/* =====================================================================
   LUXE CORP — Hero Section  |  سلة (Twilight/Pixel)
   ▸ ضعه في: لوحة سلة → تصميم/الأكواد المخصصة → CSS مخصص
   ▸ يعمل مع الملف: luxe-hero.js  (الذي يحقن الـHTML)
   كل القواعد داخل #lx-hero فلن تتعارض مع الثيم.
   الألوان: #030D1A · #101F33 · #0274E6 · #A6823C · #F0F4F8
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&display=swap');

#lx-hero{
  --obsidian:#030D1A; --navy:#101F33; --blue:#0274E6;
  --gold:#A6823C; --gold-lite:#D8B872; --gold-soft:#EBD9A8;
  --ink:#F0F4F8; --muted:rgba(240,244,248,.60); --faint:rgba(240,244,248,.40);
  --line:rgba(240,244,248,.09); --gold-line:rgba(166,130,60,.45);
  --ease:cubic-bezier(.22,1,.36,1);

  position:relative; isolation:isolate; overflow:hidden; box-sizing:border-box; direction:rtl;
  width:100vw; max-width:100vw; margin-inline:calc(50% - 50vw);
  min-height:92svh; display:flex; align-items:center;
  padding:clamp(56px,9vh,110px) clamp(20px,6vw,90px);
  font-family:'Cairo',system-ui,sans-serif; color:var(--ink); line-height:1.5;
  background:linear-gradient(160deg,#04101F 0%, var(--obsidian) 46%, #020A14 100%);
}
#lx-hero *{box-sizing:border-box;}
#lx-hero a{text-decoration:none; color:inherit;}

/* ---- background: drifting aurora orbs + network ---- */
#lx-hero .lx-orb{position:absolute; z-index:0; border-radius:50%; filter:blur(70px); pointer-events:none; will-change:transform;}
#lx-hero .lx-orb-1{width:44vw; height:44vw; top:-14%; inset-inline-end:-6%; opacity:.42;
  background:radial-gradient(circle, rgba(2,116,230,.55), transparent 66%); animation:lx-drift1 20s ease-in-out infinite;}
#lx-hero .lx-orb-2{width:38vw; height:38vw; bottom:-16%; inset-inline-start:-8%; opacity:.38;
  background:radial-gradient(circle, rgba(166,130,60,.5), transparent 66%); animation:lx-drift2 24s ease-in-out infinite;}
#lx-hero .lx-orb-3{width:28vw; height:28vw; top:36%; inset-inline-start:34%; opacity:.3;
  background:radial-gradient(circle, rgba(2,116,230,.4), transparent 66%); animation:lx-drift3 28s ease-in-out infinite;}
@keyframes lx-drift1{50%{transform:translate(-6%,8%) scale(1.15)}}
@keyframes lx-drift2{50%{transform:translate(7%,-6%) scale(1.12)}}
@keyframes lx-drift3{50%{transform:translate(-8%,-5%) scale(1.2)}}

#lx-hero .lx-net{position:absolute; inset:0; width:100%; height:100%; z-index:1;}
#lx-hero .lx-spot{position:absolute; z-index:1; top:-40%; left:50%; width:120%; height:90%; transform:translateX(-50%);
  pointer-events:none; background:radial-gradient(ellipse at center, rgba(240,244,248,.05), transparent 60%);}

/* ---- layout ---- */
#lx-hero .lx-wrap{position:relative; z-index:3; width:100%; max-width:1240px; margin-inline:auto;
  display:grid; grid-template-columns:1.06fr .94fr; align-items:center; gap:clamp(36px,5vw,84px);}

/* ---- kicker ---- */
#lx-hero .lx-kicker{display:inline-flex; align-items:center; gap:10px; padding:8px 16px; border-radius:100px;
  font-size:14px; font-weight:600; color:var(--gold-soft); background:rgba(166,130,60,.08);
  border:1px solid var(--gold-line); opacity:0; transform:translateY(14px);}
#lx-hero .lx-kicker i{width:7px; height:7px; border-radius:50%; background:var(--gold-lite);
  box-shadow:0 0 0 0 rgba(216,184,114,.5); animation:lx-ping 2.4s ease-out infinite;}
@keyframes lx-ping{70%,100%{box-shadow:0 0 0 8px rgba(216,184,114,0)}}

