/* ── 1. الرموز ─────────────────────────────────────────────── */
/* هوية واحدة دافئة، بلا وضع داكن/فاتح:
   الأرضية إسبريسو بنّي — يعادل الكحلي في إبراز فضّة الشعار (14.8:1)
   ويتفوّق عليه في الحرارة. البيج يظهر كألواح «ورق» في المناطق
   التي تُقرأ: الأرقام، الخطوات، الأسئلة، النموذج.
   الطين المحروق هو اللون الفرايحي — لمسة واحدة لا أكثر. */
:root{
  color-scheme: light;

  --ink:      #f8f0ea;   /* الأرضية الفاتحة */
  --ink-2:    #eddfd2;   /* مقطع بديل أعمق درجة */
  --ink-3:    #e9dacd;   /* أرضية خلف الصور قبل تحميلها */
  --veil:     rgba(248,240,234,.9);

  --ivory:    #3a2a1a;   /* النص الأساسي */
  --sand:     #705842;   /* النص الثانوي */

  --gold:     #8f3348;   /* لون التمييز: يُقرأ على الفاتح ويليق مصمتًا */
  --gold-hi:  #9c3b51;
  --gold-dim: rgba(143,51,72,.30);

  --clay:     #9b4f34;   /* الطين المحروق */

  --line:     rgba(143,51,72,.25);
  --line-2:   rgba(58,42,26,.20);
  --grain:    .03;
  --photo:    1;

  --f-display: "Reem Kufi", "Segoe UI", sans-serif;
  --f-body:    "IBM Plex Sans Arabic", "Segoe UI", sans-serif;
  --f-quote:   "Amiri", Georgia, serif;
  --f-latin:   "Cormorant Garamond", Georgia, serif;

  --measure: 58ch;
  --rail: clamp(20px, 4.4vw, 60px);
  --maxw: 1340px;
  --sec-y: clamp(72px, 10vw, 172px);
}

/* لوح الورق — بيج فاخر للمناطق التي تُقرأ. يقلب مجموعة الرموز كاملة. */
.paper{
  --ink:      #fdfbf7;
  --ink-2:    #f6f1e8;
  --ink-3:    #ece4d6;
  background:var(--ink);
  color:var(--ivory);
  border-block:1px solid var(--line);
}
.paper.alt{ background:var(--ink) !important; }

/* ── 2. الأساس ────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
/* المقياس السائل على الجذر لا على الجسم، حتى تكبر كل قيم rem معه */
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth;
      font-size:clamp(17px, .40vw + 15.7px, 19px); }
body{
  margin:0;
  background:var(--ink);
  color:var(--ivory);
  font-family:var(--f-body);
  font-size:1rem;
  line-height:1.8;
  letter-spacing:0;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* حبيبة ورقية خافتة فوق كل شيء — تمنع «البلاستيك الرقمي» */
body::after{
  content:""; position:fixed; inset:0; z-index:999; pointer-events:none;
  opacity:var(--grain); mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--f-display); font-weight:600; line-height:1.38; margin:0; letter-spacing:0; text-wrap:balance; }
p{ margin:0; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; }
:focus-visible{ outline:3px solid var(--gold-hi); outline-offset:3px; }
::selection{ background:var(--gold); color:#fdf8ef; }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--rail); }
.center{ text-align:center; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.num{ font-family:var(--f-latin); font-weight:300; font-variant-numeric:tabular-nums; }

/* ── 3. أدوات الهوية ──────────────────────────────────────── */
.rule{ display:flex; align-items:center; gap:14px; color:var(--gold); }
.rule::before,.rule::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,transparent,var(--line),transparent); }
.rule i{ width:6px; height:6px; rotate:45deg; background:var(--gold); flex:none; }
.rule.short{ width:min(200px,44vw); margin-inline:auto; }

.eyebrow{ font-family:var(--f-body); font-weight:600; font-size:1.16rem; color:var(--gold); margin-bottom:15px; }
.eyebrow-lat{ font-family:var(--f-latin); font-weight:600; font-size:1.06rem; letter-spacing:.4em; text-transform:uppercase; color:var(--gold); }
.h-sec{ font-size:clamp(2rem,4.9vw,3.5rem); }
.lede{ color:var(--sand); max-width:var(--measure); font-size:1.14rem; font-weight:500; }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:11px;
  padding:19px 38px; font-weight:600; font-size:1.15rem;
  border:1px solid var(--gold); color:var(--gold); background:transparent;
  position:relative; isolation:isolate; overflow:hidden; cursor:pointer;
  transition:color .5s ease;
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1; background:var(--gold);
  transform:scaleX(0); transform-origin:right; transition:transform .55s cubic-bezier(.22,.61,.36,1);
}
.btn:hover{ color:var(--ink); }
.btn:hover::before{ transform:scaleX(1); }
.btn.solid{ color:var(--ink); }
.btn.solid::before{ transform:scaleX(1); transform-origin:left; }
.btn.solid:hover{ color:var(--gold); }
.btn.solid:hover::before{ transform:scaleX(0); }
.btn.quiet{ border-color:var(--line-2); color:var(--ivory); }
.btn.quiet:hover{ border-color:var(--gold); color:var(--ink); }
.btn svg{ width:18px; height:18px; fill:currentColor; flex:none; }

