/* =====================================================================================
   ✅ [CONTROL PANEL] 0) كل الكنترول هنا (ألوان/فونت/مقاسات/روابط)
   - عدّل هنا فقط بدون ما تلمس باقي الكود
===================================================================================== */
html, body{
  width:100%;
  overflow-x:hidden;
}

:root{

  /* ================= COLORS ================= */

  --bg-dark:#0b1016;
  --bg-card:#121722;

  /* ألوان الأزرار */
  --accent-orange:#ff9d2f;
  --accent-teal:#14e0c3;   /* teal حقيقي */

  /* ================= الخلفية العامة ================= */

  /* طبقة يمين (دافئة خفيفة) */
  --grad-orange: rgba(255,140,0,0.18);

  /* طبقة شمال (teal غامق سينمائي) */
  --grad-teal: rgba(0,180,160,0.100);

  /* ================= وهج الهيرو (ورا الصورة مباشرة) ================= */

  /* teal قوي ورا الصورة */
  --hero-glow-orange: rgba(0,210,185,0.95);

  /* طبقة عمق */
  --hero-glow-teal: rgba(0,160,140,0.8);

  /* ================= نصوص ================= */

  --text:#ffffff;
  --muted:#bfc7d6;

  /* ================= TYPOGRAPHY DESKTOP ================= */

  --h1:64px;
  --p:18px;
  --h2:32px;
  --card-title:18px;
  --card-text:14px;

  /* ================= TYPOGRAPHY MOBILE ================= */

  --h1-m:27px;
  --p-m:16px;
  --h2-m:26px;

  /* ================= SIZES ================= */

  --radius:16px;
  --shadow:0 18px 55px rgba(0,0,0,0.35);

  /* ✅ روابط (لو حبيت تضيفها هنا) */
  --facebook-reviews-url: "https://www.facebook.com/hsauin.anaalwadelsess/";
}

/* =====================================================================================
   ✅ [BASE]
===================================================================================== */
*{margin:0;padding:0;box-sizing:border-box;font-family:'Cairo',sans-serif;}
html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at 70% 20%, var(--grad-orange), transparent 44%),
    radial-gradient(circle at 20% 55%, var(--grad-teal), transparent 44%),
    var(--bg-dark);
  color:var(--text);
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none;}
.container{padding-inline:8%;}
@media(max-width:980px){ .container{padding-inline:6%;} }

/* =====================================================================================
   ✅ [NAVBAR] Sticky + Transparent ( نون)
===================================================================================== */
nav{
  position:sticky; top:0; z-index:999;
  padding:14px 5%;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  background:rgba(10,15,25,0.68);
  backdrop-filter: blur(14px);
  border-bottom:1px solid rgba(255,255,255,0.06);
}

.brand{display:flex; align-items:center; gap:12px; min-width:240px;}
.brandLogo{
  width:38px;height:38px;border-radius:12px;object-fit:cover;object-position:50% 12%;
  box-shadow:0 12px 30px rgba(0,0,0,0.35);
}
.brandText .title{font-weight:900;font-size:16px;line-height:1.2;}
.brandText .sub{font-size:12px;color:var(--muted);opacity:.92;}

.menu{display:flex; gap:18px; align-items:center;}
.menu a{
  color:var(--muted);
  font-weight:800;
  padding:8px 10px;
  border-radius:12px;
  transition:.25s;
}
.menu a:hover{color:var(--accent-teal); background:rgba(255,255,255,0.04);}

.topBtn{
  background:var(--accent-teal);
  color:#001018;
  padding:10px 16px;
  border-radius:14px;
  font-weight:900;
  transition:.25s;
  white-space:nowrap;
}
.topBtn:hover{transform:translateY(-1px); filter:brightness(1.05);}

.hamburger{
  display:none;
  width:44px;height:44px;border-radius:14px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(0,0,0,0.25);
  color:#fff;
}
@media(max-width:980px){
  .menu{display:none;}
  .hamburger{display:inline-flex;align-items:center;justify-content:center;}
  .topBtn{padding:10px 14px; font-size:14px;}
  .brand{min-width:auto;}
}

/* =====================================================================================
   ✅ [HERO]
===================================================================================== */
.hero{
  min-height:calc(100vh - 74px);
  display:grid;
  grid-template-columns: 1.15fr 1fr;
  align-items:center;
  gap:52px;
  padding:46px 8% 20px;
}

.heroText h1{font-size:var(--h1);line-height:1.25;font-weight:900;margin-bottom:16px;}
.heroText p{font-size:var(--p);color:var(--muted);line-height:1.9;margin-bottom:22px;max-width:660px;}

.heroBtns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.btnPrimary{
  background:var(--accent-orange);
  color:#1a0f00;
  padding:12px 22px;
  border-radius:14px;
  font-weight:900;
  border:none;
  cursor:pointer;
  transition:.25s;
}
.btnPrimary:hover{transform:translateY(-1px); filter:brightness(1.03);}
.btnSecondary{
  background:rgba(39,211,177,0.10);
  border:1px solid rgba(39,211,177,0.48);
  color:var(--accent-teal);
  padding:12px 22px;
  border-radius:14px;
  font-weight:900;
  cursor:pointer;
  transition:.25s;
}
.btnSecondary:hover{transform:translateY(-1px);}

.rating{display:flex;align-items:center;gap:10px;color:var(--muted);font-weight:900;}
.rating .stars{color:var(--accent-teal);letter-spacing:2px;}

.heroImage{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:480px;
}

.heroImage::before{
  content:'';
  position:absolute;
  width:min(560px, 95%);
  height:min(560px, 95%);
  background:
    radial-gradient(circle at 56% 38%,
      var(--hero-glow-orange),
      var(--hero-glow-teal),
      transparent 72%);
  filter:blur(70px);
  z-index:-2;
  animation:pulse 6.2s ease-in-out infinite;
  will-change:opacity;
}
.heroImage::after{
  content:'';
  position:absolute;
  width:min(460px, 86%);
  height:min(460px, 86%);
  background:radial-gradient(circle, rgba(255,157,47,0.45), transparent 70%);
  filter:blur(45px);
  z-index:-1;
  opacity:.9;
  animation:shine 4.8s ease-in-out infinite;
}

.heroPic{
  width:min(520px, 95%);
  height:auto;
  display:block;
  animation: fadeIn 1.1s ease both, float 6.5s ease-in-out infinite;
}

.softIcon{
  position:absolute;
  width:120px;
  height:130px;
  object-fit:contain;
  filter:drop-shadow(0 18px 25px rgba(0,0,0,0.38));
  opacity:.96;
  animation:float 4.6s ease-in-out infinite;
}
.iconLeft{left:9%; top:22%;}
.iconRight{right:9%; top:22%; animation-delay:.25s;}
.iconMid{right:12%; bottom:18%; animation-delay:.5s;}

@media(max-width:980px){
  .hero{grid-template-columns:1fr;text-align:center;padding-top:28px;gap:28px;}
  .heroImage{order:-1; min-height:360px;}
  .heroText h1{font-size:var(--h1-m);}
  .heroText p{font-size:var(--p-m); margin-inline:auto;}
  .heroBtns{justify-content:center;}
  .softIcon{width:50px;height:50px;}
  .iconLeft{left:6%; top:12%;}
  .iconRight{right:6%; top:12%;}
}

/* =====================================================================================
   ✅ [SECTIONS]
===================================================================================== */
.section{padding:64px 8%;}
.sectionHead{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:16px; margin-bottom:18px;
}
.sectionHead h2{font-size:var(--h2); font-weight:900;}
.sectionHead .hint{color:var(--muted); font-size:14px; line-height:1.6;}

@media(max-width:980px){
  .section{padding:52px 6%;}
  .sectionHead h2{font-size:var(--h2-m);}
}

/* =====================================================================================
   ✅ [VIDEO EMBEDS]
===================================================================================== */
.videoGrid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
@media(max-width:980px){ .videoGrid{grid-template-columns:1fr; gap:14px;} }

.videoCard{
  background:rgba(18,23,34,0.86);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:14px;
}
.videoCard h3{font-size:16px;font-weight:900;margin-bottom:10px;}
.videoFrame{
  width:100%;
  aspect-ratio: 16 / 9;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
  background:#000;
}
.videoFrame iframe{width:100%;height:100%;border:0;}

/* =====================================================================================
   ✅ [SLIDER]
===================================================================================== */
.sliderWrap{position:relative;}
.slider{
  display:flex;
  gap:14px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:6px 4px 12px;
  scroll-behavior:smooth;
}
.slider::-webkit-scrollbar{height:10px;}
.slider::-webkit-scrollbar-track{background:rgba(255,255,255,0.06); border-radius:999px;}
.slider::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.18); border-radius:999px;}
.slider::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.26);}

.slide{flex:0 0 340px; scroll-snap-align:start;}
@media(max-width:980px){ .slide{flex-basis:84vw;} }

.card{
  background:rgba(18,23,34,0.86);
  border:1px solid rgba(255,255,255,0.06);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:16px;
  transition:.35s;
}
.card:hover{transform:translateY(-8px); box-shadow:0 28px 70px rgba(0,0,0,0.45);}

.thumb{
  width:100%; height:190px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.06);
  background:linear-gradient(135deg, rgba(39,211,177,0.08), rgba(255,157,47,0.06));
  margin-bottom:12px;
}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;}

.card h3{font-size:var(--card-title); font-weight:900; margin-bottom:6px;}
.card p{font-size:var(--card-text); color:var(--muted); line-height:1.7; margin-bottom:12px;}