/* ---- headline — word-by-word light-up ---- */
#lx-hero .lx-title{margin:26px 0 0; font-weight:800; line-height:1.2; letter-spacing:-.6px; font-size:clamp(2.3rem,5vw,4.3rem);}
#lx-hero .lx-line{display:block;}
#lx-hero .lx-w{display:inline-block; opacity:.12; will-change:opacity,filter,text-shadow;}
#lx-hero .lx-accent .lx-w{font-weight:900;
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold-lite) 45%,var(--gold-soft) 65%,var(--gold) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;}
@keyframes lx-lightup{
  0%{opacity:.12; filter:blur(7px); text-shadow:none;}
  55%{opacity:1; filter:blur(0); text-shadow:0 0 20px rgba(240,244,248,.5), 0 0 34px rgba(216,184,114,.55);}
  100%{opacity:1; filter:blur(0); text-shadow:0 0 1px rgba(216,184,114,.12);}
}
@keyframes lx-lightupGold{
  0%{opacity:.12; filter:blur(7px) drop-shadow(0 0 0 rgba(216,184,114,0));}
  55%{opacity:1; filter:blur(0) drop-shadow(0 0 22px rgba(216,184,114,.85));}
  100%{opacity:1; filter:blur(0) drop-shadow(0 0 7px rgba(216,184,114,.35));}
}
@keyframes lx-goldpulse{
  0%,100%{filter:blur(0) drop-shadow(0 0 7px rgba(216,184,114,.3));}
  50%{filter:blur(0) drop-shadow(0 0 17px rgba(216,184,114,.6));}
}

#lx-hero .lx-sub{margin:22px 0 0; max-width:33em; font-size:clamp(1rem,1.15vw,1.14rem); line-height:2;
  color:var(--muted); font-weight:300; opacity:0; transform:translateY(14px);}

/* =====================================================================
   [جديد] شارة التوثيق الرسمي — بين العنوان والوصف
   تتابع محسوب: البلاطة تطلع → الختم ينزل ويُدمَغ → موجة + شرارات →
   علامة الصح ترسم نفسها → لمعة تمرّ على النص. وبعدها حياة هادية:
   هالة ذهبية بتلفّ، موجة خفيفة، ولمسة انتباه كل ١٢ ثانية.
   الحركة كلها animations مش transitions.
   ===================================================================== */
#lx-hero .lx-verify{
  display:flex; align-items:center; flex-wrap:wrap; gap:12px 14px;
  margin:20px 0 0; opacity:0;
}
#lx-hero.lx-in .lx-verify{ animation:lx-vrise .8s var(--ease) .38s both; }
@keyframes lx-vrise{ from{opacity:0; transform:translateY(12px)} to{opacity:1; transform:none} }

/* ---- البلاطة ---- */
#lx-hero .lx-vbadge{
  position:relative; display:inline-flex; align-items:center; gap:12px;
  padding:9px 16px; border-radius:15px; overflow:hidden; isolation:isolate;
  border:1px solid var(--gold-line);
  background:
    linear-gradient(140deg, rgba(166,130,60,.18) 0%, rgba(166,130,60,.06) 55%, rgba(240,244,248,.025) 100%);
  box-shadow:0 10px 26px rgba(3,13,26,.45), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(6px);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);
}
/* دمغة: البلاطة تنضغط لحظة نزول الختم ثم ترتاح + توهّج ذهبي بيتنفّس */
#lx-hero.lx-in .lx-vbadge{
  animation:lx-vpress .9s var(--ease) .50s both, lx-vbreathe 7s ease-in-out 2.8s infinite;
}
@keyframes lx-vpress{
  0%  { transform:none; border-color:var(--gold-line); }
  32% { transform:scale(.972); border-color:rgba(216,184,114,.85); }
  58% { transform:scale(1.014); border-color:rgba(216,184,114,.6); }
  100%{ transform:none; border-color:var(--gold-line); }
}
@keyframes lx-vbreathe{
  0%,100%{ box-shadow:0 10px 26px rgba(3,13,26,.45), inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 0 rgba(216,184,114,0); }
  50%    { box-shadow:0 10px 26px rgba(3,13,26,.45), inset 0 1px 0 rgba(255,255,255,.08), 0 0 20px -2px rgba(216,184,114,.3); }
}
#lx-hero .lx-vbadge.is-link{ cursor:pointer; }
#lx-hero .lx-vbadge.is-link:hover{
  animation:none; transform:translateY(-2px); border-color:rgba(216,184,114,.75);
  box-shadow:0 16px 34px rgba(166,130,60,.28), inset 0 1px 0 rgba(255,255,255,.1);
}
#lx-hero .lx-vbadge.is-link:focus-visible{ outline:2px solid var(--gold-lite); outline-offset:3px; }

/* لمعة ناعمة بتمرّ على البلاطة */
#lx-hero .lx-vsweep{
  position:absolute; z-index:0; top:-30%; bottom:-30%; width:42%; inset-inline-start:-130%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.18), transparent);
  transform:skewX(-18deg); pointer-events:none;
}
#lx-hero.lx-in .lx-vsweep{ animation:lx-vsweep 8s var(--ease) 2.1s infinite; }
@keyframes lx-vsweep{ 0%{inset-inline-start:-130%} 26%,100%{inset-inline-start:170%} }

/* ---- الختم ---- */
#lx-hero .lx-vseal{
  position:relative; z-index:1; flex:0 0 auto; width:34px; height:34px; display:grid; place-items:center;
}
/* لمسة انتباه هادية كل ١٢ ثانية (٩٠٪ من الوقت ساكن) */
#lx-hero.lx-in .lx-vseal{ animation:lx-vnod 12s ease-in-out 5s infinite; }
@keyframes lx-vnod{
  0%,86%,100%{ transform:none; }
  89%  { transform:rotate(-8deg) scale(1.08); }
  92.5%{ transform:rotate(5deg)  scale(1.03); }
  96%  { transform:rotate(-2deg); }
}

