/* ===========================================================
   أثر | ATHAR — نظام التصميم v3 «الأقواس»
   الفكرة: قوسا الشعار يتمددان كموجات أثر. كل عنصر مميّز في الموقع
   (النمط، الهيرو، البطاقات) مبني من القوس.
   الألوان والمسافات في أعلى الملف فقط.
   =========================================================== */
:root{
  --navy:#10253D; --navy-2:#0B1B2E; --gold:#D7B678; --gold-2:#E6CB97;
  --off:#F5F4F0; --paper:#FBFAF7; --slate:#566373; --teal:#3E8E87; --teal-2:#2F736D;
  --line-l:rgba(16,37,61,.14); --line-d:rgba(245,244,240,.2);
  --r:4px;
  --sp1:8px;--sp2:16px;--sp3:24px;--sp4:32px;--sp5:48px;--sp6:64px;--sp7:96px;--sp8:128px;
  --gutter:clamp(20px,5vw,72px); --max:1280px;
  --ease:cubic-bezier(.2,.7,.2,1); --t1:.25s; --t2:.5s; --t3:.9s;
  --f-head:'Noto Kufi Arabic','IBM Plex Sans Arabic',sans-serif;
  --f-body:'IBM Plex Sans Arabic','Noto Kufi Arabic',sans-serif;
  --f-en:'Montserrat','IBM Plex Sans Arabic',sans-serif;
  --h1:clamp(2.6rem,6.2vw,5.6rem); --h2:clamp(1.9rem,3.6vw,3rem); --h3:clamp(1.25rem,1.8vw,1.6rem);
  --lead:clamp(1.1rem,1.35vw,1.28rem);
  --tile:120px;
}
@media (prefers-reduced-motion:reduce){:root{--t1:0s;--t2:0s;--t3:0s}}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--off);color:var(--navy);font-family:var(--f-body);font-size:1.075rem;line-height:1.9;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,ul{margin:0}
ul{padding:0;list-style:none}
h1,h2,h3{font-family:var(--f-head);font-weight:700;line-height:1.3}
h1{font-size:var(--h1)} h2{font-size:var(--h2)} h3{font-size:var(--h3)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.skip{position:absolute;top:-60px;inset-inline-start:16px;background:var(--gold);color:var(--navy);padding:10px 18px;z-index:200;transition:top .2s}
.skip:focus{top:12px}
.en{font-family:var(--f-en);letter-spacing:.08em}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-family:var(--f-en);font-weight:600;font-size:.75rem;letter-spacing:.24em;color:var(--slate);display:flex;align-items:center;gap:14px;margin-bottom:var(--sp2)}
.eyebrow::before{content:"";width:32px;height:1px;background:currentColor}
.bg-navy .eyebrow,.hero .eyebrow,.band .eyebrow{color:var(--gold)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* حلقة التركيز: ذهبية على الداكن، كحلية على الفاتح (الذهبي على الأبيض ضعيف التباين) */
.bg-light :focus-visible,.bg-paper :focus-visible{outline-color:var(--navy)}
main:focus{outline:0}

/* ---------- الخلفيات + النمط (متصل عبر background-attachment:fixed) ---------- */
.sec{position:relative;padding-block:clamp(72px,10vw,136px);isolation:isolate}
.bg-light{background:var(--off)} .bg-paper{background:var(--paper)}
.bg-navy{background:var(--navy);color:var(--off)}
.sec::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url(../img/arch-navy.svg) 0 0/var(--tile) var(--tile) fixed;opacity:.16}
.bg-navy::before{background-image:url(../img/arch-gold.svg);opacity:.2}
/* تلاشٍ لطيف للنمط نحو منتصف القسم ليبقى النص مقروءاً */
.sec.fade::before{-webkit-mask-image:linear-gradient(180deg,#000,rgba(0,0,0,.25) 55%,#000);mask-image:linear-gradient(180deg,#000,rgba(0,0,0,.25) 55%,#000)}
/* طبقة التوهج: نفس النمط بالذهب يظهر حول المؤشر، داخل كل قسم وتحت محتواه */
.gl{position:absolute;inset:0;z-index:-1;pointer-events:none;background:url(../img/arch-glow.svg) 0 0/var(--tile) var(--tile) fixed;opacity:.85;
  -webkit-mask-image:radial-gradient(240px circle at var(--gx,-999px) var(--gy,-999px),#000,transparent 70%);mask-image:radial-gradient(240px circle at var(--gx,-999px) var(--gy,-999px),#000,transparent 70%)}
.sec>.wrap,.hero>.wrap,.band>.wrap{position:relative;z-index:2}
@media (prefers-reduced-motion:reduce){.gl{display:none}}

/* ---------- الرأس ---------- */
.hdr{position:fixed;top:0;inset-inline:0;z-index:60;transition:background var(--t2),backdrop-filter var(--t2),box-shadow var(--t2),padding var(--t2);padding-block:22px;color:var(--off)}
.hdr.scrolled{background:rgba(11,27,46,.95);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);padding-block:12px;box-shadow:0 1px 0 rgba(245,244,240,.08)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px}
.brand svg{width:44px;height:44px;transition:transform var(--t3) var(--ease)}
.brand:hover svg{transform:translateY(-3px)}
.brand .w{display:flex;flex-direction:column;line-height:1.1}
.brand b{font-family:var(--f-head);font-size:1.6rem;font-weight:700}
.brand small{font-family:var(--f-en);font-size:.62rem;letter-spacing:.34em;opacity:.75;margin-top:4px}
.nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px);font-size:.98rem}
.nav a:not(.btn){position:relative;padding-block:6px;opacity:.88;transition:opacity var(--t1)}
.nav a:not(.btn)::after{content:"";position:absolute;inset-inline:0;bottom:0;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform var(--t2) var(--ease)}
.nav a:not(.btn):hover,.nav a[aria-current]{opacity:1}
.nav a:not(.btn):hover::after,.nav a[aria-current]::after{transform:scaleX(1)}
.nav .btn{padding:10px 20px;font-size:.92rem}
.burger{display:none;background:none;border:0;color:inherit;width:44px;height:44px;cursor:pointer;position:relative;z-index:80}
.burger i{position:absolute;inset-inline:10px;height:2px;background:currentColor;transition:transform var(--t2) var(--ease),opacity var(--t1)}
.burger i:nth-child(1){top:15px}.burger i:nth-child(2){top:21px}.burger i:nth-child(3){top:27px}
.menu-open .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-open .burger i:nth-child(2){opacity:0}
.menu-open .burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:58;background:var(--navy);color:var(--off);display:flex;flex-direction:column;justify-content:center;gap:4px;padding:100px var(--gutter) 48px;clip-path:circle(0 at calc(100% - 40px) 40px);visibility:hidden;transition:clip-path .7s var(--ease),visibility 0s .7s}
.drawer::before{content:"";position:absolute;inset:0;z-index:-1;background:url(../img/arch-gold.svg) 0 0/var(--tile) fixed;opacity:.18}
.menu-open .drawer{clip-path:circle(150% at calc(100% - 40px) 40px);visibility:visible;transition:clip-path .7s var(--ease),visibility 0s}
.drawer a{font-family:var(--f-head);font-size:clamp(1.7rem,7vw,2.4rem);padding:10px 0;border-bottom:1px solid var(--line-d);opacity:0;transform:translateY(16px);transition:opacity .5s,transform .5s var(--ease),color var(--t1)}
.menu-open .drawer a{opacity:1;transform:none}
.menu-open .drawer a:nth-child(1){transition-delay:.15s}.menu-open .drawer a:nth-child(2){transition-delay:.2s}.menu-open .drawer a:nth-child(3){transition-delay:.25s}.menu-open .drawer a:nth-child(4){transition-delay:.3s}.menu-open .drawer a:nth-child(5){transition-delay:.35s}
.drawer a:hover{color:var(--gold)}
@media(max-width:900px){.nav{display:none}.burger{display:block}}

