/* ============================================================
   الشموخ للاستشارات الهندسية — ستايل الواجهة
   المسار: public/assets/site/css/site.css
   ------------------------------------------------------------
   السلالم المعتمدة — التزم بها ولا تخترع قيماً بينها:

   الخط:    .62  .7  .78  .86  .94  1  1.12  1.3  1.5  1.8  2.4 rem
   الحواف:  2px (وسوم) · 6px (أزرار وحقول) · 10px (أيقونات)
            12px (بطاقات) · 16px (ألواح) · 100px (حبّات)
   الانتقال: .2s (لمسات) · .28s (تحويم) · .4s (تحوّلات) · .6s (دخول)

   قبل التوحيد كان في الملف 48 حجم خط و15 حافة و13 مدة — فروق
   لا تراها العين فرادى، لكن مجموعها يجعل الصفحة تبدو غير مضبوطة.
   ============================================================ */

/* ═══════════════════════════════════════════
   1. المتغيّرات
   ═══════════════════════════════════════════ */
:root{
    /* ═══════════ سلّم اللوغو ═══════════
       مستخرج من ملف اللوغو مباشرة — تسع درجات متّسقة.
       الأرقام بجانب كل درجة هي نسبة تباينها مع الأبيض (WCAG). */
    --sh-900:#052640;   /* 15.47 */
    --sh-800:#113D57;   /* 11.48 */
    --sh-700:#2A576F;   /*  7.80 */
    --sh-600:#38779B;   /*  4.91 — أغمق درجة تصلح لنص عادي */
    --sh-500:#4A8CB2;   /*  3.69 — للعناوين الكبيرة فقط */
    --sh-400:#6AA8C9;
    --sh-300:#83CAE2;
    --sh-200:#A6E0ED;
    --sh-100:#C1ECF7;

    /* ═══════════ الأدوار ═══════════ */
    --brand:var(--sh-500);          /* الأزرار والحدود النشطة */
    --brand-dark:var(--sh-600);
    --brand-soft:var(--sh-300);     /* على الخلفيات الداكنة */
    --brand-tint:rgba(74,140,178,.12);
    --brand-glow:rgba(74,140,178,.5);
    /* ★ النص بالدرجة 600 لا 500: الأخيرة تباينها 3.69 ولا تكفي لنص عادي */
    --brand-ink:var(--sh-600);

    --navy-900:var(--sh-900);
    --navy-800:var(--sh-800);
    --navy-700:var(--sh-700);
    --sh:5,38,64;

    --bg:#FFFFFF;
    --bg-soft:#F1F7FB;
    --bg-card:#FFFFFF;
    --ink:#0E2233;
    --muted:#5A7488;
    --line:#DCE8F0;

    --radius:6px;
    --wrap:1240px;
    --ease:cubic-bezier(.22,.61,.36,1);
}

html[data-theme="dark"]{
    /* في الوضع الليلي ينعكس الدور: الفاتح هو المقروء */
    --brand:var(--sh-400);
    --brand-ink:var(--sh-200);
    --brand-tint:rgba(131,202,226,.14);
    --brand-glow:rgba(106,168,201,.45);

    --bg:#08151F;
    --bg-soft:#0D1E2B;
    --bg-card:#112637;
    --ink:#E4F1F8;
    --muted:#8CA6B8;
    --line:#1E3849;
    --sh:0,0,0;
}

/* ═══════════════════════════════════════════
   2. الأساسيات
   ═══════════════════════════════════════════ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}

body{
    margin:0;background:var(--bg);color:var(--ink);
    font-family:'Tajawal',system-ui,sans-serif;line-height:1.75;
    transition:background .4s var(--ease),color .4s var(--ease);
    overflow-x:hidden;
}
html[data-lang="en"] body{font-family:'Outfit',system-ui,sans-serif}

h1,h2,h3,h4{font-family:'Cairo',sans-serif;line-height:1.35;margin:0}
html[data-lang="en"] h1,html[data-lang="en"] h2,
html[data-lang="en"] h3,html[data-lang="en"] h4{font-family:'Outfit',sans-serif}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

.wrap{width:min(var(--wrap),92%);margin-inline:auto}
.section{padding:clamp(3.5rem,7vw,6rem) 0}
.section-soft{background:var(--bg-soft)}

.skip-link{
    position:absolute;inset-inline-start:-9999px;top:0;z-index:999;
    background:var(--navy-900);color:#fff;padding:.7rem 1.2rem;
}
.skip-link:focus{inset-inline-start:0}

/* ═══════════════════════════════════════════
   3. الأزرار
   ═══════════════════════════════════════════ */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
    padding:.85rem 1.6rem;border-radius:var(--radius);border:1px solid transparent;
    font-family:'Cairo',sans-serif;font-weight:700;font-size:.94rem;cursor:pointer;
    transition:transform .28s var(--ease),box-shadow .28s,background .28s,color .28s,border-color .28s;
    position:relative;overflow:hidden;
}
html[data-lang="en"] .btn{font-family:'Outfit',sans-serif}

.btn--primary{background:var(--brand);color:#fff;box-shadow:0 12px 28px -14px var(--brand-glow)}
.btn--primary:hover{background:var(--brand-dark);transform:translateY(-2px);
    box-shadow:0 18px 36px -14px var(--brand-glow)}

.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--brand);color:var(--brand-ink);transform:translateY(-2px)}

.btn--light{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.22);
    backdrop-filter:blur(8px)}
.btn--light:hover{background:rgba(255,255,255,.2);transform:translateY(-2px)}

.btn::after{
    content:"";position:absolute;top:0;inset-inline-start:-60%;width:40%;height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
    transform:skewX(-20deg);transition:inset-inline-start .6s var(--ease);
}
.btn:hover::after{inset-inline-start:130%}

/* ═══════════════════════════════════════════
   4. الكشف عند التمرير
   ═══════════════════════════════════════════ */
/* ★ الإخفاء مشروط بوجود الجافاسكربت: html:not(.no-js).
   بدون الشرط، تعطّل السكربت يعني صفحة نصفها غير مرئي. */
html:not(.no-js) [data-reveal]{
    opacity:0;transform:translateY(24px);
    transition:opacity .6s var(--ease),transform .6s var(--ease);
}
html:not(.no-js) [data-reveal].is-in{opacity:1;transform:none}

/* حزام أمان: بعد ثانيتين يظهر كل شيء مهما حدث */
html.reveal-fallback [data-reveal]{opacity:1 !important;transform:none !important}

/* ═══════════════════════════════════════════
   5. الهيدر
   ═══════════════════════════════════════════ */
.hdr{
    position:sticky;top:0;z-index:80;
    background:rgba(28,45,62,.9);backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(131,202,226,.14);
    transition:background .28s var(--ease),box-shadow .28s;
}
.hdr.is-stuck{background:rgba(5,38,64,.96);box-shadow:0 10px 30px -20px rgba(0,0,0,.7)}

.hdr__inner{display:flex;align-items:center;gap:1.2rem;height:74px;flex-wrap:nowrap}

.hdr__brand{display:flex;align-items:center;gap:.7rem;flex:none;min-width:0}
.hdr__brand img{height:40px;width:auto;object-fit:contain}
.hdr__brand-txt{display:flex;flex-direction:column;min-width:0}
.hdr__brand-name{
    font-family:'Cairo',sans-serif;font-weight:800;font-size:.94rem;color:#fff;
    line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:210px;
}
.hdr__brand-tag{font-size:.7rem;color:rgba(131,202,226,.72);line-height:1.3;white-space:nowrap}

