/* ==========================================================================
   شراب الوصل — الأساس المشترك: توكنز + هيدر/فوتر/شريط سفلي/أزرار/زجاج/حركات
   (الـ @font-face تُحقن وقت البناء مكان العلامة التالية)
   ========================================================================== */
@font-face{font-family:'Amiri';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/amiri-latin-400.034ef8ba.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Amiri';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/amiri-latin-700.3c577e3e.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-latin-300.46c285ae.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-latin-400.4767e119.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-latin-500.80ebc672.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-latin-600.f417eeb0.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Amiri';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/amiri-arabic-400.b640f7cc.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'Amiri';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/amiri-arabic-700.bb99562a.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:300;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-arabic-300.72a7a96a.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-arabic-400.4fa3d81d.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-arabic-500.10689221.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/ibm-plex-sans-arabic-arabic-600.64891a81.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
/* خط العنوان — منفصل عمداً */
@font-face{font-family:'DecoType Thuluth II';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/title-thuluth.b6590d08.woff2) format('woff2')}

:root{
  /* ألوان «ج - ضوء» */
  --bg-1:#355A50; --bg-2:#294840; --bg-3:#1D3731; --bg-4:#16302A; --bg-5:#244139; --bg-6:#203c35;
  --gold:#F2C75A; --gold-hi:#F8D878; --ivory:#F7ECD2; --ivory-hi:#FFF4D6; --sand:#D9CDAE; --ink:#14221F;
  --line:rgba(247,236,210,.15); --line-soft:rgba(247,236,210,.12); --line-gold:rgba(242,199,90,.6);
  --glass:rgba(255,248,230,.1); --glass-deep:rgba(29,55,49,.78);
  /* الحواف والظلال */
  --r-xl:40px; --r-lg:28px; --r-md:22px; --r-pill:999px;
  --shadow-pop:0 30px 70px rgba(0,0,0,.35),0 0 50px rgba(242,199,90,.15);
  --shadow-soft:0 20px 60px rgba(0,0,0,.3);
  /* الخطوط */
  --f-ui:'IBM Plex Sans Arabic',system-ui,-apple-system,'Segoe UI',Tahoma,sans-serif;
  --f-verse:'Amiri','Noto Naskh Arabic','Traditional Arabic',serif;
  --f-title:'DecoType Thuluth II','Aref Ruqaa','Amiri','Traditional Arabic',serif;
  /* حركة ومقاسات */
  --ease:cubic-bezier(.2,.6,.2,1); --ease-slow:cubic-bezier(.6,.04,.12,.96);
  --max:1280px; --gut:24px; --header-h:60px; --bar-h:74px;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg-3);scroll-behavior:smooth}
body{margin:0;background:var(--bg-3);color:var(--ivory);font-family:var(--f-ui);font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
img,svg,video{display:block;max-width:100%}
h1,h2,h3,h4,p,figure,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
::selection{background:rgba(242,199,90,.35);color:var(--ivory-hi)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;top:-100px;right:12px;z-index:200;background:var(--gold);color:var(--ink);padding:12px 22px;border-radius:var(--r-pill);font-weight:500;transition:top .2s}
.skip:focus{top:12px}

.site{position:relative;background:linear-gradient(180deg,var(--bg-1) 0%,var(--bg-2) 35%,var(--bg-3) 100%);overflow-x:hidden;overflow-x:clip;min-height:100vh}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
@media (min-width:861px){.m-only{display:none!important}}
@media (max-width:860px){.d-only{display:none!important}}

/* ---------- زجاج ---------- */
.glass{background:var(--glass);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid var(--line)}
.glass-deep{background:var(--glass-deep);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);border:1px solid rgba(247,236,210,.14)}

/* ---------- نصوص مشتركة ---------- */
.eyebrow{font-size:14px;letter-spacing:3px;color:var(--gold)}
.h2{font-family:var(--f-verse);font-weight:400;font-size:clamp(38px,4.4vw,60px);line-height:1.5;color:var(--ivory-hi)}
.muted{color:var(--sand)}
.star-i{display:inline-block;flex:none}

