@charset "UTF-8";
/* ==========================================================================
   شركة هرم الانشاء — المقياس
   --------------------------------------------------------------------------
   ورقة خامسة تُحمَّل بعد كل الأوراق وتهدّئ الأحجام في الموقع كله:
   العناوين، والأزرار، والبطاقات، والأيقونات، والمسافات بين الأقسام. لا
   تغيّر بنية ولا لوناً. كل محدِّد هنا بوزن القاعدة التي يعدّلها، فيفوز
   بترتيب التحميل وحده بلا ‎!important‎.

   الفهرس
   ٠١  الرموز والمتن
   ٠٢  ترويسات الأقسام والأزرار
   ٠٣  الهيدر والبطل
   ٠٤  البطاقات والأيقونات
   ٠٥  الفوتر
   ٠٦  الشاشات المتوسطة (≤ 768)
   ٠٧  الجوال (≤ 560)
   ========================================================================== */


/* ==========================================================================
   ٠١ — الرموز والمتن
   ========================================================================== */
:root {
	--h-section-y: clamp(56px, 6.4vw, 96px);
	--h-head-gap: clamp(28px, 3vw, 44px);
	--h-gap: clamp(16px, 2vw, 24px);
	--hg-rule-w: 48px;
}

body {
	font-size: 1rem;
	line-height: 1.85;
}


/* ==========================================================================
   ٠٢ — ترويسات الأقسام والأزرار
   ========================================================================== */
.section-head__title {
	font-size: clamp(1.45rem, 2.5vw, 2.05rem);
}

.section-head__text {
	font-size: .98rem;
	line-height: 1.85;
}

.section-head--center::after {
	margin-block-start: clamp(14px, 1.6vw, 20px);
}

/* رقم الفصل الباهت خلف عناوين الرئيسية */
body.home .section .section-head--center::before {
	font-size: clamp(2.9rem, 5.4vw, 4.3rem);
}

.cta__title {
	font-size: clamp(1.45rem, 2.7vw, 2.15rem);
}

.btn {
	padding: 12px 24px;
	font-size: .92rem;
}

.btn--lg {
	padding: 14px 30px;
	font-size: .96rem;
}


/* ==========================================================================
   ٠٣ — الهيدر والبطل
   ========================================================================== */
.site-brand__logo {
	block-size: 46px;
}

/* الهيدر الملتصق يُصغّر الشعار قليلاً — لا يكبّره */
.site-header.is-stuck .site-brand__logo {
	block-size: 42px;
}

.hero {
	min-block-size: min(80vh, 700px);
}

.hero__title {
	font-size: clamp(2rem, 4.2vw, 3.2rem);
}

.hero__lede,
.hero__text {
	font-size: clamp(.98rem, 1.2vw, 1.08rem);
}

.hero__actions {
	gap: 12px;
	margin-block-start: 28px;
}


/* ==========================================================================
   ٠٤ — البطاقات والأيقونات
   ========================================================================== */

/* الإحصائيات */
.section.stats {
	padding-block: clamp(48px, 5.5vw, 76px);
}

.stats .stat__value {
	font-size: clamp(2.2rem, 3.8vw, 3rem);
}

.stats .stat__label {
	font-size: .92rem;
}

/* الرؤية والرسالة والقيم والأهداف */
.pillar {
	gap: 12px;
	padding: clamp(20px, 2vw, 26px);
}

.pillar__icon {
	inline-size: 54px;
	block-size: 54px;
}

.pillar__title {
	font-size: 1.06rem;
}

.pillar__text {
	font-size: .92rem;
	line-height: 1.8;
}

/* الخدمات */
.services .service-card {
	gap: 14px;
	padding: 26px 22px;
}

.services .service-card__icon {
	inline-size: 64px;
	block-size: 64px;
}

.services .service-card__icon-img {
	inline-size: 36px;
	block-size: 36px;
}

.services .service-card__title {
	font-size: 1.06rem;
}

/* باختيارك */
.why .why-item {
	gap: 12px;
	padding: 26px 22px;
}

.why .why-item__icon {
	inline-size: 54px;
	block-size: 54px;
}

.why .why-item__title {
	font-size: 1.03rem;
}

.why .why-item__text {
	font-size: .92rem;
	line-height: 1.8;
}

/* المشاريع */
.project-card .project-card__body {
	gap: 8px;
	padding: 18px 20px 20px;
}