/* رابط نصّي خافت — الصوت المنخفض هو الفخامة */
.tlink{ display:inline-flex; align-items:center; gap:10px; color:var(--gold); font-weight:600; font-size:1.12rem; background:transparent; border:0; border-bottom:1px solid var(--gold-dim); padding:0 0 5px; cursor:pointer; text-align:start; transition:border-color .4s; }
.tlink:hover{ border-color:var(--gold); }
.tlink svg{ width:14px; height:14px; fill:currentColor; transition:transform .4s; }
.tlink:hover svg{ transform:translateX(-5px); }

/* ── 4. الرأس ─────────────────────────────────────────────── */
.nav{ position:sticky; top:0; z-index:60; background:var(--veil); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid var(--line); }
.nav-in{ display:flex; align-items:center; justify-content:space-between; gap:18px; height:76px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand img{ width:40px; height:auto; }
.brand b{ display:block; font-family:var(--f-display); font-weight:600; font-size:1.24rem; line-height:1.2; }
.brand span{ display:block; font-family:var(--f-latin); font-weight:600; font-size:.78rem; letter-spacing:.4em; color:var(--gold); }
.nav-links{ display:flex; align-items:center; gap:clamp(16px,2.4vw,36px); }
.nav-links a{ font-size:1.13rem; font-weight:500; color:var(--sand); position:relative; padding-block:6px; transition:color .35s; }
.nav-links a::after{ content:""; position:absolute; inset-inline:0; bottom:0; height:1px; background:var(--gold); transform:scaleX(0); transform-origin:right; transition:transform .4s; }
.nav-links a:hover,.nav-links a[aria-current="page"]{ color:var(--ivory); }
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{ transform:scaleX(1); }
.nav-cta{ display:inline-flex; align-items:center; gap:9px; font-weight:600; font-size:1.08rem; color:var(--gold); border:1px solid var(--line); padding:10px 18px; transition:background .4s,color .4s; }
.nav-cta:hover{ background:var(--gold); color:var(--ink); }
.nav-cta svg{ width:16px; height:16px; fill:currentColor; }
.nav-toggle{ display:none; background:none; border:1px solid var(--line); color:var(--gold); width:46px; cursor:pointer; }
.nav-toggle span{ display:block; width:18px; height:1px; background:currentColor; margin:4px auto; }
@media(max-width:940px){
  .nav-toggle{ display:block; }
  .nav-links{ position:absolute; inset-inline:0; top:76px; flex-direction:column; align-items:stretch; gap:0; background:var(--ink-2); border-bottom:1px solid var(--line); max-height:0; overflow:hidden; transition:max-height .5s cubic-bezier(.22,.61,.36,1); }
  .nav-links a{ padding:16px var(--rail); border-bottom:1px solid var(--line-2); }
  .nav[data-open="true"] .nav-links{ max-height:70vh; }
  .nav-cta .lbl{ display:none; }
}

/* ── 5. البطل ─────────────────────────────────────────────── */
.hero{ position:relative; min-height:min(94svh,880px); --photo:1; display:grid; place-items:center; overflow:hidden; text-align:center; padding-block:clamp(60px,9vh,104px) clamp(66px,10vh,112px); }
.hero-bg{ position:absolute; inset:0; }
.hero-bg img{ width:100%; height:100%; object-fit:cover; filter:brightness(var(--photo)) saturate(.96); }
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(78% 66% at 50% 40%, rgba(248,240,234,.62) 0%, var(--ink) 97%),
    linear-gradient(0deg, var(--ink) 1%, rgba(248,240,234,.24) 42%, var(--ink) 100%);
}
.hero-in{ position:relative; z-index:2; display:grid; justify-items:center; gap:clamp(13px,2.1vh,23px); }