/* ---------- أزرار ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 26px;border-radius:var(--r-pill);border:1px solid transparent;font-size:16px;font-weight:500;line-height:1;cursor:pointer;white-space:nowrap;transition:background .5s var(--ease),transform .5s var(--ease),border-color .5s,color .5s}
.btn-gold{background:var(--gold);color:var(--ink)}
.btn-gold:hover{background:var(--gold-hi);transform:translateY(-2px)}
.btn-ghost{border-color:rgba(242,199,90,.6);color:var(--gold);background:rgba(22,48,42,.35)}
.btn-ghost:hover{background:rgba(242,199,90,.16);border-color:rgba(242,199,90,.9)}
.btn-line{border-color:rgba(247,236,210,.3);color:var(--ivory);background:rgba(22,48,42,.35)}
.btn-line:hover{background:rgba(242,199,90,.14);border-color:rgba(242,199,90,.6)}
.btn-glass{background:var(--glass);border-color:var(--line);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}
.btn-glass:hover{background:rgba(242,199,90,.14);border-color:rgba(242,199,90,.6)}
.btn-sm{height:42px;padding:0 18px;font-size:15px;font-weight:400}
.round-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(247,236,210,.25);background:transparent;color:var(--ivory);transition:background .6s,color .6s,border-color .6s}
@media (hover:hover){.round-btn:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}}
.pill{transition:background .5s,border-color .5s,color .5s}
.pill:hover{background:rgba(242,199,90,.14);border-color:rgba(242,199,90,.6)}
.press{transition:transform .25s ease,background .3s,border-color .3s,color .3s}
.press:active{transform:scale(.97)}
.foot-link{color:var(--sand);transition:color .4s}
.foot-link:hover{color:var(--gold)}
.go{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(242,199,90,.6);color:var(--gold);background:transparent;transition:transform .6s,background .6s,color .6s}
.card-lift{transition:transform .6s var(--ease),box-shadow .6s,border-color .6s,opacity .6s}
.card-lift:hover{transform:translateY(-8px);border-color:rgba(242,199,90,.6);box-shadow:var(--shadow-pop)}
.card-lift:hover .go,.go:hover{background:var(--gold);color:var(--ink)}

/* ---------- الهيدر ---------- */
.site-header{position:relative;z-index:20;padding:22px var(--gut) 0}
.hero-top .site-header{position:absolute;top:0;right:0;left:0}
.hdr{position:relative;max-width:var(--max);margin:0 auto;border-radius:var(--r-lg);padding:10px 18px 10px 26px;display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--glass);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--f-verse);font-size:26px;font-weight:700;line-height:1.4;color:var(--gold)}
.nav{display:flex;gap:30px}
.nav-item{position:static}
.hero-top .hdr{background:rgba(22,48,42,.52);border-color:rgba(247,236,210,.2)}
.nav-btn{display:inline-block;color:var(--ivory);font-size:16px;padding:12px 4px;opacity:.85;border-bottom:2px solid transparent;transition:opacity .6s,border-color .6s,color .6s}
.nav-item:hover .nav-btn,.nav-item:focus-within .nav-btn,.nav-btn:focus-visible{opacity:1;color:var(--gold);border-color:var(--gold)}
.nav-btn[aria-current="page"]{opacity:1;color:var(--gold);border-color:var(--gold)}
.mega{position:absolute;top:calc(100% + 10px);right:0;left:0;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .6s var(--ease-slow),transform .6s var(--ease-slow),visibility .6s;border-radius:var(--r-lg);padding:36px 40px;background:rgba(22,48,42,.95);box-shadow:0 40px 90px rgba(0,0,0,.4)}
.nav-item:hover .mega,.nav-item:focus-within .mega{opacity:1;visibility:visible;transform:translateY(0)}
.mega-in{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start}
.mega-intro{flex:0 0 220px;display:flex;flex-direction:column;gap:12px}
.mega-intro b{font:400 38px/1.4 var(--f-verse);color:var(--ivory-hi)}
.mega-intro i{display:block;width:48px;height:2px;background:var(--gold)}
.mega-intro span{font-size:14px;line-height:1.9;color:var(--sand)}
.mega-links{flex:0 0 200px;display:flex;flex-direction:column;gap:14px;font-size:16px}
.mega-link{color:var(--sand);transition:color .4s}
.mega-link:hover{color:var(--ivory-hi)}
.mega-tiles{flex:1;min-width:300px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.tile{border:1px solid rgba(247,236,210,.18);border-radius:20px;padding:22px 12px;display:flex;flex-direction:column;align-items:center;gap:12px;font-size:14px;transition:background .4s,border-color .4s}
.tile:hover{background:rgba(242,199,90,.12);border-color:rgba(242,199,90,.6)}
.hdr-tools{display:flex;align-items:center;gap:10px}
.hdr-cta{height:44px;padding:0 24px;font-size:15px}
.menu-btn{display:none}
.js .menu-btn{display:none}

/* ---------- الشريط السفلي + القائمة الكاملة (موبايل) ---------- */
.bottom-nav{display:none}
.m-menu{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;padding:12px 18px 30px;background:rgba(22,48,42,.96);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);animation:veil .4s ease both;overflow-y:auto}
.m-menu-top{display:flex;align-items:center;justify-content:space-between;height:48px}
.m-menu-top .brand{font-size:21px}
.m-menu nav{display:flex;flex-direction:column;margin-top:24px}
.m-menu nav a{display:flex;align-items:center;justify-content:space-between;padding:16px 4px;border-bottom:1px solid rgba(247,236,210,.1)}
.m-menu nav a b{display:block;font:400 28px/1.4 var(--f-verse);color:var(--ivory-hi)}
.m-menu nav a span{display:block;font-size:13px;color:var(--sand)}
.m-menu-star{margin-top:auto;padding-top:24px;display:flex;justify-content:center;opacity:.5}
body.menu-open{overflow:hidden}