.hdr__nav{display:flex;gap:.2rem;margin-inline-start:auto;flex-wrap:nowrap;min-width:0}
.hdr__link{
    position:relative;padding:.5rem .85rem;border-radius:var(--radius);
    font-size:.86rem;font-weight:600;color:rgba(232,241,247,.82);
    transition:color .2s;white-space:nowrap;
}
.hdr__link::after{
    content:"";position:absolute;bottom:2px;inset-inline:.85rem;height:2px;border-radius:2px;
    background:var(--brand-soft);transform:scaleX(0);transition:transform .28s var(--ease);
}
.hdr__link:hover,.hdr__link.is-active{color:#fff}
.hdr__link:hover::after,.hdr__link.is-active::after{transform:scaleX(1)}

.hdr__actions{display:flex;align-items:center;gap:.5rem;flex:none}

.hdr__icon,.hdr__lang{
    display:grid;place-items:center;width:36px;height:36px;border-radius:10px;
    border:1px solid rgba(131,202,226,.24);background:rgba(131,202,226,.08);
    color:var(--brand-soft);font-size:.78rem;font-weight:800;cursor:pointer;
    transition:all .2s var(--ease);
}
.hdr__icon:hover,.hdr__lang:hover{background:rgba(131,202,226,.2);color:#fff;transform:translateY(-2px)}

.hdr__moon{display:none}
html[data-theme="dark"] .hdr__sun{display:none}
html[data-theme="dark"] .hdr__moon{display:block}

.hdr__call{padding:.6rem 1.1rem;font-size:.86rem}

.hdr__burger{
    display:none;flex-direction:column;gap:4px;width:38px;height:38px;
    align-items:center;justify-content:center;border-radius:10px;cursor:pointer;
    border:1px solid rgba(131,202,226,.24);background:rgba(131,202,226,.08);
}
.hdr__burger span{display:block;width:17px;height:2px;border-radius:2px;background:var(--brand-soft);
    transition:transform .28s var(--ease),opacity .2s}
.hdr__burger.is-open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.hdr__burger.is-open span:nth-child(2){opacity:0}
.hdr__burger.is-open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

@media (max-width:1080px){ .hdr__call{display:none} }

@media (max-width:900px){
    .hdr__burger{display:flex}
    .hdr__nav{
        position:absolute;top:74px;inset-inline:0;flex-direction:column;gap:0;
        background:rgba(5,38,64,.98);backdrop-filter:blur(14px);
        border-bottom:1px solid rgba(131,202,226,.14);padding:.6rem 5%;
        clip-path:inset(0 0 100% 0);transition:clip-path .4s var(--ease);
    }
    .hdr__nav.is-open{clip-path:inset(0 0 0 0)}
    .hdr__link{padding:.85rem .4rem;border-bottom:1px solid rgba(131,202,226,.08)}
    .hdr__link::after{display:none}
    .hdr__brand-name{max-width:140px}
}

/* ═══════════════════════════════════════════
   6. رأس الصفحات الداخلية
   ═══════════════════════════════════════════ */
.phead{
    position:relative;overflow:hidden;
    padding:clamp(3rem,6vw,4.5rem) 0 clamp(3.5rem,7vw,5rem);
    background:
        radial-gradient(60% 70% at 82% 10%, rgba(74,140,178,.16), transparent 62%),
        linear-gradient(160deg,#08151F,#113D57 60%,#2A576F);
    color:#fff;
}
.phead__grid{
    position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:
        linear-gradient(rgba(131,202,226,.05) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.05) 1px,transparent 1px),
        linear-gradient(rgba(131,202,226,.09) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.09) 1px,transparent 1px);
    background-size:22px 22px,22px 22px,110px 110px,110px 110px;
    -webkit-mask-image:radial-gradient(130% 110% at 40% 0%,#000 20%,transparent 78%);
    mask-image:radial-gradient(130% 110% at 40% 0%,#000 20%,transparent 78%);
}
.phead__skyline{position:absolute;inset-inline:0;bottom:0;width:100%;height:110px;pointer-events:none}
.phead__skyline path{fill:rgba(5,38,64,.5);stroke:rgba(131,202,226,.2);stroke-width:1}

.phead__inner{position:relative;z-index:2;text-align:center}

.crumbs{
    display:flex;align-items:center;justify-content:center;gap:.45rem;flex-wrap:wrap;
    font-size:.78rem;color:rgba(232,241,247,.6);margin-bottom:1rem;
}
.crumbs a{color:rgba(131,202,226,.85);transition:color .2s}
.crumbs a:hover{color:#fff}
.crumbs__sep{opacity:.4}

.phead__eyebrow{
    display:inline-block;font-family:'Cairo',sans-serif;
    font-size:.7rem;font-weight:700;letter-spacing:.18em;
    color:var(--brand-soft);background:rgba(131,202,226,.1);
    border:1px solid rgba(131,202,226,.24);
    padding:.32rem .9rem;border-radius:100px;margin-bottom:.9rem;
}
.phead__title{font-size:clamp(1.8rem,4vw,2.9rem);font-weight:900;line-height:1.3;margin-bottom:.7rem}
.phead__sub{
    color:rgba(232,241,247,.75);font-size:clamp(.95rem,1.4vw,1.05rem);
    max-width:62ch;margin-inline:auto;
}

/* ═══════════════════════════════════════════
   7. شبكة الخدمات
   ═══════════════════════════════════════════ */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:1.4rem}

.svc{
    position:relative;overflow:hidden;padding:2rem 1.6rem 1.6rem;
    background:var(--bg-card);border:1px solid var(--line);border-radius:12px;
    transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;
}
.svc:hover{transform:translateY(-6px);border-color:var(--brand);
    box-shadow:0 24px 48px -26px rgba(var(--sh),.45)}

.svc::before{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:
        linear-gradient(var(--brand-tint) 1px,transparent 1px),
        linear-gradient(90deg,var(--brand-tint) 1px,transparent 1px);
    background-size:20px 20px;
    -webkit-mask-image:radial-gradient(80% 70% at 88% 100%,#000,transparent 72%);
    mask-image:radial-gradient(80% 70% at 88% 100%,#000,transparent 72%);
}
.svc > *{position:relative;z-index:2}

.svc__bg{
    position:absolute;inset:0;z-index:1;background-size:cover;background-position:center;
    opacity:0;transition:opacity .4s var(--ease);
}
.svc:hover .svc__bg{opacity:.07}

.svc__num{
    position:absolute;top:1.1rem;inset-inline-end:1.3rem;z-index:2;
    font-family:'Outfit',sans-serif;font-size:2.4rem;font-weight:800;
    color:var(--brand);opacity:.14;line-height:1;
    transition:opacity .28s,transform .28s var(--ease);
}
.svc:hover .svc__num{opacity:.26;transform:scale(1.08)}

.svc__icon{
    display:grid;place-items:center;width:54px;height:54px;border-radius:12px;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1.5rem;margin-bottom:1.1rem;
    transition:background .28s,color .28s,transform .4s var(--ease);
}
.svc:hover .svc__icon{background:var(--brand);color:#fff;transform:rotate(-6deg) scale(1.06)}

.svc__title{font-size:1.12rem;font-weight:800;margin-bottom:.55rem;line-height:1.45}
.svc__title a{transition:color .28s}
.svc__title a:hover{color:var(--brand-ink)}
/* الرابط يغطّي البطاقة: نقرة في أي مكان، ورابط واحد في الشيفرة */
.svc__title a::after{content:"";position:absolute;inset:0;z-index:3}

.svc__desc{
    color:var(--muted);font-size:.94rem;line-height:1.8;margin:0 0 1.1rem;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}

.svc__more{
    display:inline-flex;align-items:center;gap:.4rem;
    font-family:'Cairo',sans-serif;font-size:.86rem;font-weight:700;color:var(--brand-ink);
}
.svc__more i{transition:transform .28s var(--ease)}
.svc:hover .svc__more i{transform:translateX(-5px)}
html[dir="ltr"] .svc:hover .svc__more i{transform:translateX(5px)}

@media (max-width:560px){ .svc-grid{grid-template-columns:1fr} }

/* ═══════════════════════════════════════════
   8. صفحة تفاصيل الخدمة
   ═══════════════════════════════════════════ */
.svc-layout{
    display:grid;grid-template-columns:minmax(0,1fr) 320px;
    gap:clamp(1.5rem,3vw,2.6rem);align-items:start;
}

.svc-hero{
    position:relative;margin:0 0 2rem;border-radius:12px;overflow:hidden;
    border:1px solid var(--line);aspect-ratio:16/9;
}
.svc-hero img{width:100%;height:100%;object-fit:cover}
.svc-hero__mark{
    position:absolute;width:28px;height:28px;pointer-events:none;
    border-color:var(--brand-soft);border-style:solid;border-width:0;opacity:.85;
}
.svc-hero__mark--tl{top:14px;left:14px;border-top-width:2px;border-left-width:2px}
.svc-hero__mark--br{bottom:14px;right:14px;border-bottom-width:2px;border-right-width:2px}

/* نص المحرّر */
.prose{color:var(--ink);font-size:1rem;line-height:1.95}
.prose p{margin:0 0 1.1rem}
.prose h3{font-size:1.12rem;font-weight:800;margin:2rem 0 .8rem;
    position:relative;padding-inline-start:.9rem}
.prose h3::before{
    content:"";position:absolute;inset-inline-start:0;top:.32em;bottom:.32em;
    width:3px;border-radius:2px;background:var(--brand);
}
.prose ol{margin:0 0 1.2rem;padding-inline-start:1.3rem}
.prose ul{list-style:none;margin:0 0 1.2rem;padding-inline-start:0}
.prose li{margin-bottom:.5rem}
.prose ul li{position:relative;padding-inline-start:1.5rem}
/* معيّن مفرّغ بدل النقطة — أقرب لرموز المخططات */
.prose ul li::before{
    content:"";position:absolute;inset-inline-start:0;top:.72em;
    width:7px;height:7px;border-radius:2px;
    border:1.5px solid var(--brand);transform:rotate(45deg);
}
.prose strong{color:var(--brand-ink);font-weight:700}
.prose a{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}

/* مشاريع الخدمة */
.svc-projects{margin-top:3rem;padding-top:2.2rem;border-top:1px solid var(--line)}
.svc-projects__title{
    display:flex;align-items:center;gap:.55rem;
    font-size:1.12rem;font-weight:800;margin-bottom:1.3rem;
}
.svc-projects__title i{color:var(--brand-ink)}

.mini-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem}
.mini{
    display:block;border:1px solid var(--line);border-radius:12px;overflow:hidden;
    background:var(--bg-card);transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;
}
.mini:hover{transform:translateY(-4px);border-color:var(--brand);
    box-shadow:0 18px 34px -22px rgba(var(--sh),.45)}
.mini img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .4s var(--ease)}
.mini:hover img{transform:scale(1.06)}
.mini__ph{display:grid;place-items:center;aspect-ratio:4/3;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1.8rem}
.mini__body{display:block;padding:.75rem .85rem}
.mini__body strong{display:block;font-size:.86rem;font-weight:700;line-height:1.45;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mini__body small{display:block;font-size:.7rem;color:var(--muted);margin-top:.15rem}

/* الجانب */
.svc-aside{position:sticky;top:96px;display:flex;flex-direction:column;gap:1.1rem}

.aside-card{background:var(--bg-card);border:1px solid var(--line);border-radius:12px;padding:1.3rem}
.aside-card__title{
    font-size:.94rem;font-weight:800;margin-bottom:.9rem;
    padding-bottom:.7rem;border-bottom:1px solid var(--line);
}
.aside-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem}
.aside-list a{
    display:flex;align-items:center;gap:.6rem;padding:.62rem .7rem;border-radius:10px;
    font-size:.86rem;color:var(--muted);font-weight:600;
    transition:background .2s,color .2s,transform .2s var(--ease);
}
.aside-list a:hover{background:var(--brand-tint);color:var(--brand-ink);transform:translateX(-4px)}
html[dir="ltr"] .aside-list a:hover{transform:translateX(4px)}
.aside-list i{font-size:1rem;color:var(--brand);flex:none}

.aside-cta{
    position:relative;overflow:hidden;border-radius:12px;padding:1.6rem 1.3rem;text-align:center;
    background:linear-gradient(160deg,#113D57,#2A576F);color:#fff;
}
.aside-cta::before{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:
        linear-gradient(rgba(131,202,226,.07) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.07) 1px,transparent 1px);
    background-size:20px 20px;
}
.aside-cta > *{position:relative}
.aside-cta__ic{
    display:grid;place-items:center;width:48px;height:48px;border-radius:12px;
    background:rgba(131,202,226,.16);color:var(--brand-soft);font-size:1.5rem;margin:0 auto .8rem;
}
.aside-cta h3{font-size:1rem;font-weight:800;margin-bottom:.4rem}
.aside-cta p{font-size:.86rem;color:rgba(232,241,247,.7);margin:0 0 1.1rem;line-height:1.7}

@media (max-width:920px){
    .svc-layout{grid-template-columns:1fr}
    .svc-aside{position:static}
}

/* ═══════════════════════════════════════════
   9. شريط الدعوة
   ═══════════════════════════════════════════ */
.cta-band{
    position:relative;overflow:hidden;color:#fff;
    background:linear-gradient(150deg,#113D57,#2A576F 60%,#38779B);
}
.cta-band__grid{
    position:absolute;inset:0;pointer-events:none;opacity:.45;
    background-image:
        linear-gradient(rgba(131,202,226,.06) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.06) 1px,transparent 1px);
    background-size:22px 22px;
    -webkit-mask-image:radial-gradient(100% 100% at 80% 0%,#000,transparent 75%);
    mask-image:radial-gradient(100% 100% at 80% 0%,#000,transparent 75%);
}
.cta-band__inner{
    position:relative;z-index:2;
    display:flex;align-items:center;justify-content:space-between;gap:1.6rem;flex-wrap:wrap;
    padding:clamp(2.2rem,4vw,3.2rem) 0;
}
.cta-band__title{font-size:clamp(1.3rem,2.6vw,1.9rem);font-weight:800;margin-bottom:.35rem}
.cta-band__sub{color:rgba(232,241,247,.72);font-size:.94rem;margin:0;max-width:52ch}
.cta-band__actions{display:flex;gap:.7rem;flex-wrap:wrap}

/* ═══════════════════════════════════════════
   10. حالة فارغة
   ═══════════════════════════════════════════ */
.empty-state{text-align:center;padding:4rem 1rem;color:var(--muted)}
.empty-state svg{width:150px;margin-inline:auto;opacity:.4;margin-bottom:1rem}

/* ═══════════════════════════════════════════
   11. تقليل الحركة
   ═══════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
    [data-reveal]{opacity:1;transform:none}
}

/* ═══════════════════════════════════════════
   12. الفوتر
   ═══════════════════════════════════════════ */
.foot{
    position:relative;overflow:hidden;color:#fff;
    background:linear-gradient(165deg,#08151F,#113D57 55%,#2A576F);
    padding-top:clamp(3rem,6vw,4.5rem);
}
.foot__grid{
    position:absolute;inset:0;pointer-events:none;opacity:.4;
    background-image:
        linear-gradient(rgba(131,202,226,.05) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.05) 1px,transparent 1px);
    background-size:24px 24px;
    -webkit-mask-image:radial-gradient(110% 90% at 20% 0%,#000,transparent 75%);
    mask-image:radial-gradient(110% 90% at 20% 0%,#000,transparent 75%);
}
.foot__skyline{position:absolute;inset-inline:0;top:0;width:100%;height:80px;pointer-events:none;opacity:.5}
.foot__skyline path{fill:none;stroke:rgba(131,202,226,.22);stroke-width:1}

.foot__inner{
    position:relative;z-index:2;
    display:grid;grid-template-columns:1.5fr 1fr 1fr 1.4fr;
    gap:clamp(1.6rem,3vw,2.6rem);padding-bottom:2.5rem;
}

.foot__col--brand{max-width:340px}
.foot__logo{height:52px;width:auto;object-fit:contain;margin-bottom:1rem}
.foot__about{color:rgba(232,241,247,.65);font-size:.86rem;line-height:1.85;margin:0 0 1.2rem}

.foot__socials{display:flex;gap:.5rem;flex-wrap:wrap}
.foot__social{
    display:grid;place-items:center;width:38px;height:38px;border-radius:10px;
    border:1px solid rgba(131,202,226,.2);background:rgba(131,202,226,.07);
    color:rgba(232,241,247,.75);font-size:1rem;
    transition:all .28s var(--ease);
}
/* لون المنصة يظهر عند التحويم فقط — الفوتر يبقى هادئاً */
.foot__social:hover{
    background:var(--c);border-color:var(--c);color:#fff;transform:translateY(-3px);
    box-shadow:0 10px 22px -12px var(--c);
}

.foot__title{
    font-size:.94rem;font-weight:800;margin-bottom:1rem;color:#fff;
    position:relative;padding-bottom:.6rem;
}
.foot__title::after{
    content:"";position:absolute;bottom:0;inset-inline-start:0;width:32px;height:2px;
    border-radius:2px;background:var(--brand-soft);
}

.foot__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.foot__list a{
    color:rgba(232,241,247,.68);font-size:.86rem;
    transition:color .2s,transform .2s var(--ease);display:inline-block;
}
.foot__list a:hover{color:var(--brand-soft);transform:translateX(-4px)}
html[dir="ltr"] .foot__list a:hover{transform:translateX(4px)}

.foot__contact{list-style:none;margin:0 0 1.5rem;padding:0;display:flex;flex-direction:column;gap:.7rem}
.foot__contact li{display:flex;align-items:flex-start;gap:.55rem;font-size:.86rem;
    color:rgba(232,241,247,.68);line-height:1.7}
.foot__contact i{color:var(--brand-soft);font-size:1rem;flex:none;margin-top:.15rem}
.foot__contact a{transition:color .2s}
.foot__contact a:hover{color:var(--brand-soft)}

/* أوقات الدوام */
.foot__hours{
    border:1px solid rgba(131,202,226,.16);border-radius:10px;
    padding:.9rem 1rem;background:rgba(131,202,226,.05);
}
.foot__hours-title{
    display:flex;align-items:center;gap:.4rem;
    font-size:.78rem;font-weight:700;color:var(--brand-soft);margin-bottom:.6rem;
}
.foot__hours-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.28rem}
.foot__hours-list li{
    display:flex;align-items:center;justify-content:space-between;gap:.6rem;
    font-size:.78rem;color:rgba(232,241,247,.72);
}
.foot__hours-list li.is-closed{color:rgba(232,241,247,.38)}
.foot__hours-list li span:last-child{
    font-family:'Outfit',sans-serif;font-size:.7rem;white-space:nowrap;
}
.foot__hours-note{
    font-size:.7rem;color:rgba(232,241,247,.5);line-height:1.65;
    margin:.7rem 0 0;padding-top:.6rem;border-top:1px solid rgba(131,202,226,.12);
}

/* الشريط السفلي */
.foot__bar{
    position:relative;z-index:2;
    border-top:1px solid rgba(131,202,226,.14);background:rgba(5,38,64,.5);
}
.foot__bar-inner{
    display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
    padding:1.1rem 0;font-size:.78rem;color:rgba(232,241,247,.55);
}
.foot__legal{display:flex;gap:1.1rem;flex-wrap:wrap}
.foot__legal b{color:rgba(131,202,226,.85);font-weight:700}

@media (max-width:980px){
    .foot__inner{grid-template-columns:1fr 1fr}
    .foot__col--brand{grid-column:1 / -1;max-width:none}
}
@media (max-width:560px){
    .foot__inner{grid-template-columns:1fr}
    .foot__bar-inner{justify-content:center;text-align:center}
}

/* ═══════════════════════════════════════════
   13. أزرار التصفية
   ═══════════════════════════════════════════ */
.filters{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:2rem}
.filter{
    display:inline-flex;align-items:center;gap:.45rem;
    padding:.55rem 1.05rem;border-radius:100px;
    border:1px solid var(--line);background:var(--bg-card);
    font-family:'Cairo',sans-serif;font-size:.86rem;font-weight:700;color:var(--muted);
    transition:all .2s var(--ease);
}
html[data-lang="en"] .filter{font-family:'Outfit',sans-serif}
.filter:hover{border-color:var(--brand);color:var(--brand-ink);transform:translateY(-2px)}
.filter.is-active{
    background:var(--brand);border-color:var(--brand);color:#fff;
    box-shadow:0 10px 22px -12px var(--brand-glow);
}
.filter__n{
    font-family:'Outfit',sans-serif;font-size:.7rem;padding:.08rem .42rem;
    border-radius:100px;background:var(--brand-tint);
}
.filter.is-active .filter__n{background:rgba(255,255,255,.24)}

/* ═══════════════════════════════════════════
   14. شبكة المشاريع
   ═══════════════════════════════════════════ */
.proj-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}

.proj{
    position:relative;background:var(--bg-card);border:1px solid var(--line);
    border-radius:12px;overflow:hidden;
    transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;
}
.proj:hover{transform:translateY(-6px);border-color:var(--brand);
    box-shadow:0 26px 50px -28px rgba(var(--sh),.5)}

/* رابط واحد يغطّي البطاقة — قارئ الشاشة يقرأ عنواناً واحداً */
.proj__link{position:absolute;inset:0;z-index:4}

.proj__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--bg-soft)}
.proj__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.proj:hover .proj__media img{transform:scale(1.07)}

.proj__ph{
    display:grid;place-items:center;width:100%;height:100%;
    background:var(--brand-tint);color:var(--brand-ink);font-size:2.4rem;
}

/* علامات الزوايا تظهر عند التحويم */
.proj__mark{
    position:absolute;width:22px;height:22px;pointer-events:none;z-index:2;
    border-color:var(--brand-soft);border-style:solid;border-width:0;
    opacity:0;transition:opacity .28s var(--ease),transform .28s var(--ease);
}
.proj__mark--tl{top:12px;left:12px;border-top-width:2px;border-left-width:2px;transform:translate(6px,6px)}
.proj__mark--br{bottom:12px;right:12px;border-bottom-width:2px;border-right-width:2px;transform:translate(-6px,-6px)}
.proj:hover .proj__mark{opacity:.95;transform:none}

.proj__year,.proj__count{
    position:absolute;z-index:3;
    font-family:'Outfit',sans-serif;font-size:.7rem;font-weight:700;
    padding:.22rem .55rem;border-radius:6px;
    background:rgba(5,38,64,.78);color:var(--brand-soft);backdrop-filter:blur(6px);
}
.proj__year{top:12px;inset-inline-end:12px}
.proj__count{bottom:12px;inset-inline-start:12px;display:inline-flex;align-items:center;gap:.25rem}

.proj__body{padding:1.1rem 1.2rem 1.3rem}

.proj__type{
    display:inline-flex;align-items:center;gap:.3rem;
    font-family:'Cairo',sans-serif;font-size:.7rem;font-weight:700;
    color:var(--brand-ink);background:var(--brand-tint);
    padding:.18rem .6rem;border-radius:100px;margin-bottom:.55rem;
}
.proj__title{font-size:1rem;font-weight:800;line-height:1.45;margin-bottom:.5rem}

.proj__meta{
    display:flex;flex-wrap:wrap;gap:.9rem;
    font-size:.78rem;color:var(--muted);margin-bottom:.7rem;
}
.proj__meta span{display:inline-flex;align-items:center;gap:.3rem}
.proj__meta i{color:var(--brand)}

.proj__tags{display:flex;flex-wrap:wrap;gap:.35rem}
.tag{
    font-size:.7rem;font-weight:600;padding:.16rem .55rem;border-radius:6px;
    background:var(--bg-soft);color:var(--muted);border:1px solid var(--line);
}
.tag--more{color:var(--brand-ink);border-color:var(--brand-tint)}

@media (max-width:560px){ .proj-grid{grid-template-columns:1fr} }

/* ترقيم الصفحات */
.pager{display:flex;justify-content:center;margin-top:2.5rem}
.pager .pagination{display:flex;gap:.3rem;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.pager .page-link{
    display:grid;place-items:center;min-width:38px;height:38px;padding:0 .6rem;
    border:1px solid var(--line);border-radius:10px;background:var(--bg-card);
    color:var(--muted);font-size:.86rem;font-weight:700;transition:all .2s var(--ease);
}
.pager .page-link:hover{border-color:var(--brand);color:var(--brand-ink)}
.pager .active .page-link{background:var(--brand);border-color:var(--brand);color:#fff}
.pager .disabled .page-link{opacity:.4;pointer-events:none}

/* ═══════════════════════════════════════════
   15. شريط مواصفات المشروع
   ═══════════════════════════════════════════ */
.specs{background:var(--bg-soft);border-bottom:1px solid var(--line)}
.specs__inner{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:1rem;padding:1.6rem 0;
}
.spec{display:flex;align-items:center;gap:.8rem}
.spec__ic{
    display:grid;place-items:center;width:44px;height:44px;border-radius:12px;flex:none;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1.3rem;
}
.spec__body{display:flex;flex-direction:column;min-width:0}
.spec__body small{font-size:.7rem;color:var(--muted);line-height:1.4}
.spec__body strong{font-size:.94rem;font-weight:700;line-height:1.45;
    overflow:hidden;text-overflow:ellipsis}

/* ═══════════════════════════════════════════
   16. معرض المشروع
   ═══════════════════════════════════════════ */
.proj-layout{
    display:grid;grid-template-columns:minmax(0,1fr) 320px;
    gap:clamp(1.5rem,3vw,2.6rem);align-items:start;
}

.gallery{margin-bottom:2.2rem}

.gallery__stage{
    position:relative;margin:0 0 .8rem;border-radius:12px;overflow:hidden;
    border:1px solid var(--line);aspect-ratio:16/10;background:var(--bg-soft);
}
.gallery__stage img{width:100%;height:100%;object-fit:cover;cursor:zoom-in;
    transition:opacity .28s var(--ease)}

.gallery__mark{
    position:absolute;width:26px;height:26px;pointer-events:none;z-index:2;
    border-color:var(--brand-soft);border-style:solid;border-width:0;opacity:.85;
}
.gallery__mark--tl{top:14px;left:14px;border-top-width:2px;border-left-width:2px}
.gallery__mark--br{bottom:14px;right:14px;border-bottom-width:2px;border-right-width:2px}

.gallery__zoom{
    position:absolute;top:14px;inset-inline-end:14px;z-index:3;
    display:grid;place-items:center;width:38px;height:38px;border-radius:10px;
    border:1px solid rgba(131,202,226,.3);background:rgba(5,38,64,.72);
    color:var(--brand-soft);font-size:1.12rem;cursor:pointer;backdrop-filter:blur(6px);
    transition:all .2s var(--ease);
}
.gallery__zoom:hover{background:var(--brand);border-color:var(--brand);color:#fff}

.gallery__counter{
    position:absolute;bottom:14px;inset-inline-start:14px;z-index:3;
    font-family:'Outfit',sans-serif;font-size:.78rem;font-weight:700;
    padding:.25rem .65rem;border-radius:6px;
    background:rgba(5,38,64,.72);color:var(--brand-soft);backdrop-filter:blur(6px);
}

.gallery__thumbs{
    display:flex;gap:.55rem;overflow-x:auto;padding-bottom:.4rem;
    scrollbar-width:thin;
}
.gallery__thumb{
    flex:none;width:96px;aspect-ratio:4/3;padding:0;cursor:pointer;
    border:2px solid transparent;border-radius:10px;overflow:hidden;background:none;
    opacity:.6;transition:all .28s var(--ease);
}
.gallery__thumb img{width:100%;height:100%;object-fit:cover}
.gallery__thumb:hover{opacity:1;transform:translateY(-2px)}
.gallery__thumb.is-active{opacity:1;border-color:var(--brand)}

@media (max-width:920px){
    .proj-layout{grid-template-columns:1fr}
}

/* ═══════════════════════════════════════════
   17. اللايت‑بوكس
   ═══════════════════════════════════════════ */
.lightbox{
    position:fixed;inset:0;z-index:200;
    display:grid;place-items:center;
    background:rgba(8,16,24,.94);backdrop-filter:blur(8px);
    padding:clamp(1rem,4vw,3rem);
    animation:lbIn .28s var(--ease);
}
.lightbox[hidden]{display:none}
@keyframes lbIn{from{opacity:0}to{opacity:1}}

.lightbox__img{
    max-width:100%;max-height:88vh;object-fit:contain;
    border-radius:10px;box-shadow:0 40px 90px -30px rgba(0,0,0,.9);
    animation:lbImgIn .4s var(--ease);
}
@keyframes lbImgIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}

.lightbox__close,.lightbox__nav{
    position:absolute;display:grid;place-items:center;
    width:44px;height:44px;border-radius:50%;cursor:pointer;
    border:1px solid rgba(131,202,226,.28);background:rgba(131,202,226,.1);
    color:#fff;font-size:1.3rem;transition:all .2s var(--ease);
}
.lightbox__close:hover,.lightbox__nav:hover{
    background:var(--brand);border-color:var(--brand);transform:scale(1.08);
}
.lightbox__close{top:1.2rem;inset-inline-end:1.2rem}
.lightbox__nav--prev{inset-inline-end:1.2rem;top:50%;transform:translateY(-50%)}
.lightbox__nav--next{inset-inline-start:1.2rem;top:50%;transform:translateY(-50%)}
.lightbox__nav:hover{transform:translateY(-50%) scale(1.08)}

.lightbox__counter{
    position:absolute;bottom:1.4rem;inset-inline:50%;transform:translateX(50%);
    font-family:'Outfit',sans-serif;font-size:.86rem;font-weight:700;
    color:rgba(232,241,247,.75);
}
html[dir="ltr"] .lightbox__counter{transform:translateX(-50%)}

@media (max-width:640px){
    .lightbox__nav{width:38px;height:38px;font-size:1.12rem}
    .lightbox__nav--prev{inset-inline-end:.6rem}
    .lightbox__nav--next{inset-inline-start:.6rem}
}

/* ═══════════════════════════════════════════
   18. عناوين الأقسام
   ═══════════════════════════════════════════ */
.sec-head{text-align:center;max-width:660px;margin:0 auto clamp(2rem,4vw,3rem)}
.sec-eyebrow{
    display:inline-flex;align-items:center;gap:.5rem;
    font-family:'Cairo',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.18em;
    color:var(--brand-ink);margin-bottom:.7rem;
}
.sec-eyebrow::before,.sec-eyebrow::after{content:"";width:26px;height:1px;background:currentColor;opacity:.5}
.sec-title{font-size:clamp(1.6rem,3.4vw,2.4rem);font-weight:800;margin-bottom:.6rem}
.sec-sub{color:var(--muted);font-size:1rem}

/* ═══════════════════════════════════════════
   19. النبذة
   ═══════════════════════════════════════════ */
.intro{
    display:grid;grid-template-columns:1.15fr .85fr;
    gap:clamp(2rem,4vw,3.5rem);align-items:center;
}

.intro__figure{
    position:relative;margin:0;border-radius:16px;overflow:hidden;
    border:1px solid var(--line);aspect-ratio:4/5;
}
.intro__figure img{width:100%;height:100%;object-fit:cover;
    transition:transform .6s var(--ease)}
.intro__figure:hover img{transform:scale(1.05)}

.intro__mark{
    position:absolute;width:30px;height:30px;pointer-events:none;
    border-color:var(--brand-soft);border-style:solid;border-width:0;opacity:.9;
}
.intro__mark--tl{top:16px;left:16px;border-top-width:2px;border-left-width:2px}
.intro__mark--br{bottom:16px;right:16px;border-bottom-width:2px;border-right-width:2px}

/* بديل الصورة: مخطط يرسم نفسه */
.intro__blueprint{width:100%;height:auto}
.bp-ln path{fill:none;stroke:var(--brand);stroke-width:1.6;
    stroke-linecap:round;stroke-linejoin:round;opacity:.55}
.bp-draw{stroke-dasharray:1;stroke-dashoffset:1;
    animation:bpDraw 2.2s var(--ease) forwards}
.bp-draw.d1{animation-delay:.15s} .bp-draw.d2{animation-delay:.4s}
.bp-draw.d3{animation-delay:.65s} .bp-draw.d4{animation-delay:.9s}
.bp-draw.d5{animation-delay:1.15s}
@keyframes bpDraw{to{stroke-dashoffset:0}}

@media (max-width:900px){
    .intro{grid-template-columns:1fr}
    .intro__figure{aspect-ratio:16/10}
}

/* ═══════════════════════════════════════════
   20. شريط الأرقام
   ═══════════════════════════════════════════ */
.stats-band{
    position:relative;overflow:hidden;color:#fff;
    background:linear-gradient(150deg,#113D57,#2A576F 60%,#38779B);
}
.stats-band__grid{
    position:absolute;inset:0;pointer-events:none;opacity:.4;
    background-image:
        linear-gradient(rgba(131,202,226,.06) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.06) 1px,transparent 1px);
    background-size:22px 22px;
    -webkit-mask-image:radial-gradient(100% 100% at 50% 0%,#000,transparent 78%);
    mask-image:radial-gradient(100% 100% at 50% 0%,#000,transparent 78%);
}
.stats-band__inner{
    position:relative;z-index:2;
    display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
    gap:1.5rem;padding:clamp(2.5rem,5vw,3.5rem) 0;text-align:center;
}

.stat-item{position:relative}
/* فاصل شعرة بين الأرقام */
.stat-item + .stat-item::before{
    content:"";position:absolute;inset-inline-start:0;top:15%;bottom:15%;width:1px;
    background:linear-gradient(transparent,rgba(131,202,226,.28),transparent);
}
.stat-item__ic{
    display:grid;place-items:center;width:46px;height:46px;border-radius:12px;
    background:rgba(131,202,226,.14);color:var(--brand-soft);font-size:1.3rem;
    margin:0 auto .7rem;
}
.stat-item__num{
    display:block;font-family:'Outfit',sans-serif;font-size:clamp(1.9rem,3.6vw,2.7rem);
    font-weight:800;line-height:1;color:#fff;
}
.stat-item__lbl{
    display:block;font-size:.86rem;color:rgba(232,241,247,.62);margin-top:.4rem;
}

@media (max-width:640px){
    .stat-item + .stat-item::before{display:none}
}

/* ═══════════════════════════════════════════
   21. الرؤية والرسالة
   ═══════════════════════════════════════════ */
.vm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}

.vm{
    position:relative;overflow:hidden;padding:2rem 1.8rem;
    background:var(--bg-card);border:1px solid var(--line);border-radius:16px;
    transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;
}
.vm:hover{transform:translateY(-5px);border-color:var(--brand);
    box-shadow:0 24px 48px -26px rgba(var(--sh),.4)}

.vm::before{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.6;
    background-image:
        linear-gradient(var(--brand-tint) 1px,transparent 1px),
        linear-gradient(90deg,var(--brand-tint) 1px,transparent 1px);
    background-size:22px 22px;
    -webkit-mask-image:radial-gradient(70% 60% at 90% 100%,#000,transparent 72%);
    mask-image:radial-gradient(70% 60% at 90% 100%,#000,transparent 72%);
}
.vm > *{position:relative;z-index:2}

.vm__ic{
    display:grid;place-items:center;width:58px;height:58px;border-radius:16px;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1.8rem;margin-bottom:1.1rem;
    transition:background .28s,color .28s,transform .4s var(--ease);
}
.vm:hover .vm__ic{background:var(--brand);color:#fff;transform:rotate(-6deg) scale(1.05)}

.vm__title{font-size:1.3rem;font-weight:800;margin-bottom:.7rem}
.vm__text{color:var(--muted);font-size:.94rem;line-height:1.9}
.vm__text p{margin:0}

/* ═══════════════════════════════════════════
   22. القيم
   ═══════════════════════════════════════════ */
.val-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.3rem}

.val{
    position:relative;padding:1.8rem 1.5rem 1.5rem;
    background:var(--bg-card);border:1px solid var(--line);border-radius:12px;
    transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;
}
.val:hover{transform:translateY(-5px);border-color:var(--brand);
    box-shadow:0 22px 44px -26px rgba(var(--sh),.4)}

.val__num{
    position:absolute;top:1rem;inset-inline-end:1.2rem;
    font-family:'Outfit',sans-serif;font-size:2.4rem;font-weight:800;
    color:var(--brand);opacity:.13;line-height:1;
    transition:opacity .28s,transform .28s var(--ease);
}
.val:hover .val__num{opacity:.24;transform:scale(1.08)}

.val__ic{
    display:grid;place-items:center;width:48px;height:48px;border-radius:12px;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1.3rem;margin-bottom:.9rem;
    transition:background .28s,color .28s;
}
.val:hover .val__ic{background:var(--brand);color:#fff}

.val__title{font-size:1rem;font-weight:800;margin-bottom:.5rem;line-height:1.45}
.val__text{color:var(--muted);font-size:.86rem;line-height:1.85}
.val__text p{margin:0}

/* ═══════════════════════════════════════════
   23. الخط الزمني
   ═══════════════════════════════════════════ */
.timeline{
    position:relative;list-style:none;margin:0 auto;padding:0;max-width:780px;
}
/* الخط الرأسي */
.timeline::before{
    content:"";position:absolute;inset-inline-start:74px;top:8px;bottom:8px;width:2px;
    background:linear-gradient(var(--brand),var(--brand-tint));border-radius:2px;
}

.tl-item{
    position:relative;display:flex;align-items:flex-start;gap:1.3rem;
    padding-bottom:2.2rem;
}
.tl-item:last-child{padding-bottom:0}

.tl-item__year{
    flex:none;width:62px;text-align:center;
    font-family:'Outfit',sans-serif;font-size:1rem;font-weight:800;
    color:var(--brand-ink);padding-top:.15rem;
}

.tl-item__dot{
    position:absolute;inset-inline-start:68px;top:.5rem;
    width:14px;height:14px;border-radius:50%;z-index:2;
    background:var(--bg);border:3px solid var(--brand);
    transition:transform .28s var(--ease),box-shadow .28s;
}
.tl-item:hover .tl-item__dot{
    transform:scale(1.25);box-shadow:0 0 0 6px var(--brand-tint);
}

.tl-item__body{
    flex:1;min-width:0;margin-inline-start:2.2rem;
    padding:1.1rem 1.3rem;border-radius:12px;
    background:var(--bg-card);border:1px solid var(--line);
    transition:border-color .28s,transform .28s var(--ease);
}
.tl-item:hover .tl-item__body{border-color:var(--brand);transform:translateX(-4px)}
html[dir="ltr"] .tl-item:hover .tl-item__body{transform:translateX(4px)}

.tl-item__title{font-size:1rem;font-weight:800;margin-bottom:.35rem}
.tl-item__text{color:var(--muted);font-size:.86rem;line-height:1.85}
.tl-item__text p{margin:0}

@media (max-width:600px){
    .timeline::before{inset-inline-start:7px}
    .tl-item{flex-direction:column;gap:.5rem;padding-inline-start:2.2rem}
    .tl-item__year{width:auto;text-align:start;padding-top:0}
    .tl-item__dot{inset-inline-start:1px;top:.35rem}
    .tl-item__body{margin-inline-start:0}
}

/* ═══════════════════════════════════════════
   24. المؤسّسون
   ═══════════════════════════════════════════ */
.founders{display:flex;flex-direction:column;gap:2rem}

.founder{
    display:grid;grid-template-columns:260px 1fr;gap:2rem;align-items:start;
    padding:1.8rem;background:var(--bg-card);border:1px solid var(--line);border-radius:16px;
    transition:border-color .28s,box-shadow .28s;
}
.founder:hover{border-color:var(--brand);box-shadow:0 24px 50px -30px rgba(var(--sh),.4)}
/* المؤسّس الثاني يعكس الترتيب — إيقاع بصري بدل صفّ رتيب */
.founder:nth-child(even){grid-template-columns:1fr 260px}
.founder:nth-child(even) .founder__media{order:2}

.founder__media{
    position:relative;border-radius:12px;overflow:hidden;aspect-ratio:1;
    border:1px solid var(--line);background:var(--brand-tint);
}
.founder__media img{width:100%;height:100%;object-fit:cover;
    transition:transform .6s var(--ease)}
.founder:hover .founder__media img{transform:scale(1.05)}

.founder__initial{
    display:grid;place-items:center;width:100%;height:100%;
    font-family:'Outfit',sans-serif;font-size:2.4rem;font-weight:800;
    color:#fff;background:linear-gradient(140deg,var(--brand),var(--brand-dark));
}
.founder__mark{
    position:absolute;bottom:14px;inset-inline-end:14px;width:26px;height:26px;
    border-bottom:2px solid var(--brand-soft);border-inline-end:2px solid var(--brand-soft);
    opacity:.9;pointer-events:none;
}

.founder__name{font-size:1.3rem;font-weight:800;margin-bottom:.25rem}
.founder__pos{
    display:inline-block;font-family:'Cairo',sans-serif;font-size:.86rem;font-weight:700;
    color:var(--brand-ink);margin-bottom:.9rem;
}
html[data-lang="en"] .founder__pos{font-family:'Outfit',sans-serif}

.founder__creds{
    display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.1rem;
    padding-bottom:1.1rem;border-bottom:1px solid var(--line);
}
.founder__creds span{
    display:inline-flex;align-items:center;gap:.35rem;
    font-size:.78rem;color:var(--muted);
    background:var(--bg-soft);border:1px solid var(--line);
    padding:.28rem .7rem;border-radius:100px;
}
.founder__creds i{color:var(--brand);font-size:.94rem}

.founder__bio{color:var(--muted);font-size:.94rem;line-height:1.95}

@media (max-width:820px){
    .founder,.founder:nth-child(even){grid-template-columns:1fr;gap:1.4rem}
    .founder:nth-child(even) .founder__media{order:0}
    .founder__media{max-width:220px;margin-inline:auto}
}

/* ═══════════════════════════════════════════
   25. فريق العمل
   ═══════════════════════════════════════════ */
.team-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1.3rem}

.member{
    text-align:center;padding:1.5rem 1.1rem;
    background:var(--bg-card);border:1px solid var(--line);border-radius:12px;
    transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;
}
.member:hover{transform:translateY(-5px);border-color:var(--brand);
    box-shadow:0 20px 42px -26px rgba(var(--sh),.4)}

.member__media{
    width:96px;height:96px;border-radius:50%;overflow:hidden;margin:0 auto 1rem;
    border:3px solid var(--bg-soft);background:var(--brand-tint);
    transition:border-color .28s;
}
.member:hover .member__media{border-color:var(--brand-tint)}
.member__media img{width:100%;height:100%;object-fit:cover}

.member__initial{
    display:grid;place-items:center;width:100%;height:100%;
    font-family:'Outfit',sans-serif;font-size:2.4rem;font-weight:800;color:#fff;
    background:linear-gradient(140deg,var(--brand),var(--brand-dark));
}

.member__name{font-size:1rem;font-weight:800;margin-bottom:.2rem;line-height:1.45}
.member__pos{display:block;font-size:.78rem;font-weight:700;color:var(--brand-ink);margin-bottom:.4rem}
.member__qual{display:block;font-size:.78rem;color:var(--muted);line-height:1.6}
.member__years{
    display:inline-block;margin-top:.6rem;font-size:.7rem;font-weight:700;
    color:var(--muted);background:var(--bg-soft);border:1px solid var(--line);
    padding:.18rem .6rem;border-radius:100px;
}

@media (max-width:560px){
    .team-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.9rem}
    .member__media{width:74px;height:74px}
}

/* ═══════════════════════════════════════════
   26. الأسئلة الشائعة
   ═══════════════════════════════════════════ */
.faq-layout{
    display:grid;grid-template-columns:minmax(0,1fr) 300px;
    gap:clamp(1.5rem,3vw,2.6rem);align-items:start;
}

.faq-list{display:flex;flex-direction:column;gap:.8rem}

.faq{
    background:var(--bg-card);border:1px solid var(--line);border-radius:12px;
    overflow:hidden;transition:border-color .28s,box-shadow .28s;
}
.faq[open]{border-color:var(--brand);box-shadow:0 16px 34px -24px rgba(var(--sh),.4)}

.faq__q{
    display:flex;align-items:flex-start;gap:.85rem;
    padding:1.15rem 1.3rem;cursor:pointer;list-style:none;
    font-family:'Cairo',sans-serif;font-weight:700;font-size:1rem;line-height:1.6;
    transition:color .2s;
}
html[data-lang="en"] .faq__q{font-family:'Outfit',sans-serif}
.faq__q::-webkit-details-marker{display:none}
.faq__q:hover{color:var(--brand-ink)}

.faq__num{
    font-family:'Outfit',sans-serif;font-size:.78rem;font-weight:800;
    color:var(--brand);opacity:.55;flex:none;margin-top:.18rem;
}
.faq__q-text{flex:1;min-width:0}

.faq__caret{
    display:grid;place-items:center;width:28px;height:28px;border-radius:10px;flex:none;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1rem;
    transition:transform .28s var(--ease),background .28s,color .28s;
}
.faq[open] .faq__caret{
    transform:rotate(135deg);background:var(--brand);color:#fff;
}

.faq__a{
    padding:0 1.3rem 1.3rem;
    padding-inline-start:calc(1.3rem + .82rem + .85rem);
    animation:faqOpen .4s var(--ease);
}
@keyframes faqOpen{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.faq__a .prose{font-size:.94rem}
.faq__empty{color:var(--muted);font-style:italic;font-size:.94rem;margin:0}

@media (max-width:920px){
    .faq-layout{grid-template-columns:1fr}
    .faq__a{padding-inline-start:1.3rem}
}

/* ═══════════════════════════════════════════
   27. صفحة التواصل
   ═══════════════════════════════════════════ */
.contact-layout{
    display:grid;grid-template-columns:minmax(0,1fr) 340px;
    gap:clamp(1.5rem,3vw,2.6rem);align-items:start;
}

/* التنبيهات */
.alert{
    display:flex;align-items:flex-start;gap:.8rem;
    padding:1rem 1.2rem;border-radius:12px;margin-bottom:1.4rem;
    animation:faqOpen .4s var(--ease);
}
.alert i{font-size:1.3rem;flex:none;margin-top:.1rem}
.alert strong{display:block;font-weight:800;margin-bottom:.2rem}
.alert p{margin:0;font-size:.86rem;line-height:1.7}
.alert ul{margin:.3rem 0 0;padding-inline-start:1.1rem;font-size:.86rem}
.alert li{margin-bottom:.2rem}

.alert--ok{background:rgba(40,167,69,.1);border:1px solid rgba(40,167,69,.3);color:#1c7c43}
.alert--err{background:rgba(217,83,79,.09);border:1px solid rgba(217,83,79,.28);color:#b23b3b}

/* بيانات التواصل */
.contact-aside{display:flex;flex-direction:column;gap:1.1rem;position:sticky;top:96px}

.cinfo{background:var(--bg-card);border:1px solid var(--line);border-radius:12px;padding:1.4rem}
.cinfo__title{
    display:flex;align-items:center;gap:.45rem;
    font-size:1rem;font-weight:800;margin-bottom:1.1rem;
    padding-bottom:.75rem;border-bottom:1px solid var(--line);
}
.cinfo__title i{color:var(--brand-ink)}

.cinfo__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1rem}
.cinfo__list li{display:flex;align-items:flex-start;gap:.75rem}

.cinfo__ic{
    display:grid;place-items:center;width:42px;height:42px;border-radius:12px;flex:none;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1.12rem;
    transition:background .28s,color .28s,transform .28s var(--ease);
}
.cinfo__list li:hover .cinfo__ic{background:var(--brand);color:#fff;transform:scale(1.06)}
.cinfo__ic--wa{background:rgba(37,211,102,.14);color:#25D366}
.cinfo__list li:hover .cinfo__ic--wa{background:#25D366;color:#fff}

.cinfo__body{display:flex;flex-direction:column;min-width:0}
.cinfo__body small{font-size:.7rem;color:var(--muted);line-height:1.4}
.cinfo__body strong{font-size:.94rem;font-weight:700;line-height:1.55;word-break:break-word}
.cinfo__body a{transition:color .2s}
.cinfo__body a:hover strong{color:var(--brand-ink)}

/* أوقات الدوام */
.chours{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem}
.chours li{
    display:flex;align-items:center;justify-content:space-between;gap:.7rem;
    font-size:.86rem;color:var(--ink);padding:.28rem 0;
}
.chours li.is-closed{color:var(--muted);opacity:.65}
.chours li span:last-child{font-family:'Outfit',sans-serif;font-size:.78rem;white-space:nowrap}
.chours__note{
    font-size:.78rem;color:var(--muted);line-height:1.7;
    margin:.9rem 0 0;padding-top:.8rem;border-top:1px solid var(--line);
}

/* الخريطة */
.cmap{line-height:0;border-top:1px solid var(--line)}
.cmap iframe{display:block;filter:grayscale(.25);transition:filter .4s var(--ease)}
.cmap:hover iframe{filter:none}
html[data-theme="dark"] .cmap iframe{filter:grayscale(.4) invert(.9) hue-rotate(180deg)}

@media (max-width:920px){
    .contact-layout{grid-template-columns:1fr}
    .contact-aside{position:static}
}

/* ═══════════════════════════════════════════
   28. فورم التواصل — ثلاث خطوات
   ═══════════════════════════════════════════ */
.cbox{
    position:relative;overflow:hidden;
    background:var(--bg-card);border:1px solid var(--line);border-radius:16px;
    padding:clamp(1.4rem,3vw,2.2rem);
}
/* شبكة مخطط باهتة في الزاوية */
.cbox::before{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.6;
    background-image:
        linear-gradient(var(--brand-tint) 1px,transparent 1px),
        linear-gradient(90deg,var(--brand-tint) 1px,transparent 1px);
    background-size:22px 22px;
    -webkit-mask-image:radial-gradient(70% 60% at 92% 4%,#000,transparent 72%);
    mask-image:radial-gradient(70% 60% at 92% 4%,#000,transparent 72%);
}
.cbox > *{position:relative;z-index:2}

/* ═══ شريط الخطوات ═══ */
.steps{
    position:relative;display:flex;justify-content:space-between;gap:.5rem;
    list-style:none;margin:0 0 2rem;padding:0;
}
.steps__bar{
    position:absolute;top:19px;inset-inline:8%;height:2px;
    background:var(--line);border-radius:2px;z-index:0;
}
.steps__fill{
    display:block;height:100%;width:0;border-radius:2px;
    background:linear-gradient(90deg,var(--brand-soft),var(--brand));
    transition:width .4s var(--ease);
}

.step{
    position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:.45rem;
    flex:1;text-align:center;
}
.step__dot{
    position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;
    background:var(--bg-card);border:2px solid var(--line);
    font-family:'Outfit',sans-serif;font-weight:800;font-size:.94rem;color:var(--muted);
    transition:all .4s var(--ease);
}
.step__tick{position:absolute;opacity:0;font-size:1rem;transition:opacity .28s}
.step__num{transition:opacity .28s}

.step__label{
    font-family:'Cairo',sans-serif;font-size:.78rem;font-weight:700;color:var(--muted);
    transition:color .28s;
}
html[data-lang="en"] .step__label{font-family:'Outfit',sans-serif}

.step.is-active .step__dot{
    border-color:var(--brand);color:var(--brand-ink);
    box-shadow:0 0 0 5px var(--brand-tint);transform:scale(1.06);
}
.step.is-active .step__label{color:var(--brand-ink)}

.step.is-done{cursor:pointer}
.step.is-done .step__dot{background:var(--brand);border-color:var(--brand);color:#fff}
.step.is-done .step__num{opacity:0}
.step.is-done .step__tick{opacity:1}
.step.is-done .step__label{color:var(--ink)}

@media (max-width:520px){
    .step__label{font-size:.7rem}
    .steps__bar{inset-inline:14%}
}

/* ═══ اللوح ═══ */
.pane{display:none;border:none;margin:0;padding:0;min-width:0}
.pane.is-active{display:block;animation:paneIn .4s var(--ease)}
@keyframes paneIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

.pane__legend{
    font-size:.86rem;color:var(--muted);line-height:1.7;
    margin-bottom:1.4rem;padding:0;
}

.pane__nav{display:flex;gap:.7rem;justify-content:space-between;margin-top:1.6rem}
.pane__nav .btn{min-width:130px}
.pane__nav .btn:only-child{margin-inline-start:auto}

/* ═══ الحقول: تسمية عائمة ═══ */
.cform__row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:640px){ .cform__row{grid-template-columns:1fr} }

.cfield{position:relative;margin-bottom:1.15rem}

.cfield input,
.cfield select,
.cfield textarea{
    width:100%;padding:1.15rem .95rem .55rem;
    border:1px solid var(--line);border-radius:10px;
    background:var(--bg);color:var(--ink);
    font-family:inherit;font-size:.94rem;line-height:1.6;
    transition:border-color .2s,box-shadow .2s;
}
.cfield textarea{padding-top:1.5rem;resize:vertical;min-height:150px}
.cfield select{padding-top:1.35rem;cursor:pointer}
/* مساحة للأيقونة */
.cfield:has(.cfield__ic) input{padding-inline-end:2.6rem}

.cfield label{
    position:absolute;inset-inline-start:.95rem;top:.95rem;
    font-size:.94rem;color:var(--muted);pointer-events:none;
    transform-origin:inline-start top;
    transition:transform .2s var(--ease),color .2s;
}
.cfield label span{color:#d9534f}

/* التسمية ترتفع عند الكتابة أو التركيز */
.cfield input:focus + label,
.cfield input:not(:placeholder-shown) + label,
.cfield textarea:focus + label,
.cfield textarea:not(:placeholder-shown) + label{
    transform:translateY(-.62rem) scale(.76);color:var(--brand-ink);
}
/* select لا يدعم placeholder-shown بثبات، فتسميته ثابتة */
.cfield label.is-static{
    transform:translateY(-.62rem) scale(.76);color:var(--brand-ink);
}

.cfield__ic{
    position:absolute;inset-inline-end:.95rem;top:1.05rem;
    font-size:1.12rem;color:var(--muted);opacity:.55;
    pointer-events:none;transition:color .2s,opacity .2s;
}
.cfield:focus-within .cfield__ic{color:var(--brand);opacity:1}

.cfield input:focus,
.cfield select:focus,
.cfield textarea:focus{
    outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-tint);
}
.cfield .is-err{border-color:#d9534f;box-shadow:0 0 0 3px rgba(217,83,79,.12)}

.cfield__foot{display:flex;justify-content:space-between;gap:.6rem;margin-top:.35rem}
.cfield__hint{font-size:.7rem;color:var(--muted);transition:opacity .28s}
.cfield__counter{font-size:.7rem;color:var(--muted);font-family:'Outfit',sans-serif}

.cform__label{
    display:block;font-family:'Cairo',sans-serif;font-size:.86rem;font-weight:700;
    margin-bottom:.65rem;
}
html[data-lang="en"] .cform__label{font-family:'Outfit',sans-serif}

/* ═══ منتقي نوع المشروع ═══ */
.picker{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));
    gap:.55rem;margin-bottom:1.5rem;
}
.picker input{display:none}
.picker label{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;
    padding:.85rem .4rem;border:1px solid var(--line);border-radius:12px;cursor:pointer;
    color:var(--muted);font-size:.7rem;font-weight:700;text-align:center;line-height:1.35;
    background:var(--bg);transition:all .2s var(--ease);
}
.picker label i{font-size:1.3rem;transition:transform .28s var(--ease)}
.picker label:hover{border-color:var(--brand);color:var(--brand-ink);transform:translateY(-2px)}
.picker label:hover i{transform:scale(1.12)}
.picker input:checked + label{
    background:var(--brand);border-color:var(--brand);color:#fff;
    box-shadow:0 10px 22px -12px var(--brand-glow);
}

/* ═══ أزرار الميزانية ═══ */
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}
.chips input{display:none}
.chips label{
    padding:.5rem 1rem;border:1px solid var(--line);border-radius:100px;cursor:pointer;
    font-family:'Outfit',sans-serif;font-size:.78rem;font-weight:700;color:var(--muted);
    background:var(--bg);transition:all .2s var(--ease);white-space:nowrap;
}
.chips label:hover{border-color:var(--brand);color:var(--brand-ink)}
.chips input:checked + label{
    background:var(--brand);border-color:var(--brand);color:#fff;
    box-shadow:0 8px 18px -10px var(--brand-glow);
}

/* ═══ مصيدة السبام ═══ */
/* مخفية بصرياً لا بـ display:none — بعض الروبوتات تتجاهل المخفي كلياً */
.cform__trap{position:absolute;inset-inline-start:-9999px;opacity:0;height:0;overflow:hidden}

/* ═══ زر الإرسال أثناء المعالجة ═══ */
.btn.is-loading{pointer-events:none;opacity:.75}
.btn.is-loading i{animation:btnSpin .8s linear infinite}
@keyframes btnSpin{to{transform:rotate(360deg)}}

/* ═══════════════════════════════════════════
   30. ذيل القسم
   ═══════════════════════════════════════════ */
.sec-foot{display:flex;justify-content:center;margin-top:2.5rem}

/* ═══════════════════════════════════════════
   31. شريط الأرقام
   ═══════════════════════════════════════════ */
.numbers{
    position:relative;overflow:hidden;color:#fff;
    background:linear-gradient(150deg,#08151F,#113D57 60%,#2A576F);
}
.numbers__grid{
    position:absolute;inset:0;pointer-events:none;opacity:.45;
    background-image:
        linear-gradient(rgba(131,202,226,.06) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.06) 1px,transparent 1px);
    background-size:26px 26px;
    -webkit-mask-image:radial-gradient(100% 100% at 50% 0%,#000,transparent 78%);
    mask-image:radial-gradient(100% 100% at 50% 0%,#000,transparent 78%);
}
.numbers__inner{
    position:relative;z-index:2;
    display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:1.5rem;padding:clamp(2.6rem,5vw,3.6rem) 0;
}
.num{text-align:center;position:relative}
/* فاصل رأسي بين الأرقام */
.num + .num::before{
    content:"";position:absolute;inset-inline-start:0;top:18%;bottom:18%;width:1px;
    background:linear-gradient(transparent,rgba(131,202,226,.25),transparent);
}
.num__ic{
    display:grid;place-items:center;width:46px;height:46px;border-radius:12px;
    background:rgba(131,202,226,.12);color:var(--brand-soft);font-size:1.3rem;
    margin:0 auto .7rem;
}
.num__val{
    display:block;font-family:'Outfit',sans-serif;font-size:clamp(1.9rem,3.6vw,2.7rem);
    font-weight:900;line-height:1;color:#fff;
}
.num__lbl{display:block;font-size:.86rem;color:rgba(232,241,247,.62);margin-top:.4rem}

@media (max-width:560px){
    .num + .num::before{display:none}
}

/* ═══════════════════════════════════════════
   32. آلية العمل
   ═══════════════════════════════════════════ */
.flow{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
    gap:1.4rem;position:relative;
}
/* الخط الواصل بين الخطوات */
.flow::before{
    content:"";position:absolute;top:27px;inset-inline:8%;height:2px;
    background:repeating-linear-gradient(90deg,
    var(--brand-tint) 0 8px, transparent 8px 16px);
}
@media (max-width:760px){ .flow::before{display:none} }

.flow__item{position:relative;text-align:center;padding-top:0}

.flow__dot{
    position:relative;z-index:2;
    display:grid;place-items:center;width:56px;height:56px;border-radius:50%;
    margin:0 auto 1rem;
    background:var(--bg);border:2px solid var(--brand);color:var(--brand-ink);
    font-family:'Outfit',sans-serif;font-weight:800;font-size:1.12rem;
    box-shadow:0 0 0 6px var(--bg);
    transition:all .28s var(--ease);
}
.flow__item:hover .flow__dot{
    background:var(--brand);color:#fff;transform:scale(1.08);
    box-shadow:0 0 0 6px var(--bg),0 12px 26px -12px var(--brand-glow);
}
.flow__dot i{font-size:1.3rem}

.flow__no{
    display:block;font-family:'Outfit',sans-serif;font-size:.7rem;font-weight:800;
    letter-spacing:.14em;color:var(--brand);opacity:.6;margin-bottom:.35rem;
}
.flow__title{font-size:1rem;font-weight:800;margin-bottom:.5rem;line-height:1.45}
.flow__text{color:var(--muted);font-size:.86rem;line-height:1.85}
.flow__text p{margin:0}

/* ═══════════════════════════════════════════
   33. القيم
   ═══════════════════════════════════════════ */
.vals{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.3rem}

.val{
    position:relative;overflow:hidden;
    background:var(--bg-card);border:1px solid var(--line);border-radius:12px;
    padding:1.6rem 1.4rem;
    transition:transform .28s var(--ease),box-shadow .28s,border-color .28s;
}
.val:hover{transform:translateY(-5px);border-color:var(--brand);
    box-shadow:0 22px 44px -26px rgba(var(--sh),.45)}

/* علامة زاوية هندسية */
.val::after{
    content:"";position:absolute;top:12px;inset-inline-end:12px;width:16px;height:16px;
    border-top:1.5px solid var(--brand);border-inline-end:1.5px solid var(--brand);
    opacity:.28;transition:opacity .28s;
}
.val:hover::after{opacity:.7}

.val__ic{
    display:grid;place-items:center;width:50px;height:50px;border-radius:12px;
    background:var(--brand-tint);color:var(--brand-ink);font-size:1.5rem;
    margin-bottom:1rem;transition:all .28s var(--ease);
}
.val:hover .val__ic{background:var(--brand);color:#fff;transform:rotate(-6deg)}

.val__title{font-size:1rem;font-weight:800;margin-bottom:.5rem;line-height:1.45}
.val__text{color:var(--muted);font-size:.86rem;line-height:1.85}
.val__text p{margin:0}

/* ═══════════════════════════════════════════
   34. أسئلة الرئيسية
   ═══════════════════════════════════════════ */
.home-faq{
    display:grid;grid-template-columns:340px minmax(0,1fr);
    gap:clamp(1.5rem,3vw,3rem);align-items:start;
}
.home-faq__aside{position:sticky;top:96px}
.home-faq__aside .sec-eyebrow{margin-bottom:.7rem}
.home-faq__aside .sec-title{font-size:clamp(1.5rem,3vw,2.1rem);text-align:start}
.home-faq__aside .sec-sub{margin-bottom:1.4rem}

@media (max-width:900px){
    .home-faq{grid-template-columns:1fr}
    .home-faq__aside{position:static}
}

/* ═══════════════════════════════════════════
   35. الهيرو — صور متناوبة ملء الشاشة
   ═══════════════════════════════════════════ */
.hero{
    position:relative;min-height:clamp(600px,94vh,900px);
    display:flex;align-items:center;overflow:hidden;color:#fff;
    background:linear-gradient(160deg,#08151F,#113D57 55%,#2A576F);
}

/* ═══ الشرائح ═══ */
.hero__slides{position:absolute;inset:0;z-index:0}

.hero__slide{
    position:absolute;inset:0;
    opacity:0;visibility:hidden;
    transition:opacity 1.4s var(--ease),visibility 0s linear 1.4s;
}
.hero__slide.is-on{opacity:1;visibility:visible;transition-delay:0s}

.hero__slide img{
    width:100%;height:100%;object-fit:cover;
    /* الصورة الساكنة ملء الشاشة تبدو ميتة — زحف بطيء يمنحها حياة */
    transform:scale(1.06);
    transition:transform 6.4s linear;
}
.hero__slide.is-on img{transform:scale(1.14)}

/* ═══ طبقة التعتيم ═══ */
/* بدونها لا يُقرأ النص فوق الصور الفاتحة */
.hero__veil{
    position:absolute;inset:0;z-index:1;pointer-events:none;
    background:
        linear-gradient(105deg,
        rgba(8,21,31,.94) 0%,
        rgba(8,21,31,.82) 32%,
        rgba(17,61,87,.5) 62%,
        rgba(42,87,111,.34) 100%),
        linear-gradient(transparent 55%, rgba(8,21,31,.85));
}
html[dir="ltr"] .hero__veil{
    background:
        linear-gradient(255deg,
        rgba(8,21,31,.94) 0%,
        rgba(8,21,31,.82) 32%,
        rgba(17,61,87,.5) 62%,
        rgba(42,87,111,.34) 100%),
        linear-gradient(transparent 55%, rgba(8,21,31,.85));
}

.hero--plain{background:linear-gradient(160deg,#08151F,#113D57 55%,#2A576F)}

.hero__grid{
    position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.4;
    background-image:
        linear-gradient(rgba(131,202,226,.06) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.06) 1px,transparent 1px),
        linear-gradient(rgba(131,202,226,.1) 1px,transparent 1px),
        linear-gradient(90deg,rgba(131,202,226,.1) 1px,transparent 1px);
    background-size:26px 26px,26px 26px,130px 130px,130px 130px;
    -webkit-mask-image:radial-gradient(120% 90% at 20% 0%,#000 15%,transparent 72%);
    mask-image:radial-gradient(120% 90% at 20% 0%,#000 15%,transparent 72%);
    animation:gridDrift 50s linear infinite;
}
@keyframes gridDrift{to{background-position:130px 130px,130px 130px,650px 650px,650px 650px}}

/* ═══ النص ═══ */
.hero__inner{
    position:relative;z-index:3;
    padding-block:clamp(4rem,8vw,6rem);
}
.hero__body{max-width:640px}

.hero__eyebrow{
    display:inline-flex;align-items:center;gap:.6rem;
    font-family:'Cairo',sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.14em;
    color:var(--sh-200);background:rgba(131,202,226,.12);
    border:1px solid rgba(131,202,226,.28);padding:.4rem .95rem;border-radius:100px;
    margin-bottom:1.4rem;backdrop-filter:blur(6px);
}
.hero__pulse{
    width:7px;height:7px;border-radius:50%;background:var(--sh-200);flex:none;
    animation:pulseDot 2.2s ease-out infinite;
}
@keyframes pulseDot{
    0%{box-shadow:0 0 0 0 rgba(166,224,237,.55)}
    70%{box-shadow:0 0 0 11px rgba(166,224,237,0)}
    100%{box-shadow:0 0 0 0 rgba(166,224,237,0)}
}

.hero__title{
    font-size:clamp(2rem,4.8vw,3.5rem);font-weight:900;line-height:1.26;
    margin-bottom:1.2rem;letter-spacing:-.015em;
    text-shadow:0 2px 24px rgba(5,38,64,.6);
}
.hero__title .word{
    display:inline-block;opacity:0;transform:translateY(26px);
    animation:wordUp .8s var(--ease) forwards;
    animation-delay:calc(var(--w) * 62ms + 140ms);
}
@keyframes wordUp{to{opacity:1;transform:none}}

.hero__sub{
    color:rgba(232,241,247,.9);font-size:clamp(1rem,1.5vw,1.14rem);
    max-width:50ch;margin:0 0 2rem;line-height:1.85;
    text-shadow:0 1px 16px rgba(5,38,64,.5);
}

.hero__cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-bottom:2.4rem}

.hero__stats{display:flex;flex-wrap:wrap;gap:2.2rem}
.hero__stat{position:relative;padding-inline-start:1rem}
.hero__stat::before{
    content:"";position:absolute;inset-inline-start:0;top:5px;bottom:5px;width:2px;
    border-radius:2px;background:linear-gradient(var(--sh-200),transparent);
}
.hero__stat-num{
    display:block;font-family:'Outfit',sans-serif;font-size:1.8rem;font-weight:800;
    line-height:1;color:#fff;text-shadow:0 2px 12px rgba(5,38,64,.5);
}
.hero__stat-lbl{display:block;font-size:.78rem;color:rgba(232,241,247,.7);margin-top:.28rem}

/* ═══ بطاقة المشروع المعروض ═══ */
.hero__now{
    position:absolute;z-index:4;
    bottom:clamp(4.5rem,9vh,6rem);inset-inline-end:0;
    width:min(330px,86%);
}
.hnow{
    position:absolute;inset-inline-end:0;bottom:0;width:100%;
    display:block;padding:1.05rem 1.2rem;
    border-radius:12px 0 0 12px;
    background:rgba(8,21,31,.72);backdrop-filter:blur(14px);
    border:1px solid rgba(131,202,226,.24);border-inline-end:none;
    opacity:0;transform:translateX(-24px);pointer-events:none;
    transition:opacity .6s var(--ease),transform .6s var(--ease),background .28s;
}
html[dir="ltr"] .hnow{
    border-radius:0 12px 12px 0;
    border-inline-end:1px solid rgba(131,202,226,.24);border-inline-start:none;
    transform:translateX(24px);
}
.hnow.is-on{opacity:1;transform:none;pointer-events:auto}
.hnow:hover{background:rgba(8,21,31,.88);border-color:var(--sh-300)}

.hnow__label{
    display:inline-block;font-family:'Cairo',sans-serif;
    font-size:.62rem;font-weight:700;letter-spacing:.16em;
    color:var(--sh-200);background:rgba(131,202,226,.16);
    border:1px solid rgba(131,202,226,.3);
    padding:.16rem .55rem;border-radius:100px;margin-bottom:.45rem;
}
.hnow__name{
    display:block;font-family:'Cairo',sans-serif;font-size:1rem;font-weight:800;
    color:#fff;line-height:1.45;
}
html[data-lang="en"] .hnow__name{font-family:'Outfit',sans-serif}
.hnow__meta{
    display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;
    font-size:.78rem;color:rgba(232,241,247,.66);margin-top:.25rem;
}
.hnow__year{
    font-family:'Outfit',sans-serif;font-weight:700;color:var(--sh-200);
    background:rgba(131,202,226,.14);padding:.05rem .45rem;border-radius:6px;
}

/* ═══ المؤشّرات ═══ */
.hero__dots{
    position:absolute;z-index:4;
    bottom:clamp(1.6rem,4vh,2.4rem);inset-inline-start:max(4%,calc((100% - var(--wrap)) / 2));
    display:flex;gap:.5rem;
}
.hdot{
    position:relative;width:40px;height:4px;padding:0;cursor:pointer;
    border:none;border-radius:100px;overflow:hidden;
    background:rgba(232,241,247,.24);transition:background .28s;
}
.hdot:hover{background:rgba(232,241,247,.4)}
.hdot__fill{
    position:absolute;inset:0;width:0;border-radius:100px;
    background:var(--sh-200);
}
/* الشريط يمتلئ بمقدار ما بقي من وقت الشريحة */
.hdot.is-on .hdot__fill{animation:dotFill 5s linear forwards}
@keyframes dotFill{to{width:100%}}

/* ═══ مؤشّر التمرير ═══ */
.hero__scroll{
    position:absolute;z-index:4;bottom:clamp(1.4rem,4vh,2.2rem);
    inset-inline-end:max(4%,calc((100% - var(--wrap)) / 2));
    width:24px;height:40px;
    border:1.5px solid rgba(131,202,226,.45);border-radius:100px;
    display:grid;place-items:start center;padding-top:8px;
}
.hero__scroll-line{
    width:2px;height:8px;border-radius:2px;background:var(--sh-200);
    animation:scrollDot 1.9s var(--ease) infinite;
}
@keyframes scrollDot{
    0%{transform:translateY(0);opacity:1}
    70%{transform:translateY(15px);opacity:0}
    100%{transform:translateY(0);opacity:0}
}

/* ═══ الاستجابة ═══ */
@media (max-width:900px){
    .hero{min-height:640px}
    .hero__now{
        position:static;width:auto;margin-top:2rem;
    }
    .hnow{position:absolute;inset-inline:0;border-radius:12px;border-inline:1px solid rgba(131,202,226,.24)}
    .hero__now{position:relative;height:110px}
    .hero__veil{
        background:linear-gradient(rgba(8,21,31,.9),rgba(8,21,31,.78) 45%,rgba(8,21,31,.94));
    }
    .hero__dots{inset-inline-start:4%}
    .hero__scroll{display:none}
}
@media (max-width:560px){
    .hero__stats{gap:1.4rem}
    .hero__stat-num{font-size:1.5rem}
    .hdot{width:28px}
}

@media (prefers-reduced-motion:reduce){
    .hero__slide img{transform:none;transition:none}
    .hero__slide{transition:opacity .01ms}
    .hdot.is-on .hdot__fill{animation:none;width:100%}
    .hero__title .word{opacity:1;transform:none;animation:none}
    .hnow{opacity:1;transform:none}
    .hnow:not(.is-on){display:none}
}

/* ═══════════════════════════════════════════
   36. تشذيبات بصرية
   ═══════════════════════════════════════════ */

/* ═══ 1. الظلال: سلّم واحد بدل 23 ظلاً مرتجلاً ═══ */
:root{
    --lift-1:0 2px 8px -4px rgba(var(--sh),.18);
    --lift-2:0 12px 26px -16px rgba(var(--sh),.3);
    --lift-3:0 24px 48px -26px rgba(var(--sh),.42);
}

.svc:hover,.proj:hover,.val:hover,.mini:hover,.faq[open]{box-shadow:var(--lift-3)}
.cbox,.cinfo,.aside-card{box-shadow:var(--lift-1)}

/* ═══ 2. التركيز: حلقة واحدة واضحة في كل الموقع ═══ */
/* المتصفّح يرسم حلقة افتراضية باهتة ومختلفة بين المتصفّحات */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
    outline:2px solid var(--brand);
    outline-offset:3px;
    border-radius:2px;
}
/* الفأرة لا تحتاجها — focus-visible وحده يميّز لوحة المفاتيح */
:where(a,button,summary):focus:not(:focus-visible){outline:none}

/* ═══ 3. تحديد النص بلون العلامة ═══ */
::selection{background:var(--sh-200);color:var(--sh-900)}
html[data-theme="dark"] ::selection{background:var(--sh-700);color:#fff}

/* ═══ 4. شريط التمرير ═══ */
html{scrollbar-color:var(--sh-400) transparent;scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{
    background:var(--sh-400);border-radius:100px;
    border:3px solid var(--bg);
}
::-webkit-scrollbar-thumb:hover{background:var(--sh-500)}

/* ═══ 5. الأرقام: خط طبقي متساوي العرض ═══ */
/* بدونه يقفز عرض الرقم أثناء العدّ التصاعدي فيرتجف السطر */
.num__val,.hero__stat-num,.filter__n,.hdot,
.proj__year,.gallery__counter,.lightbox__counter,
.hnow__year,.shot__spec-year,.faq__num,.flow__no{
    font-variant-numeric:tabular-nums;
    font-feature-settings:"tnum";
}

/* ═══ 6. الصور: خلفية أثناء التحميل بدل فراغ أبيض ═══ */
.proj__media,.mini img,.gallery__stage,.svc-hero{
    background:linear-gradient(110deg,
    var(--bg-soft) 30%, rgba(131,202,226,.14) 50%, var(--bg-soft) 70%);
    background-size:220% 100%;
    animation:imgWait 1.6s ease-in-out infinite;
}
@keyframes imgWait{to{background-position:-120% 0}}
/* الحركة تتوقف بمجرد ظهور الصورة */
.proj__media:has(img[src]),.gallery__stage:has(img[src]),.svc-hero:has(img[src]){animation:none}

/* ═══ 7. الروابط داخل النص: خط سفلي يتمدّد ═══ */
.prose a{
    text-decoration:none;
    background-image:linear-gradient(currentColor,currentColor);
    background-size:0% 1.5px;background-position:0 100%;
    background-repeat:no-repeat;
    transition:background-size .28s var(--ease);
    padding-bottom:1px;
}
.prose a:hover{background-size:100% 1.5px}

/* ═══ 8. العناوين: توازن الأسطر ═══ */
/* يمنع بقاء كلمة وحيدة في السطر الأخير */
h1,h2,h3,.sec-title,.hero__title,.phead__title{text-wrap:balance}
.sec-sub,.hero__sub,.phead__sub{text-wrap:pretty}

/* ═══ 9. الأزرار: إزاحة عند الضغط ═══ */
.btn:active{transform:translateY(1px);transition-duration:.05s}

/* ═══ 10. الفواصل بين الأقسام ═══ */
/* خط شعرة بلون العلامة بدل حافة رمادية حادة */
.section + .section{
    border-top:1px solid transparent;
    border-image:linear-gradient(90deg,transparent,var(--line) 20%,var(--line) 80%,transparent) 1;
}

/* ═══ 11. الحالة الفارغة: تنفّس أوسع ═══ */
.empty-state svg{animation:emptyFloat 5s ease-in-out infinite}
@keyframes emptyFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* ═══ 12. تحسينات الوضع الليلي ═══ */
html[data-theme="dark"] .svc,
html[data-theme="dark"] .proj,
html[data-theme="dark"] .val,
html[data-theme="dark"] .mini,
html[data-theme="dark"] .cbox,
html[data-theme="dark"] .cinfo{
    /* حدّ علوي فاتح يوحي بمصدر ضوء من الأعلى */
    border-top-color:rgba(131,202,226,.16);
}
html[data-theme="dark"] img:not(.foot__logo):not(.hdr__brand img){
    /* الصور الفاتحة تبهر العين على خلفية داكنة */
    filter:brightness(.94);
}