/* هالة ذهبية بتلفّ حول الختم (نفس لغة إطار الكرت) */
#lx-hero .lx-vhalo{
  position:absolute; inset:-4px; border-radius:50%; opacity:0; pointer-events:none;
  background:conic-gradient(from 0deg, transparent 0deg, rgba(166,130,60,.15) 45deg,
    var(--gold-lite) 82deg, #FFF3D6 100deg, transparent 155deg, transparent 360deg);
  -webkit-mask:radial-gradient(farthest-side, transparent 64%, #000 66%);
          mask:radial-gradient(farthest-side, transparent 64%, #000 66%);
}
#lx-hero.lx-in .lx-vhalo{ animation:lx-vhalo 1s ease 1.02s both, lx-vhspin 5.5s linear 1.02s infinite; }
@keyframes lx-vhalo{ to{ opacity:.95 } }
@keyframes lx-vhspin{ to{ transform:rotate(360deg) } }

/* موجة الدمغة: حلقتين مرة واحدة لحظة الختم */
#lx-hero .lx-vshock, #lx-hero .lx-vshock::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  border:1.5px solid rgba(235,217,168,.9); opacity:0; pointer-events:none;
}
#lx-hero.lx-in .lx-vshock{ animation:lx-vshock 1.1s ease-out .82s 1 both; }
#lx-hero.lx-in .lx-vshock::after{ animation:lx-vshock 1.1s ease-out 1s 1 both; }
@keyframes lx-vshock{ 0%{opacity:.95; transform:scale(.55)} 100%{opacity:0; transform:scale(2.4)} }

/* حلقة خفيفة مستمرة تفضل تلفت النظر بهدوء */
#lx-hero .lx-vring{
  position:absolute; inset:0; border-radius:50%; border:1px solid rgba(216,184,114,.4);
  opacity:0; pointer-events:none;
}
#lx-hero.lx-in .lx-vring{ animation:lx-vring 4.8s ease-out 2.6s infinite; }
@keyframes lx-vring{
  0%  { opacity:.5; transform:scale(.8) }
  42% { opacity:0;  transform:scale(1.95) }
  100%{ opacity:0;  transform:scale(1.95) }
}

/* شرارات ذهبية بتتطاير لحظة الختم */
#lx-hero .lx-vsparks{ position:absolute; inset:0; pointer-events:none; }
#lx-hero .lx-vsparks i{
  position:absolute; inset-inline-start:50%; top:50%; width:3px; height:3px; border-radius:50%;
  background:#FFF7E4; box-shadow:0 0 7px rgba(235,217,168,.95); opacity:0;
}
#lx-hero .lx-vsparks i:nth-child(1){ --dx:-17px; --dy:-14px }
#lx-hero .lx-vsparks i:nth-child(2){ --dx: 18px; --dy:-11px }
#lx-hero .lx-vsparks i:nth-child(3){ --dx:-13px; --dy: 16px }
#lx-hero .lx-vsparks i:nth-child(4){ --dx: 15px; --dy: 15px }
#lx-hero .lx-vsparks i:nth-child(5){ --dx:  1px; --dy:-20px }
#lx-hero.lx-in .lx-vsparks i{ animation:lx-vspark .9s ease-out .84s both; }
@keyframes lx-vspark{
  0%  { opacity:0; transform:translate(-50%,-50%) scale(.3); }
  20% { opacity:1; transform:translate(calc(-50% + var(--dx) * .4), calc(-50% + var(--dy) * .4)) scale(1); }
  100%{ opacity:0; transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(.2); }
}

/* الدرع نفسه: ينزل من فوق ويستقر زي الختم */
#lx-hero .lx-vsvg{ width:30px; height:30px; display:block; filter:drop-shadow(0 3px 8px rgba(166,130,60,.45)); }
#lx-hero.lx-in .lx-vsvg{ animation:lx-vstamp .82s var(--ease) .52s both; }
@keyframes lx-vstamp{
  0%  { opacity:0; transform:translateY(-10px) scale(1.55) rotate(-11deg); filter:blur(5px) drop-shadow(0 0 0 rgba(166,130,60,0)); }
  55% { opacity:1; transform:translateY(0) scale(.9) rotate(2deg); filter:blur(0) drop-shadow(0 4px 15px rgba(216,184,114,.75)); }
  76% { transform:scale(1.05) rotate(-1deg); }
  100%{ opacity:1; transform:none; filter:blur(0) drop-shadow(0 3px 8px rgba(166,130,60,.45)); }
}
#lx-hero .lx-vgloss{ opacity:0; }
#lx-hero.lx-in .lx-vgloss{ animation:lx-vgloss .7s ease 1.1s both; }
@keyframes lx-vgloss{ to{ opacity:1 } }