/* ---------- الفوتر ---------- */
.site-footer{position:relative;background:var(--bg-4);border-top:1px solid rgba(242,199,90,.2)}
.ft-in{max-width:var(--max);margin:0 auto;padding:72px var(--gut) 56px;display:flex;flex-direction:column;gap:56px}
.ft-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px}
.ft-brand{display:flex;flex-direction:column;gap:16px}
.ft-brand .brand{font-size:30px}
.ft-brand p{font-size:14px;line-height:1.9;color:var(--sand)}
.ft-col{display:flex;flex-direction:column;gap:14px;font-size:15px}
.ft-col>b{font-weight:500;color:var(--ivory-hi)}
.ft-base{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;padding-top:24px;border-top:1px solid var(--line-soft);font-size:13px;color:var(--sand)}

/* ---------- حركات مشتركة ---------- */
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes veil{from{opacity:0}to{opacity:1}}
@keyframes sheet{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes drift-a{0%{transform:translate(0,0) scale(1)}50%{transform:translate(8%,6%) scale(1.15)}100%{transform:translate(0,0) scale(1)}}
@keyframes drift-b{0%{transform:translate(0,0) scale(1.1)}50%{transform:translate(-9%,-5%) scale(.95)}100%{transform:translate(0,0) scale(1.1)}}
@keyframes slide{from{transform:translate(0,0)}to{transform:translate(100px,100px)}}
@keyframes par-1{from{transform:translateY(0)}to{transform:translateY(280px)}}
@keyframes par-2{from{transform:translateY(0)}to{transform:translateY(140px)}}
@keyframes par-3{from{transform:translateY(-60px)}to{transform:translateY(60px)}}
.r1{animation:rise .8s var(--ease) .1s both}
.r2{animation:rise .8s var(--ease) .25s both}
.r3{animation:rise .8s var(--ease) .4s both}
.r4{animation:rise .8s var(--ease) .55s both}
.orb-a{animation:drift-a 22s ease-in-out infinite}
.orb-b{animation:drift-b 28s ease-in-out infinite}
.slide{animation:slide 90s linear infinite}
@supports (animation-timeline:view()){
  .reveal{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 50%}
  .par-1{animation:par-1 linear both;animation-timeline:scroll(root);animation-range:0px 1100px}
  .par-2{animation:par-2 linear both;animation-timeline:scroll(root);animation-range:0px 1100px}
  .par-3{animation:par-3 linear both;animation-timeline:view()}
}

/* ---------- موبايل (نقطة التحوّل 860px) ---------- */
@media (max-width:860px){
  :root{--gut:18px}
  .glass{background:rgba(255,248,230,.08);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
  .glass-deep{background:rgba(22,48,42,.82);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}
  .site-header,.hero-top .site-header{position:sticky;top:0;z-index:30;height:var(--header-h);padding:8px 12px 0}
  .hero-top .site-header{margin-bottom:calc(var(--header-h)*-1)}
  .hero-top .hdr,.hdr{height:48px;border-radius:24px;padding:0 4px 0 10px;background:transparent;border-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background .5s,border-color .5s}
  .site-header.is-scrolled .hdr{background:rgba(29,55,49,.86);border-color:rgba(247,236,210,.14);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
  .brand{font-size:21px;gap:8px}
  .nav,.hdr-cta{display:none}
  .hdr-tools{gap:4px}
  .hdr-tools .round-btn{border-color:transparent}
  .js .menu-btn{display:inline-flex}
  .bottom-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;right:0;left:0;bottom:0;z-index:45;height:var(--bar-h);padding:6px 6px calc(14px + env(safe-area-inset-bottom,0px));border-radius:0;border-width:1px 0 0;border-top:1px solid var(--line-soft);background:rgba(22,48,42,.9)}
  .bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:44px;color:var(--sand);font-size:12px}
  .bottom-nav a[aria-current="page"]{color:var(--gold);font-weight:500}
  .site-footer{margin-top:44px}
  .ft-in{padding:44px var(--gut) calc(120px + env(safe-area-inset-bottom,0px));gap:22px}
  .ft-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
  .ft-brand{grid-column:1/-1;gap:6px}
  .ft-brand .brand{font-size:24px}
  .ft-brand p{font-size:13px;line-height:1.8}
  .ft-col{display:contents}
  .ft-col>b{display:none}
  .ft-col a{padding:10px 0;color:var(--ivory);font-size:15px}
  .ft-col a:hover{color:var(--gold)}
  .ft-base{padding-top:18px;font-size:12px}
  .ft-base span+span{display:none}
  .orb-a,.orb-b{animation:none;filter:none!important}
  .slide{animation:none}
  .par-1,.par-2,.par-3{animation:none!important}
}

/* ---------- تقليل الحركة ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media print{.site-header,.bottom-nav,.m-menu,.site-footer{display:none!important}}

/* ---------- 404 ---------- */
.nf{padding-top:80px;padding-bottom:40px;display:flex;justify-content:center}
.nf-in{max-width:620px;width:100%;border-radius:var(--r-xl);padding:56px 36px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:18px}
.nf-in h1{font:700 clamp(34px,5vw,52px)/1.4 var(--f-verse);color:var(--ivory-hi)}
.nf-in p{color:var(--sand);line-height:2;max-width:440px}
.nf-act{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:8px}