.actions{display:flex;gap:10px;flex-wrap:wrap;}
.btnSmall{
  padding:10px 14px;
  border-radius:14px;
  font-weight:900;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(0,0,0,0.22);
  color:#fff;
  cursor:pointer;
  transition:.25s;
}
.btnSmall:hover{transform:translateY(-1px);}
.smallOrange{background:var(--accent-orange); color:#1a0f00; border-color:transparent;}
.smallTeal{background:rgba(39,211,177,0.10); color:var(--accent-teal); border-color:rgba(39,211,177,0.45);}

.sliderNav{
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:10px;
}
.navBtn{
  background:rgba(0,0,0,0.20);
  border:1px solid rgba(255,255,255,0.10);
  color:#fff;
  width:44px; height:44px;
  border-radius:14px;
  cursor:pointer;
  transition:.25s;
}
.navBtn:hover{transform:translateY(-1px);}

.dots{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.dot{
  width:8px;height:8px;border-radius:999px;
  background:rgba(255,255,255,0.20);
  border:1px solid rgba(255,255,255,0.18);
  cursor:pointer;
  transition:.25s;
}
.dot.active{
  width:22px;
  background:linear-gradient(135deg, rgba(255,157,47,0.95), rgba(39,211,177,0.75));
  border-color:rgba(255,255,255,0.22);
}

/* =====================================================================================
   ✅ [PROMPT MODAL]
===================================================================================== */
.modal{
  position:fixed; inset:0; z-index:2000;
  background:rgba(0,0,0,0.62);
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.modal.show{display:flex;}
.modalBox{
  width:min(860px, 96vw);
  border-radius:18px;
  background:rgba(18,23,34,0.95);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:0 30px 90px rgba(0,0,0,0.55);
  overflow:hidden;
}
.modalHead{
  padding:14px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  background:rgba(0,0,0,0.20);
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.modalTitle{font-weight:900; font-size:16px;}
.modalClose{
  width:42px; height:42px; border-radius:14px;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(0,0,0,0.25);
  color:#fff; cursor:pointer;
}
.modalBody{padding:14px 16px;}
.promptArea{
  width:100%;
  min-height:260px;
  border-radius:16px;
  padding:14px;
  resize:vertical;
  outline:none;
  border:1px solid rgba(255,255,255,0.10);
  background:rgba(0,0,0,0.22);
  color:#fff;
  line-height:1.9;
  font-weight:600;
}
.modalActions{
  display:flex; gap:10px; flex-wrap:wrap;
  padding:14px 16px;
  border-top:1px solid rgba(255,255,255,0.08);
  background:rgba(0,0,0,0.18);
}
.copyOk{font-size:12px;color:var(--muted);}

/* =====================================================================================
   ✅ [WHATSAPP FLOAT]
===================================================================================== */
.whatsapp{
  position:fixed; left:18px; bottom:18px; z-index:1000;
  width:56px; height:56px; border-radius:18px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(39,211,177,0.95), rgba(255,157,47,0.85));
  border:1px solid rgba(255,255,255,0.22);
  box-shadow:0 20px 55px rgba(0,0,0,0.45);
  transition:.25s;
}
.whatsapp:hover{transform:translateY(-2px) scale(1.02);}
.whatsapp span{font-weight:900; color:#001018;}

/* =====================================================================================
   ✅ Animations
===================================================================================== */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes fadeIn{from{opacity:0; transform:translateY(28px)}to{opacity:1; transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:.62}50%{opacity:1}}
@keyframes shine{0%,100%{transform:scale(1); opacity:.82}50%{transform:scale(1.06); opacity:1}}

/* Mobile */
@media(max-width:980px){
  .ctaContent h2{ font-size:24px; }
}

/* ================= ABOUT ================= */
.aboutCenter{
  position:relative;
  text-align:center;
  padding:80px 20px;
  margin:0 auto;
  max-width:1000px;
  background:none;
  border:none;
  box-shadow:none;
}
.aboutGlow{
  position:absolute;
  inset:-120px;
  background:
    radial-gradient(circle at 50% 38%,
      rgba(20,224,195,0.90),
      rgba(0,140,130,0.55),
      transparent 65%);
  opacity:.85;
  pointer-events:none;
  z-index:0;
}
.aboutHeroImg{
  position:relative;
  width:100%;
  max-width:620px;
  height:auto;
  display:block;
  margin:0 auto 20px;
  object-fit:contain;
  z-index:2;
  transition:transform .4s ease;
}
.aboutHeroImg:hover{ transform:scale(1.02); }

.aboutName{
  position:relative;
  z-index:1;
  font-size:26px;
  font-weight:900;
  margin-bottom:0px;
}
.aboutRole{
  position:relative;
  z-index:1;
  color:var(--accent-teal);
  font-weight:900;
  margin-top:0;
}
.aboutDesc{
  position:relative;
  z-index:1;
  color:var(--muted);
  line-height:1.95;
  max-width:720px;
  margin:0 auto;
}
.contactLink{
  display:inline-block;
  margin-top:10px;
  padding:10px 14px;
  border-radius:14px;
  font-weight:900;
  background:rgba(39,211,177,0.10);
  border:1px solid rgba(39,211,177,0.48);
  color:var(--accent-teal);
  transition:.25s;
}
.contactLink:hover{transform:translateY(-1px); filter:brightness(1.05);}

#contact {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
#contact .videoGrid{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:20px;
}

/* ================= EDITOR CTA ================= */
.editorCtaSection{
  margin:80px auto;
  padding:0 8%;
}
.editorCtaBox{
  padding:45px 40px;
  border-radius:28px;
  text-align:center;
  position:relative;
  background:
    linear-gradient(135deg, rgba(255,157,47,0.10), rgba(20,224,195,0.08)),
    rgba(18,23,34,0.75);
  backdrop-filter: blur(18px);
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 35px 90px rgba(0,0,0,0.55);
}
.editorCtaText h2{
  font-size:32px;
  font-weight:900;
  margin-bottom:14px;
}
.editorCtaText p{
  color:var(--muted);
  max-width:600px;
  margin:0 auto 28px;
  line-height:1.9;
}
.editorCtaActions{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}
.editorBtnPrimary{
  padding:14px 32px;
  border-radius:20px;
  font-weight:900;
  background:var(--accent-orange);
  color:#1a0f00;
  transition:.3s;
  box-shadow:0 15px 35px rgba(255,157,47,0.4);
}
.editorBtnPrimary:hover{
  transform:translateY(-4px);
  box-shadow:0 25px 60px rgba(255,157,47,0.6);
}
.editorBtnSecondary{
  padding:14px 28px;
  border-radius:20px;
  font-weight:900;
  background:rgba(39,211,177,0.10);
  color:var(--accent-teal);
  border:1px solid rgba(39,211,177,0.4);
  transition:.3s;
}
.editorBtnSecondary:hover{
  transform:translateY(-4px);
  background:rgba(39,211,177,0.18);
}

/* ================= MOBILE MENU ================= */
.mobileMenu{
  position:fixed;
  top:74px;
  right:0;
  width:100%;
  background:rgba(10,15,25,0.95);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,0.06);
  display:none;
  flex-direction:column;
  padding:20px;
  gap:15px;
  z-index:998;
}
.mobileMenu a{
  color:#fff;
  font-weight:900;
  padding:12px;
  border-radius:12px;
  background:rgba(255,255,255,0.05);
}

/* ================= FOOTER ================= */
.siteFooter{
  background:#0f141c;
  border-top:1px solid rgba(255,255,255,0.08);
  margin-top:80px;
  padding-top:50px;
}
.footerContainer{
  max-width:1200px;
  margin:auto;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:40px;
  padding:0 40px 40px;
}
.footerBrand h3{ font-weight:900; margin-bottom:10px; }
.footerBrand p{ color:var(--muted); }

.footerLinks,
.footerSocial{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.footerLinks a,
.footerSocial a{
  color:var(--muted);
  text-decoration:none;
  transition:0.3s;
}
.footerLinks a:hover,
.footerSocial a:hover{ color:var(--accent-teal); }

.footerBottom{
  text-align:center;
  padding:20px;
  border-top:1px solid rgba(255,255,255,0.05);
  color:var(--muted);
  font-size:14px;
}

/* Fade on scroll */
.js .fade-section{
  opacity:0;
  transform:translateY(40px);
  transition:opacity .8s ease, transform .8s ease;
  will-change:opacity, transform;
}
.js .fade-section.visible{
  opacity:1;
  transform:translateY(0);
}

/* =====================================================================================
   ✅ [PERF] تخفيف الحمل: أقسام بعيدة لا تُرسم قبل ظهورها + احترام تقليل الحركة + موبايل أخف
===================================================================================== */
#videos,#thumbs,#about,#contact,.siteFooter,.editorCtaSection{content-visibility:auto;contain-intrinsic-size:auto 620px;}
.slide{content-visibility:auto;contain-intrinsic-size:340px 420px;}
.thumb img{background:#0e141d;}
@media(max-width:980px){
  nav{backdrop-filter:blur(8px);}
  .heroImage::before{filter:blur(40px);animation:none;opacity:.8;}
  .heroImage::after{filter:blur(30px);animation:none;}
  .heroPic{animation:fadeIn 1.1s ease both;}
  .softIcon{animation:none;}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important;}
  .js .fade-section{opacity:1;transform:none;}
}

/* =====================================================================================
   ✅ [SUPPORT STRIP] شريط الدعم بعد الهيرو — هادئ ومش لافت
===================================================================================== */
.supportStrip{padding:0 8%;margin:-6px 0 8px;}
.supportBox{
  max-width:880px;margin:0 auto;padding:12px 16px;border-radius:18px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  background:linear-gradient(135deg,rgba(255,255,255,0.035),rgba(255,255,255,0.015));
  border:1px solid rgba(255,255,255,0.07);
  box-shadow:0 14px 40px rgba(0,0,0,0.22);
  transition:border-color .3s, background .3s;
}
.supportBox:hover{border-color:rgba(20,224,195,0.28);background:linear-gradient(135deg,rgba(20,224,195,0.05),rgba(255,157,47,0.04));}
.supportText{display:flex;flex-direction:column;gap:2px;min-width:200px;flex:1 1 260px;}
.supportText b{font-weight:900;font-size:14.5px;color:#e9eef7;}
.supportText span{font-size:12.5px;color:var(--muted);opacity:.9;}
.supportAmounts{display:flex;gap:6px;flex-wrap:wrap;}
.supportAmounts i{font-style:normal;font-weight:800;font-size:12px;color:#cfd8e6;padding:3px 9px;border-radius:999px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.07);}
.supportPay{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.payBadge{display:inline-flex;align-items:center;justify-content:center;height:26px;min-width:26px;padding:0 8px;border-radius:9px;font-size:11px;font-weight:900;letter-spacing:.2px;color:#fff;opacity:.92;}
.payBadge img{height:16px;width:auto;display:block;}
.payBadge.vf{background:#d4151f;}
.payBadge.ip{background:linear-gradient(135deg,#5b2d8e,#8c4bc0);}
.payNum{
  display:inline-flex;align-items:center;gap:8px;direction:ltr;cursor:pointer;
  font-weight:900;font-size:14px;letter-spacing:.6px;color:var(--accent-teal);
  padding:6px 12px;border-radius:12px;background:rgba(20,224,195,0.07);border:1px dashed rgba(20,224,195,0.35);
  transition:.25s;
}
.payNum:hover{background:rgba(20,224,195,0.14);transform:translateY(-1px);}
.payNum small{font-size:10.5px;font-weight:700;color:var(--muted);letter-spacing:0;}
@media(max-width:700px){.supportBox{justify-content:center;text-align:center;}.supportText{align-items:center;}.supportAmounts,.supportPay{justify-content:center;}}

/* =====================================================================================
   ✅ [MARQUEE] شريط الصور المتحرك
===================================================================================== */
.marquee{padding:34px 0 6px;overflow:hidden;direction:ltr;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent);
          mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent);}
.marquee[hidden]{display:none;}
.mqRow{display:flex;width:max-content;gap:14px;margin-bottom:14px;animation:mq var(--mq-dur,60s) linear infinite;will-change:transform;}
.mqRow.rev{animation-direction:reverse;}
.marquee:hover .mqRow{animation-play-state:paused;}
.mqItem{flex:0 0 auto;width:250px;aspect-ratio:16/9;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,0.07);background:#0e141d;box-shadow:0 12px 30px rgba(0,0,0,0.3);}
.mqItem img{width:100%;height:100%;object-fit:cover;display:block;}
@keyframes mq{to{transform:translateX(-50%)}}
@media(max-width:700px){.mqItem{width:170px;}}

/* =====================================================================================
   ✅ [YOUTUBE FACADE] الفيديو يتحمّل لما المستخدم يدوس بس (أخف بكتير)
===================================================================================== */
.ytFacade{position:relative;display:block;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:#000;overflow:hidden;}
.ytFacade img{width:100%;height:100%;object-fit:cover;display:block;opacity:.92;transition:.3s;}
.ytFacade:hover img{opacity:1;transform:scale(1.02);}
.ytFacade .play{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;background:rgba(0,0,0,0.55);border:2px solid rgba(255,255,255,0.8);display:grid;place-items:center;color:#fff;font-size:24px;padding-inline-start:4px;}

/* =====================================================================================
   ✅ [CARDS DATA-DRIVEN] ترقيم الكروت + التنقل بين الأقسام
===================================================================================== */
.catChips{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px;}
.catChips a{padding:7px 14px;border-radius:999px;font-weight:800;font-size:13.5px;color:var(--muted);background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);transition:.25s;}
.catChips a:hover{color:var(--accent-teal);border-color:rgba(20,224,195,0.4);}
.catBlock{scroll-margin-top:90px;}
.catBlock + .catBlock{margin-top:34px;}
.catMeta{color:var(--muted);font-size:12.5px;margin-inline-start:6px;}
.sentinel{flex:0 0 1px;}
.skelCard{flex:0 0 340px;height:340px;border-radius:var(--radius);background:linear-gradient(110deg,rgba(255,255,255,0.03) 30%,rgba(255,255,255,0.07) 50%,rgba(255,255,255,0.03) 70%);background-size:200% 100%;animation:skel 1.4s linear infinite;}
@keyframes skel{to{background-position:-200% 0}}
.dataError{padding:18px;border:1px dashed rgba(255,255,255,0.18);border-radius:14px;color:var(--muted);text-align:center;}

/* =====================================================================================
   ✅ [CONTACT FORM] نموذج الرسالة / الحجز
===================================================================================== */
.contactFormWrap{width:100%;max-width:760px;margin:34px auto 0;text-align:right;}
.contactForm{padding:22px;border-radius:22px;background:rgba(18,23,34,0.86);border:1px solid rgba(255,255,255,0.07);box-shadow:var(--shadow);display:grid;gap:14px;}
.contactForm h3{font-size:20px;font-weight:900;margin-bottom:2px;}
.contactForm .sub{color:var(--muted);font-size:13.5px;margin-top:-8px;}
.formRow{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.formField{display:grid;gap:6px;}
.formField label{font-size:13px;font-weight:800;color:var(--muted);}
.formField input,.formField select,.formField textarea{width:100%;border-radius:14px;padding:12px 14px;border:1px solid rgba(255,255,255,0.12);background:rgba(0,0,0,0.25);color:#fff;font-weight:600;outline:none;transition:border-color .2s;}
.formField textarea{min-height:130px;resize:vertical;line-height:1.8;}
.formField input:focus,.formField select:focus,.formField textarea:focus{border-color:rgba(20,224,195,0.65);}
.formField select option{color:#000;}
.formField .err{color:#ff8a80;font-size:12.5px;min-height:0;}
.hp{position:absolute !important;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none;}
.formActions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.formActions .btnPrimary:disabled{opacity:.55;cursor:not-allowed;transform:none;}
.formStatus{font-weight:800;font-size:14px;}
.formStatus.ok{color:var(--accent-teal);}
.formStatus.bad{color:#ff8a80;}
.formStatus a{text-decoration:underline;}
@media(max-width:700px){.formRow{grid-template-columns:1fr;}}

/* Toast (نسخ) */
.haToast{position:fixed;bottom:84px;left:50%;transform:translate(-50%,20px);background:#0f1722;border:1px solid rgba(20,224,195,0.45);color:#fff;padding:10px 18px;border-radius:14px;font-weight:800;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:3000;}
.haToast.show{opacity:1;transform:translate(-50%,0);}

.mobileMenu.open{display:flex;}
.catChips[hidden],.marquee[hidden]{display:none;}
.catCount{margin-inline-start:auto;color:var(--muted);font-size:12.5px;font-weight:700;}
.sliderNav{align-items:center;}
.payName{margin-inline-start:4px;}

/* =====================================================================================
   ✅ [NAV v3] روابط الصفحات الجديدة + أيقونات السوشيال (كل الصفحات)
===================================================================================== */
.menu{gap:4px;}
.menu a{font-size:15px;padding:8px 10px;white-space:nowrap;}
.menuSep{width:1px;height:22px;background:rgba(255,255,255,0.12);margin:0 6px;}
.navStore{display:inline-flex;align-items:center;gap:6px;}
.navStore svg{width:18px;height:18px;flex:0 0 auto;}
.navStore.gifts svg{color:var(--accent-teal);}
.navStore.packs svg{color:var(--accent-orange);}
.navStore.master svg{color:#ffd27a;}
.menu .navStore[aria-current="page"]{color:#fff;background:rgba(255,255,255,0.07);box-shadow:inset 0 -2px 0 var(--accent-teal);}
.navSocial,.mSocial,.fSocial{display:flex;align-items:center;gap:6px;}
.navSocial{display:none;}
.soc{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:var(--muted);background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);transition:.25s;}
.soc svg{width:18px;height:18px;}
.soc:hover{color:#fff;transform:translateY(-1px);}
.soc.fb:hover{background:#1f4fbf;border-color:transparent;}
.soc.yt:hover{background:#d4151f;border-color:transparent;}
.soc.ig:hover{background:linear-gradient(135deg,#7a3cc9,#d4316a,#f2a03d);border-color:transparent;}
.soc.wa:hover{background:#1fa855;border-color:transparent;}
.fSocial{margin-top:14px;}
.mobileMenu .navStore{display:flex;}
.mSocial{padding-top:4px;}
.mSocial .soc{width:42px;height:42px;padding:0;background:rgba(255,255,255,0.05);}
.whatsapp svg{width:28px;height:28px;color:#001018;}
@media(min-width:1440px){.navSocial{display:flex;}}
@media(max-width:1180px){
  .menu{display:none;}
  .hamburger{display:inline-flex;align-items:center;justify-content:center;}
  .brand{min-width:auto;}
}

/* =====================================================================================
   ✅ [PROMO] أزرار الإعلان للصفحات الثلاثة بعد الهيرو
===================================================================================== */
.promoSection{padding:10px 8% 6px;}
.promoRow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:1240px;margin:0 auto;}
.promoRow.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:920px;}
.promo{
  --c1:var(--accent-teal);--c2:rgba(20,224,195,0.05);
  position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:14px;
  padding:18px 18px 18px 16px;border-radius:20px;min-height:104px;
  box-shadow:0 18px 45px rgba(0,0,0,0.32);
  animation:promoFloat 5.5s ease-in-out infinite;transition:transform .3s, box-shadow .3s;
}
.promo.packs{--c1:var(--accent-orange);--c2:rgba(255,157,47,0.06);animation-delay:-1.8s;}
.promo.master{--c1:#ffd27a;--c2:rgba(255,210,122,0.06);animation-delay:-3.6s;}
.promo::before{
  content:'';position:absolute;z-index:-2;inset:-80%;
  background:conic-gradient(from 0deg,transparent 0deg,var(--c1) 50deg,transparent 110deg,transparent 180deg,rgba(255,255,255,0.35) 230deg,transparent 280deg);
  animation:promoSpin 6s linear infinite;
}
.promo::after{
  content:'';position:absolute;z-index:-1;inset:1.5px;border-radius:19px;
  background:radial-gradient(circle at 85% 0%,var(--c2),transparent 60%),linear-gradient(160deg,#151c29,#0f141d);
}
.promo:hover{transform:translateY(-4px);box-shadow:0 24px 60px rgba(0,0,0,0.45),0 0 0 1px var(--c1);animation-play-state:paused;}
.promoIcon{flex:0 0 auto;width:58px;height:58px;border-radius:16px;display:grid;place-items:center;color:var(--c1);background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.09);}
.promoIcon svg{width:30px;height:30px;animation:promoIcon 2.8s ease-in-out infinite;}
.promoTxt{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1;}
.promoTxt b{font-size:19px;font-weight:900;line-height:1.3;}
.promoTxt small{font-size:13px;color:var(--muted);line-height:1.6;}
.promoTag{position:absolute;top:10px;left:12px;font-size:10.5px;font-weight:900;letter-spacing:.3px;padding:2px 9px;border-radius:999px;color:#071016;background:var(--c1);}
.promoCount{position:absolute;bottom:10px;left:14px;font-size:11.5px;font-weight:800;color:var(--c1);}
.promoGo{flex:0 0 auto;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:900;color:var(--c1);border:1px solid rgba(255,255,255,0.12);transition:transform .3s;}
.promo:hover .promoGo{transform:translateX(-5px);background:var(--c1);color:#071016;}
@keyframes promoSpin{to{transform:rotate(360deg)}}
@keyframes promoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes promoIcon{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.08) rotate(-6deg)}}
@media(max-width:980px){
  .promoRow,.promoRow.two{grid-template-columns:1fr;gap:12px;}
  .promo{min-height:88px;padding:14px;animation:none;}
  .promoIcon{width:50px;height:50px;}
  .promoTxt b{font-size:17px;}
}

/* =====================================================================================
   ✅ [AI TOOLS] 4 مواقع AI مجانية
===================================================================================== */
.aiTools{padding:30px 8% 10px;}
.aiHead{display:flex;align-items:baseline;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:16px;text-align:center;}
.aiHead h2{font-size:24px;font-weight:900;}
.aiHead span{color:var(--muted);font-size:14px;}
.aiGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:1240px;margin:0 auto;}
.aiBtn{
  --ai:var(--accent-teal);
  position:relative;display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:16px;
  background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.08);transition:.25s;
}
.aiBtn:hover{transform:translateY(-2px);border-color:var(--ai);background:rgba(255,255,255,0.06);}
.aiBtn.fl{--ai:#7fb2ff;}
.aiBtn.do{--ai:var(--accent-orange);}
.aiBtn.as{--ai:#c3a6ff;}
.aiMono{flex:0 0 auto;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;direction:ltr;font-weight:900;font-size:15px;color:#071016;background:var(--ai);}
.aiTxt{display:flex;flex-direction:column;min-width:0;}
.aiTxt b{font-size:15px;font-weight:900;direction:ltr;text-align:right;}
.aiTxt small{font-size:12px;color:var(--muted);line-height:1.6;}
.aiFree{margin-inline-start:auto;flex:0 0 auto;font-size:10.5px;font-weight:900;color:var(--ai);border:1px solid var(--ai);border-radius:999px;padding:1px 8px;}
@media(max-width:1100px){.aiGrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:560px){.aiGrid{grid-template-columns:1fr;}}

/* =====================================================================================
   ✅ [STORE PAGES] الهدايا / الباقات / الماستر كلاس
===================================================================================== */
.pageHero{text-align:center;padding:56px 8% 8px;max-width:1040px;margin:0 auto;}
.eyebrow{display:inline-block;padding:5px 14px;border-radius:999px;font-weight:900;font-size:13px;color:var(--accent-teal);background:rgba(20,224,195,0.08);border:1px solid rgba(20,224,195,0.35);}
.pageHero.packs .eyebrow{color:var(--accent-orange);background:rgba(255,157,47,0.08);border-color:rgba(255,157,47,0.4);}
.pageHero.master .eyebrow{color:#ffd27a;background:rgba(255,210,122,0.08);border-color:rgba(255,210,122,0.4);}
.pageHero h1{font-size:50px;font-weight:900;line-height:1.3;margin:14px 0 10px;}
.pageHero p{font-size:17px;color:var(--muted);line-height:1.9;max-width:720px;margin:0 auto;}
.pageStat{margin-top:12px;font-weight:800;color:var(--accent-teal);min-height:1.6em;}
.pageHero.packs .pageStat{color:var(--accent-orange);}
.pageHero.master .pageStat{color:#ffd27a;}
.howBuy{list-style:none;display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:18px;}
.howBuy li{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.08);text-align:right;}
.howBuy i{font-style:normal;flex:0 0 auto;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:900;color:#1a0f00;background:var(--accent-orange);}
.howBuy span{font-size:12.5px;color:var(--muted);line-height:1.5;}
.howBuy b{display:block;font-size:14px;color:#fff;}
.storeSection{padding-top:26px;}
.catChips button{padding:7px 14px;border-radius:999px;font-weight:800;font-size:13.5px;color:var(--muted);background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);cursor:pointer;transition:.25s;}
.catChips button:hover{color:var(--accent-teal);border-color:rgba(20,224,195,0.4);}
.catChips button.on{color:#071016;background:var(--accent-teal);border-color:transparent;}
.storeGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px;}
.skelBox{height:340px;border-radius:var(--radius);background:linear-gradient(110deg,rgba(255,255,255,0.03) 30%,rgba(255,255,255,0.07) 50%,rgba(255,255,255,0.03) 70%);background-size:200% 100%;animation:skel 1.4s linear infinite;}
.storeEmpty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:44px 18px;border:1px dashed rgba(255,255,255,0.16);border-radius:18px;text-align:center;}
.storeEmpty b{font-size:20px;font-weight:900;}
.storeEmpty span{color:var(--muted);}

.sBox{display:flex;flex-direction:column;border-radius:var(--radius);background:rgba(18,23,34,0.9);border:1px solid rgba(255,255,255,0.08);overflow:hidden;box-shadow:var(--shadow);transition:transform .3s, border-color .3s;}
.sBox:hover{transform:translateY(-3px);border-color:rgba(20,224,195,0.4);}
.sBox.paid:hover{border-color:rgba(255,157,47,0.45);}
.sBox[hidden]{display:none;}
.sBox.flash{animation:sFlash 1.8s ease 2;}
@keyframes sFlash{50%{box-shadow:0 0 0 3px var(--accent-teal),var(--shadow);}}
.sbMedia{position:relative;aspect-ratio:16/9;background:#0e141d;overflow:hidden;}
.sbPoster,.sbPrev{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}
.sbPrev{opacity:0;transition:opacity .45s;}
.sbMedia.playing .sbPrev{opacity:1;}
.sbPh{position:absolute;inset:0;display:grid;place-items:center;font-weight:900;font-size:20px;color:rgba(255,255,255,0.55);background:radial-gradient(circle at 30% 20%,rgba(20,224,195,0.18),transparent 60%),radial-gradient(circle at 80% 90%,rgba(255,157,47,0.16),transparent 60%),#0e141d;}
.sbPlay{position:absolute;right:10px;bottom:10px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(0,0,0,0.55);border:1px solid rgba(255,255,255,0.35);transition:opacity .3s;}
.sbPlay svg{width:14px;height:14px;}
.sbMedia.playing .sbPlay{opacity:0;}
.sbChips{position:absolute;top:10px;right:10px;display:flex;gap:6px;flex-wrap:wrap;}
.sbTag,.sbBadge{font-size:11.5px;font-weight:900;padding:3px 10px;border-radius:999px;background:rgba(0,0,0,0.6);border:1px solid rgba(255,255,255,0.18);backdrop-filter:blur(6px);}
.sbBadge{background:var(--accent-orange);color:#1a0f00;border-color:transparent;}
.sbLock{position:absolute;top:10px;left:10px;display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:900;padding:3px 10px 3px 8px;border-radius:999px;color:#ffd9a8;background:rgba(0,0,0,0.62);border:1px solid rgba(255,157,47,0.4);backdrop-filter:blur(6px);}
.sbLock svg{width:13px;height:13px;}
.sbBody{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1;}
.sbBody h3{font-size:17px;font-weight:900;line-height:1.5;}
.sbBody p{font-size:13.5px;color:var(--muted);line-height:1.8;}
.sbFoot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:8px;flex-wrap:wrap;}
.sbBtn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;}
.sbBtn svg{width:18px;height:18px;}
.sBox.free .sbBtn{background:var(--accent-teal);color:#001018;}
.sbMeta{font-size:12.5px;color:var(--muted);direction:ltr;}
.sbPrice b{display:block;font-size:20px;font-weight:900;color:var(--accent-orange);line-height:1.2;}
.sbPrice small{font-size:12px;color:var(--muted);}
.sbActs{display:flex;align-items:center;gap:8px;}
.sbWa{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#25d366;background:rgba(37,211,102,0.1);border:1px solid rgba(37,211,102,0.45);transition:.25s;}
.sbWa svg{width:22px;height:22px;}
.sbWa:hover{background:#25d366;color:#04210f;}

.buyBox{width:min(560px,96vw);max-height:92vh;overflow:auto;}
.buyBody{padding:16px 18px 20px;display:grid;gap:16px;}
.buySum{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:12px 14px;border-radius:14px;background:rgba(255,157,47,0.08);border:1px solid rgba(255,157,47,0.3);}
.buySum span{flex:1 1 100%;font-size:12.5px;color:var(--muted);}
.buySum b{font-size:24px;font-weight:900;color:var(--accent-orange);}
.buySum small{color:var(--muted);font-weight:700;}
.buyStep{display:grid;grid-template-columns:30px 1fr;gap:12px;}
.buyStep>i{font-style:normal;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:900;color:#001018;background:var(--accent-teal);}
.buyStep b{display:block;font-size:15.5px;font-weight:900;}
.buyStep span{display:block;font-size:13.5px;color:var(--muted);line-height:1.7;}
.buyMethods{display:grid;gap:8px;margin-top:10px;}
.buyCopy{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%;padding:10px 12px;border-radius:12px;border:1px dashed rgba(20,224,195,0.4);background:rgba(20,224,195,0.06);color:#fff;cursor:pointer;text-align:right;transition:.2s;}
.buyCopy:hover{background:rgba(20,224,195,0.12);}
.buyCopy.done{border-style:solid;border-color:var(--accent-teal);}
.buyCopy b{direction:ltr;color:var(--accent-teal);letter-spacing:.4px;font-size:15px;}
.buyCopy small{margin-inline-start:auto;font-size:11.5px;color:var(--muted);}
.payBadge.pp{background:#1f4fbf;}
.buyWa{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:11px 18px;border-radius:14px;font-weight:900;color:#04210f;background:#25d366;transition:.2s;}
.buyWa svg{width:20px;height:20px;}
.buyWa:hover{transform:translateY(-1px);filter:brightness(1.05);}
.supportStrip.compact{margin:30px 0 0;}
.moreStore{padding-top:30px;padding-bottom:10px;}
.moreStore .sectionHead{justify-content:center;}
@media(max-width:980px){
  .pageHero{padding-top:40px;}
  .pageHero h1{font-size:32px;}
  .pageHero p{font-size:15.5px;}
  .storeGrid{grid-template-columns:1fr;}
}
/* موبايل: القائمة بتسكرول لو طويلة + الهوية في سطر واحد */
.mobileMenu{max-height:calc(100vh - 80px);overflow-y:auto;overscroll-behavior:contain;}
@media(max-width:560px){
  nav{padding:12px 4%;gap:10px;}
  .brandText .title{font-size:14px;white-space:nowrap;}
  .brandText .sub{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw;}
  .topBtn{padding:9px 12px;font-size:13px;}
  .mobileMenu{top:64px;padding:14px;gap:10px;}
  .mobileMenu a{padding:10px 12px;}
}

/* =====================================================================================
   ✅ [ABOUT v4] الصورة في النص + وهج ناعم من غير حواف حادة
===================================================================================== */
#about .sectionHead{flex-direction:column;align-items:center;text-align:center;gap:4px;}
.aboutCenter{padding:24px 16px 10px;max-width:880px;isolation:isolate;}
.aboutGlow{
  inset:auto;left:50%;top:10px;width:min(620px,96%);aspect-ratio:1;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(20,224,195,0.42),rgba(20,224,195,0.16) 55%,rgba(20,224,195,0) 100%);
  opacity:1;z-index:-1;
}
.aboutHeroImg{
  width:min(440px,86%);max-width:none;margin:0 auto 6px;
  -webkit-mask-image:linear-gradient(to bottom,#000 78%,transparent 99%);
          mask-image:linear-gradient(to bottom,#000 78%,transparent 99%);
}
.aboutHeroImg:hover{transform:none;}
.aboutName{font-size:30px;}
.aboutDesc{margin-top:10px;}
.aboutWorks{display:inline-flex;align-items:center;gap:8px;margin-top:20px;padding:11px 20px;border-radius:14px;font-weight:900;color:var(--accent-teal);background:rgba(20,224,195,0.08);border:1px solid rgba(20,224,195,0.4);transition:.25s;}
.aboutWorks:hover{background:rgba(20,224,195,0.16);transform:translateY(-2px);}
.aboutWorks span{animation:bob 1.8s ease-in-out infinite;}
@keyframes bob{50%{transform:translateY(4px)}}
#about{content-visibility:visible;}

/* =====================================================================================
   ✅ [DEVICE] إطار الموبايل لكل فيديو (شرح / ريلز / مشغّل)
===================================================================================== */
.device{
  position:relative;padding:10px;border-radius:30px;
  background:linear-gradient(160deg,#1d2534,#121825);
  border:1px solid rgba(255,255,255,0.09);
  box-shadow:0 22px 50px rgba(0,0,0,0.5),inset 0 0 0 2px rgba(0,0,0,0.35);
}
.device.v{border-radius:34px;padding:9px;}
.device .screen{position:relative;overflow:hidden;border-radius:21px;background:#05080d;aspect-ratio:16/9;}
.device.v .screen{aspect-ratio:9/16;border-radius:26px;}
.device .notch{position:absolute;z-index:3;background:#070a10;border:1px solid rgba(255,255,255,0.06);pointer-events:none;}
.device.h .notch{left:14px;top:50%;width:14px;height:34%;transform:translateY(-50%);border-radius:10px;}
.device.v .notch{top:15px;left:50%;width:32%;height:16px;transform:translateX(-50%);border-radius:10px;}
.scrPoster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s,opacity .3s;}
.scrPh{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:8px;color:rgba(255,255,255,0.7);background:radial-gradient(circle at 30% 20%,rgba(20,224,195,0.2),transparent 60%),radial-gradient(circle at 80% 90%,rgba(255,157,47,0.18),transparent 60%),#0b1018;}
.scrPh span svg{width:38px;height:38px;}
.scrPh b{font-size:13px;letter-spacing:.4px;direction:ltr;}
.scrPlay{position:absolute;inset:0;margin:auto;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(0,0,0,0.5);border:2px solid rgba(255,255,255,0.75);backdrop-filter:blur(4px);transition:transform .3s,background .3s;z-index:2;}
.scrPlay svg{width:24px;height:24px;margin-inline-start:-3px;}
.screen.live{background:#000;}
.mPlayer{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;background:#000;}

/* =====================================================================================
   ✅ [GALLERY] معرض الأعمال: إطارات صور بتتحرك + ظل شمال ويمين + زرار إخفاء/إظهار
===================================================================================== */
.gallery{padding:40px 8% 10px;}
.gallery[hidden],#works[hidden],.reelGrid[hidden],.worksLabel[hidden]{display:none;}
.galHead{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1300px;margin:0 auto 14px;}
.galHead h2{font-size:24px;font-weight:900;display:inline;}
.galCount{margin-inline-start:10px;color:var(--muted);font-size:13px;font-weight:700;}
.galToggle{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;font-weight:800;font-size:13.5px;color:var(--muted);background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);cursor:pointer;transition:.25s;}
.galToggle:hover{color:#fff;border-color:rgba(20,224,195,0.45);}
.galToggle svg{width:18px;height:18px;transition:transform .3s;transform:rotate(180deg);}
.gallery.closed .galToggle svg{transform:none;}
.galFrames{display:grid;gap:16px;max-width:1300px;margin:0 auto;}
.galFrames[hidden]{display:none;}
.frameBox{
  position:relative;border-radius:26px;padding:16px 0;
  background:linear-gradient(180deg,rgba(255,255,255,0.035),rgba(255,255,255,0.015));
  border:1px solid rgba(255,255,255,0.08);
  box-shadow:0 18px 45px rgba(0,0,0,0.3);
}
.frameTitle{padding:0 22px 10px;font-weight:900;font-size:14px;color:var(--muted);}
.frameTrack{position:relative;overflow:hidden;direction:ltr;border-radius:20px;}
.frameBox.moving .frameTrack::before,.frameBox.moving .frameTrack::after{
  content:'';position:absolute;top:0;bottom:0;width:clamp(40px,9%,130px);z-index:2;pointer-events:none;
}
.frameBox.moving .frameTrack::before{left:0;background:linear-gradient(90deg,#0d1219 0%,rgba(13,18,25,0.75) 35%,rgba(13,18,25,0));}
.frameBox.moving .frameTrack::after{right:0;background:linear-gradient(270deg,#0d1219 0%,rgba(13,18,25,0.75) 35%,rgba(13,18,25,0));}
.frameRow{display:flex;gap:16px;width:max-content;padding:0 16px;}
.frameBox.moving .frameRow{animation:mq var(--mq-dur,60s) linear infinite;will-change:transform;}
.frameRow.rev{animation-direction:reverse;}
.frameBox:hover .frameRow,.vPlaying .frameRow{animation-play-state:paused;}
.frameBox:not(.moving) .frameRow{width:auto;flex-wrap:wrap;justify-content:center;}
.frameRow .mqItem{width:280px;border-radius:16px;border:1px solid rgba(255,255,255,0.08);box-shadow:0 10px 26px rgba(0,0,0,0.35);transition:transform .35s;}
.frameRow .mqItem:hover{transform:scale(1.04);}
@media(max-width:700px){.gallery{padding:28px 4% 6px;}.frameRow .mqItem{width:190px;border-radius:12px;}.frameRow{gap:10px;}.frameBox{border-radius:20px;padding:10px 0;}}

/* =====================================================================================
   ✅ [VIDEO ROWS] فيديوهات الشرح بتتحرك جوه إطارات
===================================================================================== */
.videoRows{display:grid;gap:18px;}
.vRow .frameRow{gap:20px;padding:6px 20px;}
.vCard{flex:0 0 auto;width:380px;display:flex;flex-direction:column;gap:10px;padding:0;border:0;background:none;color:inherit;cursor:pointer;text-align:right;}
.vCard:hover .scrPlay,.reel:hover .scrPlay{transform:scale(1.1);background:var(--accent-orange);border-color:transparent;color:#1a0f00;}
.vCard:hover .scrPoster,.reel:hover .scrPoster{transform:scale(1.04);}
.vTitle{font-weight:900;font-size:15px;padding:0 6px;direction:rtl;}
.vSkel{flex:0 0 380px;aspect-ratio:16/9;border-radius:28px;background:linear-gradient(110deg,rgba(255,255,255,0.03) 30%,rgba(255,255,255,0.07) 50%,rgba(255,255,255,0.03) 70%);background-size:200% 100%;animation:skel 1.4s linear infinite;}
@media(max-width:700px){.vCard{width:290px;}.vSkel{flex-basis:290px;}}

/* =====================================================================================
   ✅ [WORKS] ريلز «من أعمالي»
===================================================================================== */
.worksSection{padding-top:20px;}
.worksSection .sectionHead{flex-direction:column;align-items:center;text-align:center;gap:6px;}
.worksSection .hint{max-width:640px;}
.worksLabel{display:flex;align-items:center;gap:12px;margin:22px auto 14px;max-width:1240px;font-weight:900;font-size:14px;color:var(--muted);}
.worksLabel::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(255,255,255,0.12),transparent);}
.reelGrid{display:grid;gap:18px;max-width:1240px;margin:0 auto;}
.reelGrid.v{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));}
.reelGrid.h{grid-template-columns:repeat(2,minmax(0,1fr));}
.reel{display:flex;flex-direction:column;gap:10px;transition:transform .3s;}
.reel:hover{transform:translateY(-4px);}
.reel.playing{transform:none;}
.reel.playing .device{box-shadow:0 0 0 2px var(--accent-teal),0 26px 60px rgba(0,0,0,0.55);}
.reelHit{position:absolute;inset:0;z-index:4;border:0;background:none;cursor:pointer;border-radius:inherit;}
.reelHit[hidden]{display:none;}
.reelNum,.reelSrc{position:absolute;z-index:3;top:20px;font-size:11px;font-weight:900;padding:2px 9px;border-radius:999px;background:rgba(0,0,0,0.6);border:1px solid rgba(255,255,255,0.18);backdrop-filter:blur(6px);pointer-events:none;transition:opacity .3s;}
.reelNum{right:20px;color:var(--accent-teal);}
.reelSrc{left:20px;color:#fff;direction:ltr;}
.device.h .reelSrc{left:40px;}
.device.v .reelNum,.device.v .reelSrc{top:40px;}
.reel.playing .reelNum,.reel.playing .reelSrc{opacity:0;}
.reelTitle{font-weight:900;font-size:14px;text-align:center;line-height:1.5;}
@media(max-width:900px){.reelGrid.h{grid-template-columns:1fr;}}
@media(max-width:560px){.reelGrid.v{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}.device.v{padding:7px;border-radius:26px;}.device.v .screen{border-radius:20px;}}

/* =====================================================================================
   ✅ [VIDEO MODAL] مشغّل منبثق في إطار الموبايل
===================================================================================== */
.vidModal{background:rgba(3,6,10,0.82);backdrop-filter:blur(6px);z-index:2600;}
.vidBox{width:min(980px,94vw);display:flex;flex-direction:column;gap:12px;}
.vidBox.v{width:auto;}
.vidBox.v .device{height:min(80vh,820px);aspect-ratio:9/16.6;width:auto;}
.vidBox.v .device .screen{height:100%;width:100%;aspect-ratio:auto;}
.vidHead{display:flex;align-items:center;gap:10px;color:#fff;}
.vidHead b{flex:1;font-size:16px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vidOut{font-size:12.5px;font-weight:800;color:var(--muted);padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,0.14);}
.vidOut:hover{color:#fff;border-color:var(--accent-teal);}

/* =====================================================================================
   ✅ [CARD VIDEO] زرار «فيديو شرح» في الكروت
===================================================================================== */
.card{position:relative;}
.vidBtn{display:inline-flex;align-items:center;gap:6px;color:var(--accent-teal);border-color:rgba(20,224,195,0.45);background:rgba(20,224,195,0.08);}
.vidBtn svg{width:17px;height:17px;flex:0 0 auto;}
.vidBtn.off{color:rgba(255,255,255,0.4);border-color:rgba(255,255,255,0.1);background:rgba(255,255,255,0.03);cursor:not-allowed;}
.vidBtn.off:hover{transform:none;}
.vidTip{
  position:absolute;z-index:5;top:16px;left:16px;right:16px;height:190px;border-radius:14px;overflow:hidden;
  display:grid;place-items:center;background:#05080d;border:2px solid var(--accent-teal);
  opacity:0;transform:scale(.96);transition:opacity .25s,transform .25s;pointer-events:none;
}
.vidTip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.vidTip.noimg{background:radial-gradient(circle,rgba(20,224,195,0.2),#05080d 70%);}
.vidTipPlay{position:relative;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#1a0f00;background:var(--accent-orange);box-shadow:0 10px 30px rgba(0,0,0,0.5);}
.vidTipPlay svg{width:22px;height:22px;}
.vidBtn.off .vidTip{border-color:rgba(255,255,255,0.2);background:rgba(5,8,13,0.88);}
.vidTipTxt{position:relative;font-weight:900;font-size:15px;color:#fff;padding:0 14px;text-align:center;}
.vidBtn:hover .vidTip,.vidBtn:focus-visible .vidTip{opacity:1;transform:none;}

/* المعاينات المدفوعة في إطار الجهاز كمان */
.sbMedia{margin:10px 10px 0;border-radius:18px;border:6px solid #161d2a;box-shadow:inset 0 0 0 1px rgba(255,255,255,0.06),0 10px 24px rgba(0,0,0,0.35);}

/* =====================================================================================
   ✅ [FOOTER v4]
===================================================================================== */
.footerBottom a{color:var(--accent-teal);}
.footerBottom a:hover{text-decoration:underline;}

/* =====================================================================================
   ✅ [NOTES] نوت البرومبت
===================================================================================== */
.notesPerks{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:16px;}
.notesPerks li{font-size:13px;font-weight:800;color:#dfe6f1;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);}
.notesMain{max-width:1100px;margin:0 auto;padding-top:24px;}
.nBanner{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:12px 16px;margin-bottom:14px;border-radius:14px;color:#ffd9a8;background:rgba(255,157,47,0.08);border:1px solid rgba(255,157,47,0.35);font-weight:700;}
.nBanner[hidden]{display:none;}
.nBanner button{background:none;border:0;color:inherit;font-size:16px;cursor:pointer;}
.nBar{position:sticky;top:74px;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px;border-radius:18px;background:rgba(15,20,29,0.92);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.08);box-shadow:var(--shadow);}
.nBarActs{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.nTool{padding:9px 13px;border-radius:12px;font-weight:800;font-size:13.5px;color:#e6ecf5;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);cursor:pointer;transition:.2s;}
.nTool:hover{border-color:rgba(20,224,195,0.5);color:#fff;}
.nTool.bad{color:#ff9a90;}
.nTimer{--p:1;display:flex;align-items:center;gap:10px;}
.nTimer .ring{width:38px;height:38px;border-radius:50%;background:conic-gradient(var(--accent-teal) calc(var(--p) * 360deg),rgba(255,255,255,0.08) 0);-webkit-mask:radial-gradient(circle,transparent 54%,#000 56%);mask:radial-gradient(circle,transparent 54%,#000 56%);}
.nTimer b{display:block;font-size:17px;font-weight:900;direction:ltr;text-align:right;}
.nTimer small{display:block;font-size:11.5px;color:var(--muted);max-width:230px;line-height:1.5;}
.nTimer.warn .ring{background:conic-gradient(var(--accent-orange) calc(var(--p) * 360deg),rgba(255,255,255,0.08) 0);}
.nTimer.warn b{color:var(--accent-orange);}
.nFind{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px;padding:10px;border-radius:14px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);}
.nFind[hidden]{display:none;}
.nFind input{flex:1 1 200px;padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,0.12);background:rgba(0,0,0,0.25);color:#fff;font-weight:600;}
.nFind span{color:var(--muted);font-size:13px;font-weight:700;}
.nQuickWrap{margin:14px 0 10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.nQuickWrap>span{font-size:12.5px;color:var(--muted);font-weight:700;}
.nQuick{display:flex;gap:6px;flex-wrap:wrap;}
.nQuick button{direction:ltr;font-size:12px;font-weight:700;padding:5px 10px;border-radius:999px;color:#cfe;background:rgba(20,224,195,0.06);border:1px dashed rgba(20,224,195,0.35);cursor:pointer;transition:.2s;}
.nQuick button:hover{background:rgba(20,224,195,0.16);color:#fff;}
.nEmpty{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:40px 18px;border-radius:20px;border:1px dashed rgba(255,255,255,0.16);margin-top:8px;}
.nEmpty[hidden]{display:none;}
.nEmpty b{font-size:20px;font-weight:900;}
.nEmpty span{color:var(--muted);max-width:560px;line-height:1.8;}
.nEmpty code,.nHint kbd{direction:ltr;display:inline-block;padding:0 6px;border-radius:6px;background:rgba(255,255,255,0.08);font-family:Consolas,monospace;font-size:12.5px;}
.nList{display:grid;gap:14px;margin-top:8px;}
.note{--nc:rgba(255,255,255,0.1);position:relative;padding:14px 14px 12px;border-radius:18px;background:rgba(18,23,34,0.92);border:1px solid var(--nc);box-shadow:var(--shadow);transition:border-color .25s,box-shadow .25s;}
.note::before{content:'';position:absolute;inset-inline-start:0;top:14px;bottom:14px;width:4px;border-radius:4px;background:var(--nc);}
.note:focus-within{border-color:rgba(20,224,195,0.55);box-shadow:0 0 0 3px rgba(20,224,195,0.12),var(--shadow);}
.note.c-teal{--nc:rgba(20,224,195,0.6);}
.note.c-orange{--nc:rgba(255,157,47,0.65);}
.note.c-gold{--nc:rgba(255,210,122,0.65);}
.note.c-rose{--nc:rgba(255,120,150,0.6);}
.note.locked{background:linear-gradient(160deg,rgba(120,180,255,0.06),rgba(18,23,34,0.95));border-color:rgba(140,190,255,0.45);}
.nHead{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap;}
.nNum{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:12px;font-weight:900;color:var(--muted);background:rgba(255,255,255,0.06);}
.nTitle{flex:1 1 180px;min-width:0;padding:6px 8px;border-radius:10px;border:1px solid transparent;background:transparent;color:#fff;font-weight:900;font-size:15px;}
.nTitle:hover,.nTitle:focus{border-color:rgba(255,255,255,0.12);background:rgba(0,0,0,0.2);outline:none;}
.nColors{display:flex;gap:5px;}
.nDot{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,0.15);cursor:pointer;padding:0;background:transparent;}
.nDot.teal{background:var(--accent-teal);}.nDot.orange{background:var(--accent-orange);}.nDot.gold{background:#ffd27a;}.nDot.rose{background:#ff7896;}
.nDot.on{outline:2px solid #fff;outline-offset:1px;}
.nLock{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:10px;font-size:12.5px;font-weight:800;color:var(--muted);background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);cursor:pointer;}
.nLock.on{color:#bcd8ff;border-color:rgba(140,190,255,0.5);background:rgba(140,190,255,0.1);}
.nText{width:100%;min-height:110px;resize:vertical;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,0.1);background:rgba(0,0,0,0.28);color:#fff;font-size:14.5px;line-height:1.85;font-family:'Cairo',Consolas,monospace;outline:none;}
.nText:focus{border-color:rgba(20,224,195,0.5);}
.note.locked .nText{border-style:dashed;color:#dbe7ff;cursor:default;}
.nVars{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px;padding:10px;border-radius:12px;background:rgba(255,210,122,0.06);border:1px solid rgba(255,210,122,0.25);}
.nVars b{font-size:12.5px;color:#ffd27a;}
.nVars label{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);}
.nVars label span{direction:ltr;font-weight:800;color:#ffe3a6;}
.nVars input{width:140px;padding:6px 9px;border-radius:9px;border:1px solid rgba(255,255,255,0.14);background:rgba(0,0,0,0.3);color:#fff;}
.nFoot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px;}
.nCount{font-size:12px;color:var(--muted);font-weight:700;}
.nActs{display:flex;gap:6px;flex-wrap:wrap;}
.nBtn{padding:7px 12px;border-radius:10px;font-weight:800;font-size:12.5px;color:#e6ecf5;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);cursor:pointer;transition:.2s;}
.nBtn:hover:not(:disabled){border-color:rgba(20,224,195,0.5);}
.nBtn:disabled{opacity:.35;cursor:default;}
.nBtn.pri{background:var(--accent-teal);color:#04201c;border-color:transparent;}
.nBtn.bad{color:#ff9a90;}
.nBtn.ic{padding:7px 9px;}
.nHint{margin-top:18px;font-size:12.5px;color:var(--muted);text-align:center;line-height:2;}
.nToast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);display:flex;align-items:center;gap:12px;background:#0f1722;border:1px solid rgba(20,224,195,0.5);color:#fff;padding:10px 16px;border-radius:14px;font-weight:800;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:3000;max-width:92vw;}
.nToast.show{opacity:1;transform:translate(-50%,0);pointer-events:auto;}
.nToast button{padding:5px 12px;border-radius:9px;border:0;background:var(--accent-orange);color:#1a0f00;font-weight:900;cursor:pointer;}
@media(max-width:700px){.nBar{top:64px;}.nTimer small{display:none;}.nVars input{width:110px;}}

/* =====================================================================================
   ✅ [TOGGLES] مكتبة التوجلات
===================================================================================== */
.togMain{max-width:1100px;margin:0 auto;padding-top:20px;}
.togTools{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.togSearch{flex:1;padding:13px 16px;border-radius:14px;border:1px solid rgba(255,255,255,0.12);background:rgba(0,0,0,0.25);color:#fff;font-weight:700;font-size:15px;outline:none;}
.togSearch:focus{border-color:rgba(20,224,195,0.55);}
.togCount{color:var(--muted);font-weight:800;font-size:13px;white-space:nowrap;}
.togList{display:grid;gap:10px;}
.divider{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:18px 2px 4px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,0.08);}
.dividerTitle{font-weight:900;font-size:18px;}
.dividerHint{font-size:12.5px;color:var(--muted);}
.tg{border-radius:16px;background:rgba(18,23,34,0.9);border:1px solid rgba(255,255,255,0.08);overflow:hidden;transition:border-color .25s;}
.tg[open]{border-color:rgba(20,224,195,0.4);}
.tg summary{list-style:none;display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;}
.tg summary::-webkit-details-marker{display:none;}
.tgBadge{flex:0 0 auto;font-size:11px;font-weight:900;padding:3px 9px;border-radius:999px;color:#04201c;background:var(--accent-teal);}
.tgText{flex:1;font-weight:900;font-size:15px;text-align:right;unicode-bidi:plaintext;}
.tgMini{width:64px;height:36px;border-radius:8px;object-fit:cover;background:#0e141d;}
.tgArrow{color:var(--muted);transition:transform .25s;}
.tg[open] .tgArrow{transform:rotate(180deg);}
.tgBody{padding:0 14px 14px;}
.tgGrid{display:grid;grid-template-columns:1fr 340px;gap:14px;align-items:start;}
.tgGrid.noimg{grid-template-columns:1fr;}
.tgPrompt{white-space:pre-wrap;line-height:1.9;font-size:14px;padding:12px 14px;border-radius:12px;background:rgba(0,0,0,0.28);border:1px solid rgba(255,255,255,0.08);margin-bottom:10px;max-height:320px;overflow:auto;}
.tgImg img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px;display:block;background:#0e141d;}
@media(max-width:800px){.tgGrid{grid-template-columns:1fr;}.tgMini{display:none;}}

/* =====================================================================================
   ✅ [PRIVACY] الخصوصية وشروط الاستخدام
===================================================================================== */
.pvKeys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px;text-align:right;}
.pvKeys div{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.08);}
.pvKeys b{display:block;font-size:15.5px;font-weight:900;margin-bottom:4px;}
.pvKeys span{font-size:13px;color:var(--muted);}
.pvMain{display:grid;grid-template-columns:250px 1fr;gap:28px;max-width:1150px;margin:0 auto;align-items:start;}
.pvToc{position:static;padding:16px;border-radius:16px;background:rgba(18,23,34,0.9);border:1px solid rgba(255,255,255,0.08);}
.pvToc b{display:block;font-weight:900;margin-bottom:8px;}
.pvToc ol{padding-inline-start:18px;display:grid;gap:6px;}
.pvToc a{font-size:13.5px;color:var(--muted);}
.pvToc a:hover{color:var(--accent-teal);}
.pvSec{scroll-margin-top:96px;padding:20px 22px;border-radius:18px;background:rgba(18,23,34,0.82);border:1px solid rgba(255,255,255,0.07);margin-bottom:14px;}
.pvSec h2{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:900;margin-bottom:10px;}
.pvSec h2 span{font-size:12px;font-weight:900;color:var(--accent-teal);padding:3px 8px;border-radius:8px;background:rgba(20,224,195,0.1);border:1px solid rgba(20,224,195,0.3);}
.pvSec p{color:#d6dde8;line-height:2;margin-bottom:8px;}
.pvSec a{color:var(--accent-teal);text-decoration:underline;}
.pvList{list-style:none;display:grid;gap:8px;margin:6px 0 8px;}
.pvList li{position:relative;padding-inline-start:18px;color:#d6dde8;line-height:1.9;}
.pvList li::before{content:'';position:absolute;inset-inline-start:2px;top:12px;width:6px;height:6px;border-radius:50%;background:var(--accent-teal);}
.pvList.ok li::before,.pvList.no li::before{display:none;}
.pvList.ok li,.pvList.no li{padding-inline-start:0;}
.pvList.no li{color:#f3d3cf;}
.pvNote{margin-top:6px;padding:14px 16px;border-radius:14px;color:#ffd9a8;background:rgba(255,157,47,0.08);border:1px solid rgba(255,157,47,0.3);font-weight:700;line-height:1.9;}
@media(max-width:900px){.pvMain{grid-template-columns:1fr;}.pvToc{position:static;}.pvKeys{grid-template-columns:1fr;}}
/* إصلاح: الإطار ما يتمددش بعرض الصف المتحرك + الظل على الجنبين بالـ mask */
.galFrames>*,.videoRows>*{min-width:0;}
.frameBox{min-width:0;overflow:hidden;}
.frameBox.moving .frameTrack::before,.frameBox.moving .frameTrack::after{content:none;}
.frameBox.moving .frameTrack{
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 9%,#000 91%,transparent 100%);
}
.frameBox.moving::after{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;
  box-shadow:inset 70px 0 50px -50px rgba(0,0,0,0.75),inset -70px 0 50px -50px rgba(0,0,0,0.75);
}
.nStats{font-size:12px;color:var(--muted);font-weight:700;padding-inline-start:4px;}
/* إصلاح: overflow-x:hidden على body كان بيبوّظ أي عنصر sticky (الهيدر نفسه) — clip بيمنع السكرول الأفقي من غير ما يكسر sticky */
body{overflow-x:clip;}
.pvToc{position:sticky;top:96px;}
@media(max-width:900px){.pvToc{position:static;}}

/* =====================================================================================
   ✅ [v5] «من أنا»: نفس قوة الإضاءة الأصلية — بس الحواف ناعمة (من غير قطع)
===================================================================================== */
.aboutCenter{padding:40px 16px 10px;max-width:1000px;}
.aboutGlow{
  inset:auto;left:50%;top:-40px;width:min(1000px,140%);aspect-ratio:1;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(20,224,195,0.9) 0%,rgba(0,140,130,0.55) 38%,rgba(0,140,130,0.22) 62%,rgba(0,140,130,0) 100%);
  opacity:.85;z-index:-1;pointer-events:none;
}
.aboutHeroImg{width:100%;max-width:620px;-webkit-mask-image:none;mask-image:none;}
#about{overflow-x:clip;}

/* =====================================================================================
   ✅ [v5] فيديوهات الشرح: كاروسيل — فيديو كبير في النص والجنبين باينين شوية
===================================================================================== */
.videoRows{display:grid;gap:34px;}
.vSkel{width:min(860px,78%);margin:0 auto;aspect-ratio:16/9;border-radius:30px;flex:none;}
.vCar{position:relative;}
.vCarTitle{text-align:center;font-weight:900;font-size:16px;color:var(--muted);margin-bottom:4px;}
.vStage{position:relative;}
.vTrack{
  --sw:min(860px,72%);
  display:flex;gap:28px;overflow-x:auto;overflow-y:visible;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:34px calc((100% - var(--sw)) / 2) 40px;scrollbar-width:none;outline:none;cursor:grab;
}
.vTrack::-webkit-scrollbar{display:none;}
.vTrack.dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto;}
.vTrack.dragging .vSlide{pointer-events:none;}
.vSlide{position:relative;flex:0 0 var(--sw);scroll-snap-align:center;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .45s,filter .45s;transform:scale(.86);opacity:.45;filter:saturate(.7);cursor:pointer;}
.vSlide.active{transform:none;opacity:1;filter:none;}
.vSlide .device{transition:transform .35s,box-shadow .35s;}
.vGlow{position:absolute;inset:8% 6%;border-radius:40px;background:radial-gradient(closest-side,rgba(20,224,195,0.55),rgba(255,157,47,0.25) 60%,transparent 100%);filter:blur(28px);opacity:0;transition:opacity .4s;z-index:-1;pointer-events:none;}
.vSlide.active:hover .device{transform:translateY(-10px);box-shadow:0 34px 70px rgba(0,0,0,0.6),0 0 0 1px rgba(20,224,195,0.35);}
.vSlide.active:hover .vGlow,.vSlide.playing .vGlow{opacity:1;}
.vSlide.active:hover .scrPlay{transform:scale(1.12);background:var(--accent-orange);border-color:transparent;color:#1a0f00;}
.vSlide.playing{cursor:default;}
.vSlide:not(.active) .scrPlay{opacity:0;}
.vClose{position:absolute;z-index:6;top:18px;left:24px;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;font-weight:900;font-size:13px;color:#fff;background:rgba(0,0,0,0.7);border:1px solid rgba(255,255,255,0.25);backdrop-filter:blur(6px);cursor:pointer;}
.vClose:hover{background:#b3121b;border-color:transparent;}
.vArrow{position:absolute;top:50%;z-index:5;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;transform:translateY(-50%);font-size:18px;color:#fff;background:rgba(10,15,25,0.7);border:1px solid rgba(255,255,255,0.14);backdrop-filter:blur(8px);cursor:pointer;transition:.25s;}
.vArrow:hover{background:var(--accent-teal);color:#04201c;}
.vArrow.prev{right:calc((100% - min(860px,72%)) / 2 - 64px);}
.vArrow.next{left:calc((100% - min(860px,72%)) / 2 - 64px);}
.vTabs{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:2px;}
.vTab{padding:8px 16px;border-radius:999px;font-weight:800;font-size:13.5px;color:var(--muted);background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.09);cursor:pointer;transition:.25s;max-width:280px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.vTab:hover{color:#fff;border-color:rgba(20,224,195,0.45);}
.vTab.on{color:#04201c;background:var(--accent-teal);border-color:transparent;}
@media(max-width:900px){.vTrack{--sw:86%;gap:14px;padding-top:22px;padding-bottom:26px;}.vArrow{display:none;}.vSlide{transform:scale(.92);}.vClose{top:12px;left:16px;padding:5px 10px;}}

/* =====================================================================================
   ✅ [v5] الهيدر: أقل زحمة — روابط أساسية + قائمة «اكتشف» منسدلة
===================================================================================== */
.menu{gap:2px;}
.menu>a{font-size:15px;}
.navDrop{position:relative;}
.ddBtn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:12px;font-weight:900;font-size:15px;color:#fff;background:linear-gradient(135deg,rgba(20,224,195,0.16),rgba(255,157,47,0.12));border:1px solid rgba(20,224,195,0.35);cursor:pointer;transition:.25s;margin-inline-start:6px;}
.ddBtn svg{width:16px;height:16px;transition:transform .25s;}
.ddBtn:hover,.navDrop.open .ddBtn{border-color:var(--accent-teal);}
.navDrop.open .ddBtn svg{transform:rotate(180deg);}
.navDrop.on .ddBtn{box-shadow:inset 0 -2px 0 var(--accent-teal);}
.ddPanel{
  position:absolute;top:calc(100% + 12px);left:50%;width:330px;padding:8px;border-radius:18px;
  background:rgba(14,19,28,0.97);border:1px solid rgba(255,255,255,0.1);box-shadow:0 28px 70px rgba(0,0,0,0.55);backdrop-filter:blur(14px);
  opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:opacity .2s,transform .2s,visibility .2s;z-index:1001;
}
.navDrop.open .ddPanel{opacity:1;visibility:visible;transform:translate(-50%,0);}
.ddItem{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;color:#fff !important;background:none !important;transition:background .2s;}
.ddItem:hover,.ddItem[aria-current="page"]{background:rgba(255,255,255,0.06) !important;}
.ddIc{flex:0 0 auto;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);color:var(--accent-teal);}
.ddItem.packs .ddIc{color:var(--accent-orange);}
.ddItem.master .ddIc{color:#ffd27a;}
.ddIc svg{width:20px;height:20px;}
.ddItem b{display:block;font-size:14.5px;font-weight:900;}
.ddItem small{display:block;font-size:12px;color:var(--muted);font-weight:600;}
.navSocial{display:none !important;}
.mGroup{display:grid;gap:10px;padding:10px 0;border-top:1px solid rgba(255,255,255,0.06);border-bottom:1px solid rgba(255,255,255,0.06);}
@media(max-width:1180px){.menu{display:none;}}
@media(min-width:1181px) and (max-width:1320px){.menu>a{padding:8px 8px;font-size:14.5px;}.brandText .sub{display:none;}}

/* =====================================================================================
   ✅ [v5] أزرار الإعلان + أدوات AI + الدعم: شكل Premium أهدى ومتناسق
===================================================================================== */
.blockHead{text-align:center;margin:0 auto 22px;}
.blockHead .eyebrow{margin-bottom:10px;}
.blockHead h2{font-size:28px;font-weight:900;margin-top:10px;}
.promoSection{padding:56px 8% 18px;}
.promoRow{gap:18px;max-width:1180px;}
.promo{
  --c1:var(--accent-teal);
  flex-direction:column;align-items:flex-start;gap:8px;padding:26px 24px 22px;min-height:0;border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,0.045),rgba(255,255,255,0.015));
  border:1px solid rgba(255,255,255,0.08);box-shadow:0 20px 50px rgba(0,0,0,0.28);animation:none;
}
.promo::before{inset:auto;top:-1px;left:24px;right:24px;height:1px;border-radius:0;background:linear-gradient(90deg,transparent,var(--c1),transparent);opacity:.7;animation:none;}
.promo::after{inset:0;border-radius:inherit;background:radial-gradient(120% 80% at 100% 0%,var(--c2,rgba(20,224,195,0.08)),transparent 55%);z-index:-1;}
.promo.packs{--c1:var(--accent-orange);--c2:rgba(255,157,47,0.09);}
.promo.master{--c1:#ffd27a;--c2:rgba(255,210,122,0.08);}
.promo:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--c1) 45%,transparent);box-shadow:0 30px 70px rgba(0,0,0,0.42),0 0 50px -20px var(--c1);}
.promoTop{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:8px;}
.promoIcon{width:52px;height:52px;border-radius:15px;}
.promoIcon svg{width:26px;height:26px;animation:none;}
.promoTag{position:static;font-size:11px;letter-spacing:.6px;text-transform:uppercase;padding:3px 10px;color:var(--c1);background:transparent;border:1px solid color-mix(in srgb,var(--c1) 40%,transparent);}
.promoT{font-size:21px;font-weight:900;line-height:1.35;}
.promoD{font-size:14px;color:var(--muted);line-height:1.8;}
.promoGo{position:static;display:inline-flex;align-items:center;gap:8px;width:auto;height:auto;border:0;border-radius:0;margin-top:8px;font-size:14px;font-weight:900;color:var(--c1);}
.promoGo i{font-style:normal;transition:transform .3s;}
.promo:hover .promoGo{transform:none;background:none;color:var(--c1);}
.promo:hover .promoGo i{transform:translateX(-5px);}
.promoCount{position:static;font-style:normal;font-size:12px;font-weight:700;color:var(--muted);margin-inline-start:6px;}
.promoCount::before{content:'· ';}

.aiTools{padding:26px 8% 10px;}
.aiPanel{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:center;padding:24px 26px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,0.035),rgba(255,255,255,0.012));border:1px solid rgba(255,255,255,0.07);}
.aiHead{display:block;text-align:right;margin:0;}
.aiHead h2{font-size:22px;margin:8px 0 4px;}
.aiHead p{color:var(--muted);font-size:13.5px;}
.aiGrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-width:none;}
.aiBtn{padding:12px;border-radius:14px;gap:10px;background:rgba(0,0,0,0.18);border-color:rgba(255,255,255,0.06);}
.aiBtn:hover{background:rgba(255,255,255,0.05);}
.aiMono{width:36px;height:36px;border-radius:10px;font-size:13px;}
.aiTxt b{font-size:14px;}
.aiTxt small{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.aiArrow{margin-inline-start:auto;font-style:normal;color:var(--muted);transition:.25s;}
.aiBtn:hover .aiArrow{color:var(--ai);transform:translate(-2px,-2px);}
@media(max-width:1100px){.aiPanel{grid-template-columns:1fr;}.aiHead{text-align:center;}.aiGrid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:560px){.aiGrid{grid-template-columns:1fr;}.promoSection{padding-top:36px;}.blockHead h2{font-size:22px;}}

.supportStrip{padding:26px 8% 8px;margin:0;}
.supportBox{max-width:1180px;padding:16px 22px;border-radius:20px;background:linear-gradient(90deg,rgba(255,157,47,0.07),rgba(255,255,255,0.02) 40%,rgba(20,224,195,0.05));border:1px solid rgba(255,255,255,0.07);box-shadow:none;}
.supportText{flex-direction:row;align-items:center;flex-wrap:wrap;gap:4px 14px;}
.supportText b{font-size:15px;}
.supportText span{font-size:13px;}
.supportAmounts{gap:0;}
.supportAmounts i{background:none;border:0;padding:0 6px;color:var(--muted);font-weight:700;}
.supportAmounts i+i::before{content:'·';margin-inline-end:10px;opacity:.5;}
.payBadge{height:24px;font-size:10.5px;border-radius:8px;opacity:.85;}
.payNum{padding:7px 14px;border-style:solid;border-color:rgba(20,224,195,0.3);}

/* =====================================================================================
   ✅ [v5] النوت: بسيطة وهادية
===================================================================================== */
.notesHero{padding-bottom:0;}
.notesMain{max-width:860px;padding-top:26px;}
.nBar{position:static;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:0;background:none;border:0;box-shadow:none;backdrop-filter:none;margin-bottom:14px;}
.nTimer{display:inline-flex;align-items:center;gap:8px;margin-inline-start:auto;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);font-size:13px;}
.nTimer i{font-style:normal;}
.nTimer b{display:inline;font-size:14px;}
.nTimer small{display:inline;max-width:none;font-size:12px;}
.nTimer.warn{border-color:rgba(255,157,47,0.5);}
.nLink{background:none;border:0;color:var(--muted);font-weight:700;font-size:13px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.nLink:hover{color:#ff9a90;}
.nLink[hidden]{display:none;}
.nEmpty{padding:34px 18px;border-style:dashed;}
.nEmpty b{font-size:17px;}
.nList{gap:12px;}
.note{padding:12px 14px;border-radius:16px;border-color:rgba(255,255,255,0.08);box-shadow:none;background:rgba(18,23,34,0.85);}
.note::before{display:none;}
.note.locked{background:rgba(18,23,34,0.85);border-color:rgba(140,190,255,0.4);}
.nTitle{width:100%;padding:4px 6px;font-size:14px;margin-bottom:6px;color:#e9eef7;}
.nText{min-height:90px;font-size:14px;background:rgba(0,0,0,0.22);}
.nFoot{justify-content:flex-start;gap:6px;margin-top:8px;}
.nBtn{padding:6px 12px;font-size:12.5px;}
.nBtn.on{color:#bcd8ff;border-color:rgba(140,190,255,0.5);}
.nBtn.del{margin-inline-start:auto;background:none;border-color:transparent;color:var(--muted);}
.nBtn.del:hover{color:#ff9a90;}
@media(max-width:560px){.nTimer{margin-inline-start:0;}}
/* الكاروسيل بعرض الشاشة كامل، والمقاسات بوحدات الحاوية علشان الفيديو يقف في النص بالظبط */
.vStage{container-type:inline-size;margin-inline:-8.7vw;}
.vTrack{--sw:min(880px,64cqw);padding-inline:calc((100cqw - var(--sw)) / 2);}
.vArrow.prev{right:calc((100cqw - var(--sw,min(880px,64cqw))) / 2 - 64px);}
.vArrow.next{left:calc((100cqw - var(--sw,min(880px,64cqw))) / 2 - 64px);}
.vStage{--sw:min(880px,64cqw);}
@media(max-width:980px){.vStage{margin-inline:-6.5vw;}}
@media(max-width:900px){.vTrack{--sw:84cqw;}}

/* =====================================================================================
   ✅ [v6] Switch (من الكود اللي بعته حسين — بألوان الهوية)
===================================================================================== */
.switch{font-size:17px;position:relative;display:inline-block;width:3.5em;height:2em;flex:0 0 auto;}
.switch input{opacity:0;width:0;height:0;position:absolute;}
.swSlider{position:absolute;cursor:pointer;inset:0;background:#3a4560;border-radius:50px;transition:all .4s cubic-bezier(0.175,0.885,0.32,1.275);box-shadow:inset 0 2px 4px rgba(0,0,0,0.35);}
.swSlider::before{position:absolute;content:"";height:2em;width:2em;inset:0;background-color:#fff;border-radius:50px;box-shadow:0 10px 20px rgba(0,0,0,0.4);transition:all .4s cubic-bezier(0.175,0.885,0.32,1.275);}
.switch input:checked+.swSlider{background:linear-gradient(90deg,#0fb9a0,var(--accent-teal));}
.switch input:focus-visible+.swSlider{box-shadow:0 0 0 3px rgba(20,224,195,0.45);}
.switch input:checked+.swSlider::before{transform:translateX(1.6em);}
[dir="rtl"] .switch input:checked+.swSlider::before{transform:translateX(1.6em);}
.switch.sm{font-size:12px;}
.galToggle{display:inline-flex;align-items:center;gap:12px;padding:6px 8px 6px 16px;border-radius:999px;cursor:pointer;font-weight:900;font-size:14px;color:#e6ecf5;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);}
.galToggle svg{display:none;}
.gallery.closed .galToggle{color:var(--muted);}
.tgSwitch{pointer-events:none;}

/* =====================================================================================
   ✅ [v6] فيديوهات الشرح أصغر وأنعم
===================================================================================== */
.vStage{--sw:min(700px,54cqw);}
.vTrack{--sw:min(700px,54cqw);gap:22px;padding-top:26px;padding-bottom:30px;}
.vArrow.prev{right:calc((100cqw - min(700px,54cqw)) / 2 - 62px);}
.vArrow.next{left:calc((100cqw - min(700px,54cqw)) / 2 - 62px);}
.vSlide{transform:scale(.84);opacity:.5;}
.vSlide .device{border-radius:26px;padding:8px;}
.vSlide .device .screen{border-radius:19px;}
@media(max-width:900px){.vStage,.vTrack{--sw:84cqw;}.vSlide{transform:scale(.92);}}

/* =====================================================================================
   ✅ [v6] صفحة التوجلات أكبر وأوضح
===================================================================================== */
.togHero h1{font-size:54px;}
.togMain{max-width:1280px;}
.togSearch{padding:16px 20px;font-size:16px;border-radius:16px;}
.tg{border-radius:20px;}
.tg summary{padding:16px 18px;gap:14px;}
.tgText{font-size:17.5px;}
.tgBadge{font-size:12px;padding:4px 12px;}
.tgMini{width:96px;height:54px;border-radius:10px;}
.tgBody{padding:0 18px 18px;}
.tgGrid{grid-template-columns:1fr 460px;gap:18px;}
.tgPrompt{font-size:15.5px;padding:16px 18px;max-height:420px;}
.tgImg img{border-radius:16px;}
.dividerTitle{font-size:21px;}
@media(max-width:900px){.tgGrid{grid-template-columns:1fr;}.togHero h1{font-size:34px;}}

.swSlider::before{inset:0 auto auto 0;}
.gmChev{transform:none;}
.galToggle{direction:rtl;}

/* =====================================================================================
   ✅ [v7] أزرار بإطار جلو بيلف حواليها (زي أول نسخة) + لمسة: ذيل نور ناعم + هالة خارجية
===================================================================================== */
@keyframes glowSpin{to{transform:rotate(360deg)}}
.glow{position:relative;isolation:isolate;overflow:hidden;--c1:var(--accent-teal);--spd:7s;}
.glow::before{
  content:'';position:absolute;z-index:-2;inset:-70%;
  background:conic-gradient(from 0deg,transparent 0deg,transparent 200deg,color-mix(in srgb,var(--c1) 35%,transparent) 260deg,var(--c1) 320deg,#ffffffcc 335deg,transparent 350deg);
  animation:glowSpin var(--spd) linear infinite;
}
.glow::after{
  content:'';position:absolute;z-index:-1;inset:1.5px;border-radius:inherit;
  background:radial-gradient(120% 90% at 100% 0%,color-mix(in srgb,var(--c1) 14%,transparent),transparent 55%),linear-gradient(165deg,#151c29,#0e131c 70%);
}
.glow:hover{--spd:3.2s;}

/* الكروت التلاتة */
.promoSection{padding:56px 6% 16px;}
.promoRow{gap:20px;max-width:1180px;}
.promo.glow{
  display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:24px 24px 22px;border-radius:22px;
  border:0;background:none;min-height:0;animation:none;
  box-shadow:0 22px 50px rgba(0,0,0,0.35),0 0 60px -30px var(--c1);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;
}
.promo.glow.gifts{--c1:var(--accent-teal);}
.promo.glow.packs{--c1:var(--accent-orange);}
.promo.glow.master{--c1:#ffd27a;}
.promo.glow::before{inset:-70%;top:-70%;left:-70%;right:-70%;height:auto;border-radius:0;opacity:1;}
.promo.glow:hover{transform:translateY(-6px);box-shadow:0 30px 70px rgba(0,0,0,0.45),0 0 70px -20px var(--c1);border-color:transparent;}
.promoHead{display:flex;align-items:center;justify-content:space-between;width:100%;margin-bottom:6px;}
.promo.glow .promoIcon{width:58px;height:58px;border-radius:18px;margin:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--c1) 30%,transparent),rgba(255,255,255,0.03) 70%);border:1px solid color-mix(in srgb,var(--c1) 35%,transparent);box-shadow:0 0 30px -8px var(--c1);transition:transform .4s cubic-bezier(.3,1.5,.5,1);}
.promo.glow .promoIcon svg{width:36px;height:36px;animation:none;filter:drop-shadow(0 4px 8px rgba(0,0,0,0.35));}
.promo.glow:hover .promoIcon{transform:translateY(-3px) rotate(-6deg) scale(1.06);}
.promo.glow .promoTag{position:static;font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;padding:3px 10px;border-radius:999px;color:var(--c1);background:color-mix(in srgb,var(--c1) 10%,transparent);border:1px solid color-mix(in srgb,var(--c1) 40%,transparent);}
.promo.glow .promoT{font-size:20px;font-weight:900;}
.promo.glow .promoD{font-size:13.5px;color:var(--muted);line-height:1.8;}
.promo.glow .promoGo{position:static;display:inline-flex;align-items:center;gap:8px;margin-top:6px;width:auto;height:auto;border:0;font-size:14px;font-weight:900;color:var(--c1);background:none;}
.promo.glow .promoGo i{font-style:normal;transition:transform .3s;}
.promo.glow:hover .promoGo i{transform:translateX(-6px);}
.promo.glow .promoCount{position:static;font-style:normal;font-size:12px;color:var(--muted);font-weight:700;}

/* أدوات AI */
.aiTools{padding:26px 6% 8px;}
.aiPanel{gap:24px;padding:24px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,0.035),rgba(255,255,255,0.012));border:1px solid rgba(255,255,255,0.07);box-shadow:none;}
.aiHead h2{font-size:22px;margin:10px 0 4px;}
.aiHead p{color:var(--muted);}
.aiGrid{gap:12px;}
.aiBtn.glow{--spd:9s;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;border:0;background:none;transition:transform .3s,box-shadow .3s;}
.aiBtn.glow.ar{--c1:var(--accent-teal);}
.aiBtn.glow.fl{--c1:#7fb2ff;}
.aiBtn.glow.do{--c1:#c3a6ff;}
.aiBtn.glow.as{--c1:var(--accent-orange);}
.aiBtn.glow::before{opacity:.75;}
.aiBtn.glow:hover{transform:translateY(-3px);box-shadow:0 0 40px -14px var(--c1);background:none;}
.aiBtn.glow:hover::before{opacity:1;}
.aiIc{flex:0 0 auto;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--c1) 14%,transparent);}
.aiIc svg{width:28px;height:28px;}
.aiBtn.glow .aiTxt b{font-size:14.5px;color:#fff;text-shadow:none;}
.aiBtn.glow .aiTxt small{color:var(--muted);font-weight:600;}
.aiBtn.glow .aiArrow{color:var(--muted);}
.aiBtn.glow:hover .aiArrow{color:var(--c1);}

/* الدعم */
.supportStrip{padding:26px 6% 8px;}
.supportBox{--c1:#ff7a8a;--spd:9s;position:relative;isolation:isolate;overflow:hidden;gap:16px;padding:16px 20px;border-radius:22px;border:0;background:none;box-shadow:0 0 60px -30px #ff7a8a;}
.supportBox::before{content:'';position:absolute;z-index:-2;inset:-70%;background:conic-gradient(from 0deg,transparent 0deg,transparent 200deg,rgba(255,122,138,0.35) 260deg,#ff9d2f 320deg,#ffffffcc 335deg,transparent 350deg);animation:glowSpin var(--spd) linear infinite;}
.supportBox::after{content:'';position:absolute;z-index:-1;inset:1.5px;border-radius:inherit;background:radial-gradient(90% 120% at 100% 50%,rgba(255,122,138,0.12),transparent 60%),linear-gradient(165deg,#161c28,#0e131c 70%);}
.supportBox:hover{--spd:3.5s;background:none;}
.supIc{width:52px;height:52px;border-radius:16px;background:radial-gradient(circle,rgba(255,122,138,0.28),rgba(255,255,255,0.03) 70%);border:1px solid rgba(255,122,138,0.35);}
.supIc svg{width:34px;height:34px;}
.supportText b{color:#fff;text-shadow:none;}
.supportText span{color:var(--muted);}
.supportAmounts i{color:#cfd8e6;}
.payBadge{border:0;height:24px;}
.payNum{color:var(--accent-teal);background:rgba(20,224,195,0.08);border:1px solid rgba(20,224,195,0.4);box-shadow:none;border-radius:12px;}
.payNum small{color:var(--muted);}
.payNum:hover{background:rgba(20,224,195,0.16);box-shadow:0 0 24px -8px var(--accent-teal);}

/* زرار «اكتشف» في الهيدر — جلو بيلف + لمعة */
.ddBtn{
  --c1:var(--accent-teal);position:relative;isolation:isolate;overflow:hidden;gap:8px;padding:8px 16px 8px 12px;border-radius:14px;
  color:#fff;background:none;border:0;box-shadow:0 0 26px -10px var(--accent-teal);transition:transform .25s,box-shadow .25s;margin-inline-start:8px;
}
.ddBtn::before{content:'';position:absolute;z-index:-2;inset:-150%;background:conic-gradient(from 0deg,var(--accent-teal),var(--accent-orange),#ffd27a,var(--accent-teal));animation:glowSpin 4s linear infinite;}
.ddBtn::after{content:'';position:absolute;z-index:-1;inset:1.5px;border-radius:12.5px;background:linear-gradient(160deg,#18212f,#0e131c);}
.ddBtn .ddShine{position:absolute;z-index:0;top:0;bottom:0;width:36%;left:-50%;background:linear-gradient(100deg,transparent,rgba(255,255,255,0.22),transparent);animation:ddShine 3.4s ease-in-out infinite;pointer-events:none;}
@keyframes ddShine{0%,55%{left:-50%}100%{left:130%}}
.ddBtn>*{position:relative;z-index:1;}
.ddBtn:hover,.navDrop.open .ddBtn{transform:translateY(-1px);box-shadow:0 0 34px -6px var(--accent-teal);border:0;}
.navDrop.on .ddBtn{box-shadow:0 0 34px -6px var(--accent-teal);}
.ddSpark svg{width:20px;height:20px;display:block;}
.ddBtn svg:not(.ddArrow){transform:none !important;}
.ddArrow{width:15px;height:15px;transition:transform .25s;}
.navDrop.open .ddArrow{transform:rotate(180deg);}
.ddPanel{width:340px;border:1px solid rgba(255,255,255,0.1);background:rgba(14,19,28,0.97);box-shadow:0 30px 70px rgba(0,0,0,0.55),0 0 50px -25px var(--accent-teal);}
.ddItem{border:0;}
.ddItem:hover,.ddItem[aria-current="page"]{background:rgba(255,255,255,0.06) !important;}
.ddIc{width:42px;height:42px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);box-shadow:none;}
.ddIc svg{width:28px;height:28px;}
.ddChev{margin-inline-start:auto;font-style:normal;font-size:20px;color:var(--muted);transition:transform .25s,color .25s;}
.ddItem:hover .ddChev{color:var(--accent-teal);transform:translateX(-3px);}

/* =====================================================================================
   ✅ [v7] كارت الفيديو بنفس الريفرنس بالظبط: إطار سميك بكيرف كبير + الحبة على الجنب
===================================================================================== */
.device.h{padding:2.7%;border-radius:6.6% / 13.2%;background:linear-gradient(170deg,#202a3d,#161d2b 60%,#121826);border:1px solid #2c3648;box-shadow:0 30px 60px rgba(0,0,0,0.5),inset 0 1px 0 rgba(255,255,255,0.05);}
.device.h .screen{border-radius:4.6% / 9.8%;}
.device.h .notch{left:1.9%;top:50%;width:4.7%;height:44%;transform:translateY(-50%);border-radius:999px;background:#0b0f17;border:1px solid #2a3344;box-shadow:inset 0 0 0 2px rgba(0,0,0,0.25);}
.vSlide .device{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s;}
.vSlide.active:hover .device{transform:translateY(-12px);box-shadow:0 40px 80px rgba(0,0,0,0.6),0 0 60px -20px var(--accent-teal);}
.reel .device.h{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s;}
.reel:hover .device{transform:translateY(-8px);}
.reel:hover{transform:none;}

/* =====================================================================================
   ✅ [v7] التذكير — بستايل الموقع (زجاج داكن + جلو)
===================================================================================== */
.nudge{
  --c1:var(--accent-teal);position:fixed;right:18px;bottom:18px;z-index:2500;width:min(340px,calc(100vw - 36px));padding:14px;border-radius:20px;isolation:isolate;overflow:hidden;
  display:grid;gap:10px;box-shadow:0 30px 70px rgba(0,0,0,0.55),0 0 60px -28px var(--c1);
  transform:translateY(24px);opacity:0;transition:transform .5s cubic-bezier(.2,.9,.25,1.1),opacity .35s;
}
.nudge.support,.nudge.final{--c1:#ff8a8a;}
.nudge::before{content:'';position:absolute;z-index:-2;inset:-70%;background:conic-gradient(from 0deg,transparent 0deg,transparent 200deg,color-mix(in srgb,var(--c1) 35%,transparent) 260deg,var(--c1) 320deg,#fff 335deg,transparent 350deg);animation:glowSpin 6s linear infinite;}
.nudge::after{content:'';position:absolute;z-index:-1;inset:1.5px;border-radius:18.5px;background:linear-gradient(165deg,rgba(24,31,44,0.98),rgba(13,18,27,0.98));}
.nudge.show{transform:none;opacity:1;}
.nudgeX{position:absolute;top:10px;left:10px;z-index:2;width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,0.15);background:rgba(0,0,0,0.5);color:#fff;font-size:12px;cursor:pointer;backdrop-filter:blur(6px);}
.nudgeX:hover{background:rgba(255,255,255,0.15);}
.nudgeMedia{aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#0e141d;border:1px solid rgba(255,255,255,0.08);}
.nudgeMedia img,.nudgeMedia video{width:100%;height:100%;object-fit:cover;display:block;}
.nudgeMedia.art{display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,rgba(20,224,195,0.35),transparent 60%),radial-gradient(circle at 75% 75%,rgba(255,157,47,0.3),transparent 60%),#0e141d;}
.nudgeArt{font-size:54px;animation:bob 2.4s ease-in-out infinite;}
.nudgeHeart{font-size:26px;line-height:1;}
.nudgeBody{display:grid;gap:5px;}
.nudgeBody b{font-size:15.5px;font-weight:900;}
.nudgeBody span{font-size:13px;color:var(--muted);line-height:1.7;}
.nudgeGo{justify-self:start;display:inline-flex;align-items:center;gap:8px;margin-top:6px;padding:9px 18px;border-radius:12px;font-weight:900;font-size:14px;color:#1a0f00;background:linear-gradient(135deg,var(--accent-orange),#ffd27a);box-shadow:0 10px 24px -10px var(--accent-orange);transition:transform .2s;}
.nudgeGo:hover{transform:translateY(-2px);}
.nudgeGo i{font-style:normal;}
.nudgeNum{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px;padding:9px 12px;border-radius:12px;cursor:pointer;color:var(--accent-teal);background:rgba(20,224,195,0.08);border:1px dashed rgba(20,224,195,0.45);text-align:right;}
.nudgeNum b{font-size:15px;letter-spacing:.5px;}
.nudgeNum small{margin-inline-start:auto;font-weight:700;color:var(--muted);}
.nudgeNum.done{border-style:solid;background:rgba(20,224,195,0.16);}
.nudgeLater{justify-self:center;background:none;border:0;color:var(--muted);font-size:12px;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
@media(max-width:560px){.nudge{right:10px;left:10px;width:auto;bottom:80px;padding:12px;}.nudgeMedia{aspect-ratio:21/9;}}

/* =====================================================================================
   ✅ [v7] «عندي كود» + فتح المحتوى المدفوع
===================================================================================== */
.sbCode{display:inline-flex;align-items:center;gap:6px;margin-top:2px;padding:6px 12px;border-radius:10px;font-weight:800;font-size:13px;color:#ffd27a;background:rgba(255,210,122,0.07);border:1px dashed rgba(255,210,122,0.45);cursor:pointer;transition:.2s;width:100%;justify-content:center;}
.sbCode[hidden]{display:none;}
.sbCode svg{width:16px;height:16px;}
.sbCode:hover{background:rgba(255,210,122,0.14);border-style:solid;}
.sBox.unlocked{border-color:rgba(20,224,195,0.5);}
.sBox.unlocked .sbLock{color:var(--accent-teal);border-color:rgba(20,224,195,0.5);}
.sbActs.open{flex-wrap:wrap;}
.sbView{display:inline-flex;align-items:center;gap:6px;padding:10px 14px;border-radius:14px;font-weight:900;color:var(--accent-teal);border:1px solid rgba(20,224,195,0.45);background:rgba(20,224,195,0.08);}
.sbView svg{width:16px;height:16px;}
.codeBox{width:min(440px,94vw);}
.codeBody{padding:16px 18px 20px;display:grid;gap:12px;}
.codeBody p{color:var(--muted);font-size:14px;}
.codeForm{display:flex;gap:8px;}
.codeInput{flex:1;min-width:0;padding:12px 14px;border-radius:14px;border:1px solid rgba(255,255,255,0.15);background:rgba(0,0,0,0.3);color:#fff;font:900 17px/1 Consolas,monospace;letter-spacing:1.5px;text-align:center;outline:none;}
.codeInput:focus{border-color:var(--accent-teal);box-shadow:0 0 0 3px rgba(20,224,195,0.15);}
.codeMsg{font-weight:800;font-size:13.5px;min-height:1.4em;}
.codeMsg.bad{color:#ff8a80;}

/* =====================================================================================
   ✅ [v7] رجوع لستايل الجلو اللي بيلف (زي الأول) + لمسة: هالة ناعمة + لمعة زجاج + أيقونات 3D
===================================================================================== */
.promoSection{padding:52px 6% 12px;}
.promoRow{gap:18px;max-width:1180px;}
.promo.pg{
  --c1:var(--accent-teal);--c2:rgba(20,224,195,0.10);
  position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:row;align-items:center;text-align:right;gap:16px;
  padding:20px 20px 20px 18px;min-height:112px;border-radius:22px;border:0;
  background:none;box-shadow:0 18px 45px rgba(0,0,0,0.32);transform:none;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;animation:none;
}
.promo.pg.packs{--c1:var(--accent-orange);--c2:rgba(255,157,47,0.12);}
.promo.pg.master{--c1:#ffd27a;--c2:rgba(255,210,122,0.10);}
.promo.pg::before{
  content:'';position:absolute;z-index:-2;inset:-90%;left:-90%;right:-90%;top:-90%;height:auto;border-radius:0;opacity:1;
  background:conic-gradient(from 0deg,transparent 0deg,var(--c1) 55deg,transparent 120deg,transparent 180deg,rgba(255,255,255,0.45) 235deg,transparent 290deg);
  animation:promoSpin 6s linear infinite;
}
.promo.pg::after{
  content:'';position:absolute;z-index:-1;inset:1.5px;border-radius:20.5px;
  background:radial-gradient(120% 90% at 100% 0%,var(--c2),transparent 60%),linear-gradient(160deg,#161d2b,#0f141d);
}
.promo.pg:hover{transform:translateY(-5px);box-shadow:0 26px 60px rgba(0,0,0,0.45),0 0 44px -14px var(--c1);border:0;}
.promo.pg:hover::before{animation-duration:2.6s;}
.pgIcon{flex:0 0 auto;width:62px;height:62px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(160deg,rgba(255,255,255,0.08),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.1);box-shadow:inset 0 1px 0 rgba(255,255,255,0.08),0 10px 24px rgba(0,0,0,0.3);transition:transform .4s cubic-bezier(.3,1.5,.5,1);}
.pgIcon svg{width:42px;height:42px;filter:drop-shadow(0 4px 8px rgba(0,0,0,0.35));}
.promo.pg:hover .pgIcon{transform:translateY(-3px) rotate(-5deg) scale(1.05);}
.pgTxt{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1;}
.promo.pg .promoT{font-size:19px;font-weight:900;margin:0;}
.promo.pg .promoD{font-size:13px;color:var(--muted);line-height:1.7;max-width:none;}
.pgSide{display:flex;flex-direction:column;align-items:center;gap:12px;flex:0 0 auto;}
.promo.pg .promoTag{position:static;font-size:10.5px;font-weight:900;letter-spacing:.4px;text-transform:none;padding:3px 9px;border-radius:999px;color:#071016;background:var(--c1);border:0;}
.pgGo{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:20px;font-weight:900;color:var(--c1);border:1px solid rgba(255,255,255,0.14);transition:transform .3s,background .3s,color .3s;}
.promo.pg:hover .pgGo{transform:translateX(-5px);background:var(--c1);color:#071016;}
.promo.pg .promoCount{position:absolute;bottom:8px;left:16px;font-style:normal;font-size:11px;font-weight:800;color:var(--c1);margin:0;}
.promo.pg .promoCount::before{content:none;}
/* لمعة زجاج بتعدّي عند الهوفر */
.promo.pg .pgTxt::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,0.08) 50%,transparent 65%);transform:translateX(120%);transition:transform .9s ease;}
.promo.pg:hover .pgTxt::after{transform:translateX(-120%);}

/* أدوات AI: نفس العيلة — لوحة زجاج وأزرار بجلو بيظهر مع الهوفر */
.aiTools{padding:26px 6% 8px;}
.aiPanel{position:relative;isolation:isolate;overflow:hidden;gap:22px;padding:22px 24px;border-radius:22px;border:0;background:none;box-shadow:0 18px 45px rgba(0,0,0,0.3);}
.aiPanel::before{content:'';position:absolute;inset:-120%;z-index:-2;background:conic-gradient(from 0deg,transparent 0deg,rgba(20,224,195,0.75) 50deg,transparent 110deg,transparent 190deg,rgba(255,157,47,0.6) 240deg,transparent 300deg);animation:promoSpin 9s linear infinite;}
.aiPanel::after{content:'';position:absolute;inset:1.5px;z-index:-1;border-radius:20.5px;background:linear-gradient(160deg,#151c29,#0f141d);}
.aiHead h2{font-size:22px;}
.aiHead p{color:var(--muted);}
.aiBtn.pg{--ai:var(--accent-teal);position:relative;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;color:#fff;background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.08);box-shadow:none;transition:transform .25s,border-color .25s,box-shadow .25s,background .25s;}
.aiBtn.pg.fl{--ai:#7fb2ff;}.aiBtn.pg.do{--ai:#c3a6ff;}.aiBtn.pg.as{--ai:#7ee69a;}.aiBtn.pg.ar{--ai:#ffd27a;}
.aiBtn.pg:hover{transform:translateY(-3px);background:rgba(255,255,255,0.06);border-color:var(--ai);box-shadow:0 0 26px -8px var(--ai);}
.pgIc{flex:0 0 auto;width:38px;height:38px;display:grid;place-items:center;}
.pgIc svg{width:34px;height:34px;filter:drop-shadow(0 3px 6px rgba(0,0,0,0.35));}
.aiBtn.pg .aiTxt b{font-size:14.5px;color:#fff;text-shadow:none;}
.aiBtn.pg .aiTxt small{color:var(--muted);font-weight:600;}
.pgChev{margin-inline-start:auto;font-style:normal;color:var(--muted);transition:.25s;}
.aiBtn.pg:hover .pgChev{color:var(--ai);transform:translate(-2px,-2px);}

/* الدعم: لوحة زجاج بجلو برتقالي بيلف */
.supportBox{position:relative;isolation:isolate;overflow:hidden;gap:16px;padding:16px 20px;border-radius:22px;border:0;background:none;box-shadow:0 18px 45px rgba(0,0,0,0.3);}
.supportBox::before{content:'';position:absolute;inset:-150%;z-index:-2;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,157,47,0.85) 50deg,transparent 110deg,transparent 190deg,rgba(255,120,150,0.55) 240deg,transparent 300deg);animation:promoSpin 7s linear infinite;}
.supportBox::after{content:'';position:absolute;inset:1.5px;z-index:-1;border-radius:20.5px;background:radial-gradient(90% 120% at 100% 50%,rgba(255,120,150,0.10),transparent 60%),linear-gradient(160deg,#161c28,#0f141d);}
.supportBox:hover{background:none;}
.supIc{width:52px;height:52px;border-radius:16px;background:linear-gradient(160deg,rgba(255,255,255,0.08),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.1);}
.supIc svg{width:36px;height:36px;}
.supportText b{color:#fff;text-shadow:none;}
.supportText span{color:var(--muted);}
.supportAmounts i{color:#d6dde8;}
.payBadge{border:0;height:24px;}
.payNum{color:var(--accent-teal);background:rgba(20,224,195,0.08);border:1px solid rgba(20,224,195,0.4);box-shadow:none;border-radius:12px;}
.payNum small{color:var(--muted);}
.payNum:hover{background:rgba(20,224,195,0.16);transform:translateY(-1px);box-shadow:0 0 22px -8px var(--accent-teal);}

/* زرار «اكتشف»: كبسولة زجاج بجلو بيلف + لمعة */
.ddBtn{position:relative;isolation:isolate;overflow:hidden;gap:8px;padding:8px 18px 8px 14px;color:#fff;background:none;border:0;border-radius:999px;box-shadow:0 0 24px -6px rgba(20,224,195,0.55);transform:none;}
.ddBtn::before{content:'';position:absolute;inset:-160%;z-index:-2;background:conic-gradient(from 0deg,var(--accent-teal),var(--accent-orange),#c3a6ff,var(--accent-teal));animation:promoSpin 3.2s linear infinite;}
.ddGlow{position:absolute;inset:1.5px;z-index:-1;border-radius:999px;background:linear-gradient(160deg,#17202f,#0d131c);}
.ddBtn::after{z-index:0;width:35%;background:linear-gradient(100deg,transparent,rgba(255,255,255,0.35),transparent);animation:ddShine 3.4s ease-in-out infinite;}
.ddBtn:hover,.navDrop.open .ddBtn{transform:translateY(-1px);box-shadow:0 0 34px -4px rgba(20,224,195,0.75);border:0;}
.navDrop.on .ddBtn{box-shadow:0 0 30px -4px rgba(20,224,195,0.7);}
.ddTxt{font-weight:900;font-size:15px;position:relative;}
.ddSpark svg{width:20px;height:20px;}
.ddArrow{position:relative;color:var(--accent-teal);}
.ddPanel{width:340px;border:1px solid rgba(255,255,255,0.1);background:rgba(14,19,28,0.97);box-shadow:0 28px 70px rgba(0,0,0,0.55),0 0 0 1px rgba(20,224,195,0.08);}
.ddItem{border:0;}
.ddItem:hover,.ddItem[aria-current="page"]{background:rgba(255,255,255,0.06) !important;border:0;}
.ddIc{background:linear-gradient(160deg,rgba(255,255,255,0.08),rgba(255,255,255,0.02));border:1px solid rgba(255,255,255,0.08);box-shadow:none;}
.ddItem:hover .ddChev{color:var(--accent-teal);}

/* التذكير: كارت زجاج Premium بجلو رفيع بيلف */
.nudge{isolation:isolate;overflow:hidden;padding:14px;border-radius:22px;border:0;background:none;box-shadow:0 30px 70px rgba(0,0,0,0.55),0 0 40px -18px rgba(20,224,195,0.6);}
.nudge::before{content:'';position:absolute;inset:-150%;z-index:-2;background:conic-gradient(from 0deg,transparent 0deg,var(--accent-teal) 60deg,transparent 120deg,transparent 190deg,var(--accent-orange) 250deg,transparent 310deg);animation:promoSpin 6s linear infinite;}
.nudge::after{content:'';position:absolute;inset:1.5px;z-index:-1;border-radius:20.5px;background:linear-gradient(165deg,rgba(23,31,46,0.98),rgba(12,17,25,0.98));}
.nudgeX{top:10px;left:10px;border:1px solid rgba(255,255,255,0.15);background:rgba(0,0,0,0.5);box-shadow:none;border-radius:50%;backdrop-filter:blur(6px);}
.nudgeX:hover{background:#b3121b;}
.nudgeMedia{border:1px solid rgba(255,255,255,0.08);border-radius:16px;}
.nudgeMedia.art{background:radial-gradient(circle at 30% 30%,rgba(20,224,195,0.35),transparent 60%),radial-gradient(circle at 75% 75%,rgba(255,157,47,0.35),transparent 60%),#121924;}
.nudgeBody span{color:var(--muted);}
.nudgeGo{color:#04201c;background:var(--accent-teal);border:0;box-shadow:0 10px 26px -10px var(--accent-teal);border-radius:12px;}
.nudgeGo:hover{filter:brightness(1.08);transform:translateY(-1px);}
.nudgeNum{color:var(--accent-teal);background:rgba(20,224,195,0.08);border:1px dashed rgba(20,224,195,0.45);box-shadow:none;}
.nudgeNum small{color:var(--muted);}
.nudgeNum.done{background:rgba(20,224,195,0.18);border-style:solid;}
.nudge.final::before,.nudge.support::before{background:conic-gradient(from 0deg,transparent 0deg,var(--accent-orange) 60deg,transparent 120deg,transparent 190deg,rgba(255,120,150,0.8) 250deg,transparent 310deg);}
@media (prefers-reduced-motion: reduce){.promo.pg::before,.aiPanel::before,.supportBox::before,.ddBtn::before,.nudge::before{animation:none;}}

/* =====================================================================================
   ✅ [v7] كارت الفيديو بالظبط زي الريفرنس (الكيرف + الحافة + النوتش الجانبي) + بيترفع مع الماوس
===================================================================================== */
.device.h,.vSlide .device{
  padding:22px;border-radius:46px;
  background:linear-gradient(160deg,#1f2839 0%,#161d2b 55%,#1a2233 100%);
  border:2px solid #2b3447;
  box-shadow:0 30px 60px rgba(0,0,0,0.45),inset 0 0 0 1px rgba(0,0,0,0.45),inset 0 2px 0 rgba(255,255,255,0.04);
}
.device.h .screen,.vSlide .device .screen{aspect-ratio:2.125/1;border-radius:30px;}
.device.h .notch{left:14px;top:28%;width:40px;height:44%;transform:none;border-radius:20px;background:#0a0e15;border:2px solid #1e2636;box-shadow:inset 0 0 0 1px rgba(255,255,255,0.03);}
.vSlide .device{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s;}
.vSlide:hover .device{transform:translateY(-12px);box-shadow:0 44px 80px rgba(0,0,0,0.55),0 0 0 1px rgba(20,224,195,0.25),inset 0 0 0 1px rgba(0,0,0,0.45);}
.vSlide:not(.active):hover .device{transform:translateY(-6px);}
.vSlide:hover .vGlow{opacity:.85;}
.reel .device.h{padding:16px;border-radius:36px;}
.reel .device.h .screen{border-radius:24px;}
.reel .device.h .notch{left:9px;width:28px;}
.vClose{top:32px;left:36px;}
@media(max-width:900px){
  .device.h,.vSlide .device{padding:10px;border-radius:26px;border-width:1.5px;}
  .device.h .screen,.vSlide .device .screen{border-radius:18px;}
  .device.h .notch{left:5px;width:16px;border-radius:10px;border-width:1.5px;}
  .vClose{top:16px;left:20px;}
}

/* =====================================================================================
   ✅ [v7] الموبايل: مقاسات Premium مضغوطة ومرنة (معظم الزوار من الموبايل)
===================================================================================== */
@media(max-width:600px){
  :root{--h1-m:24px;--p-m:14px;--h2-m:21px;--card-title:15px;--card-text:12.5px;--radius:14px;}
  body{font-size:14px;}
  nav{padding:10px 4%;}
  .brandLogo{width:32px;height:32px;border-radius:10px;}
  .brandText .title{font-size:13.5px;}
  .brandText .sub{font-size:10.5px;}
  .topBtn{padding:7px 12px;font-size:12.5px;border-radius:11px;}
  .hamburger{width:38px;height:38px;border-radius:11px;}
  .mobileMenu{top:58px;}
  .mobileMenu a{padding:9px 12px;font-size:14px;}
  .btnPrimary,.btnSecondary{padding:10px 16px;font-size:13.5px;border-radius:12px;}
  .section{padding:38px 5%;}
  .sectionHead{flex-direction:column;align-items:flex-start;gap:4px;margin-bottom:14px;}
  #about .sectionHead,.worksSection .sectionHead{align-items:center;}
  .sectionHead h2{font-size:var(--h2-m);line-height:1.4;}
  .sectionHead .hint{font-size:12.5px;}
  /* الهيرو */
  .hero{padding:18px 5% 6px;gap:14px;min-height:auto;}
  .heroImage{min-height:280px;}
  .heroPic{width:min(290px,80%);}
  .softIcon{width:58px;height:58px;}
  .heroText h1{line-height:1.45;margin-bottom:10px;}
  .heroText p{line-height:1.8;margin-bottom:14px;}
  .rating{font-size:12.5px;justify-content:center;}
  /* أزرار الأقسام */
  .promoSection{padding:30px 5% 6px;}
  .blockHead{margin-bottom:14px;}
  .blockHead h2{font-size:19px;margin-top:8px;}
  .blockHead .eyebrow,.eyebrow{font-size:11.5px;padding:4px 11px;}
  .promoRow{gap:10px;}
  .promo.pg{padding:12px 12px 12px 10px;min-height:0;gap:12px;border-radius:18px;}
  .promo.pg::after{border-radius:16.5px;}
  .pgIcon{width:46px;height:46px;border-radius:14px;}
  .pgIcon svg{width:30px;height:30px;}
  .promo.pg .promoT{font-size:15.5px;}
  .promo.pg .promoD{font-size:12px;line-height:1.6;}
  .pgSide{gap:8px;}
  .promo.pg .promoTag{font-size:9.5px;padding:2px 7px;}
  .pgGo{width:26px;height:26px;font-size:16px;}
  .promo.pg .promoCount{font-size:10px;bottom:5px;left:10px;}
  /* أدوات AI */
  .aiTools{padding:20px 5% 4px;}
  .aiPanel{padding:14px;gap:12px;border-radius:18px;}
  .aiPanel::after{border-radius:16.5px;}
  .aiHead h2{font-size:18px;margin:6px 0 2px;}
  .aiHead p{font-size:12px;}
  .aiGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .aiBtn.pg{padding:8px 9px;gap:7px;border-radius:12px;}
  .pgIc{width:28px;height:28px;}.pgIc svg{width:26px;height:26px;}
  .aiBtn.pg .aiTxt b{font-size:12.5px;}
  .aiBtn.pg .aiTxt small{display:none;}
  .pgChev{font-size:12px;}
  /* الدعم */
  .supportStrip{padding:20px 5% 4px;}
  .supportBox{padding:12px 14px;gap:10px;border-radius:18px;}
  .supportBox::after{border-radius:16.5px;}
  .supportText b{font-size:14px;}
  .supportText span{font-size:12px;}
  .supportAmounts i{font-size:11.5px;padding:0 4px;}
  .payNum{padding:6px 11px;font-size:13px;}
  .payBadge{height:22px;font-size:10px;}
  /* المعرض */
  .gallery{padding:26px 4% 4px;}
  .galHead h2{font-size:18px;}
  .galCount{font-size:11.5px;}
  .galToggle{padding:4px 6px 4px 10px;gap:8px;font-size:12px;}
  .galToggle .switch{font-size:13px;}
  .galFrames{gap:10px;}
  .frameBox{padding:8px 0;border-radius:16px;}
  .frameTitle{font-size:12px;padding:0 14px 6px;}
  .frameRow{gap:8px;padding:0 8px;}
  .frameRow .mqItem{width:150px;border-radius:10px;}
  /* فيديوهات الشرح */
  .vStage,.vTrack{--sw:86cqw;}
  .vTrack{gap:10px;padding-top:16px;padding-bottom:18px;}
  .vSlide{transform:scale(.93);}
  .vTabs{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding:2px 5% 6px;margin-inline:-5%;scrollbar-width:none;}
  .vTabs::-webkit-scrollbar{display:none;}
  .vTab{flex:0 0 auto;padding:6px 12px;font-size:12px;max-width:200px;}
  .vCarTitle{font-size:13.5px;}
  .vClose{font-size:11.5px;padding:4px 9px;}
  .scrPlay{width:44px;height:44px;}.scrPlay svg{width:18px;height:18px;}
  /* محرر البرومبت CTA */
  .editorCtaSection{padding:28px 5% !important;}
  .editorCtaBox{padding:20px 16px !important;border-radius:18px !important;}
  .editorCtaText h2{font-size:19px !important;}
  .editorCtaText p{font-size:13px !important;}
  .editorBtnPrimary,.editorBtnSecondary{padding:10px 16px !important;font-size:13.5px !important;}
  /* الكروت */
  .catChips{gap:6px;margin-bottom:12px;}
  .catChips a,.catChips button{padding:5px 11px;font-size:12px;}
  .slide{flex-basis:74vw;}
  .card{padding:10px;border-radius:14px;}
  .thumb{height:auto;aspect-ratio:16/9;margin-bottom:8px;border-radius:10px;}
  .card h3{margin-bottom:4px;}
  .card p{margin-bottom:8px;}
  .actions{gap:6px;}
  .btnSmall{padding:7px 10px;font-size:12px;border-radius:10px;}
  .vidBtn svg{width:14px;height:14px;}
  .vidTip{top:10px;left:10px;right:10px;height:auto;aspect-ratio:16/9;}
  .navBtn{width:36px;height:36px;}
  .catBlock + .catBlock{margin-top:22px;}
  .skelCard{flex-basis:74vw;height:300px;}
  /* من أنا + أعمالي */
  .aboutCenter{padding:16px 6px 4px;}
  .aboutHeroImg{max-width:300px;}
  .aboutName{font-size:22px;}
  .aboutRole{font-size:13px;}
  .aboutDesc{font-size:13.5px;line-height:1.95;}
  .aboutWorks{padding:9px 16px;font-size:13px;margin-top:14px;}
  .worksLabel{font-size:12.5px;margin:16px auto 10px;}
  .reelGrid{gap:10px;}
  .reelGrid.v{grid-template-columns:repeat(2,minmax(0,1fr));}
  .reel{gap:6px;}
  .reelTitle{font-size:12px;}
  .device.v{padding:6px;border-radius:22px;}
  .device.v .screen{border-radius:17px;}
  .device.v .notch{top:10px;height:11px;}
  .reelNum,.reelSrc{font-size:9.5px;padding:1px 7px;top:12px;}
  .device.v .reelNum,.device.v .reelSrc{top:28px;}
  .reelNum{right:12px;}.reelSrc{left:12px;}
  .reel .device.h{padding:8px;border-radius:22px;}
  .reel .device.h .screen{border-radius:15px;}
  .reel .device.h .notch{left:3px;width:12px;}
  /* تواصل */
  #contact .videoGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
  .videoCard{padding:12px 8px;border-radius:14px;}
  .videoCard h3{font-size:13px;margin-bottom:8px;}
  .contactLink{padding:7px 8px;font-size:11.5px;border-radius:10px;}
  .contactForm{padding:16px;border-radius:18px;gap:10px;}
  .contactForm h3{font-size:17px;}
  .formField input,.formField select,.formField textarea{padding:10px 12px;font-size:14px;border-radius:12px;}
  /* الفوتر */
  .siteFooter{margin-top:40px;padding-top:30px;}
  .footerContainer{display:grid;grid-template-columns:1fr 1fr;gap:22px 14px;padding:0 5% 24px;}
  .footerBrand{grid-column:1/-1;}
  .footerBrand h3{font-size:16px;}
  .footerBrand p,.footerLinks a{font-size:13px;}
  .footerLinks{gap:8px;}
  .footerBottom{font-size:11.5px;padding:14px 5%;}
  .soc{width:32px;height:32px;}
  .whatsapp{width:48px;height:48px;border-radius:15px;left:12px;bottom:12px;}
  .whatsapp svg{width:24px;height:24px;}
  /* النوافذ: Bottom sheet */
  .modal{align-items:flex-end;padding:0;}
  .modalBox,.buyBox{width:100%;border-radius:22px 22px 0 0;max-height:88vh;}
  .vidModal{align-items:center;padding:10px;}
  /* صفحات المتجر والتوجلات والنوت */
  .pageHero{padding:30px 5% 4px;}
  .pageHero h1,.togHero h1{font-size:25px;margin:10px 0 6px;}
  .pageHero p{font-size:13.5px;}
  .howBuy li{padding:8px 10px;}
  .storeGrid{gap:12px;}
  .sbBody{padding:12px;}
  .sbBody h3{font-size:15px;}
  .sbPrice b{font-size:17px;}
  .togSearch{padding:11px 14px;font-size:14px;}
  .tg summary{padding:11px 12px;gap:10px;}
  .tgText{font-size:14.5px;}
  .tgBody{padding:0 12px 12px;}
  .tgPrompt{font-size:13.5px;padding:12px;}
  .dividerTitle{font-size:16px;}
  .nudge{bottom:72px;padding:12px;border-radius:18px;}
  .nudge::after{border-radius:16.5px;}
  .nudgeBody b{font-size:14.5px;}
  .nudgeBody span{font-size:12px;}
}
@media(max-width:380px){
  .aiGrid{grid-template-columns:1fr 1fr;}
  .heroBtns{gap:8px;}
  #contact .videoGrid{grid-template-columns:1fr 1fr;}
}
@media(max-width:600px){.aiBtn.pg .aiTxt small{display:none !important;}.aiBtn.pg .aiTxt b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;}.aiTxt{min-width:0;}}

/* النوت: الخانات المتغيرة [ ] ( ) { } */
.nVarsBox{margin-top:8px;display:grid;gap:8px;}
.nVarsBox[hidden]{display:none;}
.nVarRow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.nVarRow>b{font-size:12px;color:var(--muted);font-weight:800;margin-inline-end:2px;}
.nVar{display:inline-flex;align-items:center;gap:0;border-radius:10px;overflow:hidden;border:1px solid rgba(20,224,195,0.35);background:rgba(20,224,195,0.06);}
.nVar span{padding:5px 8px;font-size:11.5px;font-weight:800;color:var(--accent-teal);direction:ltr;max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.nVar input{width:130px;padding:6px 9px;border:0;border-inline-start:1px solid rgba(20,224,195,0.25);background:rgba(0,0,0,0.3);color:#fff;font-size:13px;outline:none;}
.nVar input:focus{background:rgba(0,0,0,0.45);}
.nVar.filled{border-color:var(--accent-teal);}
.nResult{padding:10px 12px;border-radius:12px;background:rgba(20,224,195,0.05);border:1px dashed rgba(20,224,195,0.35);font-size:13.5px;line-height:1.9;white-space:pre-wrap;word-break:break-word;}
.nResult mark{background:rgba(20,224,195,0.22);color:#fff;border-radius:5px;padding:0 3px;}
.nResultHead{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);font-weight:800;}
.nResultHead button{background:none;border:0;color:var(--accent-teal);font-weight:800;font-size:12px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
@media(max-width:600px){.nVar input{width:110px;}}

/* =====================================================================================
   v8 — 🗺️ خريطة كورس حسين علاء (course.html) + زرار الرئيسية + تحسين الأداء
===================================================================================== */
:root{--cm-ai1:#7cf7e4;--cm-ai2:#b78bff;--cm-ed1:#ffd27a;--cm-ed2:#ff7a3d;--cm-up1:#7cc4ff;--cm-up2:#5a6bff;}

/* ---------- زرار الرئيسية (فوق إطار المعرض) — أكتر زرار مميز في الموقع ---------- */
.cmCtaWrap{padding:26px 5% 4px;display:flex;justify-content:center;}
.cmCta{position:relative;isolation:isolate;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:18px;width:min(980px,100%);padding:18px 22px;border-radius:26px;text-decoration:none;color:#fff;overflow:hidden;
  background:radial-gradient(120% 140% at 100% 0%,rgba(255,179,71,.16),transparent 55%),radial-gradient(120% 140% at 0% 100%,rgba(20,224,195,.16),transparent 55%),#0d131d;
  box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06) inset;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;}
.cmCta::before{content:"";position:absolute;inset:-2px;z-index:-2;border-radius:inherit;background:conic-gradient(from var(--cm-a,0deg),#14e0c3,#ffd27a,#ff7a3d,#b78bff,#14e0c3);animation:cmSpin 5s linear infinite;}
.cmCta::after{content:"";position:absolute;inset:2px;z-index:-1;border-radius:24px;background:radial-gradient(120% 140% at 100% 0%,rgba(255,179,71,.14),transparent 55%),radial-gradient(120% 140% at 0% 100%,rgba(20,224,195,.14),transparent 55%),linear-gradient(180deg,#111a27,#0b1119);}
@keyframes cmSpin{to{transform:rotate(1turn)}}
.cmCta::before{inset:-60%;}
.cmCta:hover{transform:translateY(-4px);box-shadow:0 26px 70px rgba(0,0,0,.55),0 0 46px rgba(20,224,195,.18);}
.cmCta .cmCtaIc{width:72px;height:72px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.12);animation:cmBob 3.6s ease-in-out infinite;}
.cmCta .cmCtaIc svg{width:50px;height:50px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.4));}
@keyframes cmBob{50%{transform:translateY(-5px) rotate(-3deg)}}
.cmCtaTxt{display:grid;gap:3px;min-width:0;}
.cmCtaTxt small{display:inline-flex;align-items:center;gap:8px;font-weight:800;font-size:12.5px;color:#ffd27a;}
.cmDot{width:8px;height:8px;border-radius:50%;background:#ffd27a;box-shadow:0 0 0 0 rgba(255,210,122,.7);animation:cmPing 1.8s infinite;}
@keyframes cmPing{70%{box-shadow:0 0 0 9px rgba(255,210,122,0)}100%{box-shadow:0 0 0 0 rgba(255,210,122,0)}}
.cmCtaTxt b{font-size:clamp(20px,2.6vw,30px);font-weight:900;line-height:1.25;background:linear-gradient(90deg,#fff 0%,#ffe2a6 35%,#7cf7e4 70%,#fff 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:cmShine 6s linear infinite;}
@keyframes cmShine{to{background-position:-220% 0}}
.cmCtaTxt em{font-style:normal;color:#b7c2d3;font-size:14px;}
.cmCtaApps{display:flex;align-items:center;}
.cmCtaApps img,.cmCtaApps .cmAiChip{width:36px;height:36px;margin-inline-start:-8px;border-radius:10px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.45));transition:transform .3s;}
.cmCta:hover .cmCtaApps img,.cmCta:hover .cmCtaApps .cmAiChip{transform:translateY(-4px);}
.cmAiChip{display:inline-grid;place-items:center;font-weight:900;font-size:13px;color:#0b1016;background:linear-gradient(135deg,var(--cm-ai1),var(--cm-ai2));border-radius:10px;}
.cmCtaGo{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;font-weight:900;color:#0b1016;white-space:nowrap;background:linear-gradient(135deg,#ffe2a6,#ff9d2f);box-shadow:0 10px 24px rgba(255,157,47,.35);}
.cmCtaGo i{font-style:normal;font-size:20px;line-height:1;transition:transform .3s;}
.cmCta:hover .cmCtaGo i{transform:translateX(-5px);}
.cmCtaGo::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.7) 50%,transparent 70%);transform:translateX(120%);animation:cmSweep 3.2s ease-in-out infinite;}
@keyframes cmSweep{60%,100%{transform:translateX(-120%)}}
.mCourse{display:flex !important;align-items:center;gap:10px;margin:6px 0;padding:12px 14px !important;border-radius:14px;font-weight:900;color:#fff !important;background:linear-gradient(135deg,rgba(20,224,195,.16),rgba(255,157,47,.16));border:1px solid rgba(255,210,122,.35);}
.mCourse svg{width:30px;height:30px;flex:none;}

/* ---------- صفحة الكورس ---------- */
.coursePage{background:var(--bg-dark);}
.cmHero{position:relative;overflow:hidden;isolation:isolate;padding:42px 5% 30px;}
.cmHeroBg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.55;}
.cmHero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,16,22,.2),rgba(11,16,22,.75) 70%,var(--bg-dark)),radial-gradient(60% 70% at 15% 40%,rgba(20,224,195,.16),transparent 70%);}
.cmFlag{position:absolute;top:14px;right:16px;display:inline-flex;padding:3px;border-radius:7px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);box-shadow:0 4px 12px rgba(0,0,0,.35);z-index:2;}
.cmFlag img{width:30px;height:20px;border-radius:4px;display:block;object-fit:cover;}
.cmHeroIn{max-width:1180px;margin:auto;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:30px;}
.cmHeroTxt{display:grid;justify-items:start;gap:12px;}
.cmLogo{width:170px;height:auto;filter:drop-shadow(0 6px 18px rgba(0,0,0,.4));}
.cmHeroTxt h1{margin:0;font-size:clamp(28px,4.4vw,54px);line-height:1.2;font-weight:900;background:linear-gradient(90deg,#fff,#ffe2a6 45%,#7cf7e4);-webkit-background-clip:text;background-clip:text;color:transparent;}
.cmHeroTxt p{margin:0;color:#c8d1df;font-size:clamp(15px,1.5vw,18px);line-height:1.9;max-width:560px;}
.cmIcons{display:inline-flex;flex-wrap:wrap;gap:8px;align-items:center;}
.cmIc{display:inline-flex;align-items:center;gap:6px;height:42px;min-width:42px;padding:4px;border-radius:13px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);}
.cmIc img{width:32px;height:auto;display:block;}
.cmIc.ai{padding:4px 10px 4px 8px;color:#e6fffb;font-weight:900;font-size:13px;}
.cmIc.ai svg{width:24px;height:24px;}
.cmIcons.big .cmIc{height:52px;min-width:52px;border-radius:16px;}
.cmIcons.big .cmIc img{width:40px;}
.cmHeroBtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}
.cmGo{text-decoration:none;}
.cmWaBtn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;font-weight:900;color:#fff;text-decoration:none;background:linear-gradient(135deg,#25d366,#128c4a);box-shadow:0 10px 24px rgba(37,211,102,.25);transition:transform .25s;}
.cmWaBtn:hover{transform:translateY(-2px);}
.cmWaBtn svg{width:22px;height:22px;}
.cmWaBtn.big{padding:15px 28px;font-size:17px;}
.cmHeroPic{position:relative;display:grid;place-items:end center;min-height:300px;}
.cmHalo{position:absolute;inset:12% 8% 0;border-radius:50%;background:radial-gradient(circle at 50% 55%,rgba(20,224,195,.55),rgba(183,139,255,.25) 45%,transparent 70%);filter:blur(10px);}
.cmMe{position:relative;width:auto;max-width:100%;max-height:460px;height:auto;-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent);mask-image:linear-gradient(180deg,#000 82%,transparent);}
.cmFloat{position:absolute;width:58px;height:auto;filter:drop-shadow(0 10px 18px rgba(0,0,0,.5));animation:cmFloat 5s ease-in-out infinite;}
.cmFloat.f1{top:12%;right:6%;}
.cmFloat.f2{top:38%;left:2%;animation-delay:-1.3s;}
.cmFloat.f3{bottom:16%;right:0;animation-delay:-2.6s;}
.cmFloat.f4{top:6%;left:16%;width:52px;height:52px;border-radius:15px;font-size:18px;animation-delay:-3.6s;}
@keyframes cmFloat{50%{transform:translateY(-12px) rotate(4deg)}}

.cmMain{padding-bottom:30px;}
.cmSec{padding:54px 5% 10px;max-width:1240px;margin:0 auto;}
.cmHead{text-align:center;display:grid;justify-items:center;gap:10px;margin-bottom:26px;}
.cmHead h2{margin:0;font-size:clamp(24px,3vw,36px);font-weight:900;}
.cmHead p{margin:0;color:var(--muted);max-width:620px;line-height:1.8;}
.cmHead.split{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;text-align:start;}
.cmHead.split>div:first-child{display:grid;gap:8px;justify-items:start;}
.cmAds.closed .cmHead{margin-bottom:0;}

/* خريطة المسارات: كروت متوصلة بخط متحرك */
.cmMap{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;}
.cmMap::before{content:"";position:absolute;top:54px;right:8%;left:8%;height:2px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.35) 0 10px,transparent 10px 20px);background-size:40px 2px;animation:cmRoute 1.6s linear infinite;z-index:0;}
@keyframes cmRoute{to{background-position:-40px 0}}
.cmMap .skelBox{height:300px;}
.cmStep{--t1:var(--cm-ai1);--t2:var(--cm-ai2);position:relative;z-index:1;display:flex;flex-direction:column;gap:10px;padding:22px 20px 20px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),#0f1621;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 40px rgba(0,0,0,.35);transition:transform .35s,border-color .35s;}
.cmStep::before{content:"";position:absolute;top:0;right:20px;left:20px;height:3px;border-radius:0 0 6px 6px;background:linear-gradient(90deg,var(--t1),var(--t2));}
.cmStep:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--t1) 45%,transparent);}
.cmStep.edit,.cmTrack.edit{--t1:var(--cm-ed1);--t2:var(--cm-ed2);}
.cmStep.upd,.cmTrack.upd{--t1:var(--cm-up1);--t2:var(--cm-up2);}
.cmStepTop{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.cmNum{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;font-size:24px;font-weight:900;color:#0b1016;background:linear-gradient(135deg,var(--t1),var(--t2));box-shadow:0 10px 24px color-mix(in srgb,var(--t2) 40%,transparent);}
.cmTag{display:inline-block;align-self:flex-start;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.3px;color:var(--t1,#7cf7e4);background:color-mix(in srgb,var(--t1,#7cf7e4) 12%,transparent);border:1px solid color-mix(in srgb,var(--t1,#7cf7e4) 35%,transparent);}
.cmStep h3{margin:2px 0 0;font-size:21px;font-weight:900;}
.cmStep p{margin:0;color:#b8c3d4;line-height:1.85;font-size:14.5px;}
.cmPoints{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:8px;}
.cmPoints li{position:relative;padding-inline-start:28px;line-height:1.7;font-size:14.5px;color:#e7edf6;}
.cmPoints li::before{content:"✓";position:absolute;right:0;top:2px;width:20px;height:20px;display:grid;place-items:center;border-radius:7px;font-size:12px;font-weight:900;color:#0b1016;background:linear-gradient(135deg,var(--t1),var(--t2));}
.cmSee{margin-top:auto;align-self:flex-start;display:inline-flex;gap:6px;align-items:center;padding:9px 16px;border-radius:999px;font-weight:900;font-size:14px;text-decoration:none;color:var(--t1);border:1px solid color-mix(in srgb,var(--t1) 40%,transparent);transition:.25s;}
.cmSee:hover{background:color-mix(in srgb,var(--t1) 14%,transparent);}
.cmSee i{font-style:normal;}

/* نتائج كل كورس */
.cmTrack{--t1:var(--cm-ai1);--t2:var(--cm-ai2);position:relative;max-width:1240px;margin:46px auto 0;padding:34px 4% 30px;border-radius:32px;overflow:hidden;isolation:isolate;
  background:radial-gradient(70% 60% at 100% 0%,color-mix(in srgb,var(--t1) 12%,transparent),transparent 70%),radial-gradient(60% 60% at 0% 100%,color-mix(in srgb,var(--t2) 12%,transparent),transparent 70%),rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.07);scroll-margin-top:80px;}
@media(min-width:1300px){.cmTrack{margin-inline:auto;}}
.cmTrackHead{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;margin-bottom:24px;}
.cmTrackNum{font-size:clamp(54px,7vw,92px);font-weight:900;line-height:.9;color:transparent;-webkit-text-stroke:2px color-mix(in srgb,var(--t1) 70%,transparent);opacity:.9;}
.cmTrackHead h2{margin:6px 0 4px;display:grid;gap:0;line-height:1.15;}
.cmTrackHead h2 small{font-size:15px;font-weight:800;color:var(--muted);}
.cmTrackHead h2 span{font-size:clamp(25px,3.4vw,42px);font-weight:900;background:linear-gradient(90deg,#fff,var(--t1) 55%,var(--t2));-webkit-background-clip:text;background-clip:text;color:transparent;}
.cmTrackHead p{margin:0;color:#b8c3d4;line-height:1.8;max-width:640px;}
.cmVids{display:grid;gap:26px;}
.cmReels{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:18px;}
.cmPicsHead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px;margin:26px 0 12px;}
.cmPicsHead b{font-size:18px;font-weight:900;}
.cmPicsHead small{color:var(--muted);}

/* إطارات الصور المتحركة */
.cmFrame{margin-top:4px;}
.cmFrame .frameRow{align-items:stretch;}
.cmPic{padding:0;border:0;background:none;cursor:zoom-in;height:220px;width:auto !important;flex:none;overflow:hidden;}
.cmPic{min-width:140px;background:rgba(255,255,255,.04);}
.cmPic img{height:100%;width:auto;min-width:140px;display:block;border-radius:inherit;object-fit:cover;}
.cmAdFrame .cmPic{height:210px;}
.cmShotFrame .cmPic{height:430px;width:236px !important;border-radius:18px;}
.cmShotFrame .cmPic img{width:100%;object-fit:cover;object-position:top;}
.cmFrame:not(.moving) .frameRow{justify-content:center;flex-wrap:wrap;}

/* الاشتراك */
.cmOffers{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:22px;align-items:stretch;}
.cmOffer{position:relative;isolation:isolate;display:flex;flex-direction:column;border-radius:26px;overflow:hidden;background:#0f1621;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 40px rgba(0,0,0,.35);transition:transform .35s;}
.cmOffer:hover{transform:translateY(-6px);}
.cmOffer.hl{border-color:transparent;}
.cmOffer.hl::before{content:"";position:absolute;inset:-60%;z-index:-2;background:conic-gradient(from 0deg,#ffd27a,#ff7a3d,#b78bff,#14e0c3,#ffd27a);animation:cmSpin 6s linear infinite;}
.cmOffer.hl::after{content:"";position:absolute;inset:2px;z-index:-1;border-radius:24px;background:#0f1621;}
.cmOfferPic{position:relative;height:230px;padding-top:14px;display:grid;place-items:end center;background:radial-gradient(70% 80% at 50% 100%,rgba(20,224,195,.35),transparent 70%),linear-gradient(180deg,#152033,#0f1621);overflow:hidden;}
.cmOffer.hl .cmOfferPic{background:radial-gradient(70% 80% at 50% 100%,rgba(255,157,47,.4),transparent 70%),linear-gradient(180deg,#22180f,#0f1621);}
.cmOfferPic img{max-height:100%;max-width:92%;width:auto;height:auto;object-fit:contain;transition:transform .5s;}
.cmOffer.ph-bundle .cmOfferPic{place-items:center;}
.cmOffer.ph-bundle .cmOfferPic img{max-height:88%;}
.cmOffer:hover .cmOfferPic img{transform:scale(1.04);}
.cmBadge{position:absolute;top:14px;left:14px;z-index:2;padding:6px 14px;border-radius:999px;font-weight:900;font-size:13px;color:#0b1016;background:linear-gradient(135deg,#ffe2a6,#ff9d2f);box-shadow:0 8px 18px rgba(255,157,47,.35);}
.cmOfferBody{display:flex;flex-direction:column;gap:10px;padding:18px 20px 20px;flex:1;}
.cmOfferBody h3{margin:0;font-size:21px;font-weight:900;}
.cmOfferBody p{margin:0;color:#b8c3d4;line-height:1.8;font-size:14.5px;}
.cmPrice{display:flex;align-items:baseline;gap:10px;margin-top:auto;}
.cmPrice b{font-size:26px;font-weight:900;color:#ffd27a;}
.cmPrice s{color:#7d8899;}
.cmPrice.ask{font-weight:800;color:#ffd27a;font-size:14px;}
.cmBuy{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 16px;border-radius:16px;font-weight:900;color:#fff;text-decoration:none;background:linear-gradient(135deg,#25d366,#128c4a);transition:filter .25s,transform .25s;}
.cmBuy:hover{filter:brightness(1.08);transform:translateY(-1px);}
.cmBuy svg{width:21px;height:21px;}

/* التقييمات: كروت متصممة بتتحرك ببطء */
.cmRevFrame{margin-bottom:16px;}
.cmRevFrame .frameRow{align-items:stretch;padding-block:8px;}
.cmReview{flex:none;width:330px;display:flex;flex-direction:column;gap:10px;padding:18px 18px 16px;border-radius:22px;text-align:start;direction:rtl;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02)),#101823;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 28px rgba(0,0,0,.35);}
.cmReview header{display:flex;align-items:center;gap:10px;}
.cmReview header>div{display:grid;min-width:0;flex:1;}
.cmReview header b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cmReview header small{color:var(--muted);font-size:12px;}
.cmAv{width:46px;height:46px;border-radius:50%;object-fit:cover;flex:none;border:2px solid rgba(20,224,195,.5);}
.cmAv.ph{display:grid;place-items:center;font-weight:900;color:#0b1016;background:linear-gradient(135deg,var(--cm-ai1),var(--cm-ai2));}
.cmStars{color:#ffc94d;letter-spacing:1px;font-size:14px;white-space:nowrap;}
.cmReview p{margin:0;color:#dfe6f0;line-height:1.85;font-size:14.5px;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;}
.cmMore{align-self:flex-start;margin-top:auto;padding:0;border:0;background:none;color:var(--accent-teal);font:inherit;font-weight:800;font-size:13px;cursor:pointer;}
.cmShot{padding:0;border:0;background:none;cursor:zoom-in;}
.cmShot img{width:100%;max-height:160px;object-fit:cover;object-position:top;border-radius:12px;}
.cmReview.full{width:min(560px,92vw);max-height:80vh;overflow:auto;}
.cmReview.full p{-webkit-line-clamp:unset;display:block;font-size:16px;}
.cmShots{margin-top:26px;}
.cmShots h3{text-align:center;margin:0 0 14px;font-size:20px;font-weight:900;}
.cmRevFrame .frameRow,.cmShotFrame .frameRow{animation-duration:var(--mq-dur,90s);}

/* تكبير الصور */
.cmLb{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:18px;background:rgba(5,8,12,.88);backdrop-filter:blur(6px);}
.cmLb[hidden]{display:none;}
.cmLb figure{position:relative;margin:0;display:grid;gap:10px;justify-items:center;}
.cmLb figure>img{max-width:92vw;max-height:84vh;border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.6);}
.cmLb figcaption{color:#dfe6f0;font-weight:800;}
.cmLbX{position:absolute;top:-14px;left:-14px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:#151d29;color:#fff;font-size:16px;cursor:pointer;}

/* الخاتمة */
.cmFinal{max-width:820px;margin:60px auto 20px;padding:36px 6%;text-align:center;display:grid;justify-items:center;gap:12px;border-radius:30px;background:radial-gradient(80% 100% at 50% 0%,rgba(20,224,195,.14),transparent 70%),rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);}
.cmFinal img{width:190px;height:auto;}
.cmFinal h2{margin:0;font-size:clamp(24px,3vw,34px);font-weight:900;}
.cmFinal p{margin:0 0 6px;color:var(--muted);}

/* ---------- الأداء: الأقسام اللي تحت ما بتترسمش غير لما تقرّب منها ---------- */
#about,#works,#contact,.siteFooter{content-visibility:auto;contain-intrinsic-size:auto 700px;}

/* ---------- موبايل: مقاسات أصغر ومرنة ---------- */
@media (max-width:900px){
  .cmHeroIn{grid-template-columns:1fr;gap:6px;}
  .cmHeroPic{order:-1;min-height:0;}
  .cmMe{max-height:270px;}
  .cmFloat{width:42px;}.cmFloat.f4{width:40px;height:40px;font-size:14px;}
  .cmMap{grid-template-columns:1fr;gap:16px;}
  .cmMap::before{top:30px;bottom:30px;right:44px;left:auto;width:2px;height:auto;background:repeating-linear-gradient(180deg,rgba(255,255,255,.3) 0 10px,transparent 10px 20px);background-size:2px 40px;animation:none;}
  .cmCta{grid-template-columns:auto 1fr;gap:12px 14px;}
  .cmCtaApps{display:none;}
  .cmCtaGo{grid-column:1/-1;justify-content:center;}
}
@media (max-width:600px){
  .cmCtaWrap{padding:18px 4% 0;}
  .cmCta{padding:14px;border-radius:22px;}
  .cmCta::after{border-radius:20px;}
  .cmCta .cmCtaIc{width:54px;height:54px;border-radius:16px;}
  .cmCta .cmCtaIc svg{width:38px;height:38px;}
  .cmCtaTxt b{font-size:19px;}
  .cmCtaTxt em{font-size:12.5px;}
  .cmCtaGo{padding:10px 16px;font-size:14px;}
  .cmHero{padding:26px 4% 14px;}
  .cmFlag{top:10px;right:10px;padding:2px;border-radius:6px;}
  .cmFlag img{width:24px;height:16px;}
  .cmHeroTxt{justify-items:center;text-align:center;gap:9px;}
  .cmLogo{width:120px;}
  .cmHeroTxt h1{font-size:27px;}
  .cmHeroTxt p{font-size:14.5px;line-height:1.8;}
  .cmHeroBtns{justify-content:center;}
  .cmHeroBtns a{padding:10px 16px;font-size:14px;}
  .cmMe{max-height:220px;}
  .cmSec{padding:36px 4% 6px;}
  .cmHead{margin-bottom:18px;gap:8px;}
  .cmHead h2{font-size:22px;}
  .cmHead p{font-size:14px;}
  .cmHead.split{justify-content:center;text-align:center;}
  .cmHead.split>div:first-child{justify-items:center;}
  .cmStep{padding:16px 15px;border-radius:20px;gap:8px;}
  .cmNum{width:46px;height:46px;font-size:19px;border-radius:14px;}
  .cmMap::before{right:37px;}
  .cmStep h3{font-size:18px;}
  .cmStep p,.cmPoints li{font-size:13.5px;}
  .cmIc{height:36px;min-width:36px;border-radius:11px;}
  .cmIc img{width:26px;}
  .cmIcons.big .cmIc{height:40px;min-width:40px;}
  .cmIcons.big .cmIc img{width:30px;}
  .cmTrack{margin:30px 3% 0;padding:22px 4% 20px;border-radius:24px;}
  .cmTrackHead{grid-template-columns:auto 1fr;gap:10px 12px;margin-bottom:16px;}
  .cmTrackHead .cmIcons{grid-column:1/-1;}
  .cmTrackNum{font-size:48px;-webkit-text-stroke-width:1.5px;}
  .cmTrackHead h2 span{font-size:23px;}
  .cmTrackHead p{font-size:13.5px;}
  .cmReels{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .cmPic{height:150px;}
  .cmAdFrame .cmPic{height:140px;}
  .cmShotFrame .cmPic{height:300px;width:166px !important;}
  .cmPic,.cmPic img{min-width:100px;}
  .cmPicsHead b{font-size:16px;}
  .cmOffers{grid-template-columns:1fr;gap:16px;}
  .cmOfferPic{height:190px;}
  .cmOfferBody{padding:14px 16px 16px;}
  .cmOfferBody h3{font-size:19px;}
  .cmReview{width:272px;padding:14px;border-radius:18px;}
  .cmReview p{font-size:13.5px;-webkit-line-clamp:5;}
  .cmAv{width:40px;height:40px;}
  .cmFinal{margin:40px 4% 10px;padding:26px 5%;}
  .cmFinal img{width:140px;}
}
@media (prefers-reduced-motion:reduce){
  .cmCta::before,.cmOffer.hl::before,.cmCtaGo::after,.cmFloat,.cmCta .cmCtaIc,.cmDot,.cmCtaTxt b,.cmMap::before{animation:none !important;}
}

/* =====================================================================================
   v9 — نوت البرومبت الذكية (الكلام العربي = خانات) + بوكس التجميد + زراير المواقع + شريط الأيقونات
===================================================================================== */
.notesMain.nWithSide{max-width:1240px;display:grid;grid-template-columns:minmax(0,1fr) 330px;grid-template-areas:"col side";gap:26px;align-items:start;}
.nCol{grid-area:col;min-width:0;}
.nSide{grid-area:side;position:sticky;top:84px;display:grid;gap:14px;padding:16px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015)),#0f1621;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 40px rgba(0,0,0,.35);overflow:hidden;}
.nBrand{display:flex;align-items:center;gap:12px;}
.nBrand img{width:64px;height:64px;filter:drop-shadow(0 8px 16px rgba(0,0,0,.45));animation:cmBob 4s ease-in-out infinite;}
.nBrand b{display:block;font-size:19px;font-weight:900;background:linear-gradient(90deg,#fff,#ffe2a6 50%,#7cf7e4);-webkit-background-clip:text;background-clip:text;color:transparent;}
.nBrand small{color:var(--muted);font-size:12.5px;line-height:1.6;}
.nSites{display:grid;gap:10px;}
.nSite{--g1:#7cf7e4;--g2:#5a6bff;position:relative;isolation:isolate;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:10px 12px;border-radius:18px;text-decoration:none;color:#fff;overflow:hidden;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s;}
.nSite::before{content:"";position:absolute;inset:-80%;z-index:-2;background:conic-gradient(from 0deg,var(--g1),var(--g2),transparent 40%,var(--g1));animation:cmSpin 4.5s linear infinite;opacity:.9;}
.nSite::after{content:"";position:absolute;inset:1.5px;z-index:-1;border-radius:16.5px;background:linear-gradient(135deg,#141d2b,#0d131c);}
.nSite.arena{--g1:#ffd27a;--g2:#ff7a3d;}
.nSite.dola{--g1:#c9a7ff;--g2:#7b4dff;}
.nSite:hover{transform:translateY(-3px) scale(1.015);box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 26px color-mix(in srgb,var(--g1) 30%,transparent);}
.nSiteIc{width:52px;height:52px;border-radius:15px;overflow:hidden;flex:none;box-shadow:0 6px 16px rgba(0,0,0,.4);transition:transform .35s;}
.nSiteIc img{width:100%;height:100%;object-fit:cover;display:block;}
.nSite:hover .nSiteIc{transform:rotate(-6deg) scale(1.06);}
.nSiteTx{display:grid;min-width:0;}
.nSiteTx b{font-size:16px;font-weight:900;}
.nSiteTx small{font-size:12px;color:#aeb9ca;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.nSiteGo{position:relative;overflow:hidden;padding:7px 12px;border-radius:999px;font-weight:900;font-size:13px;color:#0b1016;background:linear-gradient(135deg,var(--g1),var(--g2));white-space:nowrap;}
.nSiteGo i{font-style:normal;}
.nSiteGo::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.75) 50%,transparent 70%);transform:translateX(120%);animation:cmSweep 3s ease-in-out infinite;}
.nFree{position:absolute;top:7px;right:72px;padding:1px 7px;border-radius:999px;font-style:normal;font-size:10px;font-weight:900;color:#0b1016;background:var(--g1);}
.nSiteTx{padding-top:8px;}
.nTip{margin:0;padding:10px 12px;border-radius:14px;font-size:12.5px;line-height:1.7;color:#cfd7e3;background:rgba(255,210,122,.07);border:1px dashed rgba(255,210,122,.3);}
.nApps{position:relative;overflow:hidden;border-radius:16px;padding:8px 0;direction:ltr;background:rgba(0,0,0,.2);-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);}
.nAppsRow{display:flex;gap:10px;width:max-content;animation:mq 70s linear infinite;}
.nAppsRow img{width:56px;height:56px;border-radius:14px;}

/* الخانات */
.nVarsBox{margin-top:10px;padding:12px;border-radius:16px;background:linear-gradient(180deg,rgba(255,210,122,.08),rgba(255,210,122,.02));border:1px solid rgba(255,210,122,.28);}
.nVarHead{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px;margin-bottom:10px;}
.nVarHead b{color:#ffd27a;font-size:14px;}
.nVarHead small{color:var(--muted);font-size:12px;}
.nVarRow{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px;}
.nVar{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:8px;padding:6px 8px 6px 6px;border-radius:12px;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.08);transition:border-color .2s,background .2s;}
.nVar.filled{border-color:rgba(20,224,195,.55);background:rgba(20,224,195,.07);}
.nVarK{padding:4px 10px;border-radius:9px;font-weight:900;font-size:13px;color:#2a1a00;background:linear-gradient(135deg,#ffe2a6,#ffb347);white-space:nowrap;max-width:150px;overflow:hidden;text-overflow:ellipsis;}
.nVar.filled .nVarK{text-decoration:line-through;color:#d9fff8;background:rgba(20,224,195,.25);}
.nVar i{font-style:normal;color:var(--muted);}
.nVar input{width:100%;min-width:0;padding:8px 10px;border-radius:9px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.35);color:#fff;font:inherit;font-weight:700;font-size:14px;}
.nVar input:focus{outline:none;border-color:var(--accent-teal);box-shadow:0 0 0 3px rgba(20,224,195,.18);}
.nResultWrap{margin-top:10px;}
.nResultHead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;font-size:12.5px;color:var(--muted);font-weight:800;}
.nResultHead button{padding:5px 10px;border-radius:9px;border:1px solid rgba(20,224,195,.4);background:rgba(20,224,195,.1);color:var(--accent-teal);font:inherit;font-size:12px;font-weight:900;cursor:pointer;}
.nResult{padding:10px 12px;border-radius:12px;background:rgba(0,0,0,.3);line-height:1.9;font-size:13.5px;white-space:pre-wrap;word-break:break-word;color:#dfe6f0;max-height:240px;overflow:auto;}
.nResult mark{padding:1px 6px;border-radius:7px;background:rgba(20,224,195,.22);color:#b9fff2;font-weight:900;cursor:pointer;}
.nChip{padding:1px 6px;border-radius:7px;border:1px dashed rgba(255,210,122,.7);color:#ffd27a;font-weight:900;cursor:pointer;}

/* بعد التجميد: بوكس صغير عليه هاي لايت باسم البرومبت */
.nList{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));}
.nList .note:not(.mini){grid-column:1/-1;}
.note.mini{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:18px;border-color:rgba(124,247,228,.25);background:linear-gradient(180deg,rgba(124,247,228,.07),rgba(18,23,34,.9));animation:nPop .35s cubic-bezier(.2,.8,.2,1);}
@keyframes nPop{from{transform:scale(.94);opacity:0}}
.nMiniHead{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap;}
.nIce{font-size:16px;}
.nLabel{padding:4px 12px;border-radius:10px;font-weight:900;font-size:14.5px;color:#0b1016;background:linear-gradient(135deg,#ffe2a6,#7cf7e4);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.nMiniHead small{color:var(--muted);font-size:12px;}
.nMiniText{margin:0;font-size:12.5px;line-height:1.7;color:#aeb9ca;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;}
.note.mini .nFoot{margin-top:auto;gap:5px;}
.note.mini .nBtn{padding:5px 10px;font-size:12px;}
.nEmpty mark{padding:0 6px;border-radius:6px;background:rgba(255,210,122,.2);color:#ffd27a;}

/* شريط الأيقونات المتحرك فوق إطار المعرض (عكس اتجاه المعرض) */
.appStrip{position:relative;margin:0 0 14px;padding:10px 0;border-radius:24px;overflow:hidden;direction:ltr;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015)),#0e141d;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 30px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.06);}
.appStrip::before,.appStrip::after{content:"";position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none;}
.appStrip::before{left:0;background:linear-gradient(90deg,#0e141d,rgba(14,20,29,0));}
.appStrip::after{right:0;background:linear-gradient(270deg,#0e141d,rgba(14,20,29,0));}
.appRow{display:flex;gap:14px;width:max-content;padding:0 14px;animation:mq 80s linear infinite reverse;will-change:transform;}
.appRow img{width:84px;height:84px;border-radius:20px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.45));transition:transform .3s;}
.appStrip:hover .appRow{animation-play-state:paused;}
.appRow img:hover{transform:translateY(-4px) scale(1.06);}

@media (max-width:900px){
  .notesMain.nWithSide{grid-template-columns:1fr;grid-template-areas:"side" "col";gap:14px;}
  .nSide{position:static;padding:12px;gap:10px;border-radius:20px;}
  .nBrand img{width:46px;height:46px;}
  .nBrand b{font-size:16px;}
  .nSites{grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;}
  .nSite{scroll-snap-align:start;}
  .nApps{display:none;}
  .nTip{font-size:12px;padding:8px 10px;}
}
@media (max-width:600px){
  .nSites{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;gap:8px;}
  .nSite{grid-template-columns:1fr;justify-items:center;text-align:center;gap:6px;padding:12px 6px 10px;border-radius:16px;}
  .nSite::after{border-radius:14.5px;}
  .nSiteIc{width:48px;height:48px;border-radius:13px;}
  .nSiteTx{padding-top:0;}
  .nSiteTx b{font-size:13px;white-space:nowrap;}
  .nSiteTx small{display:none;}
  .nSiteGo{padding:5px 12px;font-size:12px;}
  .nFree{top:5px;right:5px;font-size:9px;}
  .nVarRow{grid-template-columns:1fr;}
  .nList{grid-template-columns:1fr 1fr;gap:10px;}
  .note.mini{padding:10px;border-radius:14px;}
  .nLabel{font-size:13px;padding:3px 9px;}
  .note.mini .nFoot .nBtn:nth-child(3){display:none;}
  .appStrip{padding:7px 0;border-radius:18px;margin-bottom:10px;}
  .appRow{gap:10px;}
  .appRow img{width:58px;height:58px;border-radius:14px;}
  .appStrip::before,.appStrip::after{width:40px;}
}
@media (prefers-reduced-motion:reduce){.appRow,.nAppsRow,.nSite::before,.nSiteGo::after,.nBrand img{animation:none !important;}}

/* ===== v10: شارات «حصري/مطلوب/جديد» + كورس جديد فوق الكل + زراير مواقع من الداش ===== */
.cmBadge2{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:6px;padding:5px 13px;border-radius:999px;font-weight:900;font-size:12.5px;color:#2a1200;background:linear-gradient(135deg,#ffe9a8,#ffb347 55%,#ff7a3d);box-shadow:0 6px 18px rgba(255,140,40,.4),inset 0 1px 0 rgba(255,255,255,.6);white-space:nowrap;}
.cmBadge2::before{content:"★";font-size:11px;}
.cmBadge2::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.8) 50%,transparent 70%);transform:translateX(120%);animation:cmSweep 2.8s ease-in-out infinite;}
.cmStep>.cmBadge2{position:absolute;top:-12px;left:18px;z-index:2;}
.cmStep.isNew{box-shadow:0 18px 40px rgba(0,0,0,.35),0 0 0 1px rgba(255,210,122,.45),0 0 34px rgba(255,157,47,.18);}
.cmTagRow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.cmSpot{position:relative;padding:22px 5% 6px;max-width:1240px;margin:0 auto;display:grid;gap:18px;}
.cmSpotCard{--t1:var(--cm-ai1);--t2:var(--cm-ai2);position:relative;isolation:isolate;display:grid;grid-template-columns:1fr 1.1fr;gap:26px;align-items:center;padding:26px;border-radius:30px;overflow:hidden;background:radial-gradient(70% 90% at 100% 0%,color-mix(in srgb,var(--t1) 16%,transparent),transparent 70%),#0f1621;}
.cmSpotCard.edit{--t1:var(--cm-ed1);--t2:var(--cm-ed2);}
.cmSpotCard.upd{--t1:var(--cm-up1);--t2:var(--cm-up2);}
.cmSpotCard::before{content:"";position:absolute;inset:-60%;z-index:-2;background:conic-gradient(from 0deg,#ffd27a,var(--t1),var(--t2),#ff7a3d,#ffd27a);animation:cmSpin 6s linear infinite;}
.cmSpotCard::after{content:"";position:absolute;inset:2px;z-index:-1;border-radius:28px;background:radial-gradient(70% 90% at 100% 0%,color-mix(in srgb,var(--t1) 14%,transparent),transparent 70%),linear-gradient(180deg,#121b28,#0c121a);}
.cmSpotTxt{display:grid;gap:12px;justify-items:start;min-width:0;}
.cmSpotKick{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.cmNew{display:inline-flex;align-items:center;gap:7px;padding:5px 13px;border-radius:999px;font-weight:900;font-size:13px;color:#fff;background:linear-gradient(135deg,#ff4f7b,#ff7a3d);box-shadow:0 8px 20px rgba(255,79,123,.35);}
.cmNew .cmDot{background:#fff;}
.cmSpotTxt h2{margin:0;font-size:clamp(26px,3.6vw,44px);font-weight:900;line-height:1.2;background:linear-gradient(90deg,#fff,var(--t1) 60%,var(--t2));-webkit-background-clip:text;background-clip:text;color:transparent;}
.cmSpotTxt p{margin:0;color:#c8d1df;line-height:1.85;}
.cmSpotBtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px;}
.cmSpotMedia{min-width:0;}
.cmSpotMedia .cmVids{gap:14px;}
.nSiteLetter{display:grid;place-items:center;width:100%;height:100%;font-size:24px;font-weight:900;color:#0b1016;background:linear-gradient(135deg,var(--g1),var(--g2));}
.nSide.noSites .nSites,.nSide.noSites .nTip{display:none;}
@media (max-width:900px){.cmSpotCard{grid-template-columns:1fr;padding:18px;gap:16px;}.cmSpotMedia{order:-1;}}
@media (max-width:600px){
  .cmSpot{padding:14px 3% 0;}
  .cmSpotCard{padding:14px;border-radius:22px;}
  .cmSpotCard::after{border-radius:20px;}
  .cmSpotTxt h2{font-size:24px;}
  .cmSpotTxt p{font-size:14px;}
  .cmBadge2{font-size:11.5px;padding:4px 11px;}
}
@media (prefers-reduced-motion:reduce){.cmBadge2::after,.cmSpotCard::before{animation:none !important;}}

/* ===== v11: صورة كارت المسار (خريطة الكورس) + زرار «شوف فيديوهات الكورس» ===== */
.cmStepThumb{position:relative;display:block;margin:2px 0 2px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 24px rgba(0,0,0,.4);background:#0b1119;aspect-ratio:16/9;isolation:isolate;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .35s;}
.cmStepThumb::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 2px transparent;transition:box-shadow .35s;pointer-events:none;}
.cmStepThumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s;}
a.cmStepThumb{cursor:pointer;}
a.cmStepThumb:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--t1) 55%,transparent);box-shadow:0 16px 34px rgba(0,0,0,.5);}
a.cmStepThumb:hover img{transform:scale(1.06);}
a.cmStepThumb:hover::after{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--t1) 60%,transparent);}
.cmThumbPlay{position:absolute;inset:0;margin:auto;width:46px;height:46px;display:grid;place-items:center;border-radius:50%;color:#0b1016;background:rgba(255,255,255,.92);box-shadow:0 6px 16px rgba(0,0,0,.45);transition:transform .35s,background .35s;}
.cmThumbPlay svg{width:22px;height:22px;margin-inline-start:2px;}
a.cmStepThumb:hover .cmThumbPlay{transform:scale(1.12);background:#fff;}
.cmSeeVids{display:inline-flex;align-items:center;gap:7px;padding:8px 15px;border-radius:999px;font-size:13px;font-weight:900;color:#0b1016;background:linear-gradient(135deg,var(--t1),var(--t2));box-shadow:0 8px 20px color-mix(in srgb,var(--t2) 35%,transparent);border:0;transition:transform .25s,filter .25s;}
.cmSeeVids:hover{transform:translateY(-2px);filter:brightness(1.05);background:linear-gradient(135deg,var(--t1),var(--t2));}
.cmSeeVids .cmPlayDot{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgba(11,16,22,.22);}
.cmSeeVids .cmPlayDot svg{width:11px;height:11px;margin-inline-start:1px;}
#cmT1,#cmT2,#cmT3{scroll-margin-top:76px;}
@media (max-width:600px){
  .cmStepThumb{border-radius:13px;}
  .cmThumbPlay{width:40px;height:40px;}
  .cmSeeVids{padding:7px 13px;font-size:12.5px;}
}

/* =====================================================================================
   v12 — موبايل خريطة الكورس (كروت أصغر + صور الاشتراك كاملة) · زرار «الرئيسية» · سلايدر الكورسات (أكتر من 3)
         · «نماذج أعمال الطلاب» · فتح الصورة جوه الموقع · نوت البرومبت على الموبايل
===================================================================================== */
/* زرار «الرئيسية» الصغير جمب «اشترك» (بيظهر لما قايمة الويب تستخبى بس) */
.topGrp{display:flex;align-items:stretch;gap:8px;}
.topHome{display:none;align-items:center;gap:5px;padding:9px 12px;border-radius:14px;font-weight:900;font-size:14px;line-height:1;color:#e8fffb;text-decoration:none;white-space:nowrap;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);transition:border-color .25s,color .25s,transform .25s;}
.topHome svg{width:17px;height:17px;flex:none;}
.topHome:hover{border-color:rgba(20,224,195,.55);color:var(--accent-teal);transform:translateY(-1px);}
@media(max-width:1180px){.topHome{display:inline-flex;}}
@media(max-width:600px){.topGrp{gap:6px;}.topHome{padding:7px 9px;font-size:12.5px;border-radius:11px;gap:4px;}.topHome svg{width:15px;height:15px;}}
@media(max-width:430px){.topHome{width:34px;height:34px;padding:0;justify-content:center;}.topHome span{display:none;}.topHome svg{width:17px;height:17px;}}

/* أسهم مشتركة (سلايدر الكورسات + نماذج الطلاب) */
.cmRoadArw,.cmWkArw{width:44px;height:44px;flex:none;display:grid;place-items:center;padding:0;border-radius:50%;cursor:pointer;color:#fff;border:1px solid rgba(255,255,255,.16);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.02)),#101823;box-shadow:0 8px 20px rgba(0,0,0,.35);transition:transform .25s,border-color .25s,opacity .25s,color .25s;}
.cmRoadArw svg,.cmWkArw svg{width:20px;height:20px;}
.cmRoadArw:hover:not(:disabled),.cmWkArw:hover:not(:disabled){transform:translateY(-2px);border-color:rgba(20,224,195,.6);color:var(--accent-teal);}
.cmRoadArw:disabled,.cmWkArw:disabled{opacity:.3;cursor:default;}

/* ---------- سلايدر الكورسات: بيشتغل بس لما الكورسات تزيد عن 3 ---------- */
.cmRoadWrap{position:relative;}
.cmMap.isSlider{display:flex;gap:22px;scroll-padding-inline:2px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:18px 2px 20px;margin:-18px -2px 0;outline:none;}
.cmMap.isSlider::-webkit-scrollbar{display:none;}
.cmMap.isSlider::before{display:none;}
.cmMap.isSlider>.cmStep{flex:0 0 calc((100% - 44px) / 3);scroll-snap-align:start;}
.cmRoadWrap:not(.atEnd) .cmMap.isSlider{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 70px);mask-image:linear-gradient(90deg,transparent 0,#000 70px);}
.cmRoadNav{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:6px;}
.cmRoadDots{display:flex;align-items:center;gap:6px;}
.cmRoadDots button{width:8px;height:8px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.22);cursor:pointer;transition:width .35s,background .35s;}
.cmRoadDots button.on{width:26px;background:linear-gradient(90deg,var(--cm-ai1),var(--cm-ai2));}
.cmRoadHint{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:800;color:var(--muted);}
.cmRoadHint i{font-style:normal;color:var(--accent-teal);letter-spacing:-2px;animation:cmNudgeL 1.6s ease-in-out infinite;}
@keyframes cmNudgeL{50%{transform:translateX(-5px);opacity:.55}}
@media(max-width:900px){.cmMap.isSlider{gap:16px;}.cmMap.isSlider>.cmStep{flex-basis:calc((100% - 16px) / 2);}}
@media(max-width:600px){
  .cmMap.isSlider{gap:12px;padding-top:16px;}
  .cmMap.isSlider>.cmStep{flex-basis:84%;}
  .cmRoadWrap:not(.atEnd) .cmMap.isSlider{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34px);mask-image:linear-gradient(90deg,transparent 0,#000 34px);}
  .cmRoadArw,.cmWkArw{width:38px;height:38px;}
  .cmRoadArw svg,.cmWkArw svg{width:17px;height:17px;}
  .cmRoadNav{gap:9px;}
  .cmRoadHint{font-size:11.5px;}
}

/* ---------- موبايل: كروت «هتتعلم إيه بالظبط» أصغر واحترافية ---------- */
@media(max-width:600px){
  .cmMap{gap:12px;}
  .cmMap::before{right:31px;top:26px;bottom:26px;}
  .cmStep{padding:12px 12px 13px;gap:7px;border-radius:18px;box-shadow:0 12px 28px rgba(0,0,0,.32);}
  .cmStep::before{right:16px;left:16px;height:2.5px;}
  .cmStep>.cmBadge2{top:-10px;left:14px;}
  .cmNum{width:38px;height:38px;font-size:16px;border-radius:12px;}
  .cmStep .cmIc{height:32px;min-width:32px;padding:3px;border-radius:10px;}
  .cmStep .cmIc img{width:23px;}
  .cmStep .cmIc.ai{padding:3px 8px 3px 6px;font-size:12px;gap:4px;}
  .cmStep .cmIc.ai svg{width:19px;height:19px;}
  .cmStep .cmTag{font-size:11px;padding:3px 10px;}
  .cmStepThumb{border-radius:12px;box-shadow:0 8px 18px rgba(0,0,0,.38);}
  .cmThumbPlay{width:36px;height:36px;}
  .cmThumbPlay svg{width:17px;height:17px;}
  .cmStep h3{font-size:16.5px;line-height:1.45;margin:0;}
  .cmStep p{font-size:13px;line-height:1.75;}
  .cmPoints{gap:5px;margin-top:1px;}
  .cmPoints li{font-size:12.8px;line-height:1.65;padding-inline-start:24px;}
  .cmPoints li::before{width:17px;height:17px;font-size:10.5px;border-radius:6px;top:2px;}
  .cmStep .cmSee{padding:7px 12px;font-size:12px;}

  /* الاشتراكات: الصورة كاملة (مش متقصوصة) + الشارة مظبوطة فوقها */
  .cmOffers{gap:14px;}
  .cmOffer{border-radius:20px;}
  .cmOffer.hl::after{border-radius:18px;}
  .cmOfferPic{height:220px;padding-top:12px;display:flex;align-items:flex-end;justify-content:center;}
  .cmOfferPic img{height:100%;max-height:none;width:auto;max-width:94%;object-fit:contain;object-position:bottom center;}
  .cmOffer.ph-bundle .cmOfferPic{align-items:center;padding:16px 0 12px;}
  .cmOffer.ph-bundle .cmOfferPic img{height:100%;max-height:none;}
  .cmOfferPic::after{content:"";position:absolute;right:0;left:0;bottom:0;height:30px;background:linear-gradient(180deg,transparent,#0f1621);pointer-events:none;}
  .cmBadge{top:10px;left:10px;padding:4px 11px;font-size:11.5px;box-shadow:0 6px 14px rgba(255,157,47,.35);}
  .cmOfferBody{padding:10px 14px 14px;gap:8px;}
  .cmOfferBody .cmIc{height:32px;min-width:32px;padding:3px;border-radius:10px;}
  .cmOfferBody .cmIc img{width:23px;}
  .cmOfferBody .cmIc.ai{padding:3px 8px 3px 6px;font-size:12px;}
  .cmOfferBody .cmIc.ai svg{width:19px;height:19px;}
  .cmOfferBody h3{font-size:17px;}
  .cmOfferBody p{font-size:13px;line-height:1.7;}
  .cmPrice b{font-size:22px;}
  .cmPrice.ask{font-size:13px;}
  .cmBuy{padding:11px 14px;border-radius:13px;font-size:14px;}
  .cmBuy svg{width:19px;height:19px;}
}

/* ---------- 🎓 نماذج أعمال الطلاب ---------- */
.cmWkEye{display:inline-flex;align-items:center;gap:8px;color:#ffd27a;background:rgba(255,210,122,.08);border-color:rgba(255,210,122,.4);}
.cmWorks .cmHead h2{background:linear-gradient(90deg,#fff,#ffe2a6 40%,#ff9d6b 70%,#c9a7ff);-webkit-background-clip:text;background-clip:text;color:transparent;}
.cmWkWrap{position:relative;}
.cmWkRail{display:flex;align-items:center;gap:18px;scroll-padding-inline:6px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:16px 6px 24px;margin:-16px -6px 0;outline:none;}
.cmWkRail::-webkit-scrollbar{display:none;}
.cmWkRail.few>.cmWk:first-child{margin-inline-start:auto;}.cmWkRail.few>.cmWk:last-child{margin-inline-end:auto;}
.cmWkRail.dragging{scroll-snap-type:none;cursor:grabbing;}
.cmWkRail.dragging .cmWk{pointer-events:none;}
.cmWkWrap:not(.noScroll):not(.atEnd) .cmWkRail:not(.few){-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 60px);mask-image:linear-gradient(90deg,transparent 0,#000 60px);}
.cmWk{--w:236px;position:relative;flex:0 0 var(--w);width:var(--w);aspect-ratio:9/16;padding:0;border:0;border-radius:26px;background:#0b1119;color:#fff;font:inherit;text-align:start;cursor:pointer;overflow:hidden;isolation:isolate;scroll-snap-align:start;box-shadow:0 18px 40px rgba(0,0,0,.45);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;}
.cmWk.wide{--w:400px;aspect-ratio:16/9;}
.cmWk::before{content:"";position:absolute;inset:-60%;z-index:-2;background:conic-gradient(from 0deg,#ffd27a,#ff7a3d,#ff4f7b,#b78bff,#14e0c3,#ffd27a);animation:cmSpin 5s linear infinite;}
.cmWk:nth-child(2n)::before{animation-duration:6.5s;animation-direction:reverse;}
.cmWkIn{position:absolute;inset:2px;z-index:0;display:block;border-radius:24px;overflow:hidden;background:#0b1119;}
.cmWkIn::after{content:"";position:absolute;inset:0;z-index:3;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.2) 50%,transparent 65%);transform:translateX(130%);transition:transform .9s;pointer-events:none;}
.cmWkPic{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.02);transition:transform .8s cubic-bezier(.2,.8,.2,1);}
.cmWkPh{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(80% 55% at 50% 28%,rgba(183,139,255,.5),transparent 70%),radial-gradient(70% 55% at 50% 100%,rgba(20,224,195,.38),transparent 70%),#0f1621;}
.cmWkPh b{font-size:20px;font-weight:900;letter-spacing:.5px;opacity:.85;}
.cmWkShade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(5,8,12,.55) 0%,transparent 24%,transparent 50%,rgba(5,8,12,.94) 100%);}
.cmWkTop{position:absolute;top:10px;right:10px;left:10px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:6px;}
.cmWkNum{padding:3px 10px;border-radius:999px;font-weight:900;font-size:12.5px;color:#2a1200;background:linear-gradient(135deg,#ffe9a8,#ffb347 55%,#ff7a3d);box-shadow:0 6px 14px rgba(255,140,40,.4);}
.cmWkSrc{padding:3px 9px;border-radius:999px;font-size:11px;font-weight:800;color:#fff;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
.cmWkPlay{position:absolute;top:50%;left:50%;z-index:2;width:62px;height:62px;margin:-31px 0 0 -31px;display:grid;place-items:center;border-radius:50%;color:#0b1016;background:rgba(255,255,255,.95);box-shadow:0 10px 26px rgba(0,0,0,.5);transition:transform .35s cubic-bezier(.2,.8,.2,1);}
.cmWkPlay::before{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(255,255,255,.65);animation:cmWkRing 2.2s ease-out infinite;}
.cmWkPlay svg{width:26px;height:26px;margin-left:3px;}
@keyframes cmWkRing{from{transform:scale(.85);opacity:1}to{transform:scale(1.45);opacity:0}}
.cmWkInfo{position:absolute;right:12px;left:12px;bottom:12px;z-index:2;display:grid;gap:2px;}
.cmWkInfo b{font-size:16px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 2px 10px rgba(0,0,0,.6);}
.cmWkInfo b::before{content:"🎓 ";}
.cmWkInfo small{font-size:12.5px;line-height:1.6;color:#d7dfeb;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.cmWk:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 26px 52px rgba(0,0,0,.55),0 0 34px rgba(255,140,40,.2);}
.cmWk:hover .cmWkPic{transform:scale(1.1);}
.cmWk:hover .cmWkPlay{transform:scale(1.1);}
.cmWk:hover .cmWkIn::after{transform:translateX(-130%);}
.cmWk:focus-visible{outline:3px solid var(--accent-teal);outline-offset:3px;}
.cmWkNav{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:2px;}
.cmWkCount{font-size:12.5px;font-weight:800;color:var(--muted);}
.cmWkWrap.noScroll .cmWkNav{display:none;}
@media(max-width:600px){
  .cmWkRail{gap:10px;padding:12px 4px 18px;margin-top:-12px;}
  .cmWk{--w:44vw;border-radius:20px;box-shadow:0 12px 26px rgba(0,0,0,.45);}
  .cmWk.wide{--w:82vw;}
  .cmWkIn{border-radius:18px;}
  .cmWkTop{top:8px;right:8px;left:8px;}
  .cmWkNum{font-size:11px;padding:2px 8px;}
  .cmWkSrc{font-size:9.5px;padding:2px 7px;}
  .cmWkPlay{width:46px;height:46px;margin:-23px 0 0 -23px;}
  .cmWkPlay svg{width:20px;height:20px;margin-left:2px;}
  .cmWkPlay::before{inset:-6px;}
  .cmWkInfo{right:9px;left:9px;bottom:9px;}
  .cmWkInfo b{font-size:13.5px;}
  .cmWkInfo small{font-size:11px;line-height:1.5;}
  .cmWkCount{font-size:11.5px;}
}

/* مشغّل نماذج الطلاب (بيتفتح فوق الصفحة وعليه ✕) */
.cmWkView{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:14px;background:radial-gradient(60% 50% at 50% 40%,rgba(183,139,255,.16),transparent 70%),rgba(4,7,11,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.cmWkView[hidden]{display:none;}
.cmWkView.show{animation:cmFade .25s ease;}
.cmWkView.show .cmWkBox{animation:cmWkPop .42s cubic-bezier(.2,.8,.2,1);}
@keyframes cmFade{from{opacity:0}}
@keyframes cmWkPop{from{transform:translateY(26px) scale(.96);opacity:0}}
.cmWkBox{--bw:min(400px,92vw,calc((100vh - 170px) * 9 / 16));width:var(--bw);display:grid;gap:10px;}
@supports (height:100dvh){.cmWkBox{--bw:min(400px,92vw,calc((100dvh - 170px) * 9 / 16));}}
.cmWkBox.wide{--bw:min(960px,94vw);}
.cmWkBar{display:flex;align-items:center;gap:10px;}
.cmWkWho{flex:1;min-width:0;display:grid;}
.cmWkWho b{font-size:16px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cmWkWho small{font-size:12.5px;color:#aeb9ca;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cmWkPos{flex:none;padding:3px 10px;border-radius:999px;font-size:12.5px;font-weight:900;color:#ffd27a;background:rgba(255,210,122,.1);border:1px solid rgba(255,210,122,.3);}
.cmWkX{flex:none;width:42px;height:42px;display:grid;place-items:center;padding:0;border-radius:50%;cursor:pointer;color:#fff;font-size:16px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);transition:transform .3s,background .3s,border-color .3s;}
.cmWkX:hover{background:#ff4f7b;border-color:transparent;transform:rotate(90deg);}
.cmWkScreen{position:relative;aspect-ratio:9/16;border-radius:24px;overflow:hidden;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 0 2px rgba(255,255,255,.08);}
.cmWkBox.wide .cmWkScreen{aspect-ratio:16/9;border-radius:18px;}
.cmWkPlayer{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000;}
.cmWkSteps{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.cmWkSteps.one{justify-content:center;}
.cmWkStep{display:inline-flex;align-items:center;gap:4px;padding:8px 14px;border-radius:999px;cursor:pointer;color:#fff;font:inherit;font-weight:800;font-size:13px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);transition:border-color .25s,opacity .25s;}
.cmWkStep svg{width:15px;height:15px;}
.cmWkStep:hover:not(:disabled){border-color:rgba(20,224,195,.6);}
.cmWkStep:disabled{opacity:.3;cursor:default;}
.cmWkOut{font-size:12.5px;color:var(--muted);text-decoration:underline;text-underline-offset:3px;}
@media(max-width:600px){.cmWkView{padding:10px;}.cmWkBox{--bw:min(400px,94vw,calc((100vh - 150px) * 9 / 16));}.cmWkX{width:40px;height:40px;}.cmWkStep{padding:7px 12px;font-size:12.5px;}}
@media(max-width:600px){@supports (height:100dvh){.cmWkBox{--bw:min(400px,94vw,calc((100dvh - 150px) * 9 / 16));}}}

/* ---------- «فتح الصورة» في الرئيسية: بتتفتح جوه الموقع وعليها ✕ ---------- */
.haLb{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:60px 14px 22px;background:rgba(4,7,11,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transition:opacity .22s ease;}
.haLb[hidden]{display:none;}
.haLb.show{opacity:1;}
.haLb figure{position:relative;margin:0;display:grid;gap:10px;justify-items:center;max-width:100%;}
.haLb img{display:block;max-width:min(1280px,94vw);max-height:calc(100vh - 130px);width:auto;height:auto;border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.6);opacity:0;transform:scale(.96);transition:opacity .3s,transform .35s cubic-bezier(.2,.8,.2,1);}
.haLb.loaded img{opacity:1;transform:none;}
.haLb figcaption{max-width:94vw;color:#dfe6f0;font-weight:800;font-size:14px;text-align:center;}
.haLbSpin{position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--accent-teal);animation:cmSpin .8s linear infinite;}
.haLb.loaded .haLbSpin{display:none;}
.haLbX{position:fixed;top:14px;left:14px;z-index:2;width:42px;height:42px;display:grid;place-items:center;padding:0;border-radius:50%;cursor:pointer;color:#fff;font-size:16px;border:1px solid rgba(255,255,255,.22);background:rgba(20,28,40,.85);box-shadow:0 8px 20px rgba(0,0,0,.4);transition:transform .3s,background .3s;}
.haLbX:hover{background:#ff4f7b;transform:rotate(90deg);}
html.haLbOpen{overflow:hidden;}
@media(max-width:600px){.haLb{padding:58px 8px 16px;}.haLb img{max-width:96vw;border-radius:10px;}.haLbX{top:10px;left:10px;width:40px;height:40px;}}

/* ---------- نوت البرومبت — موبايل بس (الويب زي ما هو) ---------- */
@media(max-width:900px){
  .nApps{display:block;padding:6px 0;border-radius:14px;}
  .nAppsRow{gap:8px;animation-duration:55s;}
  .nAppsRow img{width:46px;height:46px;border-radius:12px;}
}
@media(max-width:700px){
  .note{scroll-margin-top:72px;}
  .nTitle{font-size:13.5px;margin-bottom:4px;}
  .nText{min-height:84px;max-height:26vh;overflow-y:auto;resize:none;padding:9px 11px;font-size:13.5px;line-height:1.75;border-radius:12px;overscroll-behavior:contain;}
  .nVarsBox{margin-top:8px;padding:9px;border-radius:14px;}
  .nVarHead{margin-bottom:7px;gap:2px;}
  .nVarHead b{font-size:13px;}
  .nVarHead small{font-size:11px;}
  .nVarRow{gap:6px;}
  .nVar{gap:6px;padding:4px 5px 4px 4px;border-radius:10px;}
  .nVarK{font-size:12px;padding:3px 8px;border-radius:8px;max-width:118px;}
  .nVar input,.nVar input[type=text]{width:100%;padding:6px 8px;font-size:13.5px;border-radius:8px;}
  .nResultWrap{margin-top:8px;}
  .nResultHead{font-size:12px;}
  .nResult{max-height:150px;padding:8px 10px;font-size:12.8px;line-height:1.8;overscroll-behavior:contain;}
  .nFoot{margin-top:8px;gap:5px;}
  .note:not(.mini) .nBtn{padding:6px 11px;font-size:12px;}
}
@media (prefers-reduced-motion:reduce){.cmWk::before,.cmWkPlay::before,.cmRoadHint i,.haLbSpin{animation:none !important;}}
.haLbX:focus,.cmWkX:focus{outline:none;}
.haLbX:focus-visible,.cmWkX:focus-visible{outline:2px solid var(--accent-teal);outline-offset:3px;}