/* علامة الصح بترسم نفسها بعد ما الختم يستقر */
#lx-hero .lx-vcheck{ stroke-dasharray:13; stroke-dashoffset:13; }
#lx-hero.lx-in .lx-vcheck{ animation:lx-vdraw .45s ease .95s forwards; }
@keyframes lx-vdraw{ to{ stroke-dashoffset:0 } }

/* ---- النص: لمعة ذهبية بتمرّ على العنوان ---- */
#lx-hero .lx-vtext{ position:relative; z-index:1; display:flex; flex-direction:column; gap:2px; line-height:1.3; }
#lx-hero .lx-vtext b{
  font-size:14px; font-weight:800; letter-spacing:-.1px;
  background:linear-gradient(100deg, var(--gold) 0%, var(--gold-lite) 26%, #FFF7E4 44%,
    var(--gold-lite) 62%, var(--gold) 100%);
  background-size:280% 100%; background-position:100% 0;
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
#lx-hero.lx-in .lx-vtext b{ animation:lx-vsheen 12s ease-in-out 1.1s infinite; }
@keyframes lx-vsheen{
  0%  { background-position:100% 0 }
  28% { background-position:-60% 0 }
  70% { background-position:-60% 0 }
  100%{ background-position:100% 0 }
}
#lx-hero .lx-vtext > span{ font-size:11.5px; font-weight:400; color:var(--faint); letter-spacing:.1px; }

/* دعوة التحقّق (تظهر لو فيه رابط للوثيقة) */
#lx-hero .lx-vgo{
  position:relative; z-index:1; display:inline-flex; align-items:center; gap:6px;
  padding-inline-start:12px; margin-inline-start:2px; border-inline-start:1px solid var(--gold-line);
  font-size:11.5px; font-weight:700; color:var(--gold-soft); opacity:.7;
  transition:opacity .3s var(--ease), transform .3s var(--ease);
}
#lx-hero .lx-vgo svg{ width:12px; height:12px; transform:scaleX(-1); }
#lx-hero .lx-vbadge.is-link:hover .lx-vgo{ opacity:1; transform:translateX(-3px); }

/* الملاحظة الجانبية */
#lx-hero .lx-vnote{ font-size:12px; font-weight:400; color:var(--faint); opacity:0; }
#lx-hero.lx-in .lx-vnote{ animation:lx-vrise .8s var(--ease) .62s both; }

/* ---- feature chips ---- */
#lx-hero .lx-chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; opacity:0; transform:translateY(14px);}
#lx-hero .lx-chip{display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:100px;
  font-size:13.5px; font-weight:500; color:var(--muted); background:rgba(240,244,248,.03); border:1px solid var(--line);}
#lx-hero .lx-chip svg{color:var(--gold-lite);}

/* ---- buttons ---- */
#lx-hero .lx-cta{display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; opacity:0; transform:translateY(14px);}
#lx-hero .lx-btn{position:relative; display:inline-flex; align-items:center; gap:10px; padding:16px 32px;
  border-radius:15px; font-family:'Cairo',sans-serif; font-weight:700; font-size:16px; overflow:hidden;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s var(--ease);}
#lx-hero .lx-btn svg{transform:scaleX(-1);}
#lx-hero .lx-gold{color:#181205; background:linear-gradient(135deg,var(--gold-soft),var(--gold-lite) 45%,var(--gold));
  box-shadow:0 14px 34px rgba(166,130,60,.30);}
#lx-hero .lx-gold::before{content:""; position:absolute; top:-25%; bottom:-25%; width:55%; inset-inline-start:-90%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent); transform:skewX(-18deg);
  transition:inset-inline-start .75s var(--ease);}
#lx-hero .lx-gold:hover{transform:translateY(-3px); box-shadow:0 20px 46px rgba(166,130,60,.42);}
#lx-hero .lx-gold:hover::before{inset-inline-start:145%;}
#lx-hero .lx-ghost{color:var(--ink); border:1px solid var(--line); background:rgba(240,244,248,.02); backdrop-filter:blur(4px);}
#lx-hero .lx-ghost:hover{transform:translateY(-3px); border-color:var(--gold-line); background:rgba(166,130,60,.06);}

/* ---- trust ---- */
#lx-hero .lx-trust{display:flex; align-items:center; gap:clamp(16px,2vw,30px); margin-top:40px; opacity:0; transform:translateY(14px);}
#lx-hero .lx-stat b{display:block; font-size:clamp(1.5rem,2.1vw,1.95rem); font-weight:800; letter-spacing:-.5px;
  font-variant-numeric:tabular-nums; background:linear-gradient(120deg,var(--gold-soft),var(--gold-lite),var(--gold));
  -webkit-background-clip:text; background-clip:text; color:transparent;}
#lx-hero .lx-stat span{font-size:13px; color:var(--muted); font-weight:400;}
#lx-hero .lx-vline{width:1px; height:40px; background:linear-gradient(var(--line),transparent);}

