/* =========================================================
   الاستدامة — assets/css/sustainability.css
   تُحمَّل فوق supply-chain.css (النظام المشترك) ومقيّدة بـ body.page-sus-a،
   فلا تتسرّب إلى سلاسل الإمداد ولا المحتوى المحلي ولا أي صفحة أخرى.
   ========================================================= */

/* ---------- الغلاف: صورة المصنع خلف عنوان أبيض ---------- */
body.page-sus-a .sus-hero-media {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center 58%;
}
/* طبقتان: تعتيم علوي يحفظ قراءة الترويسة البيضاء فوق سماء فاتحة،
   وتدرّج جانبي من جهة النص يحفظ قراءة العنوان. */
body.page-sus-a .sus-hero-scrim {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(to bottom, rgba(0, 24, 56, .78) 0%, rgba(0, 24, 56, .34) 20%, rgba(0, 24, 56, 0) 42%),
		linear-gradient(to left, rgba(0, 31, 70, .92) 0%, rgba(0, 31, 70, .78) 34%, rgba(0, 31, 70, .26) 74%, rgba(0, 31, 70, .12) 100%);
}
html[dir="ltr"] body.page-sus-a .sus-hero-scrim {
	background:
		linear-gradient(to bottom, rgba(0, 24, 56, .78) 0%, rgba(0, 24, 56, .34) 20%, rgba(0, 24, 56, 0) 42%),
		linear-gradient(to right, rgba(0, 31, 70, .92) 0%, rgba(0, 31, 70, .78) 34%, rgba(0, 31, 70, .26) 74%, rgba(0, 31, 70, .12) 100%);
}
body.page-sus-a .sus-hero .breadcrumb { margin-bottom: 10px; }

/* ---------- شريط التنقّل الداخلي ---------- */
body.page-sus-a .sus-subnav {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--sc-navy-d);
	border-bottom: 1px solid rgba(255, 255, 255, .1);
	transition: top var(--ease);
}
/* صف واحد يُمرَّر أفقيًا على الشاشات الضيّقة — لا سطران، كما في «من نحن» والمركز الإعلامي */
body.page-sus-a .sus-subnav ul {
	display: flex;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
	overflow-x: auto;
	scrollbar-width: none;
}
body.page-sus-a .sus-subnav ul::-webkit-scrollbar { display: none; }
body.page-sus-a .sus-subnav li { flex: none; }
body.page-sus-a .sus-subnav a {
	display: block;
	white-space: nowrap;
	padding: 16px 18px;
	font-size: .9375rem;
	font-weight: 600;
	color: rgba(255, 255, 255, .7);
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: color var(--ease), border-color var(--ease);
}
body.page-sus-a .sus-subnav a:hover,
body.page-sus-a .sus-subnav a.is-active {
	color: #fff;
	border-bottom-color: var(--sc-teal);
}

/* ---------- الركائز: صورة ونص يتبادلان الجهة ---------- */
body.page-sus-a .sus-pillar { padding-block: var(--sc-pad); scroll-margin-top: 64px; }
body.page-sus-a .sus-pillar:nth-child(odd)  { background: #fff; }
body.page-sus-a .sus-pillar:nth-child(even) { background: var(--sc-tint); }

body.page-sus-a .sus-pillar-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
	align-items: center;
	gap: clamp(28px, 4vw, 64px);
}
/* الصف الثاني يعكس الترتيب فلا تصير الصور كلها في عمود واحد */
body.page-sus-a .sus-pillar.is-flip .sus-pillar-copy  { order: 2; }
body.page-sus-a .sus-pillar.is-flip .sus-pillar-media { order: 1; }
body.page-sus-a .sus-pillar.is-plain .sus-pillar-inner { grid-template-columns: minmax(0, 1fr); }

body.page-sus-a .sus-pillar-ico {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	margin-bottom: 16px;
	border-radius: 14px;
	background: rgba(0, 165, 181, .1);
	color: var(--sc-teal-d);
}
body.page-sus-a .sus-pillar-ico svg { width: 26px; height: 26px; }