/* ---------- الأزرار ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:14px;padding:16px 28px;border:1px solid var(--navy);background:var(--navy);color:var(--off);font-family:var(--f-body);font-weight:500;font-size:1rem;line-height:1.2;border-radius:var(--r);cursor:pointer;overflow:hidden;isolation:isolate;transition:color var(--t2) var(--ease),transform var(--t2) var(--ease),box-shadow var(--t2) var(--ease)}
.btn::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--gold);transform:translateX(101%);transition:transform var(--t2) var(--ease)}
.btn .ar{display:inline-block;transition:transform var(--t2) var(--ease)}
.btn:hover{color:var(--navy);transform:translateY(-2px);box-shadow:0 12px 26px rgba(16,37,61,.2)}
.btn:hover::before{transform:none}
.btn:hover .ar{transform:translateX(-6px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn.gold,.hero .btn:not(.line),.band .btn:not(.line),.bg-navy .btn:not(.line){background:var(--gold);border-color:var(--gold);color:var(--navy)}
.btn.gold::before,.hero .btn:not(.line)::before,.band .btn:not(.line)::before,.bg-navy .btn:not(.line)::before{background:var(--off)}
.btn.line,.bg-navy .btn.line{background:transparent;color:inherit;border-color:currentColor}
.btn.line::before{background:var(--gold)}
.btn.line:hover{color:var(--navy);border-color:var(--gold)}
.lnk{position:relative;display:inline-flex;align-items:center;gap:10px;padding-block:6px;font-weight:500}
.lnk::after{content:"";position:absolute;inset-inline:0;bottom:0;height:1px;background:currentColor;transform:scaleX(.3);transform-origin:right;transition:transform var(--t2) var(--ease)}
.lnk:hover::after{transform:scaleX(1)}
.lnk .ar{transition:transform var(--t2) var(--ease)} .lnk:hover .ar{transform:translateX(-8px)}

/* ---------- الهيرو: قوسا الشعار يتمددان ---------- */
.hero{position:relative;min-height:max(100vh,640px);min-height:max(100svh,640px);background:var(--navy);color:var(--off);display:flex;align-items:center;overflow:hidden;isolation:isolate;padding-top:110px}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background:url(../img/arch-gold.svg) 0 0/var(--tile) fixed;opacity:.2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(900px 600px at 25% 55%,rgba(215,182,120,.14),transparent 70%),linear-gradient(270deg,var(--navy) 0,rgba(16,37,61,.94) 38%,rgba(16,37,61,.35) 100%)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:var(--sp5)}
.hero-copy .eyebrow{opacity:0;animation:fade .8s .3s forwards}
.hero h1{font-size:clamp(2.7rem,5.8vw,5.4rem);line-height:1.25}
.hero h1 .ln{display:block;overflow:hidden;padding-block:.08em}
.hero h1 .ln>span{display:block;transform:translateY(110%);animation:up 1s var(--ease) forwards}
.hero h1 .ln:nth-child(1)>span{animation-delay:.45s}.hero h1 .ln:nth-child(2)>span{animation-delay:.6s}
.hero h1 .gold{color:var(--gold)}
.hero .lead{margin-top:var(--sp3);max-width:30em;color:rgba(245,244,240,.84);font-size:var(--lead);opacity:0;animation:fade .9s 1.1s forwards}
.hero .acts{margin-top:var(--sp4);display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;opacity:0;animation:fade .9s 1.3s forwards}
.hero-foot{position:absolute;bottom:28px;inset-inline:0;z-index:3}
.hero-foot .wrap{display:flex;justify-content:space-between;align-items:center;font-family:var(--f-en);font-size:.68rem;letter-spacing:.26em;color:rgba(245,244,240,.62);padding-inline-end:calc(var(--gutter) + 72px)}
.scrollcue{display:flex;align-items:center;gap:14px}
.scrollcue::before{content:"";width:1px;height:40px;background:linear-gradient(var(--gold),transparent);animation:drip 2.4s ease-in-out infinite;transform-origin:top}
@keyframes up{to{transform:none}} @keyframes fade{to{opacity:1}}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}