/* ---- premium panel (animated gold border) ---- */
#lx-hero .lx-visual{display:flex; justify-content:center; perspective:1300px;}
#lx-hero .lx-panel{position:relative; width:min(430px,90vw); padding:1.6px; border-radius:26px; overflow:hidden;
  transform-style:preserve-3d; transition:transform .2s ease-out; box-shadow:0 44px 100px rgba(0,0,0,.6);
  opacity:0; transform:translateY(22px);}
#lx-hero .lx-panel::before{content:""; position:absolute; inset:-60%; z-index:0;
  background:conic-gradient(from 0deg, transparent 0deg, var(--gold) 40deg, var(--gold-soft) 70deg, transparent 120deg,
    transparent 200deg, var(--gold-lite) 250deg, transparent 300deg, transparent 360deg);
  animation:lx-spin 7s linear infinite;}
@keyframes lx-spin{to{transform:rotate(360deg)}}
#lx-hero .lx-panel-inner{position:relative; z-index:1; padding:26px; border-radius:24.5px; overflow:hidden;
  background:radial-gradient(130% 90% at 100% 0%, rgba(2,116,230,.16), transparent 56%),
            linear-gradient(160deg,#16283f 0%, var(--navy) 55%, #0b1727 100%);}
#lx-hero .lx-shine{position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg,transparent 42%,rgba(240,244,248,.08) 48%,transparent 54%);
  background-size:250% 250%; animation:lx-cardshine 7s linear infinite;}
@keyframes lx-cardshine{to{background-position:-180% -180%}}

#lx-hero .lx-corner{position:absolute; width:16px; height:16px; border:1.5px solid var(--gold-line); z-index:2;}
#lx-hero .lx-corner.tl{top:12px; inset-inline-start:12px; border-inline-end:0; border-bottom:0;}
#lx-hero .lx-corner.tr{top:12px; inset-inline-end:12px; border-inline-start:0; border-bottom:0;}
#lx-hero .lx-corner.bl{bottom:12px; inset-inline-start:12px; border-inline-end:0; border-top:0;}
#lx-hero .lx-corner.br{bottom:12px; inset-inline-end:12px; border-inline-start:0; border-top:0;}

#lx-hero .lx-phead{position:relative; z-index:2; display:flex; align-items:center; gap:14px;}
#lx-hero .lx-seal{width:52px; height:52px; border-radius:14px; display:grid; place-items:center; flex:0 0 auto;
  font-weight:800; font-size:19px; letter-spacing:1px; color:#1a1408;
  background:linear-gradient(135deg,var(--gold-soft),var(--gold-lite) 45%,var(--gold));
  box-shadow:0 8px 20px rgba(166,130,60,.35), inset 0 1px 2px rgba(255,255,255,.4);}
#lx-hero .lx-pmeta{display:flex; flex-direction:column; gap:4px;}
#lx-hero .lx-plabel{font-size:13.5px; color:var(--gold-soft); font-weight:600;}
#lx-hero .lx-live{display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--muted);}
#lx-hero .lx-live i{width:8px; height:8px; border-radius:50%; background:#3ad07a;
  box-shadow:0 0 0 0 rgba(58,208,122,.55); animation:lx-pulse 2s ease-out infinite;}
@keyframes lx-pulse{70%,100%{box-shadow:0 0 0 7px rgba(58,208,122,0)}}

#lx-hero .lx-plan{position:relative; z-index:2; margin:22px 0 0; font-size:1.7rem; font-weight:800; letter-spacing:-.5px;}
#lx-hero .lx-figure{position:relative; z-index:2; display:flex; align-items:baseline; gap:12px; margin:16px 0 2px;}
#lx-hero .lx-figure b{font-size:3rem; font-weight:800; line-height:1; letter-spacing:-2px; font-variant-numeric:tabular-nums;
  background:linear-gradient(120deg,var(--gold-soft),var(--gold-lite),var(--gold));
  -webkit-background-clip:text; background-clip:text; color:transparent;}
#lx-hero .lx-figure span{font-size:12.5px; color:var(--muted); font-weight:400; max-width:12em; line-height:1.5;}

#lx-hero .lx-chart{position:relative; z-index:2; display:block; width:100%; height:auto; margin-top:8px; overflow:visible;}
#lx-hero .lx-chart .lx-area{opacity:0; transition:opacity 1s ease .9s;}
#lx-hero .lx-chart .lx-path{stroke:url(#lxStroke); stroke-width:2.6; stroke-linecap:round;
  filter:drop-shadow(0 3px 9px rgba(166,130,60,.4));}
#lx-hero .lx-chart .lx-node{opacity:0; transform:scale(0); transform-origin:center; transform-box:fill-box;
  transition:opacity .4s var(--ease), transform .5s var(--ease);}
#lx-hero .lx-chart .lx-node.on{opacity:1; transform:scale(1);}
#lx-hero .lx-chart .lx-nring{fill:none; stroke:var(--gold-lite); stroke-width:1.4; opacity:.5;}
#lx-hero .lx-chart .lx-ncore{fill:var(--gold-soft);}
#lx-hero .lx-chart .lx-node.peak .lx-ncore{fill:#fff; filter:drop-shadow(0 0 6px rgba(235,217,168,.9));}