body.page-sus-a .sus-pillar-copy h2 {
	margin: 0 0 14px;
	font-size: clamp(1.5rem, 2.6vw, 2.125rem);
	line-height: 1.3;
	font-weight: 700;
	color: var(--sc-navy);
}
body.page-sus-a .sus-pillar-copy > p {
	margin: 0;
	max-width: 52ch;
	font-size: 1rem;
	line-height: 1.95;
	color: var(--sc-ink-2);
}

body.page-sus-a .sus-points {
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 12px;
}
body.page-sus-a .sus-points li {
	display: grid;
	grid-template-columns: 22px minmax(0, 1fr);
	align-items: start;
	gap: 12px;
	font-size: .9375rem;
	font-weight: 600;
	color: var(--sc-ink);
}
body.page-sus-a .sus-points svg { width: 22px; height: 22px; color: var(--sc-teal-d); }

body.page-sus-a .sus-pillar-media {
	margin: 0;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 18px 40px rgba(11, 20, 32, .14);
}
body.page-sus-a .sus-pillar-media img {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* ---------- الشهادات ---------- */
body.page-sus-a .sus-certs { padding-block: var(--sc-pad); background: #fff; }
body.page-sus-a .sus-cert-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(20px, 2.4vw, 32px);
}
body.page-sus-a .sus-cert-list li {
	display: grid;
	justify-items: center;
	gap: 6px;
	text-align: center;
	padding: clamp(22px, 2.6vw, 30px) 18px;
	border: 1px solid var(--sc-line);
	border-radius: 14px;
	background: #fff;
}
body.page-sus-a .sus-cert-list img {
	width: min(180px, 100%);
	height: auto;
	margin-bottom: 6px;
}
body.page-sus-a .sus-cert-list strong { font-size: 1rem; color: var(--sc-navy); letter-spacing: .02em; }
body.page-sus-a .sus-cert-list span   { font-size: .875rem; color: var(--sc-ink-2); }

/* ---------- الختام ---------- */
body.page-sus-a .sus-cta { padding-block: 0 var(--sc-pad); background: #fff; }
body.page-sus-a .sus-cta-panel {
	display: grid;
	justify-items: center;
	gap: 10px;
	text-align: center;
	padding: clamp(34px, 4.5vw, 60px) clamp(22px, 3vw, 48px);
	border-radius: 16px;
	background: var(--sc-navy-d);
	color: #fff;
}
body.page-sus-a .sus-cta-panel h2 {
	margin: 0;
	font-size: clamp(1.375rem, 2.4vw, 2rem);
	line-height: 1.3;
	font-weight: 700;
}
body.page-sus-a .sus-cta-panel p {
	margin: 0;
	max-width: 56ch;
	font-size: 1rem;
	line-height: 1.9;
	color: rgba(255, 255, 255, .78);
}
body.page-sus-a .sus-cta-panel .btn { margin-top: 14px; }

/* ---------- المقاسات ---------- */
@media (max-width: 1024px) {
	body.page-sus-a .sus-pillar-inner { grid-template-columns: minmax(0, 1fr); gap: 28px; }
	/* على عمود واحد تسبق الصورةُ النصَّ في كل الصفوف فيبقى الإيقاع واحدًا */
	body.page-sus-a .sus-pillar .sus-pillar-media { order: 1; }
	body.page-sus-a .sus-pillar .sus-pillar-copy  { order: 2; }
	body.page-sus-a .sus-cert-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	body.page-sus-a .sus-subnav a  { padding: 14px 13px; font-size: .875rem; }
	body.page-sus-a .sus-cert-list { grid-template-columns: minmax(0, 1fr); }
	body.page-sus-a .sus-pillar-media img { aspect-ratio: 3 / 2; }
}

/* ---------- تتبُّع الحروف في العربية (كما في بقية الصفحات) ---------- */
html[dir="rtl"] body.page-sus-a .sc-eyebrow:not([dir="ltr"]) {
	letter-spacing: normal;
	word-spacing: .14em;
}