.portal{position:relative;justify-self:center;width:min(100%,560px);aspect-ratio:200/116}
.portal svg{width:100%;height:100%;overflow:visible}
.portal .ring{fill:none;stroke:var(--gold);stroke-linecap:round;stroke-width:1.4;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2s var(--ease) forwards,breathe 6s ease-in-out infinite;animation-delay:calc(.5s + var(--i)*.18s),calc(2.6s + var(--i)*.55s)}
.portal .core{opacity:0;animation:fade 1s .3s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes breathe{0%,100%{stroke-opacity:var(--o)}45%{stroke-opacity:1}}
@media(max-width:900px){
  .hero{padding-top:96px;align-items:flex-start}
  .hero .wrap{grid-template-columns:1fr;gap:var(--sp3);padding-block:var(--sp4) 96px}
  .portal{order:-1;width:min(70vw,300px);justify-self:start}
  .hero-foot{display:none}
}

/* ---------- شريط عنوان الصفحات الداخلية ---------- */
.band{position:relative;background:var(--navy);color:var(--off);overflow:hidden;isolation:isolate;padding:clamp(130px,16vw,190px) 0 clamp(56px,8vw,96px)}
.band::before{content:"";position:absolute;inset:0;z-index:-2;background:url(../img/arch-gold.svg) 0 0/var(--tile) fixed;opacity:.2}
.band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(270deg,rgba(16,37,61,.96) 0,rgba(16,37,61,.7) 55%,rgba(16,37,61,.15))}
.band h1{font-size:clamp(2.3rem,5vw,4.2rem);max-width:16em}
.band .lead{margin-top:var(--sp3);max-width:34em;color:rgba(245,244,240,.88);font-size:var(--lead)}
.band .mini-portal{position:absolute;inset-inline-end:var(--gutter);bottom:-2px;width:clamp(120px,18vw,240px);opacity:.9;z-index:1}
.band .mini-portal path{fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linecap:round}
@media(max-width:700px){.band .mini-portal{opacity:.45}}