#lx-hero .lx-pfoot{position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between;
  margin-top:20px; padding-top:18px; border-top:1px solid var(--line);}
#lx-hero .lx-price{font-size:1.55rem; font-weight:800; color:var(--gold-lite); font-variant-numeric:tabular-nums;}
#lx-hero .lx-price i{font-style:normal; font-size:.55em; font-weight:600; color:var(--muted); margin-inline-start:5px;}
#lx-hero .lx-mini{display:inline-flex; align-items:center; gap:7px; padding:10px 18px; border-radius:12px;
  font-size:14px; font-weight:700; color:var(--ink); border:1px solid var(--gold-line);
  background:linear-gradient(140deg,rgba(166,130,60,.18),rgba(166,130,60,.05));
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);}
#lx-hero .lx-mini svg{transform:scaleX(-1);}
#lx-hero .lx-mini:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(166,130,60,.25);}

/* ---- reveal (JS adds #lx-hero.lx-in) ---- */
#lx-hero.lx-in .lx-kicker,#lx-hero.lx-in .lx-sub,#lx-hero.lx-in .lx-chips,
#lx-hero.lx-in .lx-cta,#lx-hero.lx-in .lx-trust,#lx-hero.lx-in .lx-panel{
  opacity:1; transform:none; transition:opacity .9s var(--ease), transform .9s var(--ease);}
/* word light-up — delays are set inline per word by JS (longhand keeps inline delay) */
#lx-hero.lx-in .lx-w{animation-name:lx-lightup; animation-duration:.85s;
  animation-timing-function:cubic-bezier(.22,1,.36,1); animation-fill-mode:both;}
#lx-hero.lx-in .lx-accent .lx-w{animation-name:lx-lightupGold, lx-goldpulse;
  animation-duration:.85s, 3.6s; animation-timing-function:cubic-bezier(.22,1,.36,1), ease-in-out;
  animation-fill-mode:both, none; animation-iteration-count:1, infinite;}
#lx-hero.lx-in .lx-sub{transition-delay:.46s;}
#lx-hero.lx-in .lx-chips{transition-delay:.56s;}
#lx-hero.lx-in .lx-cta{transition-delay:.64s;}
#lx-hero.lx-in .lx-trust{transition-delay:.74s;}
#lx-hero.lx-in .lx-panel{transition-delay:.32s;}
#lx-hero.lx-in .lx-area{opacity:1;}

/* ---- responsive ---- */
@media (max-width:940px){
  #lx-hero{min-height:auto; padding-block:clamp(48px,7vh,80px);}
  #lx-hero .lx-wrap{grid-template-columns:1fr; text-align:center; gap:52px;}
  #lx-hero .lx-sub,#lx-hero .lx-kicker{margin-inline:auto;}
  #lx-hero .lx-chips,#lx-hero .lx-cta,#lx-hero .lx-trust{justify-content:center;}
  #lx-hero .lx-verify{justify-content:center;}
  #lx-hero .lx-panel{text-align:start;}
}
@media (max-width:520px){
  #lx-hero .lx-cta{flex-direction:column;}
  #lx-hero .lx-btn{width:100%; justify-content:center;}
  #lx-hero .lx-trust{gap:14px;}
  #lx-hero .lx-figure b{font-size:2.5rem;}
  #lx-hero .lx-verify{margin-top:18px; gap:10px;}
  #lx-hero .lx-vbadge{padding:8px 13px; border-radius:13px;}
  #lx-hero .lx-vnote{flex:1 0 100%; text-align:center; font-size:11.5px;}
}
@media (prefers-reduced-motion:reduce){
  #lx-hero *,#lx-hero *::before,#lx-hero *::after{animation:none!important; transition-duration:.001s!important;}
  #lx-hero .lx-net,#lx-hero .lx-orb{display:none;}
  #lx-hero .lx-w{opacity:1!important; filter:none!important; text-shadow:none!important;}
  #lx-hero .lx-kicker,#lx-hero .lx-sub,#lx-hero .lx-chips,#lx-hero .lx-cta,#lx-hero .lx-trust,#lx-hero .lx-panel,#lx-hero .lx-area{opacity:1; transform:none;}
  #lx-hero .lx-verify,#lx-hero .lx-vnote{opacity:1!important;}
  #lx-hero .lx-vcheck{stroke-dashoffset:0;}
  #lx-hero .lx-vgloss{opacity:1;}
  #lx-hero .lx-vtext b{background-position:40% 0;}
  #lx-hero .lx-vsweep,#lx-hero .lx-vring,#lx-hero .lx-vhalo,
  #lx-hero .lx-vshock,#lx-hero .lx-vsparks{display:none;}
}
main#main-content {
    background: #030D1A;
}

/* =====================================================================
   LUXE CORP — إضاءة ذهبية لعناوين التصنيفات  |  سلة
   ▸ CSS مخصص. يعمل مع الملف: luxe-headings.js
   ▸ يستهدف عناوين الأقسام: .s-slider-block__title h2
   ===================================================================== */

