/* ==========================================================================
   سعودي إكسبريس — الأنماط (الإصدار 1: «خط المسار»)
   هوية لوجستية: بترولي عميق وحبري، برتقالي مرجاني للأفعال، نعناعي للمسارات، ورملي دافئ للخلفيات.
   الزخارف: خطوط السرعة، أقواس المسارات بنقاط متحركة، شبكة الكرة الأرضية، وتذاكر الشحن المثقوبة.
   خصائص منطقية (inline/block) ليعمل الاتجاهان بالملف نفسه.
   ========================================================================== */

:root {
	--sx-petrol: #0A4D5C;
	--sx-petrol-2: #0F6577;
	--sx-petrol-3: #13798C;
	--sx-ink: #082F3A;
	--sx-ink-2: #05222B;
	--sx-coral: #F05A28;
	--sx-coral-d: #D9481A;
	--sx-coral-dd: #B53A12;
	--sx-mint: #19C3A6;
	--sx-mint-d: #0B7F6C;
	--sx-mint-l: #CFF3EC;
	--sx-sand: #F4EDE1;
	--sx-sand-2: #FAF6EF;
	--sx-sand-3: #E6DAC6;
	--sx-wa: #15803D;
	--sx-text: #082F3A;
	--sx-body: #26434D;
	--sx-muted: #4A6470;
	--sx-line: #E0D1B9;
	--sx-card: #FBF6EC;
	--sx-card-2: #F7EFE1;
	--sx-r-xl: 28px;
	--sx-r-lg: 22px;
	--sx-r-md: 16px;
	--sx-r-sm: 11px;
	--sx-shadow: 0 26px 50px -32px rgba(8, 47, 58, .6);
	--sx-shadow-sm: 0 14px 28px -22px rgba(8, 47, 58, .55);
	--sx-font: 'Almarai', system-ui, -apple-system, 'Segoe UI', Tahoma, Arial, sans-serif;
	--sx-ease: cubic-bezier(.2, .7, .2, 1);
	--sx-dir: 1;
	--accent: var(--sx-petrol-3);
	--ink: color-mix(in srgb, var(--accent) 62%, #062029);
	--tint: color-mix(in srgb, var(--accent) 11%, #fff);
	--sx-grid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M64 0H0v64' fill='none' stroke='%2319C3A6' stroke-opacity='.13' stroke-width='1'/%3E%3C/svg%3E");
	--sx-globe: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400' fill='none' stroke='%2319C3A6' stroke-opacity='.22' stroke-width='1.2'%3E%3Ccircle cx='200' cy='200' r='196'/%3E%3Cellipse cx='200' cy='200' rx='150' ry='196'/%3E%3Cellipse cx='200' cy='200' rx='96' ry='196'/%3E%3Cellipse cx='200' cy='200' rx='40' ry='196'/%3E%3Cpath d='M4 200h392M30 110h340M30 290h340M90 40h220M90 360h220'/%3E%3C/svg%3E");
}
[dir="rtl"] { --sx-dir: -1; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 100px; }
body {
	margin: 0; font-family: var(--sx-font); font-size: 16px; line-height: 1.8; color: var(--sx-body);
	background: var(--sx-sand); overflow-x: hidden; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;
}
@supports (overflow: clip) { body { overflow-x: clip; } }
img, svg, video, iframe { max-width: 100%; }
img { height: auto; display: block; }
a { color: var(--sx-petrol-2); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--sx-coral-d); }
h1, h2, h3, h4 { line-height: 1.32; margin: 0 0 .5em; font-weight: 800; color: var(--sx-ink); }
p { margin: 0 0 1em; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--sx-coral); outline-offset: 3px; border-radius: 8px; }
.sx-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.sx-skip { position: absolute; inset-inline-start: 12px; top: -80px; z-index: 2147483100; background: var(--sx-ink); color: #fff; padding: 10px 16px; border-radius: 10px; text-decoration: none; transition: top .2s; }
.sx-skip:focus { top: 12px; color: #fff; }
[dir="rtl"] .sx-flip { transform: scaleX(-1); }
.sx-ico { flex: none; }
.sx-main:focus { outline: none; }
.sx-main { display: block; }

.sx-wrap { width: 100%; max-width: 1280px; margin-inline: auto; padding-inline: 16px; }
.sx-wrap--narrow { max-width: 920px; }
.sx-wrap--form { max-width: 980px; }
@media (min-width: 768px) { .sx-wrap { padding-inline: 28px; } }

/* ---------- حركة الظهور عند التمرير (تُفعَّل من السكربت فقط) ---------- */
.sx-rv-on [data-sx-rv] { opacity: 0; transform: translateY(28px); transition: opacity .7s var(--sx-ease), transform .7s var(--sx-ease); transition-delay: calc(var(--d, 0) * 90ms); }
.sx-rv-on [data-sx-rv].is-in { opacity: 1; transform: none; }

@keyframes sx-fadein { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes sx-dash { to { stroke-dashoffset: -60; } }
@keyframes sx-streak { 0% { transform: translateX(calc(-30vw * var(--sx-dir))); opacity: 0; } 15% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateX(calc(110vw * var(--sx-dir))); opacity: 0; } }
@keyframes sx-pulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(2.2); opacity: 0; } }
@keyframes sx-bob { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-4px) rotate(-2deg); } }
@keyframes sx-fly { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(calc(5px * var(--sx-dir)), -5px); } }
@keyframes sx-drive { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
@keyframes sx-marquee { from { transform: translateX(0); } to { transform: translateX(calc(-100% * var(--sx-dir))); } }
@keyframes sx-sweep { from { transform: translateX(calc(-50% * var(--sx-dir))); } to { transform: translateX(0); } }
@keyframes sx-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }

/* ---------- الأزرار ---------- */
.sx-btn {
	position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 9px; isolation: isolate; overflow: hidden;
	min-height: 48px; padding: 10px 22px; border-radius: 14px; border: 2px solid transparent;
	font-weight: 800; font-size: 15px; line-height: 1.3; text-decoration: none; cursor: pointer;
	transition: transform .2s var(--sx-ease), box-shadow .2s, background-color .2s, color .2s, border-color .2s;
	-webkit-tap-highlight-color: transparent;
}
.sx-btn::after { /* خطوط سرعة تعبر الزر عند المرور */
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0;
	background: repeating-linear-gradient(100deg, transparent 0 18px, rgba(255, 255, 255, .26) 18px 21px, transparent 21px 34px);
	transform: translateX(calc(-40% * var(--sx-dir))); transition: transform .6s var(--sx-ease), opacity .3s;
}
.sx-btn:hover::after { transform: translateX(calc(40% * var(--sx-dir))); opacity: 1; }
.sx-btn:hover { transform: translateY(-2px); }
.sx-btn:active { transform: translateY(0) scale(.98); }
.sx-btn--lg { min-height: 56px; padding-inline: 26px; font-size: 16px; border-radius: 16px; }
.sx-btn--block { width: 100%; }
.sx-btn--cta { background: linear-gradient(135deg, var(--sx-coral), var(--sx-coral-d) 60%, var(--sx-coral-dd)); color: #fff; box-shadow: 0 14px 28px -14px rgba(217, 72, 26, .95); }
.sx-btn--cta:hover { color: #fff; box-shadow: 0 18px 32px -14px rgba(217, 72, 26, 1); }
.sx-btn--primary, .sx-btn--navy, .sx-btn--ink { background: linear-gradient(135deg, var(--sx-petrol-2), var(--sx-ink)); color: #fff; box-shadow: 0 14px 26px -16px rgba(8, 47, 58, .95); }
.sx-btn--primary:hover, .sx-btn--navy:hover, .sx-btn--ink:hover { color: #fff; }
.sx-btn--mint { background: linear-gradient(135deg, var(--sx-mint), var(--sx-mint-d)); color: #fff; box-shadow: 0 14px 26px -16px rgba(11, 127, 108, .95); }
.sx-btn--mint:hover { color: #fff; }
.sx-btn--wa { background: linear-gradient(135deg, #16A34A, var(--sx-wa)); color: #fff; box-shadow: 0 12px 24px -12px rgba(21, 128, 61, .85); }
.sx-btn--wa:hover { color: #fff; }
.sx-btn--accent { background: var(--ink); color: #fff; }
.sx-btn--accent:hover { color: #fff; filter: brightness(1.15); }
.sx-btn--ghost { background: var(--sx-card); color: var(--sx-ink); border-color: var(--sx-line); }
.sx-btn--ghost:hover { border-color: var(--sx-coral); color: var(--sx-coral-d); }
.sx-btn--light { background: var(--sx-card); color: var(--sx-ink); box-shadow: var(--sx-shadow-sm); }
.sx-btn--light:hover { color: var(--sx-coral-d); }
.sx-btn--glass, .sx-btn--outline-light { background: rgba(255, 255, 255, .08); color: #fff; border-color: rgba(255, 255, 255, .4); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.sx-btn--glass:hover, .sx-btn--outline-light:hover { background: rgba(255, 255, 255, .18); color: #fff; border-color: var(--sx-mint); }
.sx-link { display: inline-flex; align-items: center; gap: 7px; font-weight: 800; color: var(--sx-petrol-2); text-decoration: none; }
.sx-link:hover { color: var(--sx-coral-d); }
.sx-link svg { transition: transform .2s; }
.sx-link:hover svg { transform: translateX(4px); }
[dir="rtl"] .sx-link:hover svg { transform: scaleX(-1) translateX(4px); }

/* ---------- الشريط العلوي والرأس ---------- */
.sx-topbar { position: relative; z-index: 51; background: var(--sx-ink); color: #CFE6E9; font-size: 13.5px; overflow: hidden; }
.sx-topbar::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 2px; background: linear-gradient(90deg, var(--sx-mint), var(--sx-coral) 50%, var(--sx-mint)); opacity: .8; }
.sx-topbar__in { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 38px; }
.sx-topbar__tag { display: inline-flex; align-items: center; gap: 8px; margin: 0; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sx-topbar__tag svg { color: var(--sx-mint); }
.sx-topbar__acts { display: flex; align-items: center; gap: 6px; flex: none; }
.sx-topbar__acts a { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 9px; color: #fff; text-decoration: none; font-weight: 700; }
.sx-topbar__acts a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.sx-topbar__acts a svg { color: var(--sx-mint); }
.sx-topbar__acts .sx-topbar__wa svg { color: #4ADE80; }
.sx-topbar__num { direction: ltr; unicode-bidi: isolate; }
@media (max-width: 767px) { .sx-topbar__tag { display: none; } .sx-topbar__in { justify-content: center; } }

.sx-header {
	position: sticky; top: 0; z-index: 50;
	background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px);
	border-block-end: 1px solid rgba(10, 77, 92, .12); transition: box-shadow .25s, background-color .25s;
}
.sx-header.is-scrolled { box-shadow: 0 16px 34px -26px rgba(8, 47, 58, .7); background: rgba(255, 255, 255, .98); }
.admin-bar .sx-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .sx-header { top: 0; } }
.sx-header__progress { position: absolute; inset-inline: 0; bottom: -1px; height: 3px; overflow: hidden; pointer-events: none; }
.sx-header__progress span { display: block; height: 100%; width: 100%; transform: scaleX(var(--p, 0)); transform-origin: left center; background: linear-gradient(90deg, var(--sx-mint), var(--sx-petrol-3), var(--sx-coral)); }
[dir="rtl"] .sx-header__progress span { transform-origin: right center; background: linear-gradient(270deg, var(--sx-mint), var(--sx-petrol-3), var(--sx-coral)); }
.sx-header__in { display: flex; align-items: center; gap: 14px; min-height: 76px; transition: min-height .25s var(--sx-ease); }
.sx-header.is-scrolled .sx-header__in { min-height: 64px; }
.sx-brand { display: inline-flex; align-items: center; gap: 10px; flex: none; text-decoration: none; min-width: 0; }
.sx-brand__logo { width: auto; height: 52px; max-width: 190px; object-fit: contain; transition: height .25s var(--sx-ease); }
.sx-header.is-scrolled .sx-brand__logo { height: 44px; }
.sx-brand__mark { display: inline-flex; align-items: center; gap: 9px; }
.sx-brand__mark svg { flex: none; width: 46px; height: 46px; }
.sx-brand__name { display: flex; flex-direction: column; line-height: 1.15; }
.sx-brand__name b { font-size: 19px; color: var(--sx-ink); font-weight: 800; white-space: nowrap; }
.sx-brand__name small { font-size: 11px; font-weight: 700; color: var(--sx-petrol-3); white-space: nowrap; }
.sx-brand__tag { font-size: 12px; font-weight: 800; line-height: 1.4; color: var(--sx-petrol-2); max-width: 130px; padding-inline-start: 10px; border-inline-start: 2px solid var(--sx-coral); }
@media (max-width: 1365px) { .sx-brand__tag { display: none; } }
.sx-header__tools { display: flex; align-items: center; gap: 8px; margin-inline-start: auto; }
.sx-lang {
	display: inline-flex; align-items: center; gap: 6px; padding: 9px 13px; border-radius: 12px;
	font-weight: 800; font-size: 14px; color: var(--sx-ink); text-decoration: none; border: 1.5px solid var(--sx-line); background: var(--sx-card);
}
.sx-lang:hover { border-color: var(--sx-mint); color: var(--sx-petrol); }
.sx-lang__ico { display: inline-flex; color: var(--sx-mint-d); }
.sx-quote {
	display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 8px 16px; border-radius: 13px; white-space: nowrap;
	font-weight: 800; font-size: 14.5px; color: #fff; text-decoration: none; position: relative; overflow: hidden; isolation: isolate;
	background: linear-gradient(135deg, var(--sx-coral), var(--sx-coral-d)); box-shadow: 0 12px 24px -14px rgba(217, 72, 26, 1);
	transition: transform .2s var(--sx-ease), box-shadow .2s;
}
.sx-quote::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 200%; z-index: -1; background: repeating-linear-gradient(100deg, transparent 0 14px, rgba(255, 255, 255, .2) 14px 16px, transparent 16px 30px); animation: sx-sweep 2.8s linear infinite; }
.sx-quote:hover { color: #fff; transform: translateY(-2px); }
.sx-quote--drawer { justify-content: center; min-height: 52px; font-size: 16px; }
.sx-burger {
	position: relative; z-index: 61; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding: 0 13px;
	border-radius: 13px; border: 0; background: var(--sx-ink); color: #fff; cursor: pointer; font-weight: 800; font-size: 14px;
	box-shadow: 0 10px 22px -14px rgba(8, 47, 58, .9);
}
.sx-burger__lines { display: inline-flex; flex-direction: column; gap: 4px; width: 18px; }
.sx-burger__lines i { display: block; height: 2px; border-radius: 2px; background: currentColor; transition: transform .25s, opacity .2s, width .25s; }
.sx-burger__lines i:nth-child(1) { width: 100%; }
.sx-burger__lines i:nth-child(2) { width: 70%; background: var(--sx-mint); }
.sx-burger__lines i:nth-child(3) { width: 45%; background: var(--sx-coral); }
.sx-burger[aria-expanded="true"] .sx-burger__lines i { width: 100%; }
.sx-burger[aria-expanded="true"] .sx-burger__lines i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.sx-burger[aria-expanded="true"] .sx-burger__lines i:nth-child(2) { opacity: 0; }
.sx-burger[aria-expanded="true"] .sx-burger__lines i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.sx-burger__label { line-height: 1; }
.sx-lang-pill {
	display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 46px; padding: 0 10px; flex: none;
	border-radius: 13px; background: var(--sx-sand); color: var(--sx-ink); border: 1.5px solid var(--sx-line); font-weight: 800; font-size: 14px; text-decoration: none;
}
.sx-lang-pill[lang="ar"] { font-size: 19px; }
.sx-lang-pill:hover { color: var(--sx-petrol); border-color: var(--sx-mint); }
.sx-lang--bar { display: none; }
@media (min-width: 768px) { .sx-lang--bar { display: inline-flex; } .sx-lang-pill { display: none; } }
@media (max-width: 479px) {
	.sx-header__in { gap: 8px; min-height: 66px; }
	.sx-brand__logo { height: 42px; max-width: 108px; }
	.sx-brand__mark svg { width: 38px; height: 38px; }
	.sx-brand__name b { font-size: 15px; }
	.sx-brand__name small { display: none; }
	.sx-quote { padding-inline: 11px; font-size: 13.5px; gap: 6px; min-height: 44px; }
	.sx-quote svg { display: none; }
	.sx-lang-pill { display: none; }
	.sx-burger { padding: 0 11px; height: 44px; }
	.sx-header__tools { gap: 6px; }
}
@media (max-width: 374px) { .sx-brand__name { display: none; } }
@media (max-width: 359px) { .sx-burger__label { display: none; } .sx-brand__logo { max-width: 92px; } }

/* القائمة: درج داكن على الشاشات الصغيرة */
.sx-nav {
	position: fixed; inset-block: 0; inset-inline-end: 0; z-index: 60; width: min(90vw, 390px);
	background: var(--sx-globe) no-repeat calc(100% + 120px) 110% / 360px, radial-gradient(120% 60% at 100% 0%, rgba(25, 195, 166, .22), transparent 60%), linear-gradient(170deg, var(--sx-petrol) 0%, var(--sx-ink) 50%, var(--sx-ink-2) 100%);
	color: #fff; padding: 0 18px 28px; box-shadow: -24px 0 60px -30px rgba(0, 0, 0, .6);
	opacity: 0; transform: translateX(24px); visibility: hidden; pointer-events: none;
	transition: opacity .25s ease, transform .3s var(--sx-ease), visibility .25s; overflow-y: auto;
}
[dir="rtl"] .sx-nav { transform: translateX(-24px); box-shadow: 24px 0 60px -30px rgba(0, 0, 0, .6); background-position: -120px 110%, 0 0, 0 0; }
.sx-nav.is-open { opacity: 1; transform: none !important; visibility: visible; pointer-events: auto; }
.sx-nav__head { display: none; }
.sx-nav__list { list-style: none; margin: 0; padding: 0; counter-reset: sxnav; }
.sx-nav__item { position: relative; display: flex; flex-wrap: wrap; align-items: center; border-block-end: 1px dashed rgba(255, 255, 255, .14); }
.sx-nav__item > a { flex: 1; padding: 14px 6px; font-weight: 800; color: #fff; text-decoration: none; }
.sx-nav__item.is-current > a { color: var(--sx-mint); }
.sx-nav__subtoggle { width: 42px; height: 42px; border: 0; border-radius: 12px; background: rgba(255, 255, 255, .1); color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.sx-nav__subtoggle svg { transition: transform .2s; }
.sx-nav__subtoggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.sx-nav__sub { list-style: none; margin: 0 0 12px; padding: 0; width: 100%; display: none; }
.sx-nav__sub.is-open { display: grid; gap: 4px; }
.sx-nav__sub a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 12px; color: #E3F4F2; text-decoration: none; font-weight: 700; font-size: 15px; }
.sx-nav__sub a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.sx-nav__subico { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 9px; flex: none; background: var(--accent, var(--sx-mint)); color: #fff; }
.sx-nav__extra { display: grid; gap: 12px; margin-top: 22px; }
.sx-nav__extra .sx-lang { justify-content: center; background: rgba(255, 255, 255, .08); color: #fff; border-color: rgba(255, 255, 255, .25); }
.sx-nav__extra .sx-lang__ico { color: var(--sx-mint); }
.sx-nav__phone { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px; border-radius: 14px; color: #fff; text-decoration: none; font-weight: 800; background: rgba(25, 195, 166, .14); border: 1px solid rgba(25, 195, 166, .4); }
.sx-nav__phone:hover { color: #fff; background: rgba(25, 195, 166, .24); }
.sx-nav__phone span { direction: ltr; unicode-bidi: isolate; }
.sx-nav__note { margin: 6px 0 0; padding: 14px; border-radius: 14px; font-size: 14px; line-height: 1.8; color: #CFE6E9; background: rgba(255, 255, 255, .05); border: 1px dashed rgba(25, 195, 166, .45); }
.sx-scrim { position: fixed; inset: 0; background: rgba(5, 34, 43, .6); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); z-index: 55; opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
.sx-scrim.is-on { opacity: 1; visibility: visible; }
body.sx-lock { overflow: hidden; }
@media (max-width: 1199px) {
	.sx-nav { z-index: 2147483001; height: 100%; height: 100dvh; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
	.sx-scrim { z-index: 2147483000; }
	.sx-nav__head {
		position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px;
		margin: 0 -18px 6px; padding: 16px 18px; background: rgba(8, 47, 58, .97); border-block-end: 1px solid rgba(25, 195, 166, .3);
	}
	.sx-nav__title { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: 19px; color: #fff; }
	.sx-nav__title::before { content: ""; width: 26px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--sx-coral), var(--sx-mint)); }
	.sx-nav__close { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .08); color: #fff; cursor: pointer; }
	.sx-nav.is-open { transition: opacity .25s ease, transform .3s var(--sx-ease), visibility 0s; }
	html.sx-lock, body.sx-lock { overflow: hidden; }
	.sx-nav__item > a::before { counter-increment: sxnav; content: counter(sxnav, decimal-leading-zero); display: inline-block; min-width: 30px; margin-inline-end: 8px; font-size: 12px; color: var(--sx-mint); opacity: .85; }
}
@media (min-width: 1200px) {
	.sx-burger, .sx-nav__extra, .sx-nav__head { display: none; }
	.sx-nav {
		position: static; transform: none; opacity: 1; visibility: visible; pointer-events: auto; width: auto; padding: 0;
		box-shadow: none; overflow: visible; background: transparent; color: inherit; margin-inline-start: 6px;
	}
	[dir="rtl"] .sx-nav { transform: none; box-shadow: none; background: transparent; }
	.sx-nav__list { display: flex; align-items: center; gap: 2px; }
	.sx-nav__item { border: 0; flex-wrap: nowrap; }
	.sx-nav__item > a { position: relative; padding: 10px clamp(6px, .7vw, 12px); color: var(--sx-ink); font-size: clamp(14px, 1.08vw, 15.5px); white-space: nowrap; border-radius: 10px; }
	.sx-nav__item > a::after {
		content: ""; position: absolute; inset-inline: 10px; bottom: 3px; height: 3px; border-radius: 3px;
		background: repeating-linear-gradient(90deg, var(--sx-coral) 0 8px, transparent 8px 12px); transform: scaleX(0); transition: transform .25s var(--sx-ease);
	}
	.sx-nav__item > a:hover { color: var(--sx-petrol-2); }
	.sx-nav__item > a:hover::after, .sx-nav__item.is-current > a::after { transform: scaleX(1); }
	.sx-nav__item.is-current > a { color: var(--sx-petrol-2); }
	.sx-nav__subtoggle { width: 24px; height: 32px; background: transparent; color: var(--sx-ink); margin-inline-start: -6px; }
	.sx-nav__sub {
		display: grid; gap: 2px; position: absolute; top: calc(100% + 10px); inset-inline-start: 0; min-width: 250px; margin: 0; padding: 10px;
		background: var(--sx-globe) no-repeat 120% 120% / 220px, linear-gradient(170deg, var(--sx-petrol), var(--sx-ink)); border-radius: 18px; box-shadow: 0 26px 50px -24px rgba(5, 34, 43, .85);
		border-top: 3px solid var(--sx-coral); opacity: 0; visibility: hidden; transform: translateY(8px); transition: .2s var(--sx-ease);
	}
	.sx-nav__sub::before { content: ""; position: absolute; inset-inline: 0; top: -13px; height: 13px; }
	.sx-nav__sub--grid { grid-template-columns: 1fr 1fr; min-width: 470px; }
	.sx-nav__item.has-sub:hover .sx-nav__sub, .sx-nav__item.has-sub:focus-within .sx-nav__sub, .sx-nav__sub.is-open { opacity: 1; visibility: visible; transform: none; }
	.sx-en .sx-nav__item > a { padding-inline: 7px; font-size: 14px; }
	.sx-en .sx-header__in { gap: 10px; }
}

/* ---------- عناصر مشتركة ---------- */
.sx-section { position: relative; padding-block: 64px; }
@media (min-width: 1024px) { .sx-section { padding-block: 92px; } }
.sx-section--tint, .sx-section--foam { background: linear-gradient(180deg, #EAF4F3, var(--sx-sand-2)); }
.sx-section--sand { background: var(--sx-sand); }
.sx-section--sky { background: radial-gradient(70% 60% at 90% 0%, rgba(25, 195, 166, .16), transparent 60%), linear-gradient(180deg, #E5F3F1, var(--sx-sand-2)); }
.sx-section--peach { background: linear-gradient(180deg, #FDEDE4, var(--sx-sand-2)); }
.sx-section--mint { background: linear-gradient(180deg, #E2F6F1, #F4FBF9); }
.sx-section--dark { background: var(--sx-grid), radial-gradient(60% 70% at 100% 0%, rgba(25, 195, 166, .2), transparent 60%), linear-gradient(170deg, var(--sx-petrol), var(--sx-ink) 60%, var(--sx-ink-2)); color: #D5ECEE; }
.sx-section--dark h2, .sx-section--dark h3 { color: #fff; }
.sx-section--dark .sx-head p { color: #BFDDE1; }

.sx-head { max-width: 780px; margin-bottom: 36px; }
.sx-head h2 { font-size: clamp(26px, 3.4vw, 40px); line-height: 1.3; margin-bottom: 10px; letter-spacing: -.01em; }
.sx-head p { color: var(--sx-muted); margin: 0; font-size: 17px; }
.sx-head--center { margin-inline: auto; text-align: center; }
.sx-head--row, .sx-head--split { max-width: none; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 24px; }
.sx-head--split > div { max-width: 760px; }
.sx-head h2::after { /* خط المسار: دائرة — خط متقطع — نقطة برتقالية */
	content: ""; display: block; width: 110px; height: 12px; margin-top: 14px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 12'%3E%3Ccircle cx='6' cy='6' r='4.5' fill='none' stroke='%2319C3A6' stroke-width='2.4'/%3E%3Cpath d='M16 6h76' stroke='%230A4D5C' stroke-width='2.4' stroke-dasharray='7 5' stroke-linecap='round'/%3E%3Ccircle cx='103' cy='6' r='5' fill='%23F05A28'/%3E%3C/svg%3E") no-repeat;
}
[dir="rtl"] .sx-head h2::after { transform: scaleX(-1); }
.sx-head--center h2::after { margin-inline: auto; }
.sx-section--dark .sx-head h2::after, .sx-band .sx-head h2::after, .sx-head--light h2::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 12'%3E%3Ccircle cx='6' cy='6' r='4.5' fill='none' stroke='%2319C3A6' stroke-width='2.4'/%3E%3Cpath d='M16 6h76' stroke='%23ffffff' stroke-opacity='.7' stroke-width='2.4' stroke-dasharray='7 5' stroke-linecap='round'/%3E%3Ccircle cx='103' cy='6' r='5' fill='%23F05A28'/%3E%3C/svg%3E"); }
.sx-eyebrow, .sx-tag {
	display: inline-flex; align-items: center; gap: 7px; margin: 0 0 12px; padding: 5px 12px; border-radius: 999px;
	font-size: 13.5px; font-weight: 800; color: var(--ink); background: var(--tint); border: 1px solid color-mix(in srgb, var(--accent) 22%, #fff);
}
.sx-eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--sx-coral); box-shadow: 0 0 0 3px rgba(240, 90, 40, .2); }
.sx-eyebrow--light { color: #fff; background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .25); }
.sx-cards { display: grid; gap: 22px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
@media (min-width: 1100px) { .sx-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sx-cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sx-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.sx-chips a {
	display: inline-flex; align-items: center; gap: 7px; padding: 9px 15px; border-radius: 12px; background: var(--sx-card); border: 1.5px solid var(--sx-line);
	color: var(--sx-ink); text-decoration: none; font-weight: 800; font-size: 15px; transition: transform .2s var(--sx-ease), border-color .2s, box-shadow .2s, background-color .2s;
}
.sx-chips a svg { color: var(--sx-mint-d); }
.sx-chips a:hover { border-color: var(--sx-coral); transform: translateY(-2px); box-shadow: var(--sx-shadow-sm); color: var(--sx-ink); }
.sx-chips--sm a { padding: 7px 12px; font-size: 14px; }
.sx-chips--svc a svg { color: var(--accent); }
.sx-chips--svc a:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, #fff); }
.sx-chips li.is-main a { background: var(--sx-petrol); border-color: var(--sx-petrol); color: #fff; }
.sx-ticks { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 9px; }
.sx-ticks li { display: flex; align-items: flex-start; gap: 10px; font-weight: 700; line-height: 1.65; }
.sx-ticks svg { flex: none; width: 26px; height: 26px; padding: 5px; border-radius: 50%; background: var(--sx-mint-l); color: var(--sx-mint-d); }
.sx-ticks--dark li { font-weight: 400; color: var(--sx-body); }
.sx-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--accent, var(--sx-mint)); flex: none; }

/* خطوط السرعة: عنصر زخرفي يُكرَّر في الواجهة والشرائط */
.sx-speed { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.sx-speed i { position: absolute; display: block; height: 2px; width: var(--w, 180px); top: var(--y, 50%); left: 0; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--c, rgba(25, 195, 166, .75)), transparent); opacity: 0; animation: sx-streak var(--t, 4.5s) linear infinite; animation-delay: var(--dl, 0s); }
[dir="rtl"] .sx-speed i { left: auto; right: 0; }

/* ==========================================================================
   الرئيسية
   ========================================================================== */

/* ---------- الواجهة: خريطة المسارات ---------- */
.sx-hero {
	position: relative; isolation: isolate; overflow: hidden; color: #D5ECEE; padding-block: 44px 70px;
	background:
		radial-gradient(48% 70% at 78% 40%, rgba(25, 195, 166, .2), transparent 62%),
		radial-gradient(40% 60% at 6% 100%, rgba(240, 90, 40, .18), transparent 60%),
		linear-gradient(165deg, var(--sx-petrol) 0%, var(--sx-ink) 55%, var(--sx-ink-2) 100%);
}
[dir="rtl"] .sx-hero { background: radial-gradient(48% 70% at 22% 40%, rgba(25, 195, 166, .2), transparent 62%), radial-gradient(40% 60% at 94% 100%, rgba(240, 90, 40, .18), transparent 60%), linear-gradient(195deg, var(--sx-petrol) 0%, var(--sx-ink) 55%, var(--sx-ink-2) 100%); }
.sx-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--sx-grid); -webkit-mask-image: linear-gradient(180deg, #000 20%, transparent 95%); mask-image: linear-gradient(180deg, #000 20%, transparent 95%); }
.sx-hero::after { content: ""; position: absolute; inset-inline: 0; bottom: -1px; height: 46px; z-index: 1; background: var(--sx-sand); clip-path: polygon(0 100%, 100% 100%, 100% 0, 62% 82%, 0 30%); }
[dir="rtl"] .sx-hero::after { clip-path: polygon(0 100%, 100% 100%, 100% 30%, 38% 82%, 0 0); }
.sx-hero__grid { position: relative; z-index: 2; display: grid; gap: 26px; align-items: center; }
@media (min-width: 1024px) { .sx-hero { padding-block: 60px 100px; } .sx-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: 40px; } }
.sx-hero__kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 6px 14px 6px 6px; border-radius: 999px; font-size: 14px; font-weight: 800; color: #fff; background: rgba(255, 255, 255, .08); border: 1px solid rgba(25, 195, 166, .45); }
[dir="rtl"] .sx-hero__kicker { padding: 6px 6px 6px 14px; }
.sx-hero__kicker span { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; background: var(--sx-coral); color: #fff; }
.sx-hero__title { margin: 0 0 6px; font-size: clamp(36px, 6vw, 70px); line-height: 1.2; color: #fff; letter-spacing: -.015em; padding-block-end: .12em; }
.sx-hero__title em { font-style: normal; color: transparent; -webkit-background-clip: text; background-clip: text; background-image: linear-gradient(90deg, var(--sx-coral), #FF8A5C 50%, var(--sx-mint)); padding-block-end: .1em; }
[dir="rtl"] .sx-hero__title em { background-image: linear-gradient(270deg, var(--sx-coral), #FF8A5C 50%, var(--sx-mint)); }
.sx-hero__tag { margin: 0 0 18px; font-size: clamp(17px, 2vw, 23px); font-weight: 800; color: var(--sx-mint); }
.sx-hero__lead { max-width: 620px; font-size: 17.5px; line-height: 1.95; color: #C9E3E6; margin-bottom: 24px; }
.sx-hero__acts { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 28px; }
.sx-hero__facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; max-width: 600px; }
.sx-hero__facts li { position: relative; padding: 14px 14px 12px; border-radius: 16px; background: linear-gradient(160deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .03)); border: 1px solid rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sx-hero__facts li::before { content: ""; position: absolute; inset-inline-start: 14px; top: 0; width: 34px; height: 3px; border-radius: 0 0 3px 3px; background: var(--c, var(--sx-mint)); }
.sx-hero__facts strong { display: block; font-size: clamp(26px, 3.2vw, 36px); line-height: 1.1; color: #fff; font-weight: 800; }
.sx-hero__facts span { display: block; font-size: 13.5px; line-height: 1.5; color: #B7D6DA; font-weight: 700; margin-top: 4px; }
@media (max-width: 479px) { .sx-hero__acts .sx-btn { flex: 1 1 100%; } .sx-hero__facts { gap: 8px; } .sx-hero__facts li { padding: 12px 10px 10px; } .sx-hero__facts span { font-size: 12.5px; } }

.sx-hero__map { position: relative; margin: 0; isolation: isolate; }
.sx-hero__map::before { /* الكرة الأرضية خلف الخريطة */
	content: ""; position: absolute; inset: 2% 12%; z-index: -1; background: var(--sx-globe) center / contain no-repeat; opacity: .9;
}
.sx-rmap { display: block; width: 100%; height: auto; overflow: visible; }
.sx-rmap__arc { fill: none; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 6 6; animation: sx-dash 2.4s linear infinite; }
.sx-rmap__arc--land { stroke: var(--sx-mint); }
.sx-rmap__arc--sea { stroke: #5EC8F2; }
.sx-rmap__arc--air { stroke: var(--sx-coral); stroke-dasharray: 2 7; }
.sx-rmap__arc--ferry { stroke: #FFB48F; }
.sx-rmap__mover { fill: #fff; }
.sx-rmap__mover--air { fill: #FFD3C2; }
.sx-rmap__node circle { fill: var(--sx-ink); stroke: var(--sx-mint); stroke-width: 2; }
.sx-rmap__node--sea circle { stroke: #5EC8F2; }
.sx-rmap__node--air circle { stroke: var(--sx-coral); }
.sx-rmap__node--ferry circle { stroke: #FFB48F; }
.sx-rmap__node text, .sx-rmap__origin text { font: 700 13px/1 var(--sx-font); fill: #E6F5F6; paint-order: stroke; stroke: var(--sx-ink); stroke-width: 4px; stroke-linejoin: round; }
.sx-rmap__origin .sx-rmap__core { fill: var(--sx-coral); stroke: #fff; stroke-width: 2.5; }
.sx-rmap__origin text { font-size: 14.5px; font-weight: 800; fill: #fff; }
.sx-rmap__ring { fill: none; stroke: var(--sx-coral); stroke-width: 2; transform-box: fill-box; transform-origin: center; animation: sx-pulse 2.6s ease-out infinite; }
.sx-rmap__ring--late { animation-delay: 1.3s; }
.sx-rmap__land { fill: rgba(25, 195, 166, .08); stroke: rgba(25, 195, 166, .45); stroke-width: 1.2; stroke-dasharray: 3 4; }
.sx-rmap__ksa { font: 800 12px/1 var(--sx-font); fill: rgba(207, 243, 236, .55); letter-spacing: .25em; }
.sx-hero__legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin: 8px 0 0; padding: 0; list-style: none; font-size: 13.5px; font-weight: 700; color: #CFE6E9; }
.sx-hero__legend li { display: inline-flex; align-items: center; gap: 8px; }
.sx-hero__legend i { width: 26px; height: 0; border-top: 2.5px dashed var(--c); }
.sx-hero .sx-speed { z-index: 1; }
.sx-hero__poster { position: relative; z-index: 2; margin: 34px 0 0; padding: 8px; border-radius: 26px; background: linear-gradient(135deg, rgba(25, 195, 166, .5), rgba(240, 90, 40, .5)); box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .9); }
.sx-hero__poster img { width: 100%; border-radius: 20px; }
@media (max-width: 1023px) { .sx-hero__map { max-width: 640px; margin-inline: auto; width: 100%; } }

/* ---------- وسائل الشحن: بر / بحر / جو ---------- */
.sx-modes__bar { display: flex; gap: 10px; margin: 0 0 22px; padding: 8px; border-radius: 22px; background: var(--sx-card); border: 1px solid var(--sx-line); box-shadow: var(--sx-shadow-sm); overflow-x: auto; scrollbar-width: none; }
.sx-modes__bar::-webkit-scrollbar { display: none; }
.sx-modes__tab {
	--accent: var(--c); flex: 1 1 0; min-width: 120px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 14px; border: 0; border-radius: 16px; cursor: pointer;
	background: transparent; color: var(--sx-ink); font-weight: 800; font-size: 16px; transition: background .25s, color .25s, box-shadow .25s;
}
.sx-modes__tab:hover { background: var(--sx-sand); }
.sx-modes__tab[aria-selected="true"] { background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 50%, var(--sx-ink))); color: #fff; box-shadow: 0 14px 26px -16px var(--accent); }
.sx-modes__tico { display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; border-radius: 12px; background: var(--tint); color: var(--ink); flex: none; overflow: hidden; }
.sx-modes__tab[aria-selected="true"] .sx-modes__tico { background: rgba(255, 255, 255, .18); color: #fff; }
.sx-modes__tab small { display: block; font-size: 12px; font-weight: 700; opacity: .8; }
.sx-modes__tab > span:last-child { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.35; text-align: start; }
@media (max-width: 599px) { .sx-modes__tab { flex-direction: column; gap: 6px; padding: 10px 6px; min-width: 92px; font-size: 14.5px; } .sx-modes__tab small { display: none; } .sx-modes__tab > span:last-child { align-items: center; } }
.sx-anim--land svg { animation: sx-drive .6s ease-in-out infinite; }
.sx-anim--sea svg { animation: sx-bob 2.4s ease-in-out infinite; }
.sx-anim--air svg { animation: sx-fly 3s ease-in-out infinite; }
.sx-modes__panel { --accent: var(--c); display: grid; overflow: hidden; border-radius: var(--sx-r-xl); background: var(--sx-card); border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--sx-line)); box-shadow: var(--sx-shadow); }
.sx-modes__panel + .sx-modes__panel { margin-top: 22px; }
.sx-js .sx-modes__panel + .sx-modes__panel { margin-top: 0; }
.sx-js .sx-modes [data-sx-hidden] { display: none; }
.sx-modes__panel:not([data-sx-hidden]) { animation: sx-fadein .45s var(--sx-ease); }
@media (min-width: 900px) { .sx-modes__panel { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); } }
.sx-modes__media { position: relative; min-height: 280px; overflow: hidden; background: linear-gradient(140deg, color-mix(in srgb, var(--accent) 60%, #fff), var(--accent) 55%, var(--sx-ink)); }
.sx-modes__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sx-modes__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(5, 34, 43, .55), transparent 45%); pointer-events: none; }
.sx-modes__badge { position: absolute; z-index: 2; inset-inline-start: 18px; bottom: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; background: rgba(5, 34, 43, .72); color: #fff; font-weight: 800; font-size: 14px; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); border: 1px solid rgba(255, 255, 255, .25); }
.sx-modes__body { padding: 26px 22px 28px; }
@media (min-width: 900px) { .sx-modes__body { padding: 36px 38px; } }
.sx-modes__body h3 { font-size: clamp(22px, 2.6vw, 30px); margin-bottom: 10px; }
.sx-modes__body > p { color: var(--sx-muted); font-size: 16.5px; }
.sx-modes__to { margin: 18px 0 20px; }
.sx-modes__to > strong { display: block; font-size: 14px; color: var(--ink); margin-bottom: 8px; }
.sx-modes__acts { display: flex; flex-wrap: wrap; gap: 10px; }

/* لوحة رسم بديلة (حين لا تُرفع الصورة): أيقونة متحركة وشبكة وكرة أرضية وطريق */
.sx-art { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; color: #fff; background: var(--sx-grid), radial-gradient(60% 70% at 70% 20%, rgba(255, 255, 255, .25), transparent 60%), linear-gradient(140deg, color-mix(in srgb, var(--accent) 70%, #fff), var(--accent) 50%, color-mix(in srgb, var(--accent) 40%, var(--sx-ink))); }
.sx-art::before { content: ""; position: absolute; width: 78%; aspect-ratio: 1; inset-inline-end: -18%; top: -22%; background: var(--sx-globe) center / contain no-repeat; filter: brightness(2.6) saturate(.3); }
.sx-art__ico { position: relative; z-index: 1; display: inline-flex; width: 112px; height: 112px; align-items: center; justify-content: center; border-radius: 32px; background: rgba(255, 255, 255, .16); border: 2px solid rgba(255, 255, 255, .5); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); box-shadow: 0 24px 40px -24px rgba(0, 0, 0, .7); animation: sx-float 6s ease-in-out infinite; }
.sx-art__road { position: absolute; inset-inline-start: 0; bottom: 16%; width: 200%; height: 3px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .85) 0 22px, transparent 22px 40px); animation: sx-sweep 3s linear infinite; opacity: .55; }
.sx-art .sx-speed i { --c: rgba(255, 255, 255, .8); }

/* ---------- الخدمات: شبكة بطاقات بصور وزجاج ---------- */
.sx-fleet__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr)); }
@media (min-width: 1100px) { .sx-fleet__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .sx-fleet__grid > li.is-wide { grid-column: span 2; } }
.sx-svc {
	--accent: var(--c); position: relative; display: flex; flex-direction: column; height: 100%; min-height: 340px; overflow: hidden; border-radius: var(--sx-r-xl); isolation: isolate;
	color: #fff; background: var(--sx-ink); box-shadow: 0 26px 46px -32px color-mix(in srgb, var(--accent) 80%, #000); transition: transform .35s var(--sx-ease), box-shadow .35s;
}
.sx-svc:hover { transform: translateY(-6px); box-shadow: 0 34px 56px -32px color-mix(in srgb, var(--accent) 90%, #000); }
.sx-svc__media { position: absolute; inset: 0; z-index: -2; }
.sx-svc__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--sx-ease); }
.sx-svc:hover .sx-svc__media img { transform: scale(1.06); }
.sx-svc__media .sx-art { align-items: flex-start; padding-top: 56px; }
.sx-svc__media .sx-art__ico { width: 92px; height: 92px; border-radius: 26px; }
.sx-svc::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(5, 34, 43, .05) 25%, rgba(5, 34, 43, .82) 70%, rgba(5, 34, 43, .95)); }
.sx-svc__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px; }
.sx-svc__ico { display: inline-flex; width: 48px; height: 48px; flex: none; align-items: center; justify-content: center; border-radius: 15px; background: var(--accent); color: #fff; box-shadow: 0 0 0 4px rgba(255, 255, 255, .18); }
.sx-svc__area { display: inline-flex; align-items: center; gap: 5px; max-width: 70%; padding: 5px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 800; background: rgba(5, 34, 43, .55); border: 1px solid rgba(255, 255, 255, .25); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sx-svc__body { margin-top: auto; padding: 18px 18px 20px; }
.sx-svc__body h3 { font-size: 21px; margin-bottom: 6px; color: #fff; }
.sx-svc__body h3 a { color: inherit; text-decoration: none; }
.sx-svc__body h3 a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.sx-svc__body p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.75; color: #D7ECEE; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sx-svc__more { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border-radius: 11px; font-weight: 800; font-size: 14px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .3); transition: background .2s; }
.sx-svc:hover .sx-svc__more { background: var(--sx-coral); border-color: var(--sx-coral); }

/* ---------- الوجهات: بطاقات «بطاقة صعود» ---------- */
.sx-dests__filters { display: flex; flex-wrap: wrap; gap: 8px; margin: -12px 0 24px; }
.sx-dests__filters button { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px; border: 1.5px solid rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .06); color: #fff; font-weight: 800; font-size: 14px; cursor: pointer; }
.sx-dests__filters button[aria-pressed="true"] { background: var(--sx-mint); border-color: var(--sx-mint); color: var(--sx-ink); }
.sx-section:not(.sx-section--dark) .sx-dests__filters button { color: var(--sx-ink); border-color: var(--sx-line); background: var(--sx-card); }
.sx-section:not(.sx-section--dark) .sx-dests__filters button[aria-pressed="true"] { background: var(--sx-petrol); border-color: var(--sx-petrol); color: #fff; }
html:not(.sx-js) .sx-dests__filters { display: none; }
.sx-dests__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); }
.sx-dests__grid > li[hidden] { display: none; }
.sx-dests__more { margin-top: 26px; text-align: center; }
.sx-pass {
	--accent: var(--c); --notch: var(--sx-ink); position: relative; display: flex; flex-direction: column; height: 100%; border-radius: 20px; overflow: hidden; color: var(--sx-body);
	background: var(--sx-card); box-shadow: 0 24px 40px -30px rgba(0, 0, 0, .8); transition: transform .3s var(--sx-ease);
}
.sx-section:not(.sx-section--dark) .sx-pass { --notch: var(--sx-sand-2); border: 1px solid var(--sx-line); }
.sx-pass:hover { transform: translateY(-5px); }
.sx-pass__head { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 18px; color: #fff; background: linear-gradient(120deg, var(--accent), color-mix(in srgb, var(--accent) 45%, var(--sx-ink))); }
.sx-pass__mode { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 800; }
.sx-pass__mode span { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 9px; background: rgba(255, 255, 255, .2); }
.sx-pass__code { font-size: 12px; font-weight: 800; letter-spacing: .12em; padding: 3px 9px; border-radius: 7px; background: rgba(5, 34, 43, .35); direction: ltr; }
.sx-pass__route { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 18px 18px 14px; }
.sx-pass__end { min-width: 0; }
.sx-pass__end small { display: block; font-size: 12px; font-weight: 700; color: var(--sx-muted); }
.sx-pass__end strong { display: block; font-size: 19px; line-height: 1.35; color: var(--sx-ink); }
.sx-pass__end:last-child { text-align: end; }
.sx-pass__line { position: relative; height: 28px; min-width: 40px; }
.sx-pass__line::before { content: ""; position: absolute; inset-inline: 0; top: 50%; border-top: 2px dashed color-mix(in srgb, var(--accent) 60%, #fff); }
.sx-pass__line svg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 4px; width: 30px; height: 30px; border-radius: 50%; background: var(--sx-card); color: var(--accent); }
[dir="rtl"] .sx-pass__line svg { transform: translate(-50%, -50%) scaleX(-1); }
.sx-pass__perf { position: relative; height: 0; margin: 0 14px; border-top: 2px dashed var(--sx-line); }
.sx-pass__perf::before, .sx-pass__perf::after { content: ""; position: absolute; top: -12px; width: 22px; height: 22px; border-radius: 50%; background: var(--notch); }
.sx-pass__perf::before { left: -26px; }
.sx-pass__perf::after { right: -26px; }
.sx-pass__body { padding: 14px 18px 18px; flex: 1; display: flex; flex-direction: column; gap: 10px; }
.sx-pass__note { margin: 0; font-size: 14px; line-height: 1.75; color: var(--sx-muted); }
.sx-pass__from { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.sx-pass__from a { display: inline-flex; padding: 4px 10px; border-radius: 8px; font-size: 13px; font-weight: 800; text-decoration: none; color: var(--ink); background: var(--tint); border: 1px solid color-mix(in srgb, var(--accent) 25%, #fff); }
.sx-pass__from a:hover { background: var(--accent); color: #fff; }
.sx-pass__go { margin-top: auto; align-self: flex-start; }

/* ---------- شريط المسارات بين المدن ---------- */
.sx-ticker { position: relative; overflow: hidden; padding-block: 30px; color: #fff; background: linear-gradient(90deg, var(--sx-coral-d), var(--sx-coral) 50%, var(--sx-coral-d)); }
.sx-ticker::before, .sx-ticker::after { content: ""; position: absolute; inset-inline: 0; height: 6px; background: repeating-linear-gradient(90deg, var(--sx-ink) 0 18px, transparent 18px 30px); opacity: .5; }
.sx-ticker::before { top: 0; }
.sx-ticker::after { bottom: 0; }
.sx-ticker__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 20px; margin-bottom: 16px; }
.sx-ticker__head h2 { display: inline-flex; align-items: center; gap: 10px; margin: 0; font-size: clamp(20px, 2.4vw, 26px); color: #fff; }
.sx-ticker__head p { margin: 0; font-weight: 700; color: #FFE4D8; }
.sx-ticker__head a { color: #fff; font-weight: 800; }
.sx-ticker__belt { display: flex; width: max-content; }
.sx-ticker__mask { -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.sx-ticker__list { list-style: none; margin: 0; padding: 0; display: flex; gap: 12px; padding-inline-end: 12px; animation: sx-marquee 70s linear infinite; }
.sx-ticker__belt:hover .sx-ticker__list, .sx-ticker__belt:focus-within .sx-ticker__list { animation-play-state: paused; }
.sx-ticker__list a { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 14px; white-space: nowrap; font-weight: 800; font-size: 15px; color: var(--sx-ink); text-decoration: none; background: var(--sx-card); box-shadow: 0 10px 20px -14px rgba(0, 0, 0, .7); }
.sx-ticker__list a:hover { background: var(--sx-ink); color: #fff; }
.sx-ticker__list i { display: inline-block; width: 30px; height: 0; border-top: 2px dashed var(--sx-coral); position: relative; }
.sx-ticker__list i::after { content: ""; position: absolute; inset-inline-end: -3px; top: -5px; width: 8px; height: 8px; border-radius: 50%; background: var(--sx-mint); }
.sx-ticker__list a:hover i { border-color: var(--sx-mint); }
html:not(.sx-js) .sx-ticker__belt { width: auto; }
html:not(.sx-js) .sx-ticker__list { flex-wrap: wrap; animation: none; padding-inline: 16px; }
html:not(.sx-js) .sx-ticker__list--clone { display: none; }

/* ---------- خطوات الشحن: خط زمني بخط تقدّم ---------- */
.sx-tl { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; --p: 0; }
.sx-tl::before, .sx-tl::after { content: ""; position: absolute; border-radius: 4px; }
@media (min-width: 900px) {
	.sx-tl { grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 22px; padding-top: 74px; }
	.sx-tl::before { left: 10%; right: 10%; top: 25px; height: 4px; background: repeating-linear-gradient(90deg, var(--sx-sand-3) 0 10px, transparent 10px 16px); }
	.sx-tl::after { inset-inline-start: 10%; top: 25px; height: 4px; width: calc(80% * var(--p)); background: linear-gradient(90deg, var(--sx-mint), var(--sx-coral)); transition: width .15s linear; }
	[dir="rtl"] .sx-tl::after { background: linear-gradient(270deg, var(--sx-mint), var(--sx-coral)); }
}
@media (max-width: 899px) {
	.sx-tl { padding-inline-start: 52px; }
	.sx-tl::before { inset-inline-start: 18px; top: 18px; bottom: 18px; width: 4px; background: repeating-linear-gradient(180deg, var(--sx-sand-3) 0 10px, transparent 10px 16px); }
	.sx-tl::after { inset-inline-start: 18px; top: 18px; width: 4px; height: calc((100% - 36px) * var(--p)); background: linear-gradient(180deg, var(--sx-mint), var(--sx-coral)); }
}
.sx-tl__item { position: relative; padding: 22px 20px 20px; border-radius: 20px; background: var(--sx-card); border: 1px solid var(--sx-line); box-shadow: var(--sx-shadow-sm); }
.sx-tl__num { position: absolute; display: inline-flex; width: 50px; height: 50px; align-items: center; justify-content: center; border-radius: 50%; font-weight: 800; font-size: 18px; color: var(--sx-ink); background: var(--sx-card); border: 3px solid var(--sx-sand-3); transition: background .3s, color .3s, border-color .3s; z-index: 1; }
@media (min-width: 900px) { .sx-tl__num { top: -74px; left: 50%; transform: translateX(-50%); } .sx-tl__item { text-align: center; } .sx-tl__item::before { content: ""; position: absolute; top: -24px; left: 50%; width: 2px; height: 24px; background: var(--sx-sand-3); } }
@media (max-width: 899px) { .sx-tl__num { inset-inline-start: -54px; top: 16px; width: 40px; height: 40px; font-size: 15px; } }
.sx-tl__item.is-on .sx-tl__num, html:not(.sx-js) .sx-tl__num { background: var(--sx-coral); border-color: #FFD3C2; color: #fff; }
.sx-tl__item h3 { font-size: 18.5px; margin-bottom: 6px; }
.sx-tl__item p { margin: 0; color: var(--sx-muted); font-size: 15px; }
.sx-tl__ico { display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; border-radius: 13px; margin-bottom: 10px; background: var(--sx-mint-l); color: var(--sx-mint-d); }

/* ---------- شريط بصورة وبطاقات زجاجية (لماذا نحن) ---------- */
.sx-band { position: relative; isolation: isolate; overflow: hidden; color: #fff; padding-block: 76px; background: linear-gradient(160deg, var(--sx-petrol), var(--sx-ink)); }
.sx-band.has-img { background: var(--sx-ink) var(--band) center / cover no-repeat; }
.sx-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(5, 34, 43, .4), rgba(5, 34, 43, .9) 58%); }
[dir="rtl"] .sx-band::before { background: linear-gradient(270deg, rgba(5, 34, 43, .4), rgba(5, 34, 43, .9) 58%); }
.sx-band:not(.has-img)::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--sx-grid); }
.sx-band:not(.has-img) .sx-band__globe { position: absolute; z-index: -1; width: 560px; aspect-ratio: 1; inset-inline-start: -140px; top: 50%; transform: translateY(-50%); background: var(--sx-globe) center / contain no-repeat; opacity: .9; }
.sx-band .sx-head h2 { color: #fff; }
.sx-band .sx-head p { color: #CFE6E9; }
.sx-band__in { position: relative; z-index: 1; }
@media (min-width: 1024px) { .sx-band__in { max-width: 72%; margin-inline-start: auto; } .sx-band { padding-block: 100px; } }
.sx-glass__grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.sx-glass { position: relative; padding: 20px 18px; border-radius: 20px; background: linear-gradient(160deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .05)); border: 1px solid rgba(255, 255, 255, .22); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 20px 40px -28px rgba(0, 0, 0, .9); }
.sx-glass__ico { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 13px; margin-bottom: 10px; background: var(--c, var(--sx-mint)); color: #fff; }
.sx-glass h3 { font-size: 17.5px; color: #fff; margin-bottom: 6px; }
.sx-glass p { margin: 0; font-size: 14.5px; line-height: 1.8; color: #D9EEF0; }

/* ---------- تبويبات المقالات ---------- */
.sx-ftabs__bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.sx-ftabs__bar button { --accent: var(--c); display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; border-radius: 999px; border: 1.5px solid var(--sx-line); background: var(--sx-card); color: var(--sx-ink); font-weight: 800; font-size: 14.5px; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.sx-ftabs__bar button::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.sx-ftabs__bar button:hover { border-color: var(--accent); }
.sx-ftabs__bar button[aria-selected="true"] { background: var(--sx-ink); border-color: var(--sx-ink); color: #fff; }
.sx-js .sx-ftabs [data-sx-hidden] { display: none; }
html:not(.sx-js) .sx-ftabs__bar { display: none; }
.sx-tabs__panel + .sx-tabs__panel { margin-top: 24px; }
.sx-js .sx-tabs__panel + .sx-tabs__panel { margin-top: 0; }

/* ---------- الأسئلة في الرئيسية ---------- */
.sx-faqband__grid { display: grid; gap: 26px; }
@media (min-width: 960px) { .sx-faqband__grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: 46px; align-items: start; } .sx-faqband__side { position: sticky; top: 110px; } }
.sx-faqband__side { padding: 26px 24px; border-radius: var(--sx-r-xl); color: #D5ECEE; background: var(--sx-globe) no-repeat calc(100% + 90px) calc(100% + 90px) / 260px, linear-gradient(160deg, var(--sx-petrol), var(--sx-ink)); box-shadow: var(--sx-shadow); }
[dir="rtl"] .sx-faqband__side { background-position: -90px calc(100% + 90px), 0 0; }
.sx-faqband__side h2 { color: #fff; font-size: clamp(24px, 3vw, 34px); }
.sx-faqband__side p { color: #C3DFE3; }

/* ---------- شريط الدعوة بخطوط السرعة ---------- */
.sx-cta { position: relative; padding-block: 56px; }
.sx-cta__in {
	position: relative; isolation: isolate; overflow: hidden; display: grid; gap: 20px; align-items: center; padding: 34px 24px; border-radius: 30px; color: #fff;
	background: radial-gradient(60% 90% at 0% 0%, rgba(25, 195, 166, .35), transparent 60%), linear-gradient(120deg, var(--sx-ink), var(--sx-petrol) 55%, var(--sx-petrol-3));
	box-shadow: 0 40px 70px -44px rgba(5, 34, 43, .95);
}
[dir="rtl"] .sx-cta__in { background: radial-gradient(60% 90% at 100% 0%, rgba(25, 195, 166, .35), transparent 60%), linear-gradient(240deg, var(--sx-ink), var(--sx-petrol) 55%, var(--sx-petrol-3)); }
.sx-cta.has-img .sx-cta__in { background: linear-gradient(270deg, rgba(5, 34, 43, .25), rgba(5, 34, 43, .92) 55%), var(--band) center / cover no-repeat, var(--sx-ink); }
[dir="rtl"] .sx-cta.has-img .sx-cta__in { background: linear-gradient(90deg, rgba(5, 34, 43, .25), rgba(5, 34, 43, .92) 55%), var(--band) center / cover no-repeat, var(--sx-ink); }
.sx-cta__lines { position: absolute; inset-block: 0; inset-inline-end: 0; width: 50%; z-index: -1; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 60%); mask-image: linear-gradient(90deg, transparent, #000 60%); }
[dir="rtl"] .sx-cta__lines { -webkit-mask-image: linear-gradient(270deg, transparent, #000 60%); mask-image: linear-gradient(270deg, transparent, #000 60%); }
.sx-cta__lines::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 200%; background: repeating-linear-gradient(115deg, transparent 0 22px, rgba(240, 90, 40, .5) 22px 26px, transparent 26px 48px); animation: sx-sweep 5s linear infinite; }
.sx-cta.has-img .sx-cta__lines { opacity: .45; }
.sx-cta__in .sx-speed { z-index: -1; }
@media (min-width: 900px) { .sx-cta__in { grid-template-columns: minmax(0, 1.4fr) auto; padding: 46px 48px; } }
.sx-cta__text h2 { color: #fff; font-size: clamp(25px, 3.4vw, 38px); margin-bottom: 8px; }
.sx-cta__text p { margin: 0; color: #D4EBEE; font-size: 17px; max-width: 640px; }
.sx-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 479px) { .sx-cta__actions .sx-btn { flex: 1 1 100%; } }

/* ==========================================================================
   الصفحات الداخلية
   ========================================================================== */
.sx-phero {
	position: relative; color: #D5ECEE; padding-block: 30px 84px; overflow: hidden; isolation: isolate;
	background: radial-gradient(55% 80% at 90% 10%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 62%), linear-gradient(160deg, var(--sx-petrol) 0%, var(--sx-ink) 60%, var(--sx-ink-2) 100%);
}
[dir="rtl"] .sx-phero { background: radial-gradient(55% 80% at 10% 10%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 62%), linear-gradient(200deg, var(--sx-petrol) 0%, var(--sx-ink) 60%, var(--sx-ink-2) 100%); }
.sx-phero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--sx-grid); -webkit-mask-image: linear-gradient(180deg, #000, transparent 92%); mask-image: linear-gradient(180deg, #000, transparent 92%); }
.sx-phero::after { content: ""; position: absolute; inset-inline: 0; bottom: -1px; height: 40px; background: var(--sx-sand); clip-path: polygon(0 100%, 100% 100%, 100% 10%, 0 90%); }
[dir="rtl"] .sx-phero::after { clip-path: polygon(0 100%, 100% 100%, 100% 90%, 0 10%); }
.sx-phero__grid { position: relative; z-index: 1; display: grid; gap: 26px; align-items: center; }
.sx-phero > .sx-wrap { position: relative; z-index: 1; }
@media (min-width: 900px) { .sx-phero__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: 48px; } .sx-phero { padding-block: 40px 104px; } }
.sx-phero h1 { display: flex; align-items: center; gap: 14px; color: #fff; font-size: clamp(30px, 4.6vw, 50px); line-height: 1.25; margin-bottom: 14px; }
.sx-phero__ico { display: inline-flex; width: 60px; height: 60px; flex: none; align-items: center; justify-content: center; border-radius: 18px; color: #fff; background: linear-gradient(140deg, var(--sx-coral), var(--sx-coral-d)); box-shadow: 0 14px 28px -12px rgba(217, 72, 26, .9); border: 2px solid rgba(255, 255, 255, .45); }
.sx-phero__lead { font-size: 17.5px; line-height: 1.95; color: #C9E3E6; max-width: 720px; }
.sx-phero__actions, .sx-phero__acts { margin: 20px 0 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.sx-phero__area { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 12px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(25, 195, 166, .4); color: #fff; font-weight: 800; font-size: 14px; }
.sx-phero__area svg { color: var(--sx-mint); }
.sx-phero .sx-btn--accent { background: var(--sx-card); color: var(--sx-ink); }
.sx-phero .sx-btn--ghost { background: rgba(255, 255, 255, .08); color: #fff; border-color: rgba(255, 255, 255, .4); }
.sx-phero__media { position: relative; }
.sx-phero__frame { position: relative; display: block; padding: 7px; border-radius: 26px; background: linear-gradient(135deg, rgba(25, 195, 166, .7), rgba(240, 90, 40, .65)); box-shadow: 0 36px 60px -34px rgba(0, 0, 0, .85); }
.sx-phero__frame::before { content: ""; position: absolute; inset-inline-start: -14px; top: 18%; width: 30px; height: 30px; border-radius: 50%; background: var(--sx-coral); border: 4px solid var(--sx-ink); z-index: 2; }
.sx-phero__frame::after { content: ""; position: absolute; inset-inline-end: -10px; bottom: 16%; width: 22px; height: 22px; border-radius: 50%; background: var(--sx-mint); border: 4px solid var(--sx-ink); z-index: 2; }
.sx-phero__frame > img, .sx-phero__art { display: block; width: 100%; border-radius: 20px; aspect-ratio: 16 / 10; object-fit: cover; }
.sx-phero__art { position: relative; overflow: hidden; }
@media (max-width: 899px) { .sx-phero__media { display: none; } .sx-phero.has-img .sx-phero__media { display: block; } }
.sx-phero .sx-speed { z-index: 0; opacity: .7; }
.sx-phero--list .sx-chips { margin-top: 18px; }
.sx-phero--list .sx-chips a, .sx-phero--author .sx-chips a { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .22); color: #fff; }
.sx-phero--list .sx-chips a svg { color: var(--sx-mint); }
.sx-phero--list .sx-chips a:hover { background: var(--sx-card); color: var(--sx-ink); }
.sx-phero__search { max-width: 600px; margin-top: 16px; }
.sx-phero--svc h1 .sx-bsec__ico { width: 56px; height: 56px; }
.sx-profile { display: flex; flex-wrap: wrap; gap: 22px; align-items: flex-start; }
.sx-profile .sx-avatar { width: 96px; height: 96px; border: 3px solid rgba(255, 255, 255, .6); }
.sx-profile__txt { flex: 1 1 280px; min-width: 0; }
.sx-profile__txt h1 { margin-bottom: 4px; }
.sx-profile__role { font-weight: 800; color: var(--sx-mint); margin-bottom: 8px; }

/* مسار التنقل */
.sx-crumbs ol { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; font-size: 14px; color: #B7D6DA; }
.sx-crumbs li { display: inline-flex; align-items: center; }
.sx-crumbs li + li::before { content: ""; width: 16px; height: 0; margin-inline: 9px; border-top: 2px dashed rgba(25, 195, 166, .8); }
.sx-crumbs a { color: #D9EEF0; text-decoration: none; }
.sx-crumbs a:hover { color: #fff; text-decoration: underline; }
.sx-crumbs [aria-current] { color: #fff; font-weight: 800; }

/* صفحة الخدمة */
.sx-include { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.sx-include li { position: relative; display: flex; align-items: center; gap: 12px; padding: 16px 18px; background: var(--sx-card); border-radius: 16px; font-weight: 700; color: var(--sx-ink); border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--sx-line)); border-inline-start: 4px solid var(--accent); box-shadow: var(--sx-shadow-sm); transition: transform .25s var(--sx-ease); }
.sx-include li:hover { transform: translateY(-3px); }
.sx-include__ico { display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; background: var(--accent); color: #fff; flex: none; }
.sx-steps__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.sx-step { position: relative; padding: 22px 20px 20px; border-radius: 20px; background: var(--sx-card); border: 1px solid var(--sx-line); box-shadow: var(--sx-shadow-sm); overflow: hidden; }
.sx-step::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 4px; background: repeating-linear-gradient(90deg, var(--accent) 0 12px, transparent 12px 18px); opacity: .7; }
.sx-step__num { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%; margin-bottom: 10px; font-weight: 800; color: #fff; background: var(--sx-coral); box-shadow: 0 0 0 5px rgba(240, 90, 40, .15); }
.sx-step h3 { font-size: 18px; margin-bottom: 6px; }
.sx-step p { margin: 0; color: var(--sx-muted); font-size: 15px; }

/* صفحة الخدمات */
.sx-hub { display: grid; gap: 26px; }
.sx-hub__item { --accent: var(--c); position: relative; display: grid; overflow: hidden; background: var(--sx-card); border-radius: var(--sx-r-xl); border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--sx-line)); box-shadow: 0 24px 46px -34px color-mix(in srgb, var(--accent) 80%, #062029); }
@media (min-width: 768px) { .sx-hub__item { grid-template-columns: minmax(0, 380px) minmax(0, 1fr); } .sx-hub__item:nth-child(even) { grid-template-columns: minmax(0, 1fr) minmax(0, 380px); } .sx-hub__item:nth-child(even) .sx-hub__media { order: 2; } }
.sx-hub__media { position: relative; display: block; min-height: 240px; overflow: hidden; }
.sx-hub__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--sx-ease); }
.sx-hub__item:hover .sx-hub__media img { transform: scale(1.05); }
.sx-hub__body { padding: 26px 24px; }
.sx-hub__body .sx-svc__ico { margin-bottom: 12px; vertical-align: middle; box-shadow: 0 0 0 4px var(--tint); }
.sx-hub__area { display: inline-flex; align-items: center; gap: 4px; margin-inline-start: 10px; padding: 4px 11px; border-radius: 999px; background: var(--tint); color: var(--ink); font-size: 12.5px; font-weight: 800; vertical-align: middle; }
.sx-hub__body h2 { font-size: 25px; }
.sx-hub__body h2 a { color: var(--sx-ink); text-decoration: none; }
.sx-hub__body > p { color: var(--sx-muted); }

/* من نحن وتواصل وعرض السعر */
.sx-about { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); }
.sx-about__block, .sx-infocard { --accent: var(--c, var(--sx-petrol-3)); position: relative; padding: 26px 24px; border-radius: var(--sx-r-xl); background: var(--sx-card); border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--sx-line)); box-shadow: var(--sx-shadow-sm); overflow: hidden; }
.sx-about__block::before, .sx-infocard::before { content: ""; position: absolute; inset-inline: 0; top: 0; height: 5px; background: repeating-linear-gradient(90deg, var(--accent) 0 16px, color-mix(in srgb, var(--accent) 35%, #fff) 16px 22px); }
.sx-about__block h2 { font-size: 21px; }
.sx-about__block p { color: var(--sx-muted); margin: 0; }
.sx-contact2 { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); }
.sx-contact2 .sx-chips { margin-top: 6px; }
.sx-infocard__ico { display: inline-flex; width: 52px; height: 52px; align-items: center; justify-content: center; border-radius: 16px; background: var(--accent); color: #fff; margin-bottom: 12px; box-shadow: 0 12px 22px -12px var(--accent); }
.sx-infocard h2 { font-size: 20px; }
.sx-infocard p { color: var(--sx-muted); }
.sx-infocard__big { display: block; font-size: 26px; font-weight: 800; color: var(--sx-ink); text-decoration: none; margin-bottom: 12px; }
.sx-infocard__big span { direction: ltr; unicode-bidi: isolate; }
.sx-infocard__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.sx-pick { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 800px) { .sx-pick { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sx-pick li { --accent: var(--c); }
.sx-pick a {
	display: flex; flex-direction: column; align-items: flex-start; gap: 6px; height: 100%; padding: 18px 16px; border-radius: 20px; text-decoration: none;
	background: var(--sx-card); border: 1.5px solid color-mix(in srgb, var(--accent) 25%, var(--sx-line)); box-shadow: var(--sx-shadow-sm); transition: transform .25s var(--sx-ease), background .25s, border-color .25s;
}
.sx-pick a:hover { transform: translateY(-4px); border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, #fff); }
.sx-pick__ico { display: inline-flex; width: 50px; height: 50px; align-items: center; justify-content: center; border-radius: 15px; color: #fff; background: linear-gradient(140deg, color-mix(in srgb, var(--accent) 70%, #fff), var(--accent)); margin-bottom: 4px; }
.sx-pick strong { color: var(--sx-ink); font-size: 16.5px; line-height: 1.45; }
.sx-pick small { color: var(--sx-muted); font-weight: 700; font-size: 13px; }
.sx-legal h2 { font-size: 22px; margin-top: 1.4em; }
.sx-quotepage { display: grid; gap: 26px; align-items: start; }
@media (min-width: 1024px) { .sx-quotepage { grid-template-columns: minmax(0, 1.5fr) minmax(0, .9fr); gap: 34px; } }
.sx-quotepage__side { display: grid; gap: 18px; }

/* ---------- النماذج ---------- */
.sx-form {
	--accent: var(--sx-petrol-3); position: relative; overflow: hidden;
	background: var(--sx-card); border-radius: var(--sx-r-xl); padding: 26px 18px; border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--sx-line));
	box-shadow: 0 30px 60px -38px rgba(8, 47, 58, .6); color: var(--sx-body);
}
.sx-form::before { content: ""; position: absolute; inset-inline: 0; top: 0; height: 6px; background: repeating-linear-gradient(90deg, var(--sx-coral) 0 26px, var(--sx-mint) 26px 40px, var(--sx-petrol) 40px 66px); }
@media (min-width: 600px) { .sx-form { padding: 34px 32px 28px; } }
.sx-form__head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 20px; }
.sx-form__ico { display: inline-flex; align-items: center; justify-content: center; width: 54px; height: 54px; flex: none; border-radius: 16px; background: linear-gradient(140deg, var(--sx-coral), var(--sx-coral-d)); color: #fff; box-shadow: 0 12px 22px -12px rgba(217, 72, 26, .9); }
.sx-form__title { font-size: 22px; margin: 0 0 4px; color: var(--sx-ink); }
.sx-form__lead { margin: 0; color: var(--sx-muted); font-size: 15px; }
.sx-grid-form { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { .sx-grid-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sx-field--wide { grid-column: 1 / -1; } }
.sx-form--compact .sx-grid-form { gap: 12px; grid-template-columns: minmax(0, 1fr); }
.sx-form--compact .sx-field--wide { grid-column: auto; }
.sx-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.sx-field label, .sx-field legend { font-weight: 800; font-size: 14px; color: var(--sx-ink); }
.sx-field input, .sx-field select, .sx-field textarea {
	width: 100%; min-height: 50px; padding: 10px 14px; border-radius: 12px; border: 1.5px solid #D6CDBE; background: var(--sx-sand-2);
	transition: border-color .15s, box-shadow .15s, background-color .15s; font-size: 16px; color: var(--sx-ink);
}
.sx-field textarea { min-height: 110px; resize: vertical; }
.sx-field select { -webkit-appearance: none; appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--sx-muted) 50%), linear-gradient(135deg, var(--sx-muted) 50%, transparent 50%); background-position: calc(100% - 20px) 22px, calc(100% - 15px) 22px; background-size: 5px 5px; background-repeat: no-repeat; padding-inline-end: 36px; }
[dir="rtl"] .sx-field select { background-position: 15px 22px, 20px 22px; }
.sx-field input:focus, .sx-field select:focus, .sx-field textarea:focus { outline: none; border-color: var(--sx-mint-d); box-shadow: 0 0 0 4px rgba(25, 195, 166, .22); background: var(--sx-card); }
.sx-field.is-invalid input, .sx-field.is-invalid textarea, .sx-field.is-invalid select { border-color: #BE123C; box-shadow: 0 0 0 4px rgba(190, 18, 60, .14); }
.sx-field input[dir="ltr"] { text-align: start; }
[dir="rtl"] .sx-field input[dir="ltr"] { text-align: right; }
fieldset.sx-field { border: 0; padding: 0; margin: 0; min-width: 0; }
.sx-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.sx-opts label { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 12px; border: 1.5px solid #D6CDBE; background: var(--sx-sand-2); font-weight: 700; font-size: 14.5px; cursor: pointer; }
.sx-opts input { width: auto; min-height: 0; accent-color: var(--sx-coral); }
.sx-opts label:has(input:checked) { border-color: var(--sx-coral); background: #FFF1EA; color: var(--sx-coral-dd); }
.sx-form .sx-btn--block { margin-top: 18px; min-height: 56px; font-size: 16px; }
.sx-form__note { font-size: 13px; color: var(--sx-muted); margin: 10px 0 0; }
.sx-form__msg { margin: 14px 0 0; padding: 10px 14px; border-radius: 12px; font-weight: 700; }
.sx-form__msg.is-error { background: #FDECEF; color: #9F1239; }
.sx-form__msg.is-ok { background: #E8F6EE; color: #14532D; }
.sx-form__done { text-align: center; padding: 18px 6px 6px; }
.sx-form__done-ico { display: inline-flex; width: 66px; height: 66px; align-items: center; justify-content: center; border-radius: 50%; background: #E8F6EE; color: var(--sx-wa); margin-bottom: 10px; }
.sx-form__done-txt { font-weight: 800; font-size: 18px; }
.sx-hp { position: absolute !important; inset-inline-start: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- القوائم والبحث ---------- */
.sx-search { display: flex; background: var(--sx-card); border: 1.5px solid #D6CDBE; border-radius: 14px; overflow: hidden; box-shadow: var(--sx-shadow-sm); }
.sx-search:focus-within { border-color: var(--sx-mint-d); box-shadow: 0 0 0 4px rgba(25, 195, 166, .22); }
.sx-search input { flex: 1; min-width: 0; border: 0; padding: 13px 18px; background: transparent; font-size: 16px; color: var(--sx-ink); }
.sx-search input:focus { outline: none; }
.sx-search button { border: 0; background: linear-gradient(135deg, var(--sx-coral), var(--sx-coral-d)); color: #fff; width: 56px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.sx-empty { text-align: center; max-width: 580px; margin: 0 auto; padding: 34px 20px; color: var(--sx-muted); background: var(--sx-card); border-radius: var(--sx-r-xl); border: 2px dashed var(--sx-line); }
.sx-empty svg { color: var(--sx-mint-d); margin: 0 auto 10px; }
.sx-empty__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.sx-pages { margin-top: 36px; }
.sx-pages .nav-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.sx-pages .page-numbers, .sx-pager__num, .sx-pager__step, .sx-pager__gap {
	display: inline-flex; min-width: 46px; height: 46px; align-items: center; justify-content: center; padding-inline: 12px; border-radius: 999px;
	border: 1.5px solid color-mix(in srgb, var(--accent) 25%, var(--sx-line)); text-decoration: none; color: var(--sx-ink); font-weight: 800; background: var(--sx-card);
	transition: transform .2s, border-color .2s, color .2s;
}
.sx-pages .page-numbers.current, .sx-pager__num.is-current { background: linear-gradient(140deg, var(--sx-coral), var(--sx-coral-d)); color: #fff; border-color: transparent; box-shadow: 0 12px 22px -12px var(--sx-coral-d); }
.sx-pages a.page-numbers:hover, .sx-pager a:hover { border-color: var(--sx-coral); color: var(--sx-coral-d); transform: translateY(-2px); }
.sx-pager ul { list-style: none; margin: 30px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.sx-pager__gap { border: 0; background: transparent; min-width: 20px; }
.sx-pager__prev { transform: rotate(90deg); }
.sx-pager__next { transform: rotate(-90deg); }
[dir="rtl"] .sx-pager__prev { transform: rotate(-90deg); }
[dir="rtl"] .sx-pager__next { transform: rotate(90deg); }
.sx-404 { text-align: center; }
.sx-404__code { font-size: clamp(84px, 16vw, 170px); font-weight: 800; line-height: 1; margin: 0 0 10px; background: linear-gradient(135deg, var(--sx-mint), var(--sx-petrol) 50%, var(--sx-coral)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.sx-404 .sx-search { max-width: 540px; margin: 18px auto; }
.sx-404 .sx-chips { justify-content: center; margin-block: 18px; }

/* المدونة: أقسام الخدمات */
.sx-bsec { scroll-margin-top: 90px; }
.sx-bsec__head { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: 26px; padding: 14px; border-radius: 20px; background: var(--sx-card); border: 1px solid color-mix(in srgb, var(--accent) 25%, var(--sx-line)); border-inline-start: 5px solid var(--accent); box-shadow: var(--sx-shadow-sm); }
.sx-bsec__ico { display: inline-flex; width: 56px; height: 56px; align-items: center; justify-content: center; border-radius: 17px; background: linear-gradient(140deg, color-mix(in srgb, var(--accent) 70%, #fff), var(--accent)); color: #fff; flex: none; box-shadow: 0 12px 24px -12px var(--accent); }
.sx-bsec__titles { flex: 1 1 220px; min-width: 0; }
.sx-bsec__titles h2 { font-size: clamp(21px, 2.8vw, 28px); margin: 0; }
.sx-bsec__titles p { margin: 0; color: var(--sx-muted); font-weight: 700; font-size: 14.5px; }
.sx-bsec__all { flex: none; }
.sx-bsec__grid { transition: opacity .2s; }
.sx-bsec.is-loading .sx-bsec__grid { opacity: .4; pointer-events: none; }
.sx-bsec__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px 18px; margin-top: 30px; }
.sx-bsec__foot .sx-pager ul { margin: 0; }
@media (max-width: 600px) { .sx-bsec__foot { flex-direction: column; } }

/* بطاقات المقالات */
.sx-post {
	position: relative; display: flex; flex-direction: column; overflow: hidden; background: var(--sx-card); border-radius: 22px;
	border: 1px solid color-mix(in srgb, var(--accent) 16%, var(--sx-line)); box-shadow: 0 18px 36px -30px color-mix(in srgb, var(--accent) 70%, #062029);
	transition: transform .3s var(--sx-ease), box-shadow .3s;
}
.sx-post:hover { transform: translateY(-5px); box-shadow: 0 28px 46px -30px color-mix(in srgb, var(--accent) 85%, #062029); }
.sx-post__media { position: relative; display: block; overflow: hidden; aspect-ratio: 16 / 10; background: var(--sx-grid), linear-gradient(140deg, color-mix(in srgb, var(--accent) 50%, #fff), var(--accent) 60%, var(--sx-ink)); }
.sx-post__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--sx-ease); }
.sx-post:hover .sx-post__media img { transform: scale(1.06); }
.sx-post__ph { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; opacity: .9; }
.sx-post__body { position: relative; display: flex; flex-direction: column; gap: 8px; flex: 1; padding: 18px 18px 20px; }
.sx-post__body::before { content: ""; position: absolute; inset-inline: 18px; top: 0; border-top: 2px dashed color-mix(in srgb, var(--accent) 35%, #fff); }
.sx-chip { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 800; padding: 4px 10px; border-radius: 999px; background: var(--tint); color: var(--ink); }
.sx-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.sx-post__title { font-size: 17px; line-height: 1.6; margin: 0; }
.sx-post__title a { color: var(--sx-ink); text-decoration: none; }
.sx-post__title a::after { content: ""; position: absolute; inset: 0; }
.sx-post__title a:hover { color: var(--sx-coral-d); }
.sx-post__text { color: var(--sx-muted); font-size: 14.5px; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* الأسئلة الشائعة */
.sx-faq { display: grid; gap: 12px; }
.sx-faq__item { background: var(--sx-card); border: 1px solid color-mix(in srgb, var(--accent) 20%, var(--sx-line)); border-radius: 18px; overflow: hidden; transition: box-shadow .25s, border-color .25s; }
.sx-faq__item[open] { border-color: color-mix(in srgb, var(--accent) 50%, #fff); box-shadow: 0 18px 34px -26px rgba(8, 47, 58, .6); border-inline-start: 4px solid var(--sx-coral); }
.sx-faq__item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; font-weight: 800; color: var(--sx-ink); cursor: pointer; transition: background .15s; }
.sx-faq__item summary::-webkit-details-marker { display: none; }
.sx-faq__item summary:hover { background: var(--sx-sand-2); }
.sx-faq__chev { flex: none; width: 32px; height: 32px; padding: 6px; border-radius: 50%; background: var(--sx-sand); color: var(--sx-ink); transition: transform .25s, background .25s, color .25s; }
.sx-faq__item[open] .sx-faq__chev { transform: rotate(180deg); background: var(--sx-coral); color: #fff; }
.sx-faq__a { padding: 2px 18px 16px; color: var(--sx-body); }
.sx-faq__a p:last-child { margin-bottom: 0; }

/* ==========================================================================
   المقال
   ========================================================================== */
.sx-artbg { background: var(--sx-sand); }
.sx-arthead {
	position: relative; color: #fff; padding-block: 26px 100px; overflow: hidden; isolation: isolate;
	background: radial-gradient(55% 90% at 92% 0%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 62%), linear-gradient(160deg, var(--sx-petrol), var(--sx-ink) 60%, var(--sx-ink-2));
}
[dir="rtl"] .sx-arthead { background: radial-gradient(55% 90% at 8% 0%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 62%), linear-gradient(200deg, var(--sx-petrol), var(--sx-ink) 60%, var(--sx-ink-2)); }
.sx-arthead::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--sx-grid); -webkit-mask-image: linear-gradient(180deg, #000, transparent 90%); mask-image: linear-gradient(180deg, #000, transparent 90%); }
.sx-arthead .sx-speed { opacity: .65; }
@media (min-width: 1024px) { .sx-arthead { padding-block: 34px 120px; } }
.sx-arthead__in { position: relative; z-index: 1; }
.sx-arthead__svc { margin: 0 0 12px; }
.sx-arthead__svc a { display: inline-flex; align-items: center; gap: 8px; padding: 5px 13px 5px 5px; border-radius: 999px; font-size: 13.5px; font-weight: 800; color: #fff; text-decoration: none; background: rgba(255, 255, 255, .08); border: 1px solid rgba(25, 195, 166, .45); }
[dir="rtl"] .sx-arthead__svc a { padding: 5px 5px 5px 13px; }
.sx-arthead__svc a span { display: inline-flex; width: 26px; height: 26px; align-items: center; justify-content: center; border-radius: 50%; background: var(--sx-coral); }
.sx-arthead__svc a:hover { background: rgba(255, 255, 255, .18); color: #fff; }
.sx-article__title { font-size: clamp(27px, 4vw, 46px); line-height: 1.4; margin-bottom: 14px; max-width: 1050px; }
.sx-arthead .sx-article__title { color: #fff; }
.sx-byline { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 6px 14px 6px 6px; border-radius: 999px; font-size: 15px; color: #CFE6E9; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .2); }
[dir="rtl"] .sx-byline { padding: 6px 6px 6px 14px; }
.sx-byline a { font-weight: 800; color: #fff; text-decoration: none; }
.sx-byline a:hover { color: var(--sx-mint); }
.sx-byline .sx-avatar { width: 28px; height: 28px; box-shadow: none; }
.sx-wrap.sx-layout { max-width: 1500px; }
.sx-artbg .sx-arthead__in { max-width: 1500px; }
.sx-layout { display: grid; gap: 28px; padding-block: 0 64px; grid-template-columns: minmax(0, 1fr); margin-top: -70px; position: relative; z-index: 2; }
@media (min-width: 1024px) { .sx-layout { grid-template-columns: minmax(0, 1fr) 340px; gap: 30px; padding-bottom: 90px; margin-top: -86px; } }
.sx-article { min-width: 0; background: var(--sx-card); border-radius: var(--sx-r-xl); padding: 0 16px 30px; border: 1px solid var(--sx-line); box-shadow: 0 30px 70px -50px rgba(8, 47, 58, .7); overflow: hidden; }
.sx-article::before { content: ""; display: block; height: 5px; margin: 0 -16px 16px; background: repeating-linear-gradient(90deg, var(--sx-coral) 0 30px, var(--sx-mint) 30px 44px, var(--sx-petrol) 44px 74px); }
@media (min-width: 768px) { .sx-article { padding: 0 36px 42px; } .sx-article::before { margin: 0 -36px 26px; } }
@media (min-width: 1280px) { .sx-article { padding: 0 44px 46px; } .sx-article::before { margin: 0 -44px 30px; } }
.sx-article__thumb { margin: 0 0 24px; padding: 6px; border-radius: 22px; background: linear-gradient(135deg, var(--sx-mint-l), #FFE1D4); }
.sx-article__thumb img { width: 100%; height: auto; border-radius: 17px; }
.sx-article__form, .sx-article__faq, .sx-related { margin-top: 42px; }
.sx-article__faq h2, .sx-related h2 { display: flex; align-items: center; gap: 12px; font-size: 25px; }
.sx-article__faq h2::before, .sx-related h2::before { content: ""; flex: none; width: 34px; height: 12px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 12'%3E%3Cpath d='M2 6h20' stroke='%2319C3A6' stroke-width='2.6' stroke-dasharray='5 4' stroke-linecap='round'/%3E%3Ccircle cx='28' cy='6' r='5' fill='%23F05A28'/%3E%3C/svg%3E") no-repeat; }
[dir="rtl"] .sx-article__faq h2::before, [dir="rtl"] .sx-related h2::before { transform: scaleX(-1); }
.sx-layout--page { margin-top: -70px; }

/* ---------- نص المقال ---------- */
.sx-prose { font-size: 17.5px; line-height: 2; color: var(--sx-body); overflow-wrap: break-word; }
.sx-prose > * { max-width: 100%; }
.sx-prose div, .sx-prose p, .sx-prose figure, .sx-prose section, .sx-prose span { max-width: 100%; }
.sx-prose p { margin: 0 0 1.15em; }
.sx-prose > p:first-child { font-size: 18.5px; color: var(--sx-ink); }
.sx-prose strong, .sx-prose b { color: var(--sx-ink); font-weight: 800; }
.sx-prose h2 {
	position: relative; font-size: clamp(21px, 2.6vw, 27px); line-height: 1.55; margin: 2em 0 .9em; padding-bottom: 16px; color: var(--sx-ink);
	text-align: start !important; scroll-margin-top: 110px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 12'%3E%3Ccircle cx='6' cy='6' r='4.5' fill='none' stroke='%2319C3A6' stroke-width='2.4'/%3E%3Cpath d='M16 6h76' stroke='%230A4D5C' stroke-width='2.4' stroke-dasharray='7 5' stroke-linecap='round'/%3E%3Ccircle cx='103' cy='6' r='5' fill='%23F05A28'/%3E%3C/svg%3E") no-repeat left bottom / 90px 10px;
}
[dir="rtl"] .sx-prose h2 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 110 12'%3E%3Ccircle cx='104' cy='6' r='4.5' fill='none' stroke='%2319C3A6' stroke-width='2.4'/%3E%3Cpath d='M94 6H18' stroke='%230A4D5C' stroke-width='2.4' stroke-dasharray='7 5' stroke-linecap='round'/%3E%3Ccircle cx='7' cy='6' r='5' fill='%23F05A28'/%3E%3C/svg%3E"); background-position: right bottom; }
.sx-prose h3 { display: flex; align-items: baseline; gap: 10px; font-size: clamp(19px, 2.2vw, 22px); margin: 1.6em 0 .6em; color: var(--sx-petrol); text-align: start !important; scroll-margin-top: 110px; }
.sx-prose h3::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--sx-coral); box-shadow: 0 0 0 4px rgba(240, 90, 40, .18); transform: translateY(-2px); }
.sx-prose h4 { font-size: 18px; margin: 1.3em 0 .4em; color: var(--sx-ink); text-align: start !important; }
.sx-prose ul { list-style: none; padding-inline-start: 0; margin: 0 0 1.3em; }
.sx-prose ul > li { position: relative; padding-inline-start: 28px; margin-bottom: .55em; }
.sx-prose ul > li::before { content: ""; position: absolute; inset-inline-start: 3px; top: .72em; width: 12px; height: 12px; border-radius: 50%; border: 3px solid var(--sx-mint); background: var(--sx-card); }
.sx-prose ul ul > li::before { width: 8px; height: 8px; top: .9em; inset-inline-start: 6px; border: 0; background: var(--sx-coral); }
.sx-prose ol { list-style: none; counter-reset: sxol; padding-inline-start: 0; margin: 0 0 1.3em; }
.sx-prose ol > li { counter-increment: sxol; position: relative; padding-inline-start: 42px; margin-bottom: .6em; }
.sx-prose ol > li::before {
	content: counter(sxol); position: absolute; inset-inline-start: 0; top: .3em; min-width: 29px; height: 29px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; color: #fff; background: var(--sx-petrol); box-shadow: 0 0 0 3px var(--sx-mint-l);
}
.sx-prose li::marker { content: none; }
.sx-prose a { color: var(--sx-petrol-2); font-weight: 700; text-decoration: underline; text-decoration-color: rgba(240, 90, 40, .55); text-decoration-thickness: 2px; text-underline-offset: 4px; border-radius: 4px; transition: background .15s, color .15s; }
.sx-prose a:hover { color: var(--sx-coral-dd); background: #FFF1EA; text-decoration-color: var(--sx-coral); }
.sx-prose img { border-radius: 18px; margin-inline: auto; height: auto !important; box-shadow: 0 18px 40px -28px rgba(8, 47, 58, .6); }
.sx-prose figure, .sx-prose .wp-caption { margin: 1.8em auto; max-width: 100% !important; }
.sx-prose figcaption, .sx-prose .wp-caption-text { display: table; margin: 10px auto 0; padding: 4px 14px; border-radius: 999px; text-align: center; font-size: 14px; line-height: 1.7; color: var(--sx-petrol); background: var(--sx-sand); }
.sx-prose blockquote { position: relative; margin: 1.8em 0; padding: 22px 22px 18px; padding-inline-start: 62px; border-radius: 20px; background: linear-gradient(135deg, var(--sx-sand), #fff); border: 1px solid var(--sx-line); border-inline-start: 5px solid var(--sx-coral); color: var(--sx-ink); font-size: 18px; }
.sx-prose blockquote::before { content: "\201D"; position: absolute; inset-inline-start: 16px; top: 4px; font: 800 52px/1 Georgia, serif; color: var(--sx-mint); }
.sx-prose blockquote p:last-child { margin-bottom: 0; }
.sx-prose iframe { width: 100%; border: 0; border-radius: 16px; aspect-ratio: 16 / 9; height: auto; }
.sx-prose pre { overflow-x: auto; max-width: 100%; }
.sx-prose .aligncenter { margin-inline: auto; }
.sx-prose .alignleft, .sx-prose .alignright { float: none; margin-inline: auto; }
.sx-prose .sx-faq { margin: 1em 0 2em; }
.sx-prose .sx-faq summary span { font-size: 17px; }
.sx-prose p[style*="center"], .sx-prose div[style*="center"], .sx-prose span[style*="center"] { text-align: start !important; }
.sx-prose p[style*="center"]:has(img, iframe), .sx-prose div[style*="center"]:has(img, iframe) { text-align: center !important; }
.sx-note { position: relative; padding: 14px 18px; padding-inline-start: 56px; border-radius: 16px; font-weight: 600; background: #E6F6F3; border: 1px solid #B6E6DC; color: var(--sx-ink); }
.sx-note::before { content: "i"; position: absolute; inset-inline-start: 15px; top: 15px; width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font: 800 15px/1 Georgia, serif; color: #fff; background: var(--sx-mint-d); }
.sx-note--warn { background: #FFF1EA; border-color: #FBCDB8; }
.sx-note--warn::before { content: "!"; background: var(--sx-coral-d); font-family: inherit; }
.sx-note--tip { background: #ECF8EF; border-color: #BFE6C9; }
.sx-note--tip::before { content: "\2713"; background: var(--sx-wa); font-family: inherit; }

/* الجداول */
.sx-table { overflow-x: auto; max-width: 100%; margin: 1.6em 0; border-radius: 18px; border: 1px solid var(--sx-line); background: var(--sx-card); box-shadow: var(--sx-shadow-sm); -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.sx-table table { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 520px; font-size: 15px; margin: 0; }
.sx-prose table { max-width: none; }
.sx-prose .wp-block-table { margin: 0; overflow: visible; }
.sx-table th, .sx-table td { padding: 12px 14px; border: 0; border-block-end: 1px solid #EFE7DA; text-align: start; vertical-align: top; }
.sx-table thead th, .sx-table thead td, .sx-table tr:first-child th { background: linear-gradient(135deg, var(--sx-petrol), var(--sx-ink)); color: #fff; font-weight: 800; white-space: nowrap; }
.sx-table table:not(:has(thead)) tr:first-child td { background: var(--sx-mint-l); color: var(--sx-ink); font-weight: 800; }
.sx-table tbody tr:nth-child(even) td { background: var(--sx-sand-2); }
.sx-table tbody tr:hover td { background: #FFF1EA; }
.sx-table tr:last-child td { border-block-end: 0; }
.sx-table th:first-child, .sx-table td:first-child { min-width: 9.5em; }
.sx-prose a.sx-btn { color: #fff; border-radius: 14px; text-decoration: none; font-weight: 800; }
.sx-prose a.sx-btn:hover { color: #fff; background: linear-gradient(135deg, var(--sx-coral-d), var(--sx-coral-dd)); }

/* ---------- الفهرس الداكن: مطوي حتى «إظهار» ---------- */
.sx-toc {
	position: relative; margin-bottom: 24px; border-radius: 20px; color: #D9EEF0; overflow: hidden;
	background: var(--sx-globe) no-repeat calc(100% + 70px) -70px / 200px, linear-gradient(165deg, var(--sx-petrol) 0%, var(--sx-ink) 60%, var(--sx-ink-2) 100%);
	box-shadow: 0 22px 44px -28px rgba(5, 34, 43, .95); border: 1px solid rgba(25, 195, 166, .3);
}
[dir="rtl"] .sx-toc { background-position: -70px -70px, 0 0; }
.sx-toc::before { content: ""; position: absolute; inset-inline: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--sx-coral), var(--sx-mint)); }
.sx-toc__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px 14px; }
.sx-toc__title { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 15.5px; color: #fff; }
.sx-toc__title svg { color: var(--sx-mint); }
.sx-toc__title small { display: inline-flex; min-width: 24px; height: 24px; align-items: center; justify-content: center; padding-inline: 6px; border-radius: 999px; font-size: 12px; background: var(--sx-coral); color: #fff; }
.sx-toc__toggle { display: inline-flex; align-items: center; gap: 4px; border: 0; border-radius: 999px; padding: 7px 14px; font-weight: 800; font-size: 13.5px; cursor: pointer; color: var(--sx-ink); background: var(--sx-mint); transition: background .2s; }
.sx-toc__toggle:hover { background: var(--sx-card); }
.sx-toc__toggle svg { transition: transform .25s; }
.sx-toc__toggle .sx-toc__hide { display: none; }
.sx-toc__toggle[aria-expanded="true"] .sx-toc__hide { display: inline; }
.sx-toc__toggle[aria-expanded="true"] .sx-toc__show { display: none; }
.sx-toc__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.sx-toc__body { padding: 0 10px 12px; max-height: 60vh; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .35) transparent; border-top: 1px dashed rgba(255, 255, 255, .14); }
.sx-toc__body:not([hidden]) { animation: sx-fadein .3s var(--sx-ease); }
.sx-toc__body[hidden] { display: none; }
html:not(.sx-js) .sx-toc__body[hidden] { display: block; }
.sx-toc__list, .sx-toc__sub { list-style: none; margin: 0; padding: 0; counter-reset: sxtoc; }
.sx-toc__list { padding-top: 8px; }
.sx-toc__list > li { counter-increment: sxtoc; }
.sx-toc__sub { counter-reset: sxsub; padding-inline-start: 32px; }
.sx-toc__sub > li { counter-increment: sxsub; }
.sx-toc a { display: flex; align-items: flex-start; gap: 10px; padding: 6px 8px; border-radius: 10px; color: #D2EAEC; text-decoration: none; font-size: 14.5px; line-height: 1.65; border-inline-start: 3px solid transparent; }
.sx-toc a:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.sx-toc a:focus-visible { outline-color: var(--sx-coral); }
.sx-toc__list > li > a::before { content: counter(sxtoc); flex: none; min-width: 24px; height: 24px; margin-top: 1px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: var(--sx-ink); background: var(--sx-mint); }
.sx-toc__list > li:nth-child(3n+2) > a::before { background: #FFB48F; }
.sx-toc__list > li:nth-child(3n+3) > a::before { background: var(--sx-card); }
.sx-toc__sub > li > a::before { content: counter(sxtoc) "." counter(sxsub); flex: none; min-width: 30px; margin-top: 2px; font-size: 12px; color: #9CCBD1; }
.sx-toc a.is-active { background: rgba(25, 195, 166, .16); color: #fff; font-weight: 800; border-inline-start-color: var(--sx-coral); }
.sx-toc--side { display: none; }
@media (min-width: 1024px) { .sx-toc--inline { display: none; } .sx-toc--side { display: block; } }

/* ---------- الشريط الجانبي: مباشرة تحت الفهرس ---------- */
.sx-side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.sx-side__a:empty, .sx-side__sticky:empty { display: none; }
.sx-side__sticky { display: flex; flex-direction: column; gap: 16px; }
.sx-side__b { display: grid; gap: 20px; align-content: start; }
.sx-side__b > *, .sx-side__sticky > * { min-width: 0; }
@media (min-width: 640px) and (max-width: 1023px) { .sx-side__b { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sx-side__b > .sx-widget--cta, .sx-side__b > .sx-widget--quote { grid-column: 1 / -1; } }
@media (min-width: 1024px) {
	.sx-side.has-toc .sx-toc--side { margin-bottom: 0; }
	.sx-side.has-toc .sx-toc--side .sx-toc__body:not([hidden]) { max-height: 60vh; overflow: auto; }
}
.sx-widget { position: relative; overflow: hidden; border-radius: 22px; padding: 18px; background: var(--sx-card); border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--sx-line)); box-shadow: var(--sx-shadow-sm); }
.sx-widget::before { content: ""; position: absolute; inset-inline: 0; top: 0; height: 4px; background: repeating-linear-gradient(90deg, var(--accent) 0 18px, color-mix(in srgb, var(--accent) 35%, #fff) 18px 24px); }
.sx-widget__h { display: flex; align-items: center; gap: 9px; font-size: 17px; margin-bottom: 14px; color: var(--sx-ink); }
.sx-widget__ico { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 10px; background: var(--accent); color: #fff; flex: none; }
.sx-widget__more { margin-top: 12px; font-size: 14.5px; }
.sx-minis { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sx-mini { display: flex; align-items: center; gap: 12px; padding: 6px; border-radius: 14px; text-decoration: none; color: var(--sx-ink); transition: background .15s; }
.sx-mini:hover { background: var(--sx-sand-2); color: var(--sx-ink); }
.sx-mini__media { position: relative; flex: none; width: 64px; height: 64px; border-radius: 12px; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; color: var(--accent); background: color-mix(in srgb, var(--accent) 14%, #fff); }
.sx-mini__img { width: 100%; height: 100%; object-fit: cover; }
.sx-mini__t { font-size: 14.5px; font-weight: 700; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sx-svc-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
@media (max-width: 359px) { .sx-svc-tiles { grid-template-columns: minmax(0, 1fr); } }
.sx-svc-tiles a {
	display: flex; align-items: center; gap: 8px; height: 100%; min-width: 0; padding: 9px; border-radius: 13px; text-decoration: none; font-size: 13.5px; font-weight: 800; line-height: 1.45; overflow-wrap: anywhere;
	color: var(--ink); background: color-mix(in srgb, var(--accent) 9%, #fff); border: 1px solid color-mix(in srgb, var(--accent) 24%, #fff); transition: transform .15s, background .15s, color .15s;
}
.sx-svc-tiles__ico { flex: none; display: inline-flex; width: 34px; height: 34px; align-items: center; justify-content: center; border-radius: 10px; background: var(--accent); color: #fff; }
.sx-svc-tiles a:hover, .sx-svc-tiles a[aria-current] { background: var(--accent); color: #fff; transform: translateY(-2px); }
.sx-svc-tiles a:hover .sx-svc-tiles__ico, .sx-svc-tiles a[aria-current] .sx-svc-tiles__ico { background: rgba(255, 255, 255, .22); }
.sx-areas { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 7px; }
.sx-areas a, .sx-areas span { display: inline-flex; padding: 5px 12px; border-radius: 999px; font-size: 13.5px; font-weight: 700; text-decoration: none; color: var(--ink); background: var(--sx-card); border: 1px solid color-mix(in srgb, var(--accent) 32%, #fff); transition: background .15s, color .15s; }
.sx-areas a:hover, .sx-areas a[aria-current] { background: var(--accent); border-color: var(--accent); color: #fff; }
.sx-widget--cta, .sx-widget--quote { border: 0; color: #fff; background: var(--sx-globe) no-repeat calc(100% + 60px) calc(100% + 60px) / 200px, linear-gradient(150deg, var(--sx-petrol), var(--sx-ink)); box-shadow: 0 22px 40px -24px rgba(5, 34, 43, .95); }
[dir="rtl"] .sx-widget--cta { background-position: -60px calc(100% + 60px), 0 0; }
.sx-widget--quote { background: radial-gradient(80% 60% at 100% 0%, rgba(255, 255, 255, .22), transparent 60%), linear-gradient(150deg, var(--sx-coral), var(--sx-coral-d) 55%, var(--sx-coral-dd)); }
.sx-widget--cta::before, .sx-widget--quote::before { display: none; }
.sx-widget--cta__ico { display: inline-flex; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: 14px; background: rgba(255, 255, 255, .14); color: var(--sx-mint); margin-bottom: 10px; }
.sx-widget--quote .sx-widget--cta__ico { color: #fff; background: rgba(255, 255, 255, .2); }
.sx-widget--cta .sx-widget__h, .sx-widget--quote .sx-widget__h { color: #fff; font-size: 19px; margin-bottom: 6px; }
.sx-widget--cta p { color: #D7ECEE; font-size: 14.5px; }
.sx-widget--quote p { color: #FFEDE5; font-size: 14.5px; }
.sx-widget--cta .sx-btn, .sx-widget--quote .sx-btn { position: relative; z-index: 1; }
.sx-widget--quote .sx-btn--light { color: var(--sx-coral-dd); }
.sx-widget__acts { display: grid; gap: 8px; }

/* ---------- الكاتب ---------- */
.sx-avatar { display: inline-block; flex: none; border-radius: 50%; object-fit: cover; background: var(--sx-card); box-shadow: 0 6px 16px -8px rgba(8, 47, 58, .5); }
.sx-avatar--initial { display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; line-height: 1; background: linear-gradient(135deg, var(--sx-coral), var(--sx-petrol)); }
.sx-authorbox { display: flex; gap: 18px; align-items: flex-start; margin-top: 42px; padding: 22px; border-radius: 22px; background: linear-gradient(135deg, var(--sx-sand), #fff 75%); border: 1px solid var(--sx-line); border-inline-start: 5px solid var(--sx-mint); }
.sx-authorbox__txt { min-width: 0; }
.sx-authorbox__txt p { margin: 0 0 4px; }
.sx-authorbox__eyebrow { font-size: 13px; font-weight: 800; color: var(--sx-coral-d); }
.sx-authorbox__name { font-size: 20px; font-weight: 800; }
.sx-authorbox__name a { color: var(--sx-ink); text-decoration: none; }
.sx-authorbox__role { color: var(--sx-muted); font-weight: 700; font-size: 14.5px; }
.sx-authorbox__bio { color: var(--sx-body); margin: 8px 0 10px !important; }
@media (max-width: 479px) { .sx-authorbox { flex-direction: column; } }

/* ==========================================================================
   التذييل
   ========================================================================== */
.sx-footer { position: relative; color: #CFE6E9; background: var(--sx-ink-2); overflow: hidden; isolation: isolate; }
.sx-footer__route { position: relative; height: 70px; background: transparent; margin-bottom: -1px; }
.sx-footer__route svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.sx-footer__route-fill { fill: var(--sx-ink); }
.sx-footer__route-line { fill: none; stroke: var(--sx-mint); stroke-width: 2.5; stroke-dasharray: 10 8; animation: sx-dash 2.2s linear infinite; vector-effect: non-scaling-stroke; }
.sx-footer__route-line--b { stroke: var(--sx-coral); stroke-width: 2; animation-direction: reverse; animation-duration: 3s; }
.sx-footer__body { position: relative; background: var(--sx-grid), radial-gradient(60% 50% at 100% 0%, rgba(25, 195, 166, .16), transparent 60%), linear-gradient(180deg, var(--sx-ink), var(--sx-ink-2)); }
.sx-footer__body::before { content: ""; position: absolute; width: 520px; height: 520px; inset-inline-start: -180px; bottom: -220px; background: var(--sx-globe) center / contain no-repeat; opacity: .6; pointer-events: none; }
.sx-footer__grid { position: relative; display: grid; gap: 18px; padding-block: 34px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .sx-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .sx-footer__grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, .95fr) minmax(0, 1.1fr) minmax(0, 1.15fr); gap: 20px; } }
.sx-footer__card { position: relative; padding: 22px 20px; border-radius: 22px; background: linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)); border: 1px solid rgba(25, 195, 166, .25); }
.sx-footer__card::before { content: ""; position: absolute; inset-inline-start: 20px; top: -1px; width: 46px; height: 3px; border-radius: 0 0 3px 3px; background: var(--c, var(--sx-mint)); }
.sx-footer__brand { display: inline-flex; text-decoration: none; margin-bottom: 14px; }
.sx-footer__plate { display: inline-flex; padding: 8px 12px; border-radius: 16px; background: var(--sx-card); box-shadow: 0 14px 30px -18px rgba(0, 0, 0, .7); }
.sx-footer__logo { width: 230px; height: auto; max-width: 100%; object-fit: contain; }
.sx-footer__plate .sx-brand__name b { color: var(--sx-ink); }
.sx-footer__about p { color: #BFDCE0; font-size: 15px; line-height: 1.9; }
.sx-footer__tag { margin: 10px 0 0; font-size: 14px; color: var(--sx-mint); }
.sx-footer__tag strong { color: #fff; }
.sx-footer__contact { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; }
.sx-footer__contact a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; color: #fff; text-decoration: none; font-weight: 800; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); }
.sx-footer__contact a:hover { background: rgba(25, 195, 166, .16); border-color: var(--sx-mint); color: #fff; }
.sx-footer__contact .sx-num { direction: ltr; unicode-bidi: isolate; }
.sx-footer__contact svg { flex: none; color: var(--sx-mint); }
.sx-footer__contact .is-wa svg { color: #4ADE80; }
.sx-footer__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.sx-footer__h { display: flex; align-items: center; gap: 9px; color: #fff; font-size: 17px; margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px dashed rgba(25, 195, 166, .35); }
.sx-footer__hico { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; border-radius: 9px; background: rgba(25, 195, 166, .16); color: var(--sx-mint); }
.sx-footer ul { list-style: none; margin: 0; padding: 0; }
.sx-footer__links li, .sx-footer__posts li { margin-bottom: 6px; }
.sx-footer__col a { display: inline-flex; align-items: center; gap: 9px; color: #CFE6E9; text-decoration: none; transition: color .15s, transform .2s; }
.sx-footer__col a:hover { color: #fff; transform: translateX(3px); }
[dir="rtl"] .sx-footer__col a:hover { transform: translateX(-3px); }
.sx-footer__posts a { display: block; line-height: 1.65; font-size: 14.5px; padding-inline-start: 16px; position: relative; }
.sx-footer__posts a::before { content: ""; position: absolute; inset-inline-start: 0; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--sx-coral); }
.sx-footer__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.sx-footer__chips a { padding: 5px 11px; border-radius: 999px; font-size: 14px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14); }
.sx-footer__chips a:hover { background: var(--sx-coral); border-color: var(--sx-coral); transform: none !important; }
.sx-footer__sub { margin: 18px 0 10px; font-size: 14px; color: #fff; font-weight: 800; }
.sx-footer__bar { position: relative; border-block-start: 1px dashed rgba(255, 255, 255, .12); }
.sx-footer__bar-in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-block: 16px; font-size: 14px; }
.sx-footer__bar p { margin: 0; color: #A9CBD0; }
.sx-footer__legal { display: flex; flex-wrap: wrap; gap: 6px 16px; }
.sx-footer__legal a { color: #CFE6E9; text-decoration: none; }
.sx-footer__legal a:hover { color: #fff; text-decoration: underline; }

/* ==========================================================================
   الأزرار العائمة: اتصال وواتساب (في المقالات ذات الرقم)، اللغة، العودة للأعلى
   ========================================================================== */
.tarek-tpfb { display: none !important; }
.sx-callbar { position: fixed; z-index: 999999; display: flex; gap: 10px; bottom: max(12px, env(safe-area-inset-bottom)); left: 12px; right: 12px; }
.sx-callbar__btn {
	position: relative; flex: 1 1 50%; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 54px; padding: 0 12px;
	border-radius: 16px; border: 2px solid rgba(255, 255, 255, .92); color: #fff; text-decoration: none; font-weight: 800; font-size: 15px;
	box-shadow: 0 10px 26px rgba(5, 34, 43, .35); transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; -webkit-tap-highlight-color: transparent;
}
.sx-callbar__btn--call { background: linear-gradient(135deg, var(--sx-coral), var(--sx-coral-d)); }
.sx-callbar__btn--wa { background: linear-gradient(135deg, #16A34A, var(--sx-wa)); }
.sx-callbar__btn:hover, .sx-callbar__btn:focus-visible { color: #fff; transform: translateY(-3px); filter: brightness(1.06); }
.sx-callbar__btn:focus-visible { outline: 3px solid var(--sx-mint); outline-offset: 3px; }
.sx-callbar__ico { flex: none; }
.sx-callbar__btn--wa .sx-callbar__ico { stroke-width: 1.9; }
@media (min-width: 601px) { .sx-callbar__btn--call::before { content: ""; position: absolute; inset: -2px; border-radius: inherit; border: 2px solid var(--sx-coral); animation: sx-ring 2.4s ease-out infinite; pointer-events: none; } }
@keyframes sx-ring { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.28); opacity: 0; } }

/* زر الأعلى واللغة على الجهة المقابلة لأزرار الاتصال (أو جهة نهاية السطر حين لا أزرار) */
.sx-top, .sx-langfab { --edge: max(20px, env(safe-area-inset-right)); right: var(--edge); left: auto; }
[dir="rtl"] .sx-top, [dir="rtl"] .sx-langfab { left: max(20px, env(safe-area-inset-left)); right: auto; }
.sx-call-left .sx-top, .sx-call-left .sx-langfab { right: max(20px, env(safe-area-inset-right)); left: auto; }
.sx-call-right .sx-top, .sx-call-right .sx-langfab { left: max(20px, env(safe-area-inset-left)); right: auto; }
.sx-top {
	position: fixed; z-index: 999997; bottom: max(24px, env(safe-area-inset-bottom)); width: 54px; height: 54px; padding: 0;
	border: 0; border-radius: 50%; background: var(--sx-ink); color: #fff; cursor: pointer;
	box-shadow: 0 12px 28px -10px rgba(5, 34, 43, .75); opacity: 0; visibility: hidden; transform: translateY(16px) scale(.9);
	transition: opacity .25s ease, transform .25s ease, visibility .25s, background-color .2s;
}
.sx-top.is-on { opacity: 1; visibility: visible; transform: none; }
.sx-top:hover { background: var(--sx-petrol); }
.sx-top__ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.sx-top__track { fill: none; stroke: rgba(255, 255, 255, .18); stroke-width: 3; }
.sx-top__bar { fill: none; stroke: var(--sx-coral); stroke-width: 3.5; stroke-linecap: round; transition: stroke-dashoffset .1s linear; }
.sx-top__ico { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.sx-langfab {
	position: fixed; z-index: 999997; display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; margin-inline: 2px;
	background: linear-gradient(135deg, var(--sx-mint), var(--sx-petrol)); color: #fff; text-decoration: none; font-weight: 800; font-size: 15px;
	border: 2px solid rgba(255, 255, 255, .92); box-shadow: 0 10px 24px rgba(5, 34, 43, .32); transition: transform .2s ease, filter .2s ease;
	bottom: calc(max(24px, env(safe-area-inset-bottom)) + 68px);
}
.sx-langfab[lang="ar"] { font-size: 20px; }
.sx-langfab:hover, .sx-langfab:focus-visible { color: #fff; transform: translateY(-3px); filter: brightness(1.08); }

@media (max-width: 600px) {
	.sx-top, .sx-call-left .sx-top, .sx-call-left .sx-langfab, .sx-langfab { right: 12px; left: auto; }
	[dir="rtl"] .sx-top, [dir="rtl"] .sx-langfab, .sx-call-right .sx-top, .sx-call-right .sx-langfab { left: 12px; right: auto; }
	[dir="rtl"].sx-call-left .sx-top, [dir="rtl"] .sx-call-left .sx-top, .sx-call-left[dir="rtl"] .sx-top { right: 12px; left: auto; }
	.sx-top { width: 48px; height: 48px; bottom: max(14px, env(safe-area-inset-bottom)); }
	.sx-langfab { width: 44px; height: 44px; bottom: calc(max(14px, env(safe-area-inset-bottom)) + 58px); }
	.sx-has-call .sx-top { bottom: calc(max(12px, env(safe-area-inset-bottom)) + 74px); }
	.sx-has-call .sx-langfab { bottom: calc(max(12px, env(safe-area-inset-bottom)) + 74px + 58px); }
	body.sx-has-call { padding-bottom: 72px; }
}
@media (min-width: 601px) {
	.sx-callbar { right: auto; left: auto; bottom: max(24px, env(safe-area-inset-bottom)); flex-direction: column; gap: 12px; }
	.sx-callbar--left { left: max(20px, env(safe-area-inset-left)); }
	.sx-callbar--right { right: max(20px, env(safe-area-inset-right)); }
	.sx-callbar__btn { flex: none; width: 56px; height: 56px; padding: 0; border-radius: 50%; }
	.sx-callbar__txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.sx-top { width: 56px; height: 56px; }
	.sx-callbar__btn[data-sx-tip]::after, .sx-langfab[data-sx-tip]::after {
		content: attr(data-sx-tip); position: absolute; top: 50%; transform: translateY(-50%); white-space: nowrap; pointer-events: none;
		padding: 6px 12px; border-radius: 10px; background: var(--sx-ink); color: #fff; font: 700 14px/1.4 var(--sx-font); opacity: 0; visibility: hidden; transition: opacity .15s;
		box-shadow: 0 10px 24px -12px rgba(5, 34, 43, .8);
	}
	.sx-callbar--left .sx-callbar__btn::after { left: calc(100% + 10px); }
	.sx-callbar--right .sx-callbar__btn::after { right: calc(100% + 10px); }
	.sx-langfab::after { right: calc(100% + 10px); }
	[dir="rtl"] .sx-langfab::after, .sx-call-right .sx-langfab::after { left: calc(100% + 10px); right: auto; }
	.sx-call-left .sx-langfab::after { right: calc(100% + 10px); left: auto; }
	.sx-callbar__btn:hover::after, .sx-callbar__btn:focus-visible::after, .sx-langfab:hover::after, .sx-langfab:focus-visible::after { opacity: 1; visibility: visible; }
	/* هامش يتسع للأزرار العائمة حين تضيق الشاشة: 20 + 56 + 16 = 92px من الحافة إلى المحتوى */
	.sx-main .sx-wrap, .sx-footer .sx-wrap { padding-inline: max(28px, calc(92px - max(0px, (100vw - 1280px) / 2))); }
	.sx-main .sx-wrap.sx-layout, .sx-artbg .sx-arthead__in { padding-inline: max(28px, calc(92px - max(0px, (100vw - 1500px) / 2))); }
}

/* ==========================================================================
   الرأس الداكن والقائمة بأزرار
   ========================================================================== */
.sx-topbar { background: var(--sx-ink-2); }
.sx-header { background: rgba(8, 47, 58, .97); border-block-end: 1px solid rgba(25, 195, 166, .25); -webkit-backdrop-filter: saturate(1.3) blur(12px); backdrop-filter: saturate(1.3) blur(12px); }
.sx-header.is-scrolled { background: rgba(5, 34, 43, .98); box-shadow: 0 18px 36px -26px rgba(0, 0, 0, .9); }
.sx-brand__logo { height: 50px; max-width: 200px; }
.sx-header.is-scrolled .sx-brand__logo { height: 42px; }
.sx-header .sx-lang { background: rgba(255, 255, 255, .06); color: #EAF6F5; border-color: rgba(255, 255, 255, .18); }
.sx-header .sx-lang:hover { border-color: var(--sx-mint); color: #fff; background: rgba(25, 195, 166, .14); }
.sx-header .sx-lang__ico { color: var(--sx-mint); }
.sx-header .sx-lang-pill { background: rgba(255, 255, 255, .06); color: #fff; border-color: rgba(255, 255, 255, .2); }
.sx-burger { background: var(--sx-petrol-2); border: 1px solid rgba(25, 195, 166, .45); }
.sx-burger:hover { background: var(--sx-petrol-3); }
@media (min-width: 1200px) {
	.sx-nav__list { gap: 5px; }
	.sx-nav__item { position: relative; border-radius: 11px; background: rgba(255, 255, 255, .055); border: 1px solid rgba(255, 255, 255, .1); transition: background .2s, border-color .2s, transform .2s var(--sx-ease); }
	.sx-nav__item:hover { background: rgba(25, 195, 166, .16); border-color: rgba(25, 195, 166, .5); transform: translateY(-2px); }
	.sx-nav__item.is-current { background: linear-gradient(135deg, var(--sx-petrol-3), var(--sx-petrol)); border-color: var(--sx-mint); }
	.sx-nav__item > a { color: #EAF6F5; padding: 8px clamp(7px, .62vw, 12px); font-size: clamp(13.5px, 1vw, 15px); }
	.sx-nav__item > a:hover, .sx-nav__item.is-current > a { color: #fff; }
	.sx-nav__item > a::after { display: none; }
	.sx-nav__item.has-sub > a { padding-inline-end: 2px; }
	.sx-nav__subtoggle { color: #CFE6E9; margin-inline-start: 0; width: 22px; }
	.sx-nav__sub { top: calc(100% + 10px); }
	.sx-nav__sub--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 460px; }
	.sx-nav__sub--wide { grid-template-columns: repeat(3, minmax(0, 1fr)); min-width: 600px; max-height: 70vh; overflow-y: auto; }
	.sx-nav__item:last-child .sx-nav__sub, .sx-nav__item:nth-last-child(2) .sx-nav__sub { inset-inline-start: auto; inset-inline-end: 0; }
	.sx-lang--bar { display: none; }
}
@media (min-width: 1560px) { .sx-header .sx-lang--bar { display: inline-flex; } }
@media (min-width: 768px) and (max-width: 1199px) { .sx-header .sx-lang--bar { display: inline-flex; } }
.sx-nav__sub a { transition: background .15s, transform .15s; }
.sx-nav__sub a:hover { transform: translateX(calc(3px * var(--sx-dir) * -1)); }
.sx-flag { font-size: 18px; line-height: 1; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }
.sx-nav__subico .sx-flag { font-size: 17px; }
.sx-nav__phone--wa { background: rgba(21, 128, 61, .25); border-color: rgba(74, 222, 128, .45); }
.sx-wa-logo { flex: none; }

/* ==========================================================================
   خلفيات الأقسام الملوّنة (بلا أبيض)
   ========================================================================== */
.sx-section--cream { background: radial-gradient(60% 50% at 100% 0%, rgba(240, 90, 40, .07), transparent 60%), var(--sx-sand); }
.sx-section--sand { background: radial-gradient(60% 60% at 0% 100%, rgba(25, 195, 166, .1), transparent 60%), #EEE2CE; }
.sx-section--mint { background: radial-gradient(60% 60% at 100% 0%, rgba(25, 195, 166, .2), transparent 60%), #DCEFEA; }
.sx-section--peach { background: radial-gradient(60% 60% at 0% 0%, rgba(240, 90, 40, .14), transparent 60%), #F8E3D5; }
.sx-section--sky { background: radial-gradient(60% 60% at 100% 0%, rgba(59, 166, 217, .18), transparent 60%), #DCEBEF; }
.sx-section--tint, .sx-section--foam { background: #DCEFEA; }
.sx-section--dark .sx-eyebrow { color: #fff; background: rgba(255, 255, 255, .08); border-color: rgba(25, 195, 166, .4); }
.sx-section--dark .sx-link { color: var(--sx-mint); }
.sx-section--dark .sx-link:hover { color: #fff; }

/* رأس القسم: شارة، عنوان، وصف، نقاط */
.sx-head__lead { color: var(--sx-muted); margin: 0; font-size: 17px; max-width: 760px; }
.sx-head--center .sx-head__lead { margin-inline: auto; }
.sx-head__link { flex: none; padding: 10px 16px; border-radius: 12px; background: var(--sx-card); border: 1.5px solid var(--sx-line); transition: transform .2s var(--sx-ease), border-color .2s; }
.sx-head__link:hover { transform: translateY(-2px); border-color: var(--sx-coral); }
.sx-section--dark .sx-head__link { background: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .2); }
.sx-section--dark .sx-head__lead, .sx-band .sx-head__lead, .sx-head--light .sx-head__lead { color: #C3DFE3; }
.sx-head--light h2, .sx-band .sx-head h2 { color: #fff; }
.sx-emo { font-size: 16px; line-height: 1; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }
.sx-eyebrow:has(.sx-emo)::before { display: none; }
.sx-points { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; counter-reset: sxpt; }
.sx-points li { position: relative; padding-inline-start: 34px; line-height: 1.7; font-weight: 700; color: var(--sx-ink); counter-increment: sxpt; }
.sx-points li::before { content: counter(sxpt); position: absolute; inset-inline-start: 0; top: .1em; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: #fff; background: var(--sx-coral); box-shadow: 0 0 0 3px rgba(240, 90, 40, .18); }
.sx-points li:nth-child(3n+2)::before { background: var(--sx-mint-d); box-shadow: 0 0 0 3px rgba(25, 195, 166, .2); }
.sx-points li:nth-child(3n+3)::before { background: var(--sx-petrol); box-shadow: 0 0 0 3px rgba(10, 77, 92, .18); }
.sx-points--light li { color: #EAF6F5; }
.sx-points--light li:nth-child(3n+3)::before { background: #3BA6D9; }
.sx-points--2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 8px 18px; }
.sx-points--row { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.sx-head .sx-points { max-width: 760px; }
.sx-head--split .sx-points { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.sx-head--center .sx-points { justify-content: center; display: flex; flex-wrap: wrap; gap: 8px 22px; }

/* إطار الصور الزخرفي: حد منزاح، أركان ملوّنة */
.sx-frame { position: relative; margin: 0; padding: 0; isolation: isolate; }
.sx-frame::before { content: ""; position: absolute; inset: 12px -12px -12px 12px; z-index: -1; border-radius: 22px; border: 2px dashed color-mix(in srgb, var(--c, var(--sx-mint)) 75%, transparent); transition: transform .35s var(--sx-ease); }
[dir="rtl"] .sx-frame::before { inset: 12px 12px -12px -12px; }
.sx-frame::after { content: ""; position: absolute; width: 54px; height: 54px; top: -8px; inset-inline-end: -8px; z-index: 2; border-top: 5px solid var(--sx-coral); border-inline-end: 5px solid var(--sx-coral); border-start-end-radius: 18px; pointer-events: none; transition: transform .35s var(--sx-ease); }
.sx-frame__in { position: relative; display: block; overflow: hidden; border-radius: 20px; aspect-ratio: 4 / 3; background: var(--sx-ink); box-shadow: 0 24px 46px -30px rgba(5, 34, 43, .8); }
.sx-frame__in img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--sx-ease); }
.sx-frame:hover .sx-frame__in img { transform: scale(1.05); }
.sx-frame:hover::before { transform: translate(-4px, -4px); }
.sx-frame:hover::after { transform: translate(3px, -3px); }
.sx-frame--fill { position: absolute; inset: 0; }
.sx-frame--fill .sx-frame__in { position: absolute; inset: 0; aspect-ratio: auto; border-radius: 0; box-shadow: none; }
.sx-frame--fill::before { inset: 14px; border-radius: 16px; border-color: rgba(255, 255, 255, .45); z-index: 1; pointer-events: none; }
[dir="rtl"] .sx-frame--fill::before { inset: 14px; }
.sx-frame--fill::after { top: 6px; inset-inline-end: 6px; }

/* ---------- لوحة عرض السعر والتتبع في الواجهة ---------- */
.sx-dock { position: relative; z-index: 3; display: grid; gap: 14px; margin-top: 34px; }
@media (min-width: 1024px) { .sx-dock { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); } }
.sx-dock__card { margin: 0; padding: 16px; border-radius: 22px; background: linear-gradient(160deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .05)); border: 1px solid rgba(255, 255, 255, .2); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 30px 60px -36px rgba(0, 0, 0, .9); transition: border-color .25s, transform .25s var(--sx-ease); }
.sx-dock__card:hover, .sx-dock__card:focus-within { border-color: rgba(25, 195, 166, .6); transform: translateY(-3px); }
.sx-dock__card--quote { border-top: 3px solid var(--sx-coral); }
.sx-dock__card--track { border-top: 3px solid var(--sx-mint); }
.sx-dock__h { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-weight: 800; color: #fff; font-size: 16px; }
.sx-dock__row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.sx-dock__f { flex: 1 1 150px; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sx-dock__f--grow { flex: 1 1 220px; }
.sx-dock__f span { font-size: 12.5px; font-weight: 800; color: #B7D6DA; }
.sx-dock__f select, .sx-dock__f input { width: 100%; min-height: 48px; padding: 8px 12px; border-radius: 12px; border: 1.5px solid rgba(255, 255, 255, .25); background: rgba(5, 34, 43, .55); color: #fff; font-size: 15.5px; }
.sx-dock__f select option { color: var(--sx-ink); background: var(--sx-sand); }
.sx-dock__f select:focus, .sx-dock__f input:focus { outline: none; border-color: var(--sx-mint); box-shadow: 0 0 0 3px rgba(25, 195, 166, .3); }
.sx-dock__f input::placeholder { color: rgba(255, 255, 255, .45); }
.sx-dock__swap { display: inline-flex; width: 36px; height: 48px; align-items: center; justify-content: center; color: var(--sx-coral); flex: none; }
.sx-dock .sx-btn { min-height: 48px; flex: 0 0 auto; }
@media (max-width: 599px) { .sx-dock__swap { display: none; } .sx-dock .sx-btn { flex: 1 1 100%; } }

/* ---------- الخليج أولاً: مربعات كبيرة بالأعلام ---------- */
.sx-gulf__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.sx-gtile { position: relative; display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 20px 18px 18px; border-radius: 22px; text-decoration: none; overflow: hidden; isolation: isolate; color: #fff;
	background: var(--sx-grid), linear-gradient(150deg, var(--sx-petrol-3), var(--sx-petrol) 55%, var(--sx-ink)); box-shadow: 0 22px 40px -28px rgba(5, 34, 43, .9); transition: transform .3s var(--sx-ease), box-shadow .3s; }
.sx-gtile::before { content: ""; position: absolute; width: 170px; height: 170px; inset-inline-end: -60px; top: -60px; z-index: -1; background: var(--sx-globe) center / contain no-repeat; transition: transform .6s var(--sx-ease); }
.sx-gtile::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 4px; background: repeating-linear-gradient(90deg, var(--sx-coral) 0 14px, transparent 14px 22px); transform: scaleX(.3); transform-origin: right; transition: transform .4s var(--sx-ease); }
[dir="ltr"] .sx-gtile::after { transform-origin: left; }
.sx-gtile:hover { transform: translateY(-6px); box-shadow: 0 30px 50px -28px rgba(5, 34, 43, 1); color: #fff; }
.sx-gtile:hover::before { transform: rotate(25deg) scale(1.1); }
.sx-gtile:hover::after { transform: scaleX(1); }
.sx-gtile__flag { font-size: 44px; line-height: 1; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .35)); }
.sx-gtile__name { font-size: 22px; font-weight: 800; margin-top: 6px; }
.sx-gtile__via { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 700; color: #BFE6E3; line-height: 1.5; }
.sx-gtile__via svg { color: var(--sx-mint); }
.sx-gtile__count { font-size: 12.5px; font-weight: 800; color: #FFD3C2; }
.sx-gtile__go { position: absolute; top: 18px; inset-inline-end: 18px; display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 255, 255, .12); transition: background .2s, transform .3s var(--sx-ease); }
.sx-gtile:hover .sx-gtile__go { background: var(--sx-coral); transform: translateX(calc(4px * var(--sx-dir) * -1)); }

/* ---------- المناطق ومربعات الأعلام ---------- */
.sx-regions { display: grid; gap: 18px; }
@media (min-width: 900px) { .sx-regions { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sx-region--world { grid-column: 1 / -1; } }
.sx-region { padding: 18px; border-radius: 22px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(25, 195, 166, .25); transition: border-color .25s; }
.sx-region:hover { border-color: rgba(25, 195, 166, .55); }
.sx-section:not(.sx-section--dark) .sx-region { background: var(--sx-card); border-color: var(--sx-line); box-shadow: var(--sx-shadow-sm); }
.sx-region__h { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 18px; }
.sx-region__h > span { font-size: 22px; line-height: 1; }
.sx-region__h small { margin-inline-start: auto; display: inline-flex; min-width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; font-size: 13px; color: #fff; background: var(--sx-coral); }
.sx-flags { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); }
.sx-flags--wide { grid-template-columns: repeat(auto-fill, minmax(min(100%, 170px), 1fr)); }
.sx-flagtile { --c: var(--sx-mint); display: flex; align-items: center; gap: 10px; height: 100%; padding: 10px 12px; border-radius: 14px; text-decoration: none; color: var(--sx-ink); background: var(--sx-card); border: 1.5px solid transparent; border-inline-start: 4px solid var(--c); box-shadow: 0 12px 22px -18px rgba(0, 0, 0, .7); transition: transform .2s var(--sx-ease), border-color .2s, background .2s; }
.sx-flagtile:hover { transform: translateY(-3px) scale(1.02); border-color: var(--c); color: var(--sx-ink); background: #fff8ef; }
.sx-flagtile__flag { font-size: 28px; line-height: 1; flex: none; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }
.sx-flagtile__txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
.sx-flagtile__txt strong { font-size: 15px; font-weight: 800; }
.sx-flagtile__txt small { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; color: var(--sx-muted); flex-wrap: wrap; }
.sx-flagtile__txt small svg { color: var(--c); }
.sx-minichips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.sx-minichips a, .sx-minichips > li > span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 999px; font-size: 13.5px; font-weight: 800; text-decoration: none; color: var(--ink); background: var(--tint); border: 1px solid color-mix(in srgb, var(--accent) 28%, transparent); transition: background .2s, color .2s, transform .2s; }
.sx-minichips a:hover { background: var(--accent); color: #fff; transform: translateY(-2px); }
.sx-minichips--light > li > span { color: #fff; background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .2); }

/* ---------- شحن السيارات ---------- */
.sx-cars__grid { display: grid; gap: 28px; align-items: center; }
@media (min-width: 1000px) { .sx-cars__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 44px; } }
.sx-cars__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.sx-cars__methods { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.sx-cars__methods--row { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.sx-method { position: relative; display: flex; gap: 16px; align-items: flex-start; padding: 20px; border-radius: 22px; background: var(--sx-card); border: 1px solid var(--sx-line); border-inline-start: 5px solid var(--sx-coral); box-shadow: var(--sx-shadow-sm); transition: transform .25s var(--sx-ease), box-shadow .25s; }
.sx-method:nth-child(2) { border-inline-start-color: var(--sx-mint); }
.sx-method:nth-child(3) { border-inline-start-color: #3BA6D9; }
.sx-method:hover { transform: translateX(calc(6px * var(--sx-dir) * -1)); box-shadow: var(--sx-shadow); }
.sx-method__emo { flex: none; display: inline-flex; width: 58px; height: 58px; align-items: center; justify-content: center; border-radius: 18px; font-size: 30px; background: var(--sx-sand); box-shadow: inset 0 0 0 2px var(--sx-line); }
.sx-method h3 { font-size: 18.5px; margin-bottom: 4px; }
.sx-method p { margin: 0; color: var(--sx-muted); font-size: 15px; }

/* ---------- خدمات (شبكات 3 و4) ---------- */
@media (min-width: 1100px) { .sx-fleet__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sx-fleet__grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .sx-fleet__grid--3 > li, .sx-fleet__grid--4 > li { grid-column: auto !important; } }
.sx-svc { min-height: 360px; }

/* ---------- ألواح وأوراق ---------- */
.sx-paper { position: relative; padding: 26px 22px; border-radius: 24px; background: var(--sx-card); border: 1px solid var(--sx-line); box-shadow: var(--sx-shadow-sm); }
.sx-paper::before { content: ""; position: absolute; inset-inline: 22px; top: 0; height: 4px; border-radius: 0 0 4px 4px; background: repeating-linear-gradient(90deg, var(--sx-coral) 0 24px, var(--sx-mint) 24px 36px, var(--sx-petrol) 36px 60px); }
@media (min-width: 768px) { .sx-paper { padding: 34px 38px; } }
.sx-panel { position: relative; padding: 22px 20px; border-radius: 22px; background: var(--sx-card); border: 1px solid var(--sx-line); box-shadow: var(--sx-shadow-sm); transition: transform .25s var(--sx-ease); }
.sx-panel:hover { transform: translateY(-3px); }
.sx-panel h2 { font-size: 20px; display: flex; align-items: center; gap: 8px; }
.sx-panel__sub { font-size: 16px; margin: 18px 0 10px; color: #fff; }
.sx-panel--dark { color: #D5ECEE; background: var(--sx-globe) no-repeat calc(100% + 80px) calc(100% + 80px) / 240px, linear-gradient(160deg, var(--sx-petrol), var(--sx-ink)); border-color: rgba(25, 195, 166, .3); }
.sx-panel--dark h2 { color: #fff; }
.sx-panel--coral { color: #FFEDE5; background: radial-gradient(80% 60% at 100% 0%, rgba(255, 255, 255, .2), transparent 60%), linear-gradient(150deg, var(--sx-coral), var(--sx-coral-d) 60%, var(--sx-coral-dd)); border: 0; }
.sx-panel--coral h2 { color: #fff; }
.sx-split { display: grid; gap: 20px; }
@media (min-width: 900px) { .sx-split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; } }

/* صفحة الدولة */
.sx-country__intro { display: grid; gap: 22px; align-items: start; }
@media (min-width: 1024px) { .sx-country__intro { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 30px; } }
.sx-ccards { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.sx-ccard { position: relative; padding: 18px; border-radius: 20px; background: var(--sx-card); border: 1px solid var(--sx-line); border-top: 4px solid var(--accent); box-shadow: var(--sx-shadow-sm); transition: transform .25s var(--sx-ease), box-shadow .25s; }
.sx-ccard:nth-child(2) { border-top-color: var(--sx-coral); }
.sx-ccard:nth-child(3) { border-top-color: var(--sx-petrol); }
.sx-ccard:nth-child(4) { border-top-color: #E58A4E; }
.sx-ccard:hover { transform: translateY(-4px) rotate(-.4deg); box-shadow: var(--sx-shadow); }
.sx-ccard__emo { display: inline-flex; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: 15px; font-size: 25px; margin-bottom: 10px; background: var(--sx-sand); }
.sx-ccard h3 { font-size: 17.5px; margin-bottom: 4px; }
.sx-ccard p { margin: 0; font-size: 14.5px; color: var(--sx-muted); }

/* عرض السعر والتتبع */
.sx-quotezone { overflow: hidden; }
.sx-quotezone .sx-form { background: var(--sx-sand); border: 0; box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .9); }
.sx-quotezone .sx-form .sx-field input, .sx-quotezone .sx-form .sx-field select, .sx-quotezone .sx-form .sx-field textarea { background: var(--sx-card); }
.sx-quotepage { position: relative; z-index: 1; }
.sx-quotezone .sx-panel:not(.sx-panel--coral) { background: rgba(255, 255, 255, .06); border-color: rgba(25, 195, 166, .3); color: #D5ECEE; }
.sx-quotezone .sx-panel:not(.sx-panel--coral) h2 { color: #fff; }
.sx-quotezone .sx-panel .sx-points li { color: #EAF6F5; }
.sx-stages { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; position: relative; }
.sx-stages::before { content: ""; position: absolute; inset-inline-start: 21px; top: 18px; bottom: 18px; border-inline-start: 2px dashed rgba(25, 195, 166, .6); }
.sx-stages li { position: relative; display: flex; align-items: center; gap: 12px; font-weight: 800; color: #fff; }
.sx-stages li span { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%; font-size: 20px; background: var(--sx-ink); border: 2px solid var(--sx-mint); flex: none; position: relative; }
.sx-form--track .sx-form__ico { background: linear-gradient(140deg, var(--sx-mint), var(--sx-mint-d)); }

/* صفحة الأسئلة */
.sx-faqpage { display: grid; gap: 22px; align-items: start; }
@media (min-width: 1024px) { .sx-faqpage { grid-template-columns: 290px minmax(0, 1fr); gap: 30px; } .sx-faqpage__nav { position: sticky; top: 110px; } }
.sx-faqpage__nav ul { list-style: none; margin: 0; padding: 10px; display: flex; flex-wrap: wrap; gap: 6px; border-radius: 20px; background: linear-gradient(160deg, var(--sx-petrol), var(--sx-ink)); }
@media (min-width: 1024px) { .sx-faqpage__nav ul { flex-direction: column; } }
.sx-faqpage__nav a { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 12px; color: #EAF6F5; text-decoration: none; font-weight: 800; font-size: 14.5px; transition: background .2s, transform .2s; }
.sx-faqpage__nav a:hover { background: rgba(25, 195, 166, .2); color: #fff; transform: translateX(calc(3px * var(--sx-dir) * -1)); }
.sx-faqpage__list { display: grid; gap: 22px; }
.sx-faqgroup { padding: 22px; border-radius: 24px; background: var(--sx-card-2); border: 1px solid var(--sx-line); box-shadow: var(--sx-shadow-sm); scroll-margin-top: 110px; }
.sx-faqgroup h2 { display: flex; align-items: center; gap: 10px; font-size: 22px; }
.sx-faqgroup__emo { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 14px; background: var(--sx-sand); font-size: 22px; }
.sx-faqgroup .sx-link { margin-top: 14px; }

/* من نحن */
.sx-about__emo { display: inline-flex; width: 52px; height: 52px; align-items: center; justify-content: center; border-radius: 16px; font-size: 26px; margin-bottom: 10px; background: var(--sx-sand); box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent); }
.sx-about__block { transition: transform .25s var(--sx-ease), box-shadow .25s; }
.sx-about__block:hover, .sx-infocard:hover { transform: translateY(-4px); box-shadow: var(--sx-shadow); }
.sx-infocard { transition: transform .25s var(--sx-ease), box-shadow .25s; }
.sx-infocard .sx-points { margin: 0 0 16px; }

/* رأس الصفحات: علم، رمز، شعار */
.sx-phero__ico--flag { font-size: 34px; background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .35); box-shadow: none; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }
.sx-phero__emo { position: absolute; z-index: 2; inset-inline-start: 18px; bottom: 16px; display: inline-flex; width: 56px; height: 56px; align-items: center; justify-content: center; border-radius: 18px; font-size: 30px; background: rgba(5, 34, 43, .55); border: 1px solid rgba(255, 255, 255, .3); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sx-phero__art--logo { display: flex; align-items: center; justify-content: center; padding: 26px; background: var(--sx-grid), radial-gradient(60% 70% at 50% 40%, rgba(25, 195, 166, .25), transparent 70%), linear-gradient(150deg, var(--sx-petrol), var(--sx-ink)); }
.sx-phero__logo { width: auto; max-width: 70%; max-height: 100%; height: auto; object-fit: contain; filter: drop-shadow(0 16px 30px rgba(0, 0, 0, .45)); animation: sx-float 7s ease-in-out infinite; }
.sx-phero .sx-points { margin-top: 4px; }
.sx-phero__frame { transition: transform .4s var(--sx-ease); }
.sx-phero__frame:hover { transform: rotate(-1deg) translateY(-4px); }

/* ---------- الفهرس داخل المقال بعد الفقرة الأولى: قائمة منسدلة بتمرير داخلي ---------- */
.sx-prose .sx-toc { margin: 1.6em 0; max-width: 100%; font-size: 15px; line-height: 1.6; }
.sx-prose .sx-toc ol, .sx-prose .sx-toc ul { margin: 0; padding: 0; }
.sx-prose .sx-toc li { padding: 0; margin: 0; position: static; }
.sx-prose .sx-toc ol > li::before { content: none; display: none; }
.sx-prose .sx-toc a { color: #D2EAEC; font-weight: 700; text-decoration: none; background: none; }
.sx-prose .sx-toc a:hover { color: #fff; background: rgba(255, 255, 255, .08); }
.sx-prose .sx-toc__list > li > a::before { content: counter(sxtoc); display: inline-flex; }
.sx-prose .sx-toc__sub > li > a::before { content: counter(sxtoc) "." counter(sxsub); display: inline-flex; }
.sx-toc--inline { display: block; }
.sx-toc--side { display: none !important; }
.sx-toc__head { cursor: pointer; }
.sx-toc__body { max-height: min(340px, 52vh); overscroll-behavior: contain; }
.sx-toc__body::-webkit-scrollbar { width: 6px; }
.sx-toc__body::-webkit-scrollbar-thumb { background: rgba(25, 195, 166, .5); border-radius: 6px; }
.sx-toc__title::before { content: ""; width: 26px; height: 26px; flex: none; background: url("../img/brand/symbol-light.webp") center / contain no-repeat; }
.sx-toc__title > svg { display: none; }

/* الشريط الجانبي: أقسام مؤطَّرة */
.sx-side__b { gap: 18px; }
@media (min-width: 1024px) { .sx-side { position: relative; } .sx-side__b > .sx-widget--quote { position: static; } }
.sx-widget:not(.sx-widget--quote):not(.sx-widget--cta) { background: var(--sx-card-2); }
.sx-widget { transition: transform .25s var(--sx-ease), box-shadow .25s; }
.sx-widget:hover { transform: translateY(-3px); box-shadow: var(--sx-shadow); }
.sx-widget::after { content: ""; position: absolute; inset: 8px; border-radius: 16px; border: 1px dashed color-mix(in srgb, var(--accent) 30%, transparent); pointer-events: none; }
.sx-widget--quote::after, .sx-widget--cta::after { border-color: rgba(255, 255, 255, .28); }
.sx-widget > * { position: relative; z-index: 1; }
.sx-widget__ico--flag { background: var(--sx-sand); font-size: 20px; }
.sx-widget__txt { font-size: 14.5px; color: var(--sx-muted); margin: -4px 0 12px; }
.sx-miniflags { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.sx-miniflags a { display: flex; align-items: center; gap: 7px; padding: 6px 8px; border-radius: 10px; font-size: 13.5px; font-weight: 800; color: var(--sx-ink); text-decoration: none; background: var(--sx-card); border: 1px solid var(--sx-line); transition: background .15s, transform .15s, border-color .15s; }
.sx-miniflags a span { font-size: 18px; line-height: 1; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }
.sx-miniflags a:hover, .sx-miniflags a[aria-current] { border-color: var(--sx-mint); background: #E3F4F0; transform: translateY(-2px); }
.sx-mini__ph { display: inline-flex; color: var(--accent); }
.sx-article { background: var(--sx-card); }
.sx-artbg { background: var(--sx-sand); }

/* الأزرار العائمة: تلميحات أوضح، زر الاتصال بارز، واتساب بالشعار الرسمي */
.sx-callbar__btn--call { background: linear-gradient(135deg, var(--sx-coral), var(--sx-coral-dd)); }
.sx-callbar__btn--wa { background: linear-gradient(135deg, #25D366, #128C4A); }
.sx-callbar__btn--wa .sx-callbar__ico { width: 26px; height: 26px; }
@media (min-width: 601px) {
	.sx-callbar__btn { width: 60px; height: 60px; }
	.sx-callbar__btn--call { width: 64px; height: 64px; }
	.sx-callbar__btn--call .sx-callbar__ico { width: 26px; height: 26px; animation: sx-shake 3.2s ease-in-out infinite; }
	.sx-callbar__btn[data-sx-tip]::after, .sx-langfab[data-sx-tip]::after { padding: 8px 14px; border-radius: 12px; font-size: 14.5px; background: var(--sx-ink); border: 1px solid rgba(25, 195, 166, .45); }
	.sx-callbar__btn--call[data-sx-tip]::after { background: var(--sx-coral-dd); border-color: rgba(255, 255, 255, .5); }
	.sx-callbar__btn--wa[data-sx-tip]::after { background: #128C4A; border-color: rgba(255, 255, 255, .5); }
}
@keyframes sx-shake { 0%, 86%, 100% { transform: rotate(0); } 88% { transform: rotate(-14deg); } 91% { transform: rotate(12deg); } 94% { transform: rotate(-8deg); } 97% { transform: rotate(5deg); } }
.sx-top::before { content: ""; position: absolute; inset: 13px; background: url("../img/brand/symbol-light.webp") center / contain no-repeat; opacity: .18; }

/* بطاقات المقالات والأسئلة بلون كريمي */
.sx-post { background: var(--sx-card); }
.sx-faq__item { background: var(--sx-card); }
.sx-faq__item[open] { background: #FFF8EE; }
.sx-hub__item { background: var(--sx-card); transition: transform .3s var(--sx-ease), box-shadow .3s; }
.sx-hub__item:hover { transform: translateY(-4px); }
.sx-hub__media { min-height: 260px; }
.sx-include li { background: var(--sx-card); }
.sx-tl__item { background: var(--sx-card); transition: transform .25s var(--sx-ease), box-shadow .25s; }
.sx-tl__item:hover { transform: translateY(-4px); box-shadow: var(--sx-shadow); }
.sx-step { background: var(--sx-card); }
.sx-chips a { background: var(--sx-card); }
.sx-modes__bar { background: var(--sx-card); }
.sx-modes__panel { background: var(--sx-card); }
.sx-modes__media .sx-frame--fill::before { border-color: rgba(255, 255, 255, .55); }
.sx-faqband__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.sx-faqband__side .sx-points { margin: 0 0 4px; }
.sx-pass { background: var(--sx-card); }
.sx-bsec__head { background: var(--sx-card); }
.sx-empty { background: var(--sx-card); }
.sx-form { background: var(--sx-card); }

.sx-section--dark .sx-points li, .sx-band .sx-points li { color: #EAF6F5; }
.sx-band .sx-eyebrow, .sx-head--light .sx-eyebrow { color: #fff; background: rgba(255, 255, 255, .1); border-color: rgba(25, 195, 166, .45); }
.sx-minichips a > span { font-size: 15px; line-height: 1; }
@media (max-width: 479px) {
	.sx-header__in { gap: 6px; }
	.sx-brand__logo, .sx-header.is-scrolled .sx-brand__logo { height: 32px; max-width: 120px; }
	.sx-quote { padding-inline: 10px; font-size: 13px; min-height: 42px; }
	.sx-burger { padding: 0 10px; gap: 6px; height: 42px; font-size: 13px; }
}
@media (max-width: 359px) { .sx-brand__logo, .sx-header.is-scrolled .sx-brand__logo { height: 26px; max-width: 96px; } }

.sx-section--dark .sx-form h2, .sx-section--dark .sx-form h3, .sx-form .sx-form__title { color: var(--sx-ink); }
.sx-section--dark .sx-form .sx-head h2 { color: var(--sx-ink); }
.sx-section--dark .sx-form { color: var(--sx-body); }

.sx-quotepage > *, .sx-split > *, .sx-country__intro > *, .sx-faqpage > *, .sx-cars__grid > *, .sx-hero__grid > *, .sx-phero__grid > * { min-width: 0; }
.sx-points li { overflow-wrap: anywhere; }

@media (max-width: 600px) {
	.sx-callbar, .sx-langfab, .sx-top { transition: opacity .25s ease, transform .25s ease, visibility .25s; }
	.sx-float-away .sx-callbar, .sx-float-away .sx-langfab, .sx-float-away .sx-top.is-on { opacity: 0; visibility: hidden; transform: translateY(20px); pointer-events: none; }
}

/* هامش الأزرار العائمة للشاشات المتوسطة */
@media (min-width: 601px) and (max-width: 1100px) { .sx-langfab { bottom: calc(max(24px, env(safe-area-inset-bottom)) + 72px); } }

/* تقليل الحركة للعناصر الجديدة */
@media (prefers-reduced-motion: reduce) {
	.sx-phero__logo, .sx-callbar__btn--call .sx-callbar__ico, .sx-quote::before, .sx-cta__lines::before { animation: none !important; }
}

/* ---------- مقالات مصممة بأنماط مضمّنة: <div data-sx-art="1"> ---------- */
.sx-prose [data-sx-art] { display: block; }
.sx-prose [data-sx-art] :is(ul, ol)[style] { padding-inline-start: revert; }
.sx-prose [data-sx-art] :is(ul, ol)[style] > li, .sx-prose [data-sx-art] li[style] { padding-inline-start: revert; position: static; counter-increment: none; }
.sx-prose [data-sx-art] :is(ul, ol)[style] > li::before, .sx-prose [data-sx-art] li[style]::before { content: none; display: none; }
.sx-prose [data-sx-art] :is(ul, ol)[style] > li::marker, .sx-prose [data-sx-art] li[style]::marker { content: normal; }
.sx-prose [data-sx-art] :is(h2, h3, h4)[style] { background: none; border: 0; border-radius: 0; padding: 0; display: block; }
.sx-prose [data-sx-art] h3[style]::before { content: none; display: none; }
.sx-prose [data-sx-art] blockquote[style] { background: none; border: 0; border-radius: 0; padding: 0; font-size: inherit; }
.sx-prose [data-sx-art] blockquote[style]::before { content: none; display: none; }
.sx-prose [data-sx-art] .sx-table:has(> table[style]) { border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.sx-prose [data-sx-art] table[style] { border-collapse: collapse; border-spacing: 0; }
.sx-prose [data-sx-art] table[style] :is(th, td) { border: revert; background: revert; color: revert; font-weight: revert; white-space: normal; padding: revert; }
.sx-prose [data-sx-art] table[style] tr:hover > td { background: revert; }
.sx-prose [data-sx-art] img[style] { border-radius: 0; box-shadow: none; }
.sx-prose [data-sx-art] a[style] { text-decoration: none; background: none; border-radius: 0; font-weight: inherit; }
.sx-prose [data-sx-art] a[style]:hover { background: none; }
.sx-prose [data-sx-art] figure[style] figcaption, .sx-prose [data-sx-art] figcaption[style] { display: block; background: none; padding: 0; border-radius: 0; }
.sx-prose [data-sx-art] :is(p, div, span, td, th)[style*="center"] { text-align: center !important; }
.sx-prose [data-sx-art] table[style] :is(th, td):first-child { min-width: 0; }

/* ---------- تقليل الحركة ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; transition-delay: 0s !important; }
	.sx-speed, .sx-rmap__mover, .sx-art__road, .sx-rmap__ring { display: none !important; }
	.sx-ticker__belt { width: auto; }
	.sx-ticker__mask { -webkit-mask-image: none; mask-image: none; }
	.sx-ticker__list { flex-wrap: wrap; justify-content: center; animation: none !important; padding-inline: 16px; }
	.sx-ticker__list--clone { display: none; }
	.sx-rmap__arc, .sx-footer__route-line { animation: none !important; }
	.sx-tl__num { background: var(--sx-coral) !important; border-color: #FFD3C2 !important; color: #fff !important; }
}

/* ---------- الطباعة ---------- */
@media print {
	.sx-topbar, .sx-header, .sx-footer, .sx-side, .sx-article__form, .sx-cta, .sx-top, .sx-langfab, .sx-callbar, .sx-speed { display: none !important; }
	.sx-arthead { background: none; color: #000; padding: 0; }
	.sx-arthead .sx-article__title { color: #000; }
	.sx-layout { margin-top: 0; }
}