/* ═══════════════════════════════════════════════════════════
   BRAND VARIABLES — غيّر هذه القيم لإعادة تصميم الموقع بالكامل
═══════════════════════════════════════════════════════════ */
:root{
  --primary:       #008080;   /* اللون الأساسي  */
  --primary-dark:  #006666;   /* الأساسي الداكن */
  --primary-hover: #009898;   /* Hover */
  --primary-light: #e6f3f3;   /* خلفية فاتحة   */
  --primary-xlt:   #f2fbfb;   /* أفتح          */
  --text:          #1a1a1a;   /* نص أساسي      */
  --text-muted:    #555e68;   /* نص ثانوي      */
  --bg:            #ffffff;   /* خلفية الصفحة  */
  --surface:       #f7fbfb;   /* سطح ثانوي     */
  --border:        #cce4e4;
  --border-lt:     #e4f2f2;
  --font:          'Cairo', sans-serif;
  --max-w:         1160px;
  --r:             12px;
  --rs:            8px;
  --t:             .3s ease;
  --sh-s:          0 2px 14px rgba(0,128,128,.07);
  --sh-m:          0 6px 28px rgba(0,128,128,.12);
  --sh-l:          0 14px 50px rgba(0,128,128,.18);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{font-family:var(--font);color:var(--text);background:var(--bg);line-height:1.75}
a{text-decoration:none;color:inherit}
ul{list-style:none}
button{font-family:var(--font);cursor:pointer}
.w{max-width:var(--max-w);margin:0 auto;padding:0 24px;padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
section{padding:88px 0;scroll-margin-top:96px}
.page-top{padding-top:130px}

/* ── خطوط ── */
.tag{display:inline-block;background:var(--primary-light);border:1px solid rgba(0,128,128,.22);color:var(--primary-dark);padding:5px 18px;border-radius:50px;font-size:.82rem;font-weight:700;margin-bottom:14px}
h2.sh{font-size:clamp(1.55rem,3vw,2.1rem);font-weight:900;color:var(--primary);margin-bottom:12px;line-height:1.3}
.pre-h{font-size:1rem;font-weight:700;color:var(--primary-dark);margin-bottom:6px;line-height:1.7}
.pre-sub{font-size:.96rem;color:var(--text-muted);max-width:640px;margin:0 auto 14px;line-height:1.82}
.ssub{font-size:.96rem;color:var(--text-muted);max-width:580px;line-height:1.82}
.sec-top{text-align:center;margin-bottom:52px}
.sec-top .ssub{margin:0 auto}
.bar{width:52px;height:4px;background:var(--primary);border-radius:2px;margin:13px auto}

/* ── أزرار ── */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:var(--rs);font-weight:700;font-size:.92rem;transition:var(--t);border:2px solid transparent;font-family:var(--font)}
.btn-p{background:var(--primary);color:#fff;border-color:var(--primary)}
.btn-p:hover{background:var(--primary-dark);border-color:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,128,128,.28)}
.btn-o{background:#fff;color:var(--primary-dark);border-color:#fff}
.btn-o:hover{background:var(--primary-xlt);color:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.2)}
.btn-w{background:#fff;color:var(--primary-dark);border-color:#fff}
.btn-w:hover{background:var(--primary-xlt);color:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.2)}
.btn-wa{background:#25D366;color:#fff;border-color:#25D366}
.btn-wa:hover{background:#1ebe57;border-color:#1ebe57;transform:translateY(-2px);box-shadow:0 8px 22px rgba(37,211,102,.4)}

/* ── واتساب عائم ── */
#wa-float{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom));right:24px;z-index:950;display:flex;align-items:center;gap:10px;background:#25D366;color:#fff;padding:12px 18px 12px 16px;border-radius:50px;font-weight:700;font-size:.9rem;box-shadow:0 6px 20px rgba(37,211,102,.32);transition:var(--t)}
#wa-float:hover{background:#1ebe57;transform:translateY(-3px);box-shadow:0 12px 32px rgba(37,211,102,.55)}
#wa-float .wa-ic{width:30px;height:30px;flex-shrink:0}
#wa-float .wa-tx{white-space:nowrap}
@media(max-width:768px){#wa-float{padding:13px;bottom:calc(18px + env(safe-area-inset-bottom));right:16px}#wa-float .wa-tx{display:none}#go-top{bottom:calc(18px + env(safe-area-inset-bottom));left:16px}}

/* ═══════════════════════════════════════════════════
   شريط التنقل
═══════════════════════════════════════════════════ */
#nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:#fff;border-bottom:1.5px solid var(--border-lt);padding:13px 0;transition:var(--t)}
#nav.sc{box-shadow:0 3px 22px rgba(0,128,128,.1)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:16px}
.nav-brand{display:flex;align-items:center;gap:10px}
.nav-logo{width:54px;height:54px;background:var(--primary);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.05rem;font-weight:900;flex-shrink:0}
.nav-brand .n1{font-size:1.02rem;font-weight:900;color:var(--primary);display:block;line-height:1.2}
.nav-brand .n2{font-size:.66rem;color:var(--text-muted)}
.nav-links{display:flex;align-items:center;gap:22px}
.nav-links a{color:var(--text);font-size:.87rem;font-weight:600;transition:var(--t);position:relative;padding-bottom:3px}
.nav-links a::after{content:'';position:absolute;bottom:0;right:0;width:0;height:2px;background:var(--primary);transition:var(--t);border-radius:2px}
/* تأثير التحويم على الأجهزة ذات المؤشر فقط — يمنع بقاء التمييز بعد اللمس على الجوال */
@media(hover:hover){
  .nav-links a:hover{color:var(--primary)}
  .nav-links a:hover::after{width:100%}
}
.nav-links a.active{color:var(--primary)}
.nav-links a.active::after{width:100%}
.nav-cta-btn{margin:10px;padding:9px 20px;font-size:.83rem}
.saudi-ic{width:40px;height:40px;object-fit:contain;position:relative;top:10px;filter:brightness(0) invert(1);opacity:.92}
.hbg{display:none;flex-direction:column;gap:5px;background:none;border:none;padding:4px;position:relative;z-index:1001}
.hbg span{display:block;width:26px;height:2px;background:var(--primary);border-radius:2px;transition:var(--t)}
.hbg.op span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hbg.op span:nth-child(2){opacity:0}
.hbg.op span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mob-nav{display:none;position:fixed;inset:0;background:#fff;z-index:999;flex-direction:column;align-items:center;justify-content:center;gap:24px;border-top:3px solid var(--primary)}
.mob-nav.op{display:flex}
.mob-nav a{color:var(--text);font-size:1.2rem;font-weight:700;transition:var(--t)}
.mob-nav a:hover{color:var(--primary)}
.mob-x{position:absolute;top:20px;left:20px;background:none;border:none;color:var(--primary);font-size:2rem;cursor:pointer}

/* ═══════════════════════════════════════════════════
   الهيرو
═══════════════════════════════════════════════════ */
#hero{min-height:100vh;min-height:100svh;background:url('background.jpg') center center / cover no-repeat;position:relative;overflow:hidden;display:flex;align-items:stretch}
.hero-grid{display:grid;grid-template-columns:1fr 380px;width:100%;min-height:100vh}
.hero-content{padding:140px 5% 80px;position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.25);color:#fff;padding:7px 18px;border-radius:50px;font-size:.83rem;font-weight:700;margin-bottom:22px}
.hero-h{font-size:clamp(2rem,4.5vw,3.2rem);font-weight:900;color:#fff;line-height:1.28;margin-bottom:18px}
.hero-h em{color:var(--primary);font-style:normal}
.hero-p{font-size:.95rem;color:rgba(255,255,255,.78);margin-bottom:34px;line-height:1.87;max-width:500px}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap}
.hero-panel{background:rgba(0,100,100,0.82);display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:14px;padding:80px 32px;position:relative;z-index:2}
.hero-panel::before{content:'';position:absolute;top:0;bottom:0;right:-28px;width:28px;background:rgba(0,100,100,0.82);clip-path:polygon(0 0,0 100%,100% 50%)}
.hero-lbl{text-align:center;color:rgba(255,255,255,.88);font-size:.9rem;font-weight:700;margin-bottom:4px}
.hero-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.hstat{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);border-radius:var(--r);padding:18px 12px;text-align:center;transition:var(--t)}
.hstat:hover{background:rgba(255,255,255,.22);transform:scale(1.03)}
.hstat-n{font-size:2.2rem;font-weight:900;color:#fff;line-height:1}
.hstat-l{font-size:.77rem;color:rgba(255,255,255,.88);margin-top:5px}
.hero-meta{text-align:center;font-size:.77rem;color:rgba(255,255,255,.62);margin-top:8px;line-height:1.8}
#hero::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,0.35);z-index:1}

/* ═══════════════════════════════════════════════════
   شريط الأرقام (موبايل فقط)
═══════════════════════════════════════════════════ */
#stats{padding:0;background:var(--primary);display:none}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr)}
.s-cell{padding:40px 16px;text-align:center;border-left:1px solid rgba(255,255,255,.18);transition:background var(--t)}
.s-cell:last-child{border-left:none}
.s-cell:hover{background:rgba(255,255,255,.08)}
.s-num{font-size:2.6rem;font-weight:900;color:#fff;line-height:1;margin-bottom:6px}
.s-lbl{font-size:.89rem;color:rgba(255,255,255,.88);font-weight:600}

/* ═══════════════════════════════════════════════════
   شريط الثقة + جدار الشعارات — جهات التمويل
═══════════════════════════════════════════════════ */
#trust{padding:56px 0;background:var(--primary-xlt);border-bottom:1px solid var(--border-lt)}
.trust-lbl{text-align:center;font-size:.98rem;font-weight:700;color:var(--primary-dark);margin-bottom:26px}
.logo-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.logo-item{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;background:#fff;border:1.5px solid var(--border);border-radius:var(--r);padding:22px 12px;text-align:center;transition:var(--t);box-shadow:var(--sh-s)}
.logo-item:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:var(--sh-m)}
.logo-mark{width:100%;height:58px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.logo-mark img{max-width:100%;max-height:52px;object-fit:contain}
.logo-name{font-size:.78rem;font-weight:700;color:var(--primary-dark);line-height:1.45}
/* شارات مصغّرة (تُستخدم داخل صفحات أخرى) */
.trust-row{display:flex;flex-wrap:wrap;justify-content:center;gap:11px}
.trust-badge{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--border);border-radius:50px;padding:9px 18px;font-size:.85rem;font-weight:700;color:var(--primary-dark);box-shadow:var(--sh-s);transition:var(--t)}
.trust-badge:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:var(--sh-m)}

/* ═══════════════════════════════════════════════════
   القطاعات — دراسات جدوى معتمدة لكل قطاع
═══════════════════════════════════════════════════ */
#sectors{background:var(--bg)}
.sect-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:52px}
.sect-card{background:var(--primary-xlt);border:1px solid var(--border-lt);border-radius:var(--r);padding:24px 18px;text-align:center;transition:var(--t)}
.sect-card:hover{border-color:var(--primary);box-shadow:var(--sh-m);transform:translateY(-4px);background:var(--bg)}
.sect-card .sico{font-size:2.1rem;display:block;margin-bottom:10px}
.sect-card h3{font-size:.98rem;font-weight:700;color:var(--primary);margin-bottom:6px;line-height:1.4}
.sect-card p{font-size:.8rem;color:var(--text-muted);line-height:1.7}
.flyers-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.flyer{border-radius:var(--r);overflow:hidden;box-shadow:var(--sh-m);border:1px solid var(--border-lt);transition:var(--t);background:var(--bg)}
.flyer:hover{transform:translateY(-5px);box-shadow:var(--sh-l);border-color:var(--primary)}
.flyer img{width:100%;height:auto;display:block}
.flyer figcaption{padding:13px 16px;font-size:.86rem;font-weight:700;color:var(--primary-dark);text-align:center}

/* ═══════════════════════════════════════════════════
   من نحن
═══════════════════════════════════════════════════ */
#about{background:var(--surface)}
.about-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:56px;align-items:start}
.about-txt p{color:var(--text-muted);margin-bottom:13px;font-size:.94rem;line-height:1.85}
.vmv{display:flex;flex-direction:column;gap:13px}
.vmv-card{background:var(--bg);border-radius:var(--r);padding:20px 22px;border-right:4px solid var(--primary);box-shadow:var(--sh-s);transition:var(--t)}
.vmv-card:hover{transform:translateX(-4px);box-shadow:var(--sh-m)}
.vmv-card h3{font-size:.94rem;font-weight:700;color:var(--primary);margin-bottom:6px}
.vmv-card p{color:var(--text-muted);font-size:.85rem;line-height:1.74}
.official-box{background:var(--primary-xlt);border:1.5px solid var(--border);border-radius:var(--rs);padding:14px 18px;margin-top:20px;display:flex;align-items:center;gap:10px;font-size:.86rem;color:var(--primary-dark);font-weight:700}

/* ═══════════════════════════════════════════════════
   المبادئ
═══════════════════════════════════════════════════ */
#principles{background:var(--bg)}
.prin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.prin-card{background:var(--primary-xlt);border-radius:var(--r);padding:22px;display:flex;gap:13px;align-items:flex-start;border:1px solid var(--border-lt);transition:var(--t)}
.prin-card:hover{border-color:var(--primary);box-shadow:var(--sh-m);transform:translateY(-4px);background:var(--bg)}
.pico{width:44px;height:44px;background:var(--primary-light);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;flex-shrink:0;border:1.5px solid var(--border)}
.prin-card p{font-size:.84rem;color:var(--text-muted);line-height:1.78}

/* ═══════════════════════════════════════════════════
   الخدمات
═══════════════════════════════════════════════════ */
#services{background:var(--surface)}
.tabs-bar{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-bottom:42px}
.tab{padding:9px 20px;border-radius:50px;border:2px solid var(--border);background:var(--bg);color:var(--text-muted);font-size:.86rem;font-weight:700;transition:var(--t);font-family:var(--font)}
.tab:hover,.tab.on{border-color:var(--primary);background:var(--primary);color:#fff}
.panel{display:none}.panel.on{display:block}
.srv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.scard{border-radius:var(--r);border:1px solid var(--border-lt);overflow:hidden;transition:var(--t);background:var(--bg)}
.scard:hover{transform:translateY(-5px);box-shadow:var(--sh-l);border-color:var(--primary)}
.sc-head{background:var(--primary);padding:20px;display:flex;gap:11px;align-items:flex-start}
.sc-head .ico{font-size:1.9rem;flex-shrink:0;margin-top:2px}
.sc-head h3{color:#fff;font-size:1rem;font-weight:700}
.sc-head p{color:rgba(255,255,255,.65);font-size:.76rem;margin-top:3px}
.sc-body{padding:16px 18px}
.sc-body li{display:flex;align-items:flex-start;gap:7px;font-size:.84rem;color:var(--text-muted);padding:5px 0;border-bottom:1px solid var(--border-lt)}
.sc-body li:last-child{border-bottom:none}
.sc-body li::before{content:'✓';color:var(--primary);font-weight:900;flex-shrink:0}
.sf{background:var(--bg);border-radius:var(--r);padding:24px;border:1px solid var(--border-lt);transition:var(--t);box-shadow:var(--sh-s)}
.sf:hover{border-color:var(--primary);box-shadow:var(--sh-m);transform:translateY(-3px)}
.sf h3{font-size:.95rem;font-weight:700;color:var(--primary);margin-bottom:10px}
.sf p{font-size:.84rem;color:var(--text-muted);line-height:1.78}

/* ═══════════════════════════════════════════════════
   لماذا نحن
═══════════════════════════════════════════════════ */
#why{background:var(--primary)}
#why h2.sh{color:#fff}
#why .ssub{color:rgba(255,255,255,.72)}
#why .tag{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.3);color:#fff}
#why .bar{background:rgba(255,255,255,.6)}
.why-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.wcard{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:var(--r);padding:24px 14px;text-align:center;transition:var(--t)}
.wcard:hover{background:rgba(255,255,255,.18);transform:translateY(-5px);border-color:rgba(255,255,255,.42)}
.wcard span{font-size:2.2rem;margin-bottom:11px;display:block}
.wcard h4{color:#fff;font-size:.9rem;font-weight:700;margin-bottom:7px;line-height:1.4}
.wcard p{color:rgba(255,255,255,.68);font-size:.78rem;line-height:1.7}

/* ═══════════════════════════════════════════════════
   فريق العمل
═══════════════════════════════════════════════════ */
#team{background:var(--bg)}
.leader-card{background:var(--primary-xlt);border-radius:var(--r);padding:32px;display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:start;border:2px solid var(--primary);box-shadow:var(--sh-m);margin-bottom:28px}
.av-big{width:94px;height:94px;background:var(--primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.9rem;flex-shrink:0;color:#fff}
.leader-info h3{font-size:1.25rem;font-weight:900;color:var(--primary);margin-bottom:3px}
.leader-info .role{color:var(--primary-dark);font-weight:700;font-size:.84rem;margin-bottom:10px}
.leader-info p{font-size:.87rem;color:var(--text-muted);line-height:1.8}
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tcard{background:var(--surface);border-radius:var(--r);padding:24px 18px;text-align:center;border:1px solid var(--border-lt);transition:var(--t)}
.tcard:hover{border-color:var(--primary);box-shadow:var(--sh-m);transform:translateY(-4px);background:var(--bg)}
.av-sm{width:62px;height:62px;background:var(--primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin:0 auto 11px;color:#fff}
.tcard h4{font-size:.92rem;font-weight:700;color:var(--primary);margin-bottom:3px}
.tcard .role2{color:var(--text-muted);font-size:.77rem;font-weight:600;margin-bottom:9px}
.tcard p{font-size:.79rem;color:var(--text-muted);line-height:1.72}

/* ═══════════════════════════════════════════════════
   تواصل معنا
═══════════════════════════════════════════════════ */
#contact{background:var(--surface)}
.contact-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:52px}
.contact-info h3{font-size:1.25rem;font-weight:900;color:var(--primary);margin-bottom:8px}
.contact-info>p{color:var(--text-muted);margin-bottom:26px;font-size:.92rem;line-height:1.82}
.ci-list{display:flex;flex-direction:column;gap:13px}
.ci-row{display:flex;align-items:flex-start;gap:12px}
.ci-ico{width:44px;height:44px;background:var(--primary);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0;color:#fff}
.ci-label{font-size:.8rem;color:var(--text-muted);font-weight:600}
.ci-val{font-size:.9rem;font-weight:700;color:var(--text);line-height:1.5}
.form-wrap{background:var(--bg);padding:26px;border-radius:var(--r);border:1px solid var(--border-lt);box-shadow:var(--sh-s);display:flex;flex-direction:column;gap:12px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fld{display:flex;flex-direction:column;gap:5px}
.fld label{font-size:.82rem;font-weight:700;color:var(--text)}
.fld input,.fld select,.fld textarea{padding:11px 13px;border:2px solid var(--border-lt);border-radius:var(--rs);font-family:var(--font);font-size:.9rem;color:var(--text);background:var(--surface);transition:border-color var(--t);direction:rtl;outline:none;width:100%}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--primary);background:#fff}
.fld textarea{resize:vertical;min-height:106px}
.form-submit{width:100%;padding:13px;background:var(--primary);color:#fff;border:none;border-radius:var(--rs);font-size:.96rem;font-weight:700;transition:var(--t);font-family:var(--font);display:flex;align-items:center;justify-content:center;gap:8px}
.form-submit:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,128,128,.26)}
.wa-hint{display:flex;align-items:center;gap:6px;font-size:.77rem;color:var(--text-muted);justify-content:center;margin-top:2px}
.wa-dot{width:8px;height:8px;background:#25D366;border-radius:50%;flex-shrink:0}

/* بطاقة الهدية */
.gift-card{display:flex;align-items:center;gap:22px;background:linear-gradient(135deg,var(--primary),var(--primary-dark));border-radius:var(--r);padding:26px 28px;margin-bottom:34px;box-shadow:var(--sh-m);flex-wrap:wrap}
.gift-ic{font-size:2.6rem;flex-shrink:0}
.gift-main{flex:1;min-width:240px}
.gift-main h3{color:#fff;font-size:1.12rem;font-weight:900;margin-bottom:6px}
.gift-main p{color:rgba(255,255,255,.86);font-size:.87rem;line-height:1.75;margin-bottom:14px}
.gift-btn{background:#fff;color:var(--primary-dark);border:none;border-radius:var(--rs);padding:12px 24px;font-size:.92rem;font-weight:900;font-family:var(--font);transition:var(--t);box-shadow:0 4px 14px rgba(0,0,0,.14)}
.gift-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.22)}
.gift-btn:disabled{background:rgba(255,255,255,.85);color:var(--primary);cursor:default}
.gift-code{display:flex;flex-direction:column;align-items:center;gap:4px;background:rgba(255,255,255,.14);border:1.5px dashed rgba(255,255,255,.5);border-radius:var(--r);padding:16px 26px;flex-shrink:0}
.gift-code-lbl{color:rgba(255,255,255,.82);font-size:.78rem;font-weight:700}
.gift-code-val{color:#fff;font-size:2.1rem;font-weight:900;letter-spacing:.32em;font-variant-numeric:tabular-nums;padding-right:.32em}
@media(max-width:768px){.gift-card{justify-content:center;text-align:center}.gift-main{text-align:center}.gift-code{width:100%}}

/* ═══════════════════════════════════════════════════
   شريط دعوة لاتخاذ إجراء (CTA)
═══════════════════════════════════════════════════ */
#cta-band{background:var(--primary);text-align:center}
#cta-band h2{color:#fff;font-size:clamp(1.5rem,3vw,2rem);font-weight:900;margin-bottom:10px}
#cta-band p{color:rgba(255,255,255,.82);margin-bottom:24px;font-size:.95rem;max-width:560px;margin-left:auto;margin-right:auto;line-height:1.8}
.cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
#cta-band .btn-light{background:#fff;color:var(--primary-dark);border-color:#fff}
#cta-band .btn-light:hover{background:var(--primary-xlt);transform:translateY(-2px)}

/* ═══════════════════════════════════════════════════
   نافذة الاستشارة العائمة (Modal)
═══════════════════════════════════════════════════ */
.modal-gift{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--primary-xlt);border:1.5px dashed var(--primary);border-radius:var(--r);padding:10px 18px}
.modal-gift-lbl{color:var(--primary-dark);font-size:.78rem;font-weight:700}
.modal-gift-val{color:var(--primary-dark);font-size:1.7rem;font-weight:900;letter-spacing:.32em;font-variant-numeric:tabular-nums;padding-right:.32em}
.modal-ov{position:fixed;inset:0;background:rgba(8,30,30,.55);z-index:1100;display:none;align-items:center;justify-content:center;padding:20px}
.modal-ov.op{display:flex}
.modal{background:#fff;border-radius:16px;padding:28px 26px;width:100%;max-width:430px;position:relative;box-shadow:var(--sh-l);display:flex;flex-direction:column;gap:12px;max-height:92vh;overflow-y:auto;animation:modal-in .28s ease}
@keyframes modal-in{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
.modal-x{position:absolute;top:12px;left:16px;background:none;border:none;color:var(--text-muted);font-size:1.6rem;line-height:1;cursor:pointer}
.modal-x:hover{color:var(--primary)}
.modal-head{text-align:center;margin-bottom:4px}
.modal-ic{font-size:2.4rem;display:block;margin-bottom:6px}
.modal-head h3{font-size:1.2rem;font-weight:900;color:var(--primary);margin-bottom:5px}
.modal-head p{font-size:.85rem;color:var(--text-muted);line-height:1.7}

/* ── زر للأعلى + تنبيه ── */
#go-top{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom));left:24px;width:44px;height:44px;background:var(--primary);color:#fff;border:2px solid rgba(255,255,255,.9);border-radius:50%;font-size:1.1rem;opacity:0;pointer-events:none;transition:var(--t);z-index:900;box-shadow:0 4px 16px rgba(0,0,0,.35)}
#go-top.show{opacity:1;pointer-events:auto}
#go-top:hover{transform:translateY(-3px)}
#toast{position:fixed;bottom:24px;right:24px;background:#1a1a1a;color:#fff;padding:13px 18px;border-radius:var(--rs);font-size:.87rem;box-shadow:var(--sh-l);border-right:4px solid var(--primary);transform:translateY(80px);opacity:0;transition:var(--t);z-index:9999;pointer-events:none;max-width:290px;line-height:1.55}
#toast.show{transform:translateY(0);opacity:1}

/* ═══════════════════════════════════════════════════
   الفوتر
═══════════════════════════════════════════════════ */
footer{background:#1a1a1a;padding:56px 0 0}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:40px;margin-bottom:38px}
.foot-brand .fn{font-size:1.08rem;font-weight:900;color:#fff;margin-bottom:2px}
.foot-brand .fs{font-size:.68rem;color:rgba(0,200,200,.8);margin-bottom:11px}
.foot-brand .fd{font-size:.81rem;color:rgba(255,255,255,.52);line-height:1.82}
.foot-col-title{color:rgba(0,200,200,.9);font-size:.88rem;font-weight:700;margin-bottom:14px;padding-bottom:7px;border-bottom:2px solid var(--primary);display:inline-block}
.foot-links{display:flex;flex-direction:column;gap:8px}
.foot-links a{color:rgba(255,255,255,.57);font-size:.8rem;transition:var(--t)}
.foot-links a:hover{color:rgba(0,200,200,.9);padding-right:5px}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding:16px 0 92px;display:flex;align-items:center;justify-content:space-between;font-size:.75rem;color:rgba(255,255,255,.33)}
.foot-bottom a{color:rgba(0,200,200,.7)}

/* ── تحريك عند التمرير ── */
.anim{opacity:0;transform:translateY(26px);transition:opacity .6s ease,transform .6s ease}
.anim.in{opacity:1;transform:translateY(0)}
.stag>*{opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease}
.stag.in>*{opacity:1;transform:translateY(0);transition-delay:.41s}
.stag.in>*:nth-child(1){transition-delay:.05s}
.stag.in>*:nth-child(2){transition-delay:.11s}
.stag.in>*:nth-child(3){transition-delay:.17s}
.stag.in>*:nth-child(4){transition-delay:.23s}
.stag.in>*:nth-child(5){transition-delay:.29s}
.stag.in>*:nth-child(6){transition-delay:.35s}
.stag.in>*:nth-child(7){transition-delay:.41s}
.stag.in>*:nth-child(8){transition-delay:.47s}
.stag.in>*:nth-child(9){transition-delay:.53s}
.stag.in>*:nth-child(10){transition-delay:.59s}
.stag.in>*:nth-child(11){transition-delay:.65s}
.stag.in>*:nth-child(12){transition-delay:.71s}

.fld input[dir="ltr"]{direction:ltr;text-align:right;unicode-bidi:embed}

/* ── Responsive ── */
@media(max-width:1024px){.why-grid{grid-template-columns:repeat(3,1fr)}.foot-grid{grid-template-columns:1fr 1fr;gap:24px}}
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr}.hero-panel{display:none}#stats{display:block}.stats-row{grid-template-columns:repeat(2,1fr)}.s-cell{border:none;border-bottom:1px solid rgba(255,255,255,.15)}
  .logo-wall{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:768px){
  section{padding:60px 0;scroll-margin-top:160px}
  .page-top{padding-top:185px}
  /* شريط تنقل متعدد الصفوف: كل الروابط والزر ظاهرة بلا قائمة جانبية */
  .hbg{display:none}
  .nav-in{flex-wrap:wrap;justify-content:center;row-gap:6px}
  .nav-brand{width:100%;justify-content:center}
  .nav-brand .n2{display:none}
  .nav-logo{width:36px;height:36px}
  .nav-links{flex-wrap:wrap;justify-content:center;gap:4px 14px}
  .nav-links a{font-size:.8rem}
  .nav-cta-btn{margin:0;padding:6px 14px;font-size:.75rem}
  .about-grid{grid-template-columns:1fr;gap:24px}
  .prin-grid{grid-template-columns:1fr 1fr}
  .sect-grid{grid-template-columns:1fr 1fr}
  .flyers-grid{grid-template-columns:1fr;max-width:420px;margin:0 auto}
  .srv-grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:1fr 1fr}
  .leader-card{grid-template-columns:1fr;text-align:center;gap:14px}.av-big{margin:0 auto}
  .team-grid{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr;gap:28px}
  .f2{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .foot-bottom{flex-direction:column;gap:5px;text-align:center}
  .hero-content{padding:170px 24px 60px}
  .hero-btns{flex-direction:column;align-items:stretch}
  .hero-btns .btn{width:100%;justify-content:center;padding:14px 20px;font-size:.98rem}
}
@media(max-width:480px){.prin-grid{grid-template-columns:1fr}.team-grid{grid-template-columns:1fr}.why-grid{grid-template-columns:1fr 1fr}}

/* ── الأجهزة الحديثة: آيفون 14/15/16 (390–430px) وما يعادلها سامسونج جالكسي (360–412px) ── */
@media(max-width:440px){
  .w{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
  section{padding:52px 0}
  .hero-content{padding:166px 20px 52px}
  .hero-h{font-size:clamp(1.72rem,8vw,2.1rem);line-height:1.32}
  .hero-badge{font-size:.76rem;padding:6px 14px}
  .hero-p{font-size:.9rem}
  .sect-grid{grid-template-columns:1fr;gap:13px}
  .sect-card{padding:20px 18px}
  .why-grid{grid-template-columns:1fr}
  .logo-wall{grid-template-columns:repeat(2,1fr)}
  .trust-badge{font-size:.8rem;padding:8px 14px}
  h2.sh{font-size:clamp(1.42rem,6vw,1.8rem)}
  .s-num{font-size:2.2rem}
}
/* الأجهزة الأصغر: جالكسي S الأساسية (≤360px) */
@media(max-width:360px){
  .hero-h{font-size:1.6rem}
  .stats-row{grid-template-columns:1fr 1fr}
  .prin-grid,.team-grid{grid-template-columns:1fr}
}