.project-card .project-card__title {
	font-size: 1.02rem;
	line-height: 1.6;
}

/* العملاء: لوحات أسماء قصيرة — أربع في الصف على الشاشات الواسعة
 * (اثنتان في الصف تحت ٧٦٨ من sections.css، ولا تُكتب هنا فوقها). */
@media (min-width: 769px) {

	.clients .clients__grid > * {
		flex: 1 1 clamp(170px, 21%, 240px);
	}
}

.clients .client-card {
	min-block-size: 88px;
	padding: 16px 14px;
}

.clients .client-card__name {
	font-size: .93rem;
	line-height: 1.65;
}

/* الشهادات */
.cert-card .cert-card__body {
	gap: 8px;
	padding: 16px 20px 20px;
}

.cert-card .cert-card__title {
	font-size: 1rem;
}

/* التواصل */
.contact-info .contact-info__item {
	gap: 12px;
	padding: 16px 18px;
}

.contact-info .contact-info__value {
	font-size: .95rem;
}

/* من نحن */
.about .about-step {
	padding: 22px 20px;
}

.gm .gm__quote-text {
	font-size: clamp(1rem, 1.5vw, 1.18rem);
}

.vm .vm__img {
	block-size: clamp(160px, 20vw, 250px);
}

.vm .vm__card {
	gap: 12px;
	padding: 26px 24px;
}

.values .value-card {
	padding: 22px 20px;
}

.goals .goal-item {
	padding: 20px 22px;
}

.quality .quality-item {
	padding: 18px 20px;
}

.branches .branch-card {
	padding: 22px 20px;
}


/* ==========================================================================
   ٠٥ — الفوتر
   ========================================================================== */
.site-footer .footer-top {
	padding-block: clamp(44px, 4.6vw, 64px);
}

.site-footer .footer-brand__logo {
	block-size: 50px;
}

.site-footer .footer-title {
	margin-block-end: 14px;
	font-size: .96rem;
}

.site-footer .footer-about {
	font-size: .92rem;
}


/* ==========================================================================
   ٠٦ — الشاشات المتوسطة (≤ 768)
   ========================================================================== */
@media (max-width: 768px) {

	.hero {
		min-block-size: min(72vh, 560px);
	}

	/* الإحصائيات الخمس عمودان بدل قائمة طويلة، والأخيرة في منتصف سطرها */
	.stats .stats__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 26px 16px;
	}

	.stats .stat {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 4px;
		text-align: center;
	}

	.stats .stat + .stat::before {
		display: none;
	}

	.stats .stat:last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}
}


/* ترويسة الصفحات تحت ٩٩٢: مسار التنقل سطر واحد بلا الصفحة الحالية (هي العنوان
 * فوقه)، ويُخفى كلّه حين لا يبقى فيه إلا «الرئيسية» — فيبقى الشريط بمقاسه. */