/* ---------- كتل المحتوى ---------- */
.stmt{font-family:var(--f-head);font-weight:700;font-size:clamp(1.9rem,4.4vw,3.8rem);line-height:1.5}
.stmt .w{opacity:.18;transition:opacity .5s}
.stmt .w.on{opacity:1}
.stmt b{color:var(--gold);font-weight:700}
.bg-light .stmt b,.bg-paper .stmt b{color:var(--navy);background:linear-gradient(var(--gold),var(--gold)) 0 92%/100% .14em no-repeat}
.split{display:grid;grid-template-columns:1fr 1.1fr;gap:var(--sp6);align-items:start}
@media(max-width:860px){.split{grid-template-columns:1fr;gap:var(--sp4)}}
.muted{color:var(--slate)} .bg-navy .muted{color:rgba(245,244,240,.82)}
.lead{font-size:var(--lead);line-height:1.95}
.head{margin-bottom:clamp(40px,6vw,72px)}
.head p{margin-top:var(--sp2);max-width:36em}

/* بطاقات القوس: صورة النافذة المقوّسة */
.arches{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp4)}
@media(max-width:820px){.arches{grid-template-columns:1fr}}
.arch-card{position:relative;display:flex;flex-direction:column;gap:var(--sp2);padding:clamp(120px,14vw,170px) clamp(24px,4vw,48px) var(--sp5);border:1px solid var(--line-d);border-radius:min(260px,40%) min(260px,40%) var(--r) var(--r);background:rgba(11,27,46,.55);backdrop-filter:blur(2px);overflow:hidden;transition:transform var(--t3) var(--ease),border-color var(--t2),background var(--t2)}
.arch-card.teal{background:rgba(47,115,109,.9);border-color:rgba(245,244,240,.3)}
.arch-card svg.mk{position:absolute;top:0;inset-inline:0;margin-inline:auto;width:150px;height:130px;pointer-events:none}
.arch-card svg.mk path{fill:none;stroke:var(--gold);stroke-width:1.3;stroke-linecap:round;opacity:.35;transition:opacity var(--t2),transform var(--t3) var(--ease);transform-origin:50% 100%;transform-box:fill-box}
.arch-card.teal svg.mk path{stroke:var(--off)}
a.arch-card:hover,a.arch-card:focus-visible{transform:translateY(-8px);border-color:var(--gold)}
a.arch-card:hover svg.mk path,a.arch-card:focus-visible svg.mk path{opacity:1}
a.arch-card:hover svg.mk path:nth-child(2){transform:scale(1.12)}a.arch-card:hover svg.mk path:nth-child(3){transform:scale(1.26)}
.arch-card .tag{font-family:var(--f-en);font-size:.72rem;letter-spacing:.26em;color:var(--gold)}
.arch-card.teal .tag{color:var(--off)}
.arch-card h3{font-size:clamp(1.6rem,2.6vw,2.1rem)}
.arch-card p{opacity:.86;flex:1}
.arch-card .lnk{align-self:flex-start;margin-top:var(--sp1)}

