/* ══════════════════════════════════════════════════════════════
   TOPA TRADERS — GOLDEN MINDSET
   هوية ذهبية كاملة خاصة بهذه الصفحة وحدها — Luxury Editorial Book Launch.
   ══════════════════════════════════════════════════════════════
   الأخضر مُلغى تماماً هنا: نعيد تعريف توكنات النظام داخل .topa-gm فقط،
   فتتحوّل كل المكوّنات المشتركة (العناوين · الأسئلة · التنبيه · التركيز)
   إلى الذهبي آلياً بلا لمس ملفات النظام المشتركة.
   كل الأصناف الجديدة تبدأ بـ tgm- فلا تتصادم مع أي شيء في القالب.
   ══════════════════════════════════════════════════════════════ */

/* ─── إخفاء ترويسة/تذييل/نوافذ Kajabi الافتراضية — على هذه الصفحة وحدها ─── */
body:has(.topa-gm) #section-header,
body:has(.topa-gm) #section-footer,
body:has(.topa-gm) #section-exit_pop,
body:has(.topa-gm) #section-two_step,
html.tgm-host #section-header,
html.tgm-host #section-footer,
html.tgm-host #section-exit_pop,
html.tgm-host #section-two_step{display:none!important}

body:has(.topa-gm),
html.tgm-host body{background:#050505!important}

body:has(.topa-gm) main,
html.tgm-host main{padding:0!important;margin:0!important;min-height:0!important}

/* ══════════════════════════════════════════════════════════════
   1) اللوحة الذهبية — تُعيد تعريف توكنات النظام لهذه الصفحة
   ══════════════════════════════════════════════════════════════ */
.topa.topa-gm{
  /* الأسطح */
  --bg:#050505;
  --s1:#0B0B0B;
  --s2:#0E0E0E;
  --s3:#131313;
  --gl:rgba(212,175,98,.028);
  --gl2:rgba(212,175,98,.055);
  --line:rgba(212,175,98,.14);
  --line2:rgba(212,175,98,.25);
  --line3:rgba(212,175,98,.4);

  /* الذهبي يحل محل الأخضر في كل المكوّنات المشتركة */
  --g:#D4AF62;
  --g-lt:#F1D79A;
  --g-dk:#8A682F;
  --g08:rgba(212,175,98,.08);
  --g12:rgba(212,175,98,.12);
  --g20:rgba(212,175,98,.2);
  --g30:rgba(212,175,98,.3);
  --g45:rgba(212,175,98,.45);
  --gold:#D4AF62;

  /* النصوص */
  --tx:#F5F2EA;
  --tx2:#A9A49B;
  --tx3:#726D65;
  --w:#F5F2EA;

  /* خاص بالصفحة */
  --gm-grad:linear-gradient(135deg,#8A682F,#F1D79A,#B68A3E);
  --gm-ink:#0A0803;
  --gm-rule:rgba(212,175,98,.25);
  --gm-serif:"Times New Roman",Georgia,serif;

  background:var(--bg);
  color:var(--tx);
}
/* لا أزرق في هذه الصفحة إطلاقاً */
.topa.topa-gm .topa-blue{--b:var(--g);--b-lt:var(--g-lt)}
.topa.topa-gm :focus-visible{outline-color:var(--g)}

/* ══════════════════════════════════════════════════════════════
   2) خلفية: غبار ذهبي + أشعة خافتة جداً
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-dust{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.topa .tgm-dust::before{
  content:"";position:absolute;inset:-20% -10%;
  background-image:
    radial-gradient(1.4px 1.4px at 12% 18%, rgba(241,215,154,.5), transparent 60%),
    radial-gradient(1.1px 1.1px at 28% 62%, rgba(212,175,98,.42), transparent 60%),
    radial-gradient(1.6px 1.6px at 46% 28%, rgba(241,215,154,.34), transparent 60%),
    radial-gradient(1.1px 1.1px at 63% 74%, rgba(212,175,98,.4), transparent 60%),
    radial-gradient(1.5px 1.5px at 78% 36%, rgba(241,215,154,.3), transparent 60%),
    radial-gradient(1.2px 1.2px at 90% 66%, rgba(212,175,98,.36), transparent 60%),
    radial-gradient(1.1px 1.1px at 36% 88%, rgba(241,215,154,.26), transparent 60%),
    radial-gradient(1.3px 1.3px at 70% 12%, rgba(212,175,98,.3), transparent 60%);
  background-size:520px 520px;
  opacity:.9;
  animation:tgmDrift 34s linear infinite}
@keyframes tgmDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-520px,-260px,0)}}
/* شعاعان خافتان جداً */
.topa .tgm-rays{position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    linear-gradient(104deg,transparent 34%,rgba(212,175,98,.045) 41%,transparent 47%),
    linear-gradient(96deg,transparent 58%,rgba(241,215,154,.03) 63%,transparent 69%)}

/* ══════════════════════════════════════════════════════════════
   3) عناصر تحريرية مشتركة
   ══════════════════════════════════════════════════════════════ */
/* خط ذهبي رفيع يُرسم أثناء التمرير */
.topa .tgm-rule{display:block;height:1px;border:0;margin:0;
  background:linear-gradient(270deg,var(--g45),rgba(212,175,98,.1) 70%,transparent);
  transform-origin:right center}
.topa .tgm-rule--v{width:1px;height:auto;
  background:linear-gradient(180deg,var(--g45),rgba(212,175,98,.1) 70%,transparent);
  transform-origin:center top}
.topa.tgm-armed .tgm-rule{transform:scaleX(0);
  transition:transform 1.1s cubic-bezier(.4,0,.2,1)}
.topa.tgm-armed .tgm-rule--v{transform:scaleY(0)}
.topa.tgm-armed .is-in .tgm-rule,
.topa.tgm-armed .tgm-rule.is-in{transform:none}

/* عنوان تحريري: كِك صغير + عنوان أبيض */
.topa .tgm-kick{display:inline-flex;align-items:center;gap:10px;
  font-size:10.8px;font-weight:600;letter-spacing:.32em;color:var(--g);
  direction:ltr;unicode-bidi:isolate;margin-bottom:14px}
.topa .tgm-kick::before{content:"";width:26px;height:1px;background:var(--g45);flex:none}
.topa .tgm-kick--ar{direction:rtl;letter-spacing:.12em}
.topa .tgm-h2{font-size:clamp(23px,2.9vw,34px);font-weight:600;line-height:1.5;
  letter-spacing:-.012em;color:var(--w)}
.topa .tgm-h2 em{font-style:normal;color:var(--g)}
.topa .tgm-lead{margin-top:14px;font-size:var(--sub);color:var(--tx2);line-height:2;max-width:56ch}

/* ══════════════════════════════════════════════════════════════
   4) الترويسة
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-hdr{background:rgba(5,5,5,.82);border-bottom-color:transparent}
.topa .tgm-hdr.is-stuck{background:rgba(5,5,5,.96);border-bottom-color:var(--line)}
.topa .tgm-hdr__in{display:flex;align-items:center;justify-content:space-between;gap:14px;height:68px}
.topa .tgm-brand{display:flex;align-items:center;gap:12px;min-height:44px;flex:none}
.topa .tgm-brand img{height:36px;width:36px;object-fit:contain;display:block}
.topa .tgm-brand b{font-size:12.5px;font-weight:600;color:var(--tx);letter-spacing:.16em;white-space:nowrap}
.topa .tgm-back{display:inline-flex;align-items:center;gap:8px;flex:none;
  min-height:40px;padding:0 16px;border-radius:2px;
  font-size:12.2px;font-weight:500;letter-spacing:.04em;color:var(--tx2);
  border:1px solid var(--gm-rule);background:transparent;
  transition:color .3s,border-color .3s,background .3s}
.topa .tgm-back:hover{color:var(--gm-ink);border-color:transparent;background:var(--gm-grad)}
.topa .tgm-back svg{width:13px;height:13px;flex:none}

/* ══════════════════════════════════════════════════════════════
   5) الأزرار
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-btn{position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:11px;
  min-height:56px;padding:0 30px;border-radius:2px;
  font-size:14px;font-weight:600;letter-spacing:.02em;color:var(--gm-ink);
  background:var(--gm-grad);background-size:180% 100%;background-position:20% 0;
  border:0;box-shadow:0 14px 34px -18px rgba(212,175,98,.55);
  transition:background-position .6s var(--ez),transform .3s var(--ez),box-shadow .3s}
.topa .tgm-btn:hover{background-position:80% 0;transform:translateY(-2px);
  box-shadow:0 18px 40px -18px rgba(212,175,98,.7)}
.topa .tgm-btn:active{transform:translateY(0)}
.topa .tgm-btn svg{width:15px;height:15px;flex:none;transition:transform .3s var(--ez)}
.topa .tgm-btn:hover svg{transform:translateX(-4px)}
/* لمعة ذهبية هادئة */
.topa .tgm-btn::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(104deg,transparent 38%,rgba(255,255,255,.42) 50%,transparent 62%);
  transform:translateX(-140%)}
.topa .tgm-btn:hover::after{animation:tgmShimmer 1s var(--ez) 1 both}
@keyframes tgmShimmer{to{transform:translateX(140%)}}

.topa .tgm-btn--ghost{background:transparent;background-image:none;color:var(--g);
  border:1px solid var(--gm-rule);box-shadow:none;min-height:52px;font-weight:500}
.topa .tgm-btn--ghost:hover{background:var(--g08);border-color:var(--line3);
  color:var(--g-lt);transform:translateY(-2px);box-shadow:none}
.topa .tgm-btn--ghost::after{display:none}

/* رابط نزول ثانوي */
.topa .tgm-jump{display:inline-flex;align-items:center;gap:9px;min-height:40px;
  font-size:12.8px;font-weight:500;color:var(--tx2);letter-spacing:.02em;
  transition:color .3s}
.topa .tgm-jump:hover{color:var(--g)}
.topa .tgm-jump svg{width:13px;height:13px;flex:none;
  transition:transform .4s var(--ez)}
.topa .tgm-jump:hover svg{transform:translateY(4px)}

/* ══════════════════════════════════════════════════════════════
   6) الهيرو — تكوين غير متماثل
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-hero{position:relative;overflow:hidden;
  padding-block:clamp(34px,4.4vw,66px) clamp(40px,4.8vw,72px)}
.topa .tgm-hero__in{position:relative;z-index:2;display:grid;
  grid-template-columns:1.02fr .98fr;gap:clamp(24px,3.6vw,64px);align-items:center;min-height:0}

.topa .tgm-eyebrow{display:inline-flex;align-items:center;gap:11px;
  font-size:10.8px;font-weight:600;letter-spacing:.42em;
  direction:ltr;unicode-bidi:isolate;margin-bottom:20px;
  background:var(--gm-grad);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent}
.topa .tgm-eyebrow::before{content:"";width:32px;height:1px;background:var(--g45);flex:none}

.topa .tgm-h1{font-size:clamp(26px,3.2vw,40px);font-weight:600;line-height:1.5;
  letter-spacing:-.014em;color:var(--w);max-width:15ch}
.topa .tgm-h1 em{font-style:normal;color:var(--g)}

/* سطر بيانات الكتاب — تحريري بخطوط فاصلة رفيعة */
.topa .tgm-meta{display:flex;flex-wrap:wrap;align-items:center;gap:0;margin-top:26px;
  padding-block:15px;border-block:1px solid var(--gm-rule);max-width:30rem}
.topa .tgm-meta__i{display:inline-flex;align-items:center;gap:8px;padding-inline:clamp(12px,1.6vw,20px);
  font-size:12.4px;color:var(--tx2);letter-spacing:.02em;line-height:1.6}
.topa .tgm-meta__i:first-child{padding-inline-start:0}
.topa .tgm-meta__i + .tgm-meta__i{border-inline-start:1px solid var(--gm-rule)}
.topa .tgm-meta__i svg{width:14px;height:14px;color:var(--g);flex:none}
.topa .tgm-meta__i b{font-size:15px;font-weight:600;color:var(--g-lt);
  direction:ltr;unicode-bidi:isolate;letter-spacing:.01em}

.topa .tgm-hero__cta{margin-top:30px;display:flex;flex-direction:column;
  align-items:flex-start;gap:16px}

/* ── الكتاب ثلاثي الأبعاد ── */
.topa .tgm-book{position:relative;perspective:1600px;display:grid;place-items:center;
  padding-block:clamp(6px,1.4vw,16px)}
.topa .tgm-book__halo{position:absolute;z-index:0;width:min(560px,100%);aspect-ratio:1;
  border-radius:50%;pointer-events:none;filter:blur(70px);
  background:radial-gradient(circle,rgba(212,175,98,.28),rgba(138,104,47,.1) 45%,transparent 70%)}
.topa .tgm-book__stage{position:relative;z-index:2;width:min(392px,100%);
  transform-style:preserve-3d;will-change:transform}
.topa .tgm-book__f{position:relative;display:block;transform-style:preserve-3d;
  filter:drop-shadow(0 34px 40px rgba(0,0,0,.85)) drop-shadow(0 6px 14px rgba(0,0,0,.6))}
.topa .tgm-book__f img{width:100%;height:auto;display:block;border-radius:3px}
/* إضاءة ذهبية على الحافة */
.topa .tgm-book__f::before{content:"";position:absolute;inset:0;pointer-events:none;border-radius:3px;
  background:linear-gradient(255deg,rgba(241,215,154,.16),transparent 34%);
  mix-blend-mode:screen}
/* Gold light sweep يمر على الغلاف */
.topa .tgm-book__sweep{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:3px}
.topa .tgm-book__sweep::after{content:"";position:absolute;top:-30%;bottom:-30%;width:38%;
  right:-45%;
  background:linear-gradient(100deg,transparent,rgba(241,215,154,.34),transparent);
  transform:skewX(-14deg)}
.topa .tgm-book.tgm-armed .tgm-book__sweep::after{animation:tgmSweep 6.5s ease-in-out 1.6s infinite}
@keyframes tgmSweep{
  0%{right:-45%;opacity:0}
  8%{opacity:1}
  28%{right:120%;opacity:0}
  100%{right:120%;opacity:0}}
/* انعكاس خفيف أسفل الكتاب */
.topa .tgm-book__refl{position:relative;z-index:1;width:min(392px,100%);height:96px;
  margin-top:-6px;pointer-events:none;
  background:linear-gradient(180deg,rgba(212,175,98,.09),transparent 72%);
  filter:blur(9px);
  -webkit-mask-image:linear-gradient(180deg,#000,transparent);
  mask-image:linear-gradient(180deg,#000,transparent)}
/* الطفو البطيء */
.topa .tgm-book.tgm-armed .tgm-book__stage{animation:tgmFloat 9s ease-in-out infinite}
@keyframes tgmFloat{0%,100%{translate:0 0}50%{translate:0 -13px}}
.topa .tgm-book.is-tilting .tgm-book__stage{animation:none}
/* دخول الكتاب: دوران + تكبير */
.topa.tgm-armed .tgm-book__stage{opacity:0;
  transform:perspective(1600px) rotateY(-17deg) rotateX(7deg) scale(.9)}
.topa.tgm-armed .tgm-book.is-in .tgm-book__stage{opacity:1;transform:none;
  transition:opacity 1.05s var(--ez),transform 1.15s var(--ez)}

/* ══════════════════════════════════════════════════════════════
   7) الفصول الثلاثة — Layout تحريري
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-ch{position:relative}
.topa .tgm-ch__spine{position:absolute;top:6px;bottom:6px;right:clamp(24px,4.4vw,74px);
  width:1px;z-index:0}
.topa .tgm-chapter{position:relative;z-index:2;display:grid;
  grid-template-columns:clamp(96px,13vw,190px) 1fr;
  gap:clamp(16px,2.6vw,44px);align-items:start;
  padding-block:clamp(30px,3.6vw,52px)}
.topa .tgm-chapter + .tgm-chapter{border-top:1px solid var(--gm-rule)}
/* رقم الفصل — كبير وشفاف */
.topa .tgm-chapter__n{position:relative;font-family:var(--gm-serif);
  font-size:clamp(62px,9vw,132px);line-height:.82;font-weight:400;
  direction:ltr;unicode-bidi:isolate;
  background:var(--gm-grad);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;opacity:.34;
  transition:opacity .6s var(--ez),transform .6s var(--ez)}
.topa .tgm-chapter:hover .tgm-chapter__n{opacity:.62;transform:translateY(-4px)}
/* نقطة على العمود الفقري */
.topa .tgm-chapter__dot{position:absolute;top:calc(clamp(30px,3.6vw,52px) + 14px);
  right:clamp(24px,4.4vw,74px);width:9px;height:9px;border-radius:50%;
  transform:translateX(50%);z-index:3;
  background:var(--gm-grad);box-shadow:0 0 0 4px #050505,0 0 14px rgba(212,175,98,.6)}
.topa .tgm-chapter__x{padding-top:clamp(4px,1vw,14px)}
.topa .tgm-chapter__t{font-size:clamp(19px,2.1vw,25px);font-weight:600;color:var(--w);
  line-height:1.5;margin-bottom:11px}
.topa .tgm-chapter__d{font-size:var(--body);color:var(--tx2);line-height:2.05;max-width:52ch}
/* تفاوت تحريري: كل فصل يزاح قليلاً */
.topa .tgm-chapter:nth-child(3) .tgm-chapter__x{padding-inline-start:clamp(0px,2.4vw,42px)}
.topa .tgm-chapter:nth-child(4) .tgm-chapter__x{padding-inline-start:clamp(0px,4.8vw,84px)}

/* ══════════════════════════════════════════════════════════════
   8) الجسر — من الكتاب إلى 1:1
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-bridge{position:relative;overflow:hidden;background:var(--s1);
  border-block:1px solid var(--gm-rule)}
.topa .tgm-bridge__in{position:relative;z-index:2;max-width:1080px;margin-inline:auto}
.topa .tgm-bridge__t{font-size:clamp(21px,2.7vw,33px);font-weight:600;color:var(--w);
  line-height:1.62;text-align:center;max-width:22ch;margin-inline:auto}
.topa .tgm-bridge__t em{font-style:normal;
  background:var(--gm-grad);-webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent}
.topa .tgm-bridge__d{margin:16px auto 0;font-size:var(--sub);color:var(--tx2);
  line-height:2;max-width:58ch;text-align:center}

/* المسار البصري */
.topa .tgm-path{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:clamp(14px,2.4vw,34px);margin-top:clamp(30px,3.8vw,50px)}
.topa .tgm-side{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.topa .tgm-side__box{width:clamp(86px,11vw,124px);aspect-ratio:1;border-radius:3px;
  display:grid;place-items:center;position:relative;overflow:hidden;
  border:1px solid var(--gm-rule);background:rgba(212,175,98,.035);
  transition:transform .5s var(--ez),border-color .5s,box-shadow .5s,background .5s}
.topa .tgm-side__box svg{width:44%;height:44%;color:var(--g)}
.topa .tgm-side:hover .tgm-side__box{transform:translateY(-4px);border-color:var(--line3);
  background:rgba(212,175,98,.075);box-shadow:0 18px 40px -22px rgba(212,175,98,.5)}
.topa .tgm-side__l{font-size:12px;font-weight:600;letter-spacing:.18em;color:var(--tx2)}
.topa .tgm-side--one .tgm-side__l{color:var(--g-lt)}

/* الخط الذهبي المتحرك في المنتصف */
.topa .tgm-conn{position:relative;height:2px;min-width:clamp(60px,10vw,190px);border-radius:2px;
  background:linear-gradient(270deg,rgba(212,175,98,.14),var(--g-lt) 45%,var(--g) 55%,rgba(212,175,98,.14));
  box-shadow:0 0 14px rgba(212,175,98,.42);
  transform-origin:right center}
.topa.tgm-armed .tgm-conn{transform:scaleX(0);
  transition:transform 1.15s cubic-bezier(.4,0,.2,1) .15s}
.topa.tgm-armed .is-in .tgm-conn{transform:none}
/* شرارة تسير على الخط */
.topa .tgm-conn::after{content:"";position:absolute;top:50%;right:0;
  width:9px;height:9px;border-radius:50%;transform:translateY(-50%);
  background:var(--g-lt);box-shadow:0 0 16px 3px rgba(241,215,154,.9);opacity:0}
.topa.tgm-armed .is-in .tgm-conn::after{animation:tgmSpark 1.9s var(--ez) 1.1s infinite}
@keyframes tgmSpark{
  0%{right:0;opacity:0}10%{opacity:1}
  70%{right:100%;opacity:1}80%{right:100%;opacity:0}100%{right:100%;opacity:0}}

/* ══════════════════════════════════════════════════════════════
   9) التعليم الفردي — ألواح زجاجية سوداء بحدود ذهبية
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-one{position:relative;overflow:hidden}
.topa .tgm-one__hd{max-width:38rem}
.topa .tgm-panels{display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(12px,1.6vw,20px);margin-top:clamp(28px,3.4vw,44px)}
.topa .tgm-panel{position:relative;overflow:hidden;padding:clamp(22px,2.5vw,32px);
  border-radius:3px;border:1px solid var(--gm-rule);
  background:linear-gradient(168deg,rgba(212,175,98,.05),rgba(255,255,255,.014));
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  transition:transform .45s var(--ez),border-color .45s,background .45s,box-shadow .45s}
.topa .tgm-panel::before{content:"";position:absolute;inset:0 0 auto;height:1px;
  background:var(--gm-grad);opacity:0;transition:opacity .45s}
.topa .tgm-panel:hover{transform:translateY(-5px);border-color:var(--line3);
  background:linear-gradient(168deg,rgba(212,175,98,.09),rgba(255,255,255,.02));
  box-shadow:0 24px 50px -30px rgba(212,175,98,.5)}
.topa .tgm-panel:hover::before{opacity:1}
.topa .tgm-panel__n{display:block;font-family:var(--gm-serif);font-size:15px;
  color:var(--g);opacity:.7;letter-spacing:.1em;direction:ltr;unicode-bidi:isolate;
  margin-bottom:16px}
.topa .tgm-panel__ic{width:40px;height:40px;border-radius:2px;display:grid;place-items:center;
  margin-bottom:16px;color:var(--g);
  border:1px solid var(--gm-rule);background:rgba(212,175,98,.05);
  transition:border-color .45s,background .45s,transform .45s var(--ez)}
.topa .tgm-panel__ic svg{width:18px;height:18px}
.topa .tgm-panel:hover .tgm-panel__ic{border-color:var(--line3);
  background:rgba(212,175,98,.1);transform:translateY(-2px)}
.topa .tgm-panel__t{font-size:16.5px;font-weight:600;color:var(--w);line-height:1.55;margin-bottom:9px}
.topa .tgm-panel__d{font-size:var(--body);color:var(--tx2);line-height:2}
.topa .tgm-one__cta{margin-top:clamp(26px,3.2vw,38px)}

/* ══════════════════════════════════════════════════════════════
   10) المقارنة الصغيرة — كتلتان يفصلهما خط ذهبي
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-cmp{display:grid;grid-template-columns:1fr 1px 1fr;
  gap:clamp(18px,3vw,48px);align-items:stretch;max-width:900px;margin-inline:auto}
.topa .tgm-cmp__sep{background:linear-gradient(180deg,transparent,var(--g45) 22%,var(--g45) 78%,transparent)}
.topa .tgm-cmp__i{padding-block:clamp(6px,1vw,14px)}
.topa .tgm-cmp__k{display:inline-flex;align-items:center;gap:9px;
  font-size:11px;font-weight:600;letter-spacing:.24em;color:var(--g);margin-bottom:12px}
.topa .tgm-cmp__k::before{content:"";width:18px;height:1px;background:var(--g45);flex:none}
.topa .tgm-cmp__v{font-size:15px;color:var(--tx);line-height:1.95}
.topa .tgm-cmp__v b{font-family:var(--gm-serif);font-size:20px;font-weight:400;
  color:var(--g-lt);direction:ltr;unicode-bidi:isolate}

/* ══════════════════════════════════════════════════════════════
   11) الأسئلة والتنبيه
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-faq{max-width:820px;margin-inline:auto}
.topa .tgm-faq .t-q{border-bottom-color:var(--gm-rule)}
.topa .tgm-faq .t-q__b{padding-block:clamp(17px,2vw,22px);font-size:15.2px;letter-spacing:.01em}
.topa .tgm-faq .t-q__i{border-radius:2px;border-color:var(--gm-rule)}
.topa .tgm-faq .t-q.is-open .t-q__i{background:var(--gm-grad);border-color:transparent;color:var(--gm-ink)}
.topa .tgm-faq .t-q__c{line-height:2.1}

.topa .tgm-notice{display:flex;align-items:flex-start;gap:12px;
  margin:clamp(30px,3.6vw,46px) auto 0;max-width:760px;
  padding:16px 18px;border-radius:3px;
  border:1px solid var(--gm-rule);background:rgba(212,175,98,.04);
  font-size:12.6px;color:var(--tx2);line-height:1.95}
.topa .tgm-notice svg{width:17px;height:17px;color:var(--g);flex:none;margin-top:3px}

/* ══════════════════════════════════════════════════════════════
   12) التذييل
   ══════════════════════════════════════════════════════════════ */
.topa .tgm-ft{border-top:1px solid var(--gm-rule);padding-block:28px 26px;background:var(--bg)}
.topa .tgm-ft__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:12px 22px;font-size:12px;color:var(--tx3);letter-spacing:.02em}
.topa .tgm-ft__in nav{display:flex;flex-wrap:wrap;gap:2px 18px}
.topa .tgm-ft__in a{display:inline-flex;align-items:center;min-height:40px;transition:color .3s}
.topa .tgm-ft__in a:hover{color:var(--g)}

/* ══════════════════════════════════════════════════════════════
   13) الظهور بالتتابع (الإخفاء يبدأ فقط بعد تأكيد عمل JavaScript)
   ══════════════════════════════════════════════════════════════ */
.topa.tgm-armed [data-gm]{opacity:0;transform:translateY(22px);
  transition:opacity .85s var(--ez),transform .85s var(--ez)}
.topa.tgm-armed [data-gm].is-in{opacity:1;transform:none}

/* العنوان يدخل كلمةً بعد كلمة:
   نظام الكلمات المشترك (.t-wd) يكشفها عند [data-rv].is-in، وهذه الصفحة
   تستخدم [data-gm]، لذلك نصل النظامين هنا. الحاوية نفسها لا تتحرك
   حتى لا تزدوج الحركة مع حركة الكلمات. */
.topa.tgm-armed [data-words][data-gm]{opacity:1;transform:none;transition:none}
.topa.tp-anim.tgm-armed [data-words][data-gm].is-in .t-wd{opacity:1;transform:none}
.topa.tgm-armed [data-gm-stagger] > *{opacity:0;transform:translateY(24px);
  transition:opacity .8s var(--ez),transform .8s var(--ez)}
.topa.tgm-armed [data-gm-stagger].is-in > *{opacity:1;transform:none}
.topa.tgm-armed [data-gm-stagger].is-in > *:nth-child(1){transition-delay:.04s}
.topa.tgm-armed [data-gm-stagger].is-in > *:nth-child(2){transition-delay:.16s}
.topa.tgm-armed [data-gm-stagger].is-in > *:nth-child(3){transition-delay:.28s}
.topa.tgm-armed [data-gm-stagger].is-in > *:nth-child(4){transition-delay:.4s}
.topa.tgm-armed [data-gm-stagger].is-in > *:nth-child(5){transition-delay:.52s}

/* Parallax خفيف بين الأقسام — يحرّكه JavaScript */
.topa .tgm-par{will-change:transform}

/* ══════════════════════════════════════════════════════════════
   14) التجاوب
   ══════════════════════════════════════════════════════════════ */
@media (max-width:1080px){
  .topa .tgm-hero__in{grid-template-columns:1fr;gap:clamp(28px,4vw,42px)}
  .topa .tgm-hero__x{order:2}
  .topa .tgm-book{order:1;max-width:330px;margin-inline:auto}
  .topa .tgm-book__stage,.topa .tgm-book__refl{width:100%}
  .topa .tgm-h1{max-width:none}
  .topa .tgm-meta{max-width:none}
}
@media (max-width:900px){
  .topa .tgm-panels{grid-template-columns:1fr}
  /* المسار يصبح رأسياً واضحاً */
  .topa .tgm-path{grid-template-columns:1fr;justify-items:center;gap:18px}
  .topa .tgm-conn{width:2px;min-width:0;height:clamp(56px,9vw,84px);
    background:linear-gradient(180deg,rgba(212,175,98,.12),var(--g),rgba(212,175,98,.12));
    transform-origin:center top}
  .topa.tgm-armed .tgm-conn{transform:scaleY(0)}
  .topa.tgm-armed .is-in .tgm-conn{transform:none}
  .topa .tgm-conn::after{right:auto;left:50%;top:0;transform:translateX(-50%)}
  .topa.tgm-armed .is-in .tgm-conn::after{animation-name:tgmSparkV}
  @keyframes tgmSparkV{
    0%{top:0;opacity:0}10%{opacity:1}
    70%{top:100%;opacity:1}80%{top:100%;opacity:0}100%{top:100%;opacity:0}}
  .topa .tgm-cmp{grid-template-columns:1fr;gap:0}
  .topa .tgm-cmp__sep{height:1px;width:100%;
    background:linear-gradient(90deg,transparent,var(--g45) 22%,var(--g45) 78%,transparent);
    margin-block:clamp(20px,3vw,28px)}
}
@media (max-width:680px){
  .topa .tgm-hdr__in{height:60px}
  .topa .tgm-brand img{height:32px;width:32px}
  .topa .tgm-brand b{font-size:11.5px;letter-spacing:.12em}
  .topa .tgm-btn{width:100%;min-height:54px;padding:0 18px;font-size:13.4px}
  .topa .tgm-hero__cta{align-items:stretch}
  .topa .tgm-book{max-width:264px}
  .topa .tgm-meta{gap:4px 0;padding-block:13px}
  .topa .tgm-meta__i{padding-inline:11px;font-size:11.8px}
  .topa .tgm-chapter{grid-template-columns:1fr;gap:6px;padding-block:26px}
  .topa .tgm-chapter__n{font-size:56px}
  .topa .tgm-chapter__dot,.topa .tgm-ch__spine{display:none}
  .topa .tgm-chapter:nth-child(3) .tgm-chapter__x,
  .topa .tgm-chapter:nth-child(4) .tgm-chapter__x{padding-inline-start:0}
  .topa .tgm-ft__in{flex-direction:column;align-items:flex-start}
}
@media (max-width:400px){
  .topa .tgm-brand b{display:none}
  .topa .tgm-brand{min-width:44px;justify-content:center}
  .topa .tgm-eyebrow{letter-spacing:.3em;font-size:10.2px}
  .topa .tgm-chapter__d,.topa .tgm-panel__d{font-size:13.4px}
}

/* ══════════════════════════════════════════════════════════════
   15) تقليل الحركة
   ══════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
  .topa .tgm-dust::before,
  .topa .tgm-book.tgm-armed .tgm-book__stage,
  .topa .tgm-book.tgm-armed .tgm-book__sweep::after,
  .topa .tgm-btn::after,
  .topa.tgm-armed .is-in .tgm-conn::after{animation:none!important}
  .topa.tgm-armed .tgm-book__stage{opacity:1;transform:none!important}
  .topa.tgm-armed [data-gm],
  .topa.tgm-armed [data-gm-stagger] > *{opacity:1;transform:none;transition:none!important}
  .topa.tgm-armed .tgm-rule,.topa.tgm-armed .tgm-conn{transform:none!important;transition:none!important}
  .topa .tgm-par{transform:none!important}
  .topa .tgm-panel,.topa .tgm-btn,.topa .tgm-back,.topa .tgm-side__box{transition-duration:.001ms}
}
@media print{.topa .tgm-back,.topa .tgm-dust,.topa .tgm-rays{display:none!important}}