@media (max-width: 992px) {

	.page-hero {
		--hp-area: 180px;
	}

	/*
	 * سطر واحد. لا overflow على الحبّة نفسها حتى لا يُقصّ إطار التركيز حول
	 * الروابط؛ الاسم الطويل يُختصر داخل عنصره بنقاط، و«الرئيسية» والفواصل
	 * لا تنكمش أبداً. التوسيط «الآمن» يبدأ من طرف البداية إن ضاق السطر.
	 */
	.page-hero__crumbs {
		flex-wrap: nowrap;
		justify-content: safe center;
		white-space: nowrap;
	}

	.page-hero__crumbs .breadcrumbs__link,
	.page-hero__crumbs .breadcrumbs__item {
		min-inline-size: 0;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.page-hero__crumbs > :first-child,
	.page-hero__crumbs .breadcrumbs__sep {
		flex-shrink: 0;
	}

	.page-hero__crumbs .breadcrumbs__current,
	.page-hero__crumbs .breadcrumbs__sep:nth-last-child(2) {
		display: none;
	}

	.page-hero__crumbs:not(:has(.breadcrumbs__link ~ .breadcrumbs__link)) {
		display: none;
	}

	.page-hero--long .page-hero__title {
		font-size: 1.3rem;
	}
}

/* الشاشات اللوحية: صورة «من نحن» بعرض الحاوية تصير شريطاً عريضاً لا لوحاً طويلاً */
@media (min-width: 561px) and (max-width: 992px) {

	.about .about__img {
		aspect-ratio: 16 / 9;
	}
}

/* بين ٥٦١ و٧٦٨: شبكات من عمودين أو ثلاثة بدل بطاقة واحدة بعرض الشاشة */
@media (min-width: 561px) and (max-width: 768px) {

	.projects__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.certs .certs__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.values-grid,
	.about .about-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}


/* ==========================================================================
   ٠٧ — الجوال (≤ 560)
   ========================================================================== */
@media (max-width: 560px) {

	:root {
		--h-section-y: clamp(44px, 11vw, 60px);
		--h-head-gap: 24px;
	}

	body {
		font-size: .97rem;
	}

	.section-head__title {
		font-size: 1.4rem;
	}

	body.home .section .section-head--center::before {
		font-size: 2.7rem;
	}

	.page-hero__title {
		font-size: 1.45rem;
	}

	.site-brand__logo {
		block-size: 40px;
	}

	.site-header.is-stuck .site-brand__logo {
		block-size: 38px;
	}

	/* البطل: زرّان متجاوران بارتفاع مريح بدل شريطين عريضين */
	.hero__title {
		font-size: clamp(1.75rem, 8vw, 2.15rem);
	}

	.hero__actions {
		flex-wrap: nowrap;
		gap: 10px;
	}

	.hero__actions .btn,
	.cta__actions .btn {
		flex: 1 1 0;
		inline-size: auto;
		min-block-size: 46px;
		padding: 11px 14px;
	}

	.btn {
		min-block-size: 44px;
	}

	.stats .stat__value {
		font-size: 2.1rem;
	}

	/* الركائز والخدمات: أيقونة أصغر بجانب النصّ */
	.pillar {
		gap: 14px;
		padding: 16px 18px;
	}

	.pillar__icon {
		inline-size: 46px;
		block-size: 46px;
	}

	.services .service-card {
		padding: 16px 18px;
	}

	.services .service-card__icon {
		inline-size: 54px;
		block-size: 54px;
	}

	.services .service-card__icon-img {
		inline-size: 30px;
		block-size: 30px;
	}

	/* باختيارك: الأيقونة في عمود جانبي، والعنوان والنص بجانبها */
	.why .why-item {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		align-items: start;
		column-gap: 14px;
		row-gap: 2px;
		padding: 18px;
		text-align: start;
	}

	.why .why-item__icon {
		grid-row: span 2;
		inline-size: 46px;
		block-size: 46px;
	}

	/* العملاء: عمودان من لوحات صغيرة */
	.clients .clients__grid {
		gap: 10px;
	}

	.clients .clients__grid > * {
		flex: 1 1 calc(50% - 5px);
		max-inline-size: none;
	}

	.clients .client-card {
		min-block-size: 70px;
		padding: 12px 10px;
	}

	.clients .client-card__name {
		font-size: .86rem;
		line-height: 1.6;
	}

	.contact-info .contact-info__item {
		padding: 14px 16px;
	}

	.vm .vm__card,
	.values .value-card,
	.branches .branch-card,
	.about .about-step {
		padding: 18px;
	}

	/* القيم ومراحل العمل: كلمة وأيقونة في كل بطاقة، فتكفيها بطاقتان في الصفّ */
	.values-grid,
	.about .about-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.about .about-step {
		flex-direction: column;
		justify-content: center;
		gap: 10px;
		padding: 16px 12px;
		text-align: center;
	}

	.about .about-step__title {
		flex: 0 0 auto;
	}

	.about .about-step__num {
		display: none;
	}

	.values .value-card {
		align-items: center;
		gap: 8px;
		padding: 16px 12px;
		text-align: center;
	}

	/* صور المعدّات: عمودان من صور صغيرة تُفتح بالحجم الكامل عند اللمس */
	.equipment .equipment__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	/* بطاقة بيانات المشروع: عمودان، والزرّ بعرض البطاقة */
	.project-info__list {
		flex-basis: 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px 16px;
	}

	.project-info__cta {
		inline-size: 100%;
	}

	.site-footer .footer-top {
		padding-block: 40px 28px;
	}

	/* الفوتر: الروابط والخدمات عمودان متجاوران، والشعار والتواصل بعرض الشاشة */
	.site-footer .footer-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px 16px;
	}

	.site-footer .footer-col--brand,
	.site-footer .footer-col--contact {
		grid-column: 1 / -1;
	}

	.page-hero--long .page-hero__title {
		font-size: 1.15rem;
	}
}