.mark{ position:relative; width:clamp(148px,17.5vw,236px); filter:drop-shadow(0 12px 30px rgba(58,42,26,.18)); }
.mark img{ width:100%; height:auto; }
.mark::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(102deg,transparent 40%,rgba(255,255,255,.5) 50%,transparent 60%);
  mix-blend-mode:screen; opacity:0;
  -webkit-mask-image:var(--mark-mask); mask-image:var(--mark-mask);
  -webkit-mask-size:contain; mask-size:contain;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  animation:foil 2.4s ease-out 1.6s 1;
}
@keyframes foil{
  0%,74%{ opacity:0; transform:translateX(-34%); }
  80%{ opacity:.8; }
  92%,100%{ opacity:0; transform:translateX(34%); }
}
.wordmark{ display:grid; justify-items:center; gap:5px; }
.wordmark b{ font-family:var(--f-display); font-weight:600; font-size:clamp(1.55rem,3.6vw,2.2rem); line-height:1.1; }
.wordmark .lat{ font-family:var(--f-latin); font-weight:400; font-size:clamp(.8rem,1.6vw,1rem); letter-spacing:.62em; text-indent:.62em; color:var(--gold); }
.wordmark .tag{ font-family:var(--f-latin); font-style:italic; font-weight:600; font-size:1.16rem; letter-spacing:.1em; color:var(--sand); }

.hero h1{ font-size:clamp(2.05rem,5.8vw,4.05rem); line-height:1.3; max-width:15ch; }
.hero h1 em{ font-style:normal; color:var(--clay); }
.hero .lede{ margin-inline:auto; max-width:50ch; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:6px; }
.scroll-hint{ position:absolute; bottom:24px; inset-inline:0; z-index:2; display:grid; justify-items:center; gap:10px; color:var(--sand); font-weight:600; font-size:1.04rem; }
.scroll-hint i{ width:1px; height:44px; background:linear-gradient(var(--gold),transparent); }

/* ── 6. الأقسام ───────────────────────────────────────────── */
.sec{ padding-block:var(--sec-y); position:relative; }
.sec.tight{ padding-block:clamp(52px,7vw,104px); }
.sec.alt{ background:var(--ink-2); border-block:1px solid var(--line); }
.sec-head{ display:grid; gap:18px; margin-bottom:clamp(38px,5.5vw,68px); }
.sec-head.center{ justify-items:center; text-align:center; }

/* أعمدة المزايا — من ذيل مطبوعات أرساك */
.pillars{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:0; }
.pillar{ padding:clamp(26px,3.2vw,42px) 18px; text-align:center; border-inline-start:1px solid var(--line-2); }
.pillar:first-child{ border-inline-start:0; }
.pillar svg{ width:34px; height:34px; stroke:var(--gold); fill:none; stroke-width:1.15; stroke-linecap:round; stroke-linejoin:round; margin:0 auto 16px; }
.pillar b{ display:block; font-family:var(--f-display); font-weight:600; font-size:1.36rem; margin-bottom:7px; }
.pillar span{ font-size:1.14rem; font-weight:500; color:var(--sand); line-height:1.8; }
@media(max-width:660px){ .pillar{ border-inline-start:0; border-top:1px solid var(--line-2); } .pillar:first-child{ border-top:0; } }

/* فهرس الباقات — صفوف تحريرية */
.index-list{ border-top:1px solid var(--line); position:relative; }
.index-row{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:clamp(16px,3vw,36px); padding-block:clamp(20px,2.6vw,30px); border-bottom:1px solid var(--line); transition:padding-inline .55s cubic-bezier(.22,.61,.36,1); }
.index-row:hover{ padding-inline:16px; }
.index-row .ix{ font-family:var(--f-latin); font-weight:400; font-size:1.62rem; color:var(--gold); width:2.4em; }
.index-row .nm{ display:grid; gap:2px; min-width:0; }
.index-row .nm b{ font-family:var(--f-display); font-weight:600; font-size:clamp(1.3rem,2.9vw,1.9rem); line-height:1.4; transition:color .45s; }
.index-row:hover .nm b{ color:var(--clay); }
.index-row .nm span{ font-size:1.15rem; font-weight:500; color:var(--sand); }
.index-row .go{ font-size:1.1rem; font-weight:600; color:var(--sand); display:flex; align-items:center; gap:10px; white-space:nowrap; }
.index-row .go svg{ width:15px; height:15px; fill:var(--gold); transition:transform .45s; }
.index-row:hover .go svg{ transform:translateX(-7px); }
.index-row .thumb{ display:none; position:absolute; inset-inline-end:24%; width:220px; aspect-ratio:4/3; z-index:5; pointer-events:none; opacity:0; scale:.94; transition:opacity .45s,scale .45s; border:1px solid var(--gold-dim); translate:0 -50%; }
.index-row .thumb img{ width:100%; height:100%; object-fit:cover; filter:brightness(var(--photo)); }
@media(hover:hover) and (min-width:940px){ .index-row{ position:relative; } .index-row .thumb{ display:block; top:50%; } .index-row:hover .thumb{ opacity:1; scale:1; } }
@media(max-width:939px){ .index-row .go .lbl{ display:none; } }