/* مسار النمو: أقواس تكبر */
.grow{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp4);align-items:end}
@media(max-width:820px){.grow{grid-template-columns:1fr;gap:var(--sp5)}}
.grow li{position:relative;padding-top:var(--sp3)}
.grow .arc{display:block;margin-bottom:var(--sp3);color:var(--navy)}
.grow .arc path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--ease)}
.grow li.in .arc path{stroke-dashoffset:0}
.grow li:nth-child(1) .arc{width:56px}.grow li:nth-child(2) .arc{width:96px}.grow li:nth-child(3) .arc{width:140px}
@media(max-width:820px){.grow li .arc{width:var(--w,80px)!important}}
.grow .num,.num{font-family:var(--f-en);font-size:.75rem;letter-spacing:.2em;color:var(--slate)}
.grow h3{margin-top:6px} .grow p{margin-top:8px;color:var(--slate)}

/* شبكة خطوط رفيعة (القيم) */
.cells{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-l);border-inline-start:1px solid var(--line-l)}
@media(max-width:820px){.cells{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.cells{grid-template-columns:1fr}}
.cells li{position:relative;padding:var(--sp5) var(--sp4);border-bottom:1px solid var(--line-l);border-inline-end:1px solid var(--line-l);min-height:200px;display:flex;flex-direction:column;justify-content:space-between;transition:background var(--t2)}
.cells li::before{content:"";position:absolute;top:0;inset-inline:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:right;transition:transform var(--t3) var(--ease)}
.cells li:hover{background:rgba(255,255,255,.55)} .cells li:hover::before{transform:scaleX(1)}
.cells h3{font-size:clamp(1.2rem,1.6vw,1.45rem)}

/* قائمة رقمية */
.rows li{display:grid;grid-template-columns:72px 1fr;gap:var(--sp3);padding-block:var(--sp4);border-bottom:1px solid var(--line-l)}
.rows li:first-child{border-top:1px solid var(--line-l)}
.bg-navy .rows li{border-color:var(--line-d)}
.rows p{margin-top:6px;opacity:.82}
.bg-navy .rows .num{color:var(--gold)}

/* خط زمني عمودي */
.tl{position:relative;padding-inline-start:44px}
.tl::before{content:"";position:absolute;inset-inline-start:11px;top:8px;bottom:8px;width:1px;background:var(--line-l)}
.tl li{position:relative;padding-bottom:var(--sp5)}
.tl li:last-child{padding-bottom:0}
.tl li::before{content:"";position:absolute;inset-inline-start:-44px;top:6px;width:23px;height:23px;border:1px solid var(--navy);border-radius:23px 23px 0 0;background:var(--off);transition:background var(--t2),border-color var(--t2),transform var(--t3) var(--ease)}
.tl li.in::before{background:var(--teal);border-color:var(--teal);transform:translateY(-3px)}
.tl p{margin-top:6px;color:var(--slate)}

/* لمن؟ لماذا؟ */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp4)}
@media(max-width:760px){.duo{grid-template-columns:1fr}}
.duo>div{padding:var(--sp5);border:1px solid var(--line-d);border-radius:var(--r)}
.duo p{margin-top:8px;font-size:var(--lead)}
.duo .arch-top{display:block;width:44px;margin-bottom:var(--sp3)}
.duo .arch-top path{fill:none;stroke:var(--gold);stroke-width:1.5}