/* الكلمة (قبل الإضاءة: ذهبي خافت) */
.s-slider-block__title h2 .lxh-w{
  display:inline-block;
  opacity:.12;
  font-weight:800;
  background:linear-gradient(100deg,#A6823C 0%,#D8B872 45%,#EBD9A8 65%,#A6823C 100%);
  -webkit-background-clip:text; background-clip:text;
  color:transparent;
  will-change:opacity,filter;
}

/* عند ظهور القسم: تنوّر الكلمات واحدة ورا التانية + توهّج ذهبي مستمر خفيف */
.s-slider-block__title h2.lxh-in .lxh-w{
  animation-name:lxh-lightup, lxh-pulse;
  animation-duration:.85s, 3.6s;
  animation-timing-function:cubic-bezier(.22,1,.36,1), ease-in-out;
  animation-fill-mode:both, none;
  animation-iteration-count:1, infinite;
}

@keyframes lxh-lightup{
  0%{opacity:.12; filter:blur(7px) drop-shadow(0 0 0 rgba(216,184,114,0));}
  55%{opacity:1; filter:blur(0) drop-shadow(0 0 20px rgba(216,184,114,.85));}
  100%{opacity:1; filter:blur(0) drop-shadow(0 0 7px rgba(216,184,114,.35));}
}
@keyframes lxh-pulse{
  0%,100%{filter:blur(0) drop-shadow(0 0 6px rgba(216,184,114,.3));}
  50%{filter:blur(0) drop-shadow(0 0 15px rgba(216,184,114,.55));}
}

@media (prefers-reduced-motion:reduce){
  .s-slider-block__title h2 .lxh-w{opacity:1!important; filter:none!important; animation:none!important;}
}
footer.store-footer.nova-store-footer {
    background: #101F33 !important;
    color: white !important;
}

header.store-header.nova-store-header.duration-700 {
    background: #030D1A !important;
}
.nova-store-footer .nova-store-footer__inner salla-payments .s-payments-list-item {
    align-items: center;
    background-color: white !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .16) !important;
    display: flex;
    height: 28px !important;
    justify-content: center;
    width: 40px !important;
}

@media only screen and (max-width: 1024px) {
    .mm-spn.mm-spn--light {
        background: #030D1A;
        color: white;
    }
}
body {
    background-color: #030D1A !important;
    color: var(--color-store) !important;
}




/////
/* =====================================================================
   LUXE CORP / تذكرة قبول — قسم الأسئلة الشائعة  |  سلة
   ▸ CSS مخصص. يعمل مع الملف: luxe-faq.js
   ▸ يُحقن بعد قسم:  id="best-offers-4-slider"
   الألوان: #030D1A · #101F33 · #0274E6 · #A6823C · #F0F4F8
   ===================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&display=swap');

#lx-faq{
  --obsidian:#030D1A; --navy:#101F33; --blue:#0274E6;
  --gold:#A6823C; --gold-lite:#D8B872; --gold-soft:#EBD9A8;
  --ink:#F0F4F8; --muted:rgba(240,244,248,.62); --line:rgba(240,244,248,.09);
  --gold-line:rgba(166,130,60,.42); --ease:cubic-bezier(.22,1,.36,1);

  position:relative; isolation:isolate; overflow:hidden; box-sizing:border-box; direction:rtl;
  width:100vw; max-width:100vw; margin-inline:calc(50% - 50vw);
  padding:clamp(56px,8vh,96px) clamp(20px,6vw,72px);
  font-family:'Cairo',system-ui,sans-serif; color:var(--ink); line-height:1.6;
  background:
    radial-gradient(90% 60% at 50% -10%, rgba(2,116,230,.12), transparent 60%),
    radial-gradient(80% 60% at 50% 120%, rgba(166,130,60,.10), transparent 60%),
    linear-gradient(180deg,#04101F 0%, var(--obsidian) 55%, #020A14 100%);
}
#lx-faq *{box-sizing:border-box;}
#lx-faq .lx-faq-wrap{position:relative; z-index:2; width:100%; max-width:880px; margin-inline:auto;}

/* head */
#lx-faq .lx-faq-head{text-align:center; margin-bottom:clamp(30px,4vh,48px);}
#lx-faq .lx-faq-kicker{display:inline-flex; align-items:center; gap:9px; padding:8px 16px; border-radius:100px;
  font-size:13.5px; font-weight:600; color:var(--gold-soft); background:rgba(166,130,60,.08); border:1px solid var(--gold-line);}
#lx-faq .lx-faq-kicker::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--gold-lite);
  box-shadow:0 0 0 0 rgba(216,184,114,.5); animation:lxf-ping 2.4s ease-out infinite;}
