/* VERTEX home — طبقة تلميع خفيفة فوق الصفحة الحالية (لا تغيّر المحتوى ولا الهيكل) */
:root{--vxp-pink:#EE678C;--vxp-pink2:#D94F77;--vxp-peach:#FFB48F;--vxp-ease:cubic-bezier(.2,.75,.15,1)}

/* شريط تقدّم التمرير */
#vxp-progress{position:fixed;top:0;right:0;left:0;height:3px;z-index:2147483000;pointer-events:none;background:transparent}
#vxp-progress i{display:block;height:100%;width:100%;transform-origin:100% 50%;transform:scaleX(0);background:linear-gradient(270deg,var(--vxp-pink),var(--vxp-peach));box-shadow:0 0 12px rgba(238,103,140,.55)}

/* توهّج ناعم يتبع المؤشر (الحاسوب فقط) */
#vxp-glow{position:fixed;left:0;top:0;width:360px;height:360px;margin:-180px 0 0 -180px;border-radius:50%;pointer-events:none;z-index:0;opacity:0;transition:opacity .4s;background:radial-gradient(circle,rgba(238,103,140,.10),rgba(238,103,140,0) 65%);will-change:transform}
.vxp-on #vxp-glow{opacity:1}

/* الهيرو: هالة ناعمة صغيرة خلف الرسمة فقط (بدون بقع كبيرة) */
/* بدون isolation وبدون transform/will-change على .art: الصورة تعتمد على mix-blend-mode:multiply لتندمج مع خلفية الصفحة */
.hero{position:relative}
.hero .art::before{content:"";position:absolute;inset:12% 10% 8% 10%;border-radius:50%;background:radial-gradient(circle at 50% 52%,rgba(255,179,198,.40),rgba(255,210,184,.18) 52%,rgba(255,210,184,0) 72%);filter:blur(26px);z-index:-1;pointer-events:none;animation:vxpDrift 16s ease-in-out infinite}
@keyframes vxpDrift{50%{transform:translate(36px,26px) scale(1.1)}}
.hero .art svg{transition:transform .35s var(--vxp-ease)}

/* الأزرار: لمعة عند المرور + رفعة */
.btn{position:relative;overflow:hidden;transition:transform .28s var(--vxp-ease),box-shadow .28s var(--vxp-ease)}
.btn::after{content:"";position:absolute;top:0;bottom:0;width:50%;right:-80%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);transition:right .7s var(--vxp-ease);pointer-events:none}
.btn:hover::after{right:130%}
.btn-pink:hover{transform:translateY(-3px);box-shadow:0 18px 30px -14px rgba(238,103,140,.85)}
.btn-line:hover{transform:translateY(-3px)}
.btn:active{transform:scale(.98)}

/* بطاقات المزايا: بقعة ضوء تتبع المؤشر */
.feature{position:relative;overflow:hidden;transition:transform .35s var(--vxp-ease),box-shadow .35s var(--vxp-ease)}
.feature::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(238,103,140,.16),transparent 70%)}
.feature:hover{transform:translateY(-6px);box-shadow:0 26px 40px -28px rgba(194,65,106,.6)}
.feature:hover::before{opacity:1}

/* المنتجات: ميلان ثلاثي الأبعاد + لمعة + تكبير الصورة */
.hx-prods{perspective:1100px}
.hx-card.hx-prod{position:relative;transition:transform .35s var(--vxp-ease),box-shadow .35s var(--vxp-ease);transform-style:preserve-3d;will-change:transform}
.hx-card.hx-prod figure{overflow:hidden}
.hx-card.hx-prod img{transition:transform .6s var(--vxp-ease)}
.hx-card.hx-prod:hover img{transform:scale(1.07)}
.hx-card.hx-prod::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .25s;background:radial-gradient(220px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.55),transparent 62%)}
.hx-card.hx-prod:hover::after{opacity:1}
.hx-card.hx-prod small{display:inline-block!important;margin-top:4px;padding:3px 12px;border-radius:999px;background:#FDEEF0!important;color:#C2416A!important;font-weight:600!important}

/* الشريط المتحرك للآراء: يقف عند المرور وحواف متلاشية */
.hx-marquee{-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.hx-marquee:hover *{animation-play-state:paused}

/* الأسئلة الشائعة */
.faq details summary{transition:color .25s}
.faq details summary:hover{color:var(--vxp-pink2)}
.faq details[open]{animation:vxpOpen .35s var(--vxp-ease)}
@keyframes vxpOpen{from{opacity:.6;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* الأرقام: نبضة خفيفة عند اكتمال العدّ */
.hx-stats b,.hx-stats strong{display:inline-block}
.hx-stats .vxp-done{animation:vxpPop .6s var(--vxp-ease)}
@keyframes vxpPop{40%{transform:scale(1.12)}}

/* قلوب/نجوم عائمة خفيفة خلف قسم الدعوة */
#join{position:relative;overflow:hidden}
.vxp-float{position:absolute;pointer-events:none;opacity:.5;animation:vxpFloat 9s ease-in-out infinite;font-size:22px;z-index:0}
@keyframes vxpFloat{50%{transform:translateY(-16px) rotate(8deg)}}

/* احترام «تقليل الحركة» وتوفير الأداء */
@media (prefers-reduced-motion:reduce){
  .hero .art::before,.vxp-float{animation:none!important}
  .btn::after{display:none}
  .hx-card.hx-prod,.feature{transform:none!important}
  #vxp-glow{display:none}
}
.vxp-lite .hero .art::before,.vxp-lite .vxp-float{animation:none}
.vxp-lite #vxp-glow{display:none}
@media (max-width:760px){
  #vxp-glow{display:none}
}

/* شاشات طويلة: لا نترك فراغًا كبيرًا فوق وتحت محتوى الهيرو (الأصل: ارتفاع الشاشة كاملة) */
@media (min-width:761px){.hero .wrap{min-height:min(calc(100vh - 84px),640px)}}
/* حافة الصورة 254 بدل 255: نرفعها قليلًا لتصير بيضاء تامة قبل الدمج فلا يظهر مربعها */
.hero-girl{filter:brightness(1.012)}