/* أكورديون */
.acc{border-top:1px solid var(--line-l)}
.acc-i{border-bottom:1px solid var(--line-l)}
.acc-t{width:100%;display:grid;grid-template-columns:56px 1fr 28px;align-items:center;gap:var(--sp2);padding:var(--sp3) 0;background:none;border:0;color:inherit;font:inherit;text-align:start;cursor:pointer}
.acc-t h3{transition:transform var(--t2) var(--ease),color var(--t2)}
.acc-t:hover h3{transform:translateX(-10px);color:var(--teal-2)}
.acc-t .pl{position:relative;width:20px;height:20px}
.acc-t .pl::before,.acc-t .pl::after{content:"";position:absolute;inset:0;margin:auto;background:currentColor}
.acc-t .pl::before{width:20px;height:1.5px}.acc-t .pl::after{width:1.5px;height:20px;transition:transform var(--t2) var(--ease)}
.acc-t[aria-expanded=true] .pl::after{transform:rotate(90deg)}
.acc-p{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--t2) var(--ease)}
.acc-p>div{overflow:hidden}
.acc-t[aria-expanded=true]+.acc-p{grid-template-rows:1fr}
.acc-p p{padding:0 72px var(--sp4) 0;color:var(--slate);max-width:44em}
@media(max-width:600px){.acc-p p{padding-inline-end:0}}

/* صفوف الشراكات */
.prow{color:inherit;display:grid;grid-template-columns:minmax(120px,.5fr) 1.5fr 40px;align-items:center;gap:var(--sp3);padding:var(--sp4) 0;border-bottom:1px solid var(--line-l);position:relative;transition:padding var(--t2) var(--ease),background var(--t2)}
.prow:first-child{border-top:1px solid var(--line-l)}
.prow h3{font-size:clamp(1.8rem,3.4vw,2.8rem)}
.prow span.p{color:var(--slate);font-size:var(--lead)}
.prow .mk{justify-self:end;width:40px;height:40px;border:1px solid var(--line-l);border-radius:40px 40px 0 0;display:grid;place-items:center;transition:background var(--t2),transform var(--t3) var(--ease),border-color var(--t2)}
.prow:hover,.prow:focus-visible{padding-inline:var(--sp3);background:rgba(255,255,255,.6)}
.prow:hover .mk,.prow:focus-visible .mk{background:var(--gold);border-color:var(--gold);transform:translateY(-4px)}
@media(max-width:700px){.prow{grid-template-columns:1fr 36px}.prow span.p{grid-column:1/2;grid-row:2}.prow .mk{grid-row:1/3;grid-column:2}}

/* روابط التواصل الكبيرة */
.clink{display:grid;grid-template-columns:140px 1fr 40px;align-items:center;gap:var(--sp3);padding:var(--sp4) 0;border-bottom:1px solid var(--line-l);transition:padding var(--t2) var(--ease),background var(--t2)}
.clink:first-child{border-top:1px solid var(--line-l)}
a.clink:hover{padding-inline:var(--sp3);background:rgba(255,255,255,.6)}
.clink .lb{font-family:var(--f-en);font-size:.72rem;letter-spacing:.24em;color:var(--slate)}
.clink .v{font-family:var(--f-head);font-size:clamp(1.5rem,3.4vw,2.6rem);font-weight:700}
.clink .ar{transition:transform var(--t2) var(--ease);justify-self:end}
a.clink:hover .ar{transform:translateX(-8px)}
@media(max-width:620px){.clink{grid-template-columns:1fr 32px}.clink .lb{grid-column:1/2}.clink .v{grid-column:1/2}.clink .ar{grid-row:1/3;grid-column:2}}