/* فسيفساء تحريرية */
.mosaic{ display:grid; gap:clamp(10px,1.3vw,18px); grid-template-columns:repeat(4,1fr); grid-auto-rows:minmax(150px,auto); }
.mosaic figure{ margin:0; position:relative; overflow:hidden; background:var(--ink-3); outline:1px solid var(--line); outline-offset:-1px; }
.mosaic img{ width:100%; height:100%; object-fit:cover; filter:brightness(var(--photo)); transition:scale 1s cubic-bezier(.22,.61,.36,1); }
.mosaic figure:hover img{ scale:1.05; }
.mosaic figcaption{ position:absolute; inset-inline:0; bottom:0; padding:16px 18px; background:linear-gradient(0deg,rgba(28,19,13,.92),transparent); color:#f3e7d8; font-family:var(--f-display); font-weight:600; font-size:1.3rem; }
.m-tall{ grid-row:span 2; }
.m-wide{ grid-column:span 2; }
@media(max-width:860px){ .mosaic{ grid-template-columns:repeat(2,1fr); } .m-tall{ grid-row:span 1; } }

/* لوح مقسوم */
.split{ display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:clamp(28px,5.5vw,80px); }
.split .art{ position:relative; }
.split .art img{ width:100%; aspect-ratio:4/3; object-fit:cover; filter:brightness(var(--photo)); }
.split .art::after{ content:""; position:absolute; inset:15px; border:1px solid var(--gold-dim); pointer-events:none; }
.split .copy{ display:grid; gap:22px; justify-items:start; }
.split.flip .art{ order:2; }
@media(max-width:880px){ .split{ grid-template-columns:1fr; } .split.flip .art{ order:0; } }

/* مستويات الضيوف */
.tiers{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); border:1px solid var(--line); }
.tier{ padding:30px 16px; text-align:center; border-inline-start:1px solid var(--line); }
.tier:first-child{ border-inline-start:0; }
.tier b{ display:block; font-family:var(--f-latin); font-weight:300; font-size:clamp(2.2rem,4.6vw,3rem); color:var(--gold-hi); line-height:1; }
.tier u{ display:block; text-decoration:none; font-weight:600; font-size:1.1rem; color:var(--gold); margin-block:8px 12px; }
.tier span{ font-size:1.14rem; font-weight:500; color:var(--sand); }
@media(max-width:660px){ .tiers{ grid-template-columns:repeat(2,1fr); } .tier{ border-top:1px solid var(--line); } .tier:nth-child(-n+2){ border-top:0; } .tier:nth-child(odd){ border-inline-start:0; } }