@keyframes lxf-ping{70%,100%{box-shadow:0 0 0 8px rgba(216,184,114,0)}}
#lx-faq .lx-faq-title{margin:18px 0 0; font-size:clamp(1.8rem,3.6vw,2.9rem); font-weight:800; letter-spacing:-.5px;}
#lx-faq .lx-faq-title .lxf-w{display:inline-block; opacity:.12; font-weight:800;
  background:linear-gradient(100deg,var(--gold) 0%,var(--gold-lite) 45%,var(--gold-soft) 65%,var(--gold) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; will-change:opacity,filter;}
#lx-faq.lxf-in .lx-faq-title .lxf-w{animation-name:lxf-lightup,lxf-pulse; animation-duration:.85s,3.6s;
  animation-timing-function:cubic-bezier(.22,1,.36,1),ease-in-out; animation-fill-mode:both,none; animation-iteration-count:1,infinite;}
@keyframes lxf-lightup{0%{opacity:.12; filter:blur(7px) drop-shadow(0 0 0 rgba(216,184,114,0));}
  55%{opacity:1; filter:blur(0) drop-shadow(0 0 20px rgba(216,184,114,.85));}
  100%{opacity:1; filter:blur(0) drop-shadow(0 0 7px rgba(216,184,114,.35));}}
@keyframes lxf-pulse{0%,100%{filter:blur(0) drop-shadow(0 0 6px rgba(216,184,114,.3));}
  50%{filter:blur(0) drop-shadow(0 0 15px rgba(216,184,114,.55));}}
#lx-faq .lx-faq-sub{margin:14px 0 0; font-size:clamp(.95rem,1.1vw,1.08rem); color:var(--muted); font-weight:300;}

/* list */
#lx-faq .lx-faq-list{display:flex; flex-direction:column; gap:14px;}
#lx-faq .lx-faq-item{position:relative; border-radius:16px; overflow:hidden; opacity:0; transform:translateY(16px);
  border:1px solid var(--line); background:linear-gradient(160deg, rgba(22,40,63,.55), rgba(16,31,51,.55));
  backdrop-filter:blur(6px); transition:border-color .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease);}
#lx-faq .lx-faq-item::before{content:""; position:absolute; inset-inline-start:0; top:0; bottom:0; width:3px;
  background:linear-gradient(var(--gold),var(--gold-lite)); transform:scaleY(0); transform-origin:top; transition:transform .4s var(--ease);}
#lx-faq.lxf-in .lx-faq-item{opacity:1; transform:none; transition:opacity .7s var(--ease), transform .7s var(--ease),
  border-color .35s var(--ease), box-shadow .35s var(--ease);}
#lx-faq .lx-faq-item.open{border-color:var(--gold-line); box-shadow:0 18px 44px rgba(0,0,0,.35);
  background:linear-gradient(160deg, rgba(26,46,71,.7), rgba(16,31,51,.7));}
#lx-faq .lx-faq-item.open::before{transform:scaleY(1);}

#lx-faq .lx-faq-q{width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 22px; background:none; border:0; cursor:pointer; text-align:start;
  font-family:'Cairo',sans-serif; font-size:clamp(1rem,1.3vw,1.15rem); font-weight:600; color:var(--ink);
  transition:color .3s var(--ease);}
#lx-faq .lx-faq-q:hover{color:var(--gold-soft);}
#lx-faq .lx-faq-ic{flex:0 0 auto; width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
  border:1px solid var(--gold-line); background:rgba(166,130,60,.08); color:var(--gold-lite);
  transition:transform .4s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);}
#lx-faq .lx-faq-ic svg{width:16px; height:16px; display:block;}
#lx-faq .lx-faq-item.open .lx-faq-ic{transform:rotate(180deg); background:linear-gradient(135deg,var(--gold-lite),var(--gold));
  color:#181205; box-shadow:0 6px 16px rgba(166,130,60,.4);}

#lx-faq .lx-faq-a{max-height:0; overflow:hidden; transition:max-height .45s var(--ease);}
#lx-faq .lx-faq-a-inner{padding:0 22px 22px; color:var(--muted); font-size:clamp(.92rem,1.05vw,1.03rem); line-height:2; font-weight:300;
  border-top:1px solid var(--line); margin-top:2px; padding-top:16px;}
#lx-faq .lx-faq-a-inner strong{color:var(--gold-soft); font-weight:600;}

@media (max-width:520px){
  #lx-faq .lx-faq-q{padding:16px 16px; gap:12px;}
  #lx-faq .lx-faq-a-inner{padding-inline:16px;}
}
@media (prefers-reduced-motion:reduce){
  #lx-faq *,#lx-faq *::before,#lx-faq *::after{animation:none!important; transition-duration:.001s!important;}
  #lx-faq .lx-faq-title .lxf-w{opacity:1!important; filter:none!important;}
  #lx-faq .lx-faq-item{opacity:1!important; transform:none!important;}
}
.bg-white {
    background-color: #030D1A !important;
}
.s-comments-product {
    background-color: #030D1A !important;
}

.s-product-options-wrapper .s-form-control {
    background-color: white ! IMPORTANT;
    border-color: white !important;
    border-radius: 10px !important;
    color: #030D1A !important;
}