/* شريط «قريباً» */
.soon{display:flex;flex-wrap:wrap;gap:var(--sp5);align-items:center;justify-content:space-between;padding:clamp(28px,5vw,56px);border:1px solid var(--line-d);border-radius:min(220px,30%) min(220px,30%) var(--r) var(--r);padding-top:clamp(56px,8vw,96px);background:rgba(11,27,46,.5)}
.badge{display:inline-block;font-family:var(--f-en);font-size:.7rem;letter-spacing:.22em;padding:6px 14px;border:1px solid var(--gold);color:var(--gold);border-radius:20px}

/* دعوة ختامية */
.cta-end{text-align:center}
.cta-end .eyebrow{justify-content:center}.cta-end .eyebrow::before{display:none}
.cta-end h2{max-width:20em;margin:0 auto var(--sp4)}

/* ---------- النماذج ---------- */
.form{display:grid;gap:var(--sp3)}
.field label,.field .lab{display:block;font-size:.9rem;margin-bottom:6px;opacity:.85}
.field input,.field select,.field textarea{width:100%;font:inherit;color:inherit;background:transparent;border:0;border-bottom:1px solid var(--line-l);padding:12px 0;border-radius:0;transition:border-color var(--t2)}
.field textarea{min-height:110px;resize:vertical}
.field select{appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23999' stroke-width='1.5'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E") no-repeat left 4px center}
.field select option{color:var(--navy)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 1px 0 var(--gold)}
.bg-navy .field input,.bg-navy .field select,.bg-navy .field textarea{border-color:var(--line-d)}
.field input:user-invalid,.field textarea:user-invalid,.field select:user-invalid{border-color:#C2564B;box-shadow:0 1px 0 #C2564B}
::placeholder{color:inherit;opacity:.45}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;cursor:pointer}
.chip span{display:inline-block;padding:10px 22px;border:1px solid var(--line-l);border-radius:40px;transition:all var(--t1)}
.chip input:checked+span{background:var(--navy);color:var(--off);border-color:var(--navy)}
.chip input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.note{font-size:.88rem;color:var(--slate)}
.bg-navy .note{color:rgba(245,244,240,.78)}
.form-ok{display:none;padding:var(--sp4);border:1px solid var(--gold);border-radius:var(--r);background:rgba(215,182,120,.12)}
.form-ok.show{display:block;animation:fade .5s forwards}
.form-ok h3{margin-bottom:8px}
.form.sent{display:none}

/* ---------- التذييل ---------- */
.ftr{background:var(--navy-2);color:var(--off);padding:clamp(56px,7vw,96px) 0 28px;position:relative;isolation:isolate}
.ftr::before{content:"";position:absolute;inset:0;z-index:-1;background:url(../img/arch-gold.svg) 0 0/var(--tile) fixed;opacity:.1}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--sp5);padding-bottom:var(--sp5)}
@media(max-width:760px){.fgrid{grid-template-columns:1fr}}
.ftr .fh{font-family:var(--f-en);font-size:.72rem;letter-spacing:.26em;color:var(--gold);margin-bottom:var(--sp2);font-weight:600}
.ftr a{display:block;opacity:.82;padding-block:5px;transition:opacity var(--t1),transform var(--t2) var(--ease)}
.ftr a:hover{opacity:1;transform:translateX(-6px)}
.ftr .bot{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;padding-top:var(--sp3);border-top:1px solid var(--line-d);font-size:.85rem;opacity:.75}
@media(max-width:820px){.ftr{padding-bottom:104px}}