/* مُرشِّح الباقة حسب عدد الضيوف */
.picker{ border:1px solid var(--line); background:var(--ink-2); padding:clamp(26px,4vw,48px); display:grid; gap:26px; }
.picker-steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:22px; }
.chips{ display:flex; flex-wrap:wrap; gap:11px; }
.chip{ padding:13px 24px; border:1px solid var(--line); background:transparent; color:var(--sand); font-weight:600; font-size:1.14rem; cursor:pointer; transition:.35s; }
.chip:hover{ border-color:var(--gold); color:var(--ivory); }
.chip[aria-pressed="true"]{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.picker-out{ border-top:1px solid var(--line); padding-top:24px; display:grid; gap:16px; justify-items:start; }
.picker-out .res{ font-family:var(--f-display); font-weight:600; font-size:clamp(1.1rem,2.4vw,1.5rem); line-height:1.5; }
.picker-out .res b{ color:var(--gold-hi); font-weight:600; }

/* اقتباس تحريري */
.pull{ text-align:center; display:grid; gap:20px; justify-items:center; }
.pull q{ font-family:var(--f-quote); font-size:clamp(1.4rem,3.6vw,2.35rem); line-height:1.75; color:var(--ivory); max-width:26ch; quotes:"\00AB" "\00BB"; }
.pull cite{ font-style:normal; font-size:1.12rem; font-weight:600; color:var(--gold); }

/* شريط دعوة */
.cta-band{ position:relative; overflow:hidden; text-align:center; padding-block:clamp(66px,9.5vw,124px); }
.cta-band .bgimg{ position:absolute; inset:0; }
.cta-band .bgimg img{ width:100%; height:100%; object-fit:cover; filter:brightness(.46) saturate(.9); }
.cta-band .bgimg::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(32,22,15,.76),rgba(32,22,15,.46)); }
.cta-band .in{ position:relative; z-index:2; display:grid; justify-items:center; gap:22px; }
.cta-band h2{ font-size:clamp(2.1rem,5.2vw,3.8rem); max-width:20ch; color:#f3e7d8; }
.cta-band p{ color:#d9c7ad; max-width:46ch; font-size:1.2rem; font-weight:500; }
.cta-band .in .btn{ border-color:#d4af5f; color:#d4af5f; }
.cta-band .in .btn::before{ background:#d4af5f; }
.cta-band .in .btn:hover,.cta-band .in .btn.solid{ color:#241a12; }
.cta-band .in .btn.solid:hover{ color:#d4af5f; }

/* ── 7. صفحة الباقات ──────────────────────────────────────── */
.pkg{ border-top:1px solid var(--line); }
.pkg:last-of-type{ border-bottom:1px solid var(--line); }
.pkg-head{ display:grid; grid-template-columns:auto 1fr auto; gap:clamp(14px,2.6vw,30px); align-items:center; width:100%; background:none; border:0; color:inherit; text-align:start; cursor:pointer; padding-block:clamp(20px,2.6vw,30px); }
.pkg-head::-webkit-details-marker{ display:none; }
.pkg-head .art{ width:clamp(76px,10vw,124px); aspect-ratio:1; overflow:hidden; border:1px solid var(--line); flex:none; }
.pkg-head .art img{ width:100%; height:100%; object-fit:cover; filter:brightness(var(--photo)); }
.pkg-head h2{ font-size:clamp(1.3rem,3vw,2.05rem); }
.pkg-head .sub{ font-size:1.16rem; font-weight:500; color:var(--sand); margin-top:6px; }
.pkg-head .sign{ width:44px; height:44px; border:1px solid var(--line); display:grid; place-items:center; color:var(--gold); flex:none; transition:background .4s,color .4s; }
.pkg-head .sign::before{ content:"+"; font-family:var(--f-latin); font-size:1.55rem; line-height:1; }
.pkg-head:hover .sign{ background:var(--gold); color:var(--ink); }
details[open] > .pkg-head .sign::before{ content:"–"; }
.pkg-body{ padding-bottom:clamp(30px,4vw,54px); display:grid; gap:clamp(24px,3.4vw,40px); }
.courses{ display:grid; grid-template-columns:repeat(auto-fit,minmax(226px,1fr)); gap:clamp(20px,2.8vw,38px); }
.course h3{ font-size:1.38rem; color:var(--gold-hi); padding-bottom:10px; margin-bottom:14px; border-bottom:1px solid var(--line); }
.course li{ font-size:1.16rem; font-weight:500; color:var(--sand); display:flex; gap:11px; line-height:1.8; }
.course li::before{ content:"◆"; color:var(--gold); font-size:.5rem; margin-top:.85em; flex:none; }
.pkg-foot{ display:flex; flex-wrap:wrap; gap:18px 26px; align-items:center; justify-content:space-between; }

/* عارض الصفحة الأصلية */
.viewer{ position:fixed; inset:0; z-index:200; display:none; place-items:center; padding:3vmin; background:rgba(26,18,12,.96); --gold:#d4af5f; --gold-hi:#e0c97f; --gold-dim:rgba(212,175,95,.30); }
.viewer[data-open="true"]{ display:grid; }
.viewer img{ max-width:100%; max-height:92vh; object-fit:contain; border:1px solid var(--gold-dim); }
.viewer .x{ position:absolute; top:16px; inset-inline-end:16px; width:46px; height:46px; background:none; border:1px solid var(--gold-dim); color:var(--gold); font-size:1.3rem; cursor:pointer; }
.viewer .x:hover{ background:var(--gold); color:#2a1c10; }

/* ── 8. التواصل والزيارة ──────────────────────────────────── */
.channels{ display:grid; grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); gap:clamp(14px,2vw,22px); }
.channel{ display:grid; gap:12px; padding:clamp(26px,3.2vw,36px); border:1px solid var(--line); background:var(--ink-2); transition:border-color .45s, transform .45s; }
.channel:hover{ border-color:var(--gold); transform:translateY(-4px); }
.channel .ico{ width:54px; height:54px; display:grid; place-items:center; border:1px solid var(--gold-dim); color:var(--gold); }
.channel .ico svg{ width:25px; height:25px; fill:currentColor; }
.channel b{ font-family:var(--f-display); font-weight:600; font-size:1.48rem; }
.channel span{ font-size:1.14rem; font-weight:500; color:var(--sand); }
.channel .val{ font-family:var(--f-latin); font-size:1.45rem; letter-spacing:.04em; color:var(--gold-hi); direction:ltr; text-align:start; }

.facts{ border:1px solid var(--line); }
.fact{ display:grid; grid-template-columns:minmax(110px,.8fr) 2fr; gap:20px; padding:22px clamp(18px,3vw,30px); border-bottom:1px solid var(--line-2); }
.fact:last-child{ border-bottom:0; }
.fact dt{ font-size:1.12rem; font-weight:600; color:var(--gold); }
.fact dd{ margin:0; font-size:1.18rem; font-weight:500; }

.steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:clamp(18px,2.6vw,30px); counter-reset:s; }
.step{ display:grid; gap:10px; padding-top:22px; border-top:1px solid var(--line); }
.step .n{ font-family:var(--f-latin); font-weight:300; font-size:1.9rem; color:var(--gold); }
.step b{ font-family:var(--f-display); font-weight:600; font-size:1.38rem; }
.step span{ font-size:1.15rem; font-weight:500; color:var(--sand); line-height:1.85; }

.form{ display:grid; gap:20px; }
.field{ display:grid; gap:9px; }
.field label{ font-size:1.12rem; font-weight:600; color:var(--gold); }
.field input,.field select,.field textarea{ font-family:var(--f-body); font-weight:500; font-size:1.16rem; color:var(--ivory); background:var(--ink); border:1px solid var(--line); padding:14px 16px; width:100%; transition:border-color .35s; }
.field input::placeholder,.field textarea::placeholder{ color:color-mix(in srgb, var(--sand) 60%, transparent); }
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{ border-color:var(--gold); }
.field textarea{ min-height:118px; resize:vertical; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media(max-width:660px){ .field-row{ grid-template-columns:1fr; } }
.form-note{ font-size:1.1rem; font-weight:500; color:var(--sand); }

.faq{ border-top:1px solid var(--line); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:22px; cursor:pointer; font-family:var(--f-display); font-weight:600; font-size:1.4rem; list-style:none; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; font-family:var(--f-latin); font-size:1.4rem; color:var(--gold); }
.faq details[open] summary::after{ content:"–"; }
.faq p{ color:var(--sand); font-size:1.16rem; font-weight:500; padding-bottom:24px; max-width:var(--measure); }

/* ── 9. التذييل ───────────────────────────────────────────── */
/* التذييل غرفة إسبريسو: يحمل الشعار الفضّي ويختم الصفحة الفاتحة بوزن */
.foot{
  --ink:#332419; --ink-2:#2b1d12; --ink-3:#5a4231;
  --ivory:#f3e7d8; --sand:#c8b49c;
  --gold:#d4af5f; --gold-hi:#e0c97f; --gold-dim:rgba(212,175,95,.30);
  --clay:#d98e63;
  --line:rgba(212,175,95,.30); --line-2:rgba(243,231,216,.15);
  color:var(--ivory);
}
.foot{ border-top:1px solid var(--line); background:var(--ink-2); padding-block:clamp(50px,6.5vw,82px) 26px; }
.foot-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:clamp(26px,4vw,52px); }
.foot-brand{ display:grid; gap:16px; justify-items:start; }
.foot-brand img{ width:66px; height:auto; }
.foot h4{ font-family:var(--f-body); font-weight:600; font-size:1.14rem; color:var(--gold); margin-bottom:16px; }
.foot ul{ display:grid; gap:11px; }
.foot ul a,.foot ul li{ font-size:1.14rem; font-weight:500; color:var(--sand); transition:color .35s; }
.foot ul a:hover{ color:var(--gold-hi); }
.foot-bottom{ margin-top:clamp(34px,5vw,56px); padding-top:22px; border-top:1px solid var(--line-2); display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; font-size:1.08rem; font-weight:500; color:var(--sand); }
@media(max-width:860px){ .foot-grid{ grid-template-columns:1fr 1fr; } .foot-brand{ grid-column:1/-1; } }

/* شريط ثابت للجوال */
.dock{ position:fixed; inset-inline:0; bottom:0; z-index:70; display:none; grid-template-columns:1fr 1fr; background:var(--ink-2); border-top:1px solid var(--line); }
.dock a{ padding:0 8px; min-height:57px; line-height:1.2; text-align:center; font-weight:600; font-size:1.14rem; color:var(--gold); display:flex; align-items:center; justify-content:center; gap:9px; }
.dock a+a{ border-inline-start:1px solid var(--line); }
.dock svg{ width:19px; height:19px; fill:currentColor; }
@media(max-width:760px){ .dock{ display:grid; } body{ padding-bottom:58px; } }

/* ── 10. الظهور بالتمرير ──────────────────────────────────── */
.rise{ opacity:0; transform:translateY(14px); transition:opacity .55s cubic-bezier(.22,.61,.36,1), transform .55s cubic-bezier(.22,.61,.36,1); }
.rise.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .rise{ opacity:1; transform:none; }
}

/* قوائم نقطية بمعيّن ذهبي */
.bullets{ display:grid; gap:14px; }
.bullets li{ display:flex; gap:12px; color:var(--sand); font-size:1.16rem; font-weight:500; line-height:1.8; }
.bullets li::before{ content:"\25C6"; color:var(--gold); font-size:.5rem; margin-top:.9em; flex:none; }

/* مبدّل اللغة */
.lang{ display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:0 14px;
  border:1px solid var(--line); color:var(--gold); font-family:var(--f-latin); font-weight:600;
  font-size:1rem; letter-spacing:.14em; transition:background .4s,color .4s,border-color .4s; }
.lang:hover{ background:var(--gold); border-color:var(--gold); color:var(--ink); }
.lang svg{ width:17px; height:17px; fill:currentColor; }
@media(max-width:520px){ .lang{ padding:0 10px; } .lang svg{ display:none; } }

/* ── 11. النسخة الإنجليزية: تايبوغرافيا واتجاه ───────────── */
[lang="en"]{
  --f-display:"Cormorant Garamond", Georgia, serif;
  --measure: 62ch;
}
[lang="en"]{ line-height:1.68; }
[lang="en"] h1,[lang="en"] h2,[lang="en"] h3,[lang="en"] h4{ font-weight:600; line-height:1.2; letter-spacing:.004em; }
[lang="en"] .h-sec{ font-size:clamp(2.3rem,5.4vw,4rem); }
[lang="en"] .hero h1{ font-size:clamp(2.4rem,6.4vw,4.6rem); line-height:1.14; }
[lang="en"] .eyebrow{ text-transform:uppercase; letter-spacing:.18em; font-size:1.04rem; font-weight:600; }
[lang="en"] .pillar b,[lang="en"] .step b,[lang="en"] .channel b,[lang="en"] .course h3{ letter-spacing:.01em; }
[lang="en"] .pull q{ quotes:"\201C" "\201D"; font-family:var(--f-latin); font-size:clamp(1.6rem,4vw,2.7rem); line-height:1.4; }
[lang="en"] .wordmark b{ font-family:var(--f-latin); letter-spacing:.06em; }
[lang="en"] .index-row .nm b{ letter-spacing:.008em; }

/* الأسهم تتبع اتجاه القراءة */
[dir="ltr"] .tlink svg,[dir="ltr"] .index-row .go svg{ transform:scaleX(-1); }
[dir="ltr"] .tlink:hover svg{ transform:scaleX(-1) translateX(-5px); }
[dir="ltr"] .index-row:hover .go svg{ transform:scaleX(-1) translateX(-7px); }

/* لِيد البطل: أول سطر يقرأه الزائر، فيأخذ حجمًا أكبر */
.hero .lede{ font-size:clamp(1.16rem,1.5vw + .8rem,1.34rem); font-weight:500; line-height:1.75; }
.cta-band .in p{ font-weight:500; }

/* ── 12. أهداف اللمس: لا يقلّ أي عنصر تفاعلي عن 44px ───────── */
.tlink{ min-height:44px; padding-block:6px 8px; }
.foot ul a{ display:inline-block; padding-block:6px; }
.nav-cta{ min-height:44px; min-width:44px; }
.lang{ min-height:44px; min-width:44px; }
.nav-toggle{ min-height:44px; min-width:46px; }
.index-row .go{ min-height:44px; }
.channel{ min-height:44px; }
.fact dd a{ display:inline-block; padding-block:5px; }

/* ── 13. إصلاحات المراجعة ─────────────────────────────────── */

/* رابط تخطّي إلى المحتوى */
.skip{ position:fixed; inset-inline-start:0; top:0; z-index:200;
  background:var(--gold); color:var(--ink); padding:14px 22px; font-weight:600;
  transform:translateY(-130%); transition:transform .2s ease; }
.skip:focus{ transform:none; }

/* الشريط الثابت لا يغطّي التذييل، ويحترم منطقة الأمان في الجوال */
@media(max-width:760px){
  body{ padding-bottom:calc(72px + env(safe-area-inset-bottom,0px)); }
  .dock{ padding-bottom:env(safe-area-inset-bottom,0px); }
}
/* على الشاشات الضيّقة جدًّا يكفي الشريط الثابت للتواصل */
@media(max-width:430px){ .nav .nav-cta{ display:none; } }

/* تلميح التمرير لا يزاحم أزرار البطل على الشاشات القصيرة */
@media(max-height:780px),(max-width:600px){ .scroll-hint{ display:none; } }

/* المصغّرات لا تظهر على أجهزة اللمس مهما اتّسعت */
@media(hover:none){ .index-row .thumb{ display:none; } }

/* صف الفهرس يتحرّك بالإزاحة لا بالحشو، فلا تخطيط في كل إطار */
.index-row{ transition:none; }
.index-row:hover{ padding-inline:0; }
@media(hover:hover){
  .index-row > *{ transition:translate .28s cubic-bezier(.22,.61,.36,1); }
  .index-row:hover > *{ translate:-14px 0; }
  [dir="ltr"] .index-row:hover > *{ translate:14px 0; }
  .index-row:hover .thumb{ translate:0 -50%; }
}

/* الفسيفساء بمناطق صريحة: لا خلايا فارغة */
.mosaic{ grid-auto-rows:auto; }
.mosaic figure{ aspect-ratio:4/3; min-height:0; }
.mosaic.mos-a{ grid-template-areas:"a a b c" "a a b d" "e e e f"; }
.mosaic.mos-a figure{ aspect-ratio:auto; }
.mosaic.mos-a > *:nth-child(1){ grid-area:a } .mosaic.mos-a > *:nth-child(2){ grid-area:b }
.mosaic.mos-a > *:nth-child(3){ grid-area:c } .mosaic.mos-a > *:nth-child(4){ grid-area:d }
.mosaic.mos-a > *:nth-child(5){ grid-area:e } .mosaic.mos-a > *:nth-child(6){ grid-area:f }
.mosaic.mos-a{ grid-template-rows:repeat(3,minmax(150px,1fr)); }
.mosaic.mos-b{ grid-template-areas:"a b c d" "e e f f"; grid-template-rows:repeat(2,minmax(190px,1fr)); }
.mosaic.mos-b figure{ aspect-ratio:auto; }
.mosaic.mos-b > *:nth-child(1){ grid-area:a } .mosaic.mos-b > *:nth-child(2){ grid-area:b }
.mosaic.mos-b > *:nth-child(3){ grid-area:c } .mosaic.mos-b > *:nth-child(4){ grid-area:d }
.mosaic.mos-b > *:nth-child(5){ grid-area:e } .mosaic.mos-b > *:nth-child(6){ grid-area:f }
@media(max-width:860px){
  .mosaic.mos-a,.mosaic.mos-b{ grid-template-areas:none; grid-template-rows:none; grid-template-columns:repeat(2,1fr); }
  .mosaic.mos-a > *,.mosaic.mos-b > *{ grid-area:auto; aspect-ratio:4/3; }
}

/* شبكات ذات عدد ثابت: أعمدة صريحة بدل يتيم في نطاق اللوحي */
@media(min-width:1001px){ .pillars{ grid-template-columns:repeat(5,1fr); } }
@media(min-width:661px) and (max-width:1000px){
  .pillars{ grid-template-columns:repeat(2,1fr); }
  .pillar{ border-inline-start:0; border-top:1px solid var(--line-2); }
  .pillar:nth-child(even){ border-inline-start:1px solid var(--line-2); }
  .pillar:nth-child(-n+2){ border-top:0; }
  .courses{ grid-template-columns:repeat(2,1fr); }
  .channels{ grid-template-columns:repeat(2,1fr); }
}
@media(min-width:941px){ .channels{ grid-template-columns:repeat(3,1fr); } }

/* الأسهم بمسافة واحدة، والحركات بمدد أقصر وأكثر تناسقًا */
.tlink:hover svg{ transform:translateX(-6px); }
[dir="ltr"] .tlink:hover svg{ transform:scaleX(-1) translateX(-6px); }
.index-row:hover .go svg{ transform:translateX(-6px); }
[dir="ltr"] .index-row:hover .go svg{ transform:scaleX(-1) translateX(-6px); }
.channel:hover{ transform:none; }
.mosaic figure:hover img{ transition-duration:.6s; }

/* الدعوة الختامية تبقى أكبر عنوان في الصفحة، في اللغتين */
[lang="en"] .cta-band h2{ font-size:clamp(2.3rem,5.6vw,4.3rem); }

/* ── 14. إصلاحات مراجعة الكود ─────────────────────────────── */

/* السمة hidden تغلب display الخاص بالمكوّنات (زر واتساب في المُرشِّح) */
[hidden]{ display:none !important; }

/* هدف الرابط العميق لا يختبئ خلف الرأس اللاصق */
.pkg, [id^="p-"], .sec[id]{ scroll-margin-top:90px; }

/* بلا جافاسكربت: كل المحتوى ظاهر */
@media (scripting: none){ .rise{ opacity:1; transform:none; } }

/* سطر ARSAK فوق صورة البطل: بلون النص لا الرمل، فيُقرأ على الغسل الفاتح */
.hero .eyebrow-lat{ color:var(--ivory); opacity:.72; }

/* أهداف لمس التذييل والعلامة: مساحة نقر أوسع بلا أثر بصري */
.foot ul a{ padding-inline:10px; margin-inline:-10px; }
.brand{ min-height:44px; }