/* ---------- عناصر عامة ---------- */
.progress{position:fixed;top:0;inset-inline:0;height:3px;z-index:90;pointer-events:none}
.progress i{display:block;height:100%;background:var(--gold);transform:scaleX(0);transform-origin:right}
.wa{position:fixed;bottom:24px;inset-inline-start:24px;z-index:55;width:56px;height:56px;border-radius:50%;background:var(--navy);border:1.5px solid var(--gold);color:var(--gold);display:grid;place-items:center;box-shadow:0 10px 28px rgba(0,0,0,.28);transition:opacity var(--t2),transform var(--t2) var(--ease),background var(--t2),color var(--t2)}
.wa:hover{transform:translateY(-4px) scale(1.06);background:var(--gold);color:var(--navy)}
.wa svg{width:26px;height:26px}
.wa.late{opacity:0;pointer-events:none;transform:translateY(12px)}

.js .rv{opacity:0;transform:translateY(28px);transition:opacity var(--t3) var(--ease),transform var(--t3) var(--ease)}
.js .rv.d1{transition-delay:.12s}.js .rv.d2{transition-delay:.24s}.js .rv.d3{transition-delay:.36s}
.js .rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none}.hero h1 .ln>span{transform:none;animation:none}.hero-copy .eyebrow,.hero .lead,.hero .acts,.portal .core{animation:none;opacity:1}.portal .ring{animation:none;stroke-dashoffset:0}.stmt .w{opacity:1}.grow .arc path{stroke-dashoffset:0}}

.nf{min-height:100vh;min-height:100svh;display:grid;place-items:center;text-align:center}
.nf .n{font-family:var(--f-en);font-weight:600;font-size:clamp(5rem,18vw,11rem);color:var(--gold);line-height:1;letter-spacing:.06em}

/* ---------- هوية أثر المجتمعية: كحلي + أخضر مزرق (#7CC4BB على الداكن، #3E8E87 على الفاتح) — بلا ذهبي ---------- */
.impact{--gold:#7CC4BB;--gold-2:#9DD6CE;--accent-l:#3E8E87}
.impact .bg-navy::before,.impact .band::before,.impact .ftr::before,.impact .drawer::before{background-image:url(../img/arch-mint.svg)}
.impact .gl{background-image:url(../img/arch-glow-mint.svg)}
.impact .bg-light .stmt b,.impact .bg-paper .stmt b{background-image:linear-gradient(var(--accent-l),var(--accent-l))}
.impact .cells li::before{background:var(--accent-l)}
.impact .field input:focus,.impact .field select:focus,.impact .field textarea:focus{border-color:var(--accent-l);box-shadow:0 1px 0 var(--accent-l)}
.impact .bg-navy .field input:focus,.impact .bg-navy .field textarea:focus,.impact .bg-navy .field select:focus{border-color:var(--gold);box-shadow:0 1px 0 var(--gold)}
.impact .progress i{background:var(--gold)}
.brand small.sub{font-family:var(--f-en);font-size:.62rem;letter-spacing:.14em;margin-top:3px;opacity:.9;white-space:nowrap}
.arch-card.teal{background:rgba(11,27,46,.55);border-color:rgba(124,196,187,.35)}
.arch-card.teal .tag{color:#7CC4BB}
.arch-card.teal svg.mk path{stroke:#7CC4BB}
a.arch-card.teal:hover{border-color:#7CC4BB}

/* ---------- الطباعة ---------- */
@media print{
  .hdr,.drawer,.progress,.wa,.gl,.hero-foot,.skip,.portal,.mini-portal{display:none!important}
  .sec::before,.hero::before,.hero::after,.band::before,.band::after,.ftr::before{display:none}
  body,.bg-navy,.hero,.band,.ftr{background:#fff!important;color:#000!important}
  .js .rv,.stmt .w{opacity:1!important;transform:none!important}
  .hero h1 .ln>span{transform:none!important}
  .hero,.band{min-height:0;padding:24px 0}
}