/* ===== VAZHMOJ Ultra layer: glass UI, aurora hero, motion ===== */
:root{--ease:cubic-bezier(.2,.8,.2,1)}
#vm-pg{position:fixed;top:0;inset-inline:0;height:3px;z-index:300;background:linear-gradient(90deg,var(--turq),var(--gold));transform:scaleX(0);transform-origin:0 50%}[dir=rtl] #vm-pg{transform-origin:100% 50%}
.header{background:rgba(4,40,32,.68)!important;backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);border-bottom:1px solid rgba(255,255,255,.1)!important;transition:box-shadow .3s}
.header.scrolled{box-shadow:0 12px 40px rgba(0,0,0,.35)}
.brand{color:#fff!important}.brand small{color:var(--turq-light)!important}
.nav a{color:#cfeee6}.nav a:hover,.nav a.active{background:rgba(255,255,255,.12)!important;color:#fff!important}
.lang-btn{border-color:rgba(255,255,255,.35)!important;color:#fff!important}.lang-btn:hover{background:var(--turq)!important;border-color:var(--turq)!important;color:#04281f!important}
.icon-btn{background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.22)!important;color:#fff}.burger span{background:#fff!important}
.nav.open{background:rgba(4,40,32,.97)!important;backdrop-filter:blur(20px)}
.btn{position:relative;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s,background .25s}
.btn:hover{transform:translateY(-3px)}
.btn-gold,.btn-primary{box-shadow:0 10px 30px -8px rgba(230,184,74,.6)}
.btn-gold:after,.btn-primary:after{content:"";position:absolute;top:0;bottom:0;width:40%;inset-inline-start:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);animation:sheen 4.5s ease-in-out infinite}
@keyframes sheen{55%,100%{inset-inline-start:130%}}
.hero:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1px);background-size:30px 30px;mask-image:radial-gradient(circle at 60% 40%,#000,transparent 72%);-webkit-mask-image:radial-gradient(circle at 60% 40%,#000,transparent 72%);pointer-events:none}
.hero:after{content:"";position:absolute;width:560px;height:560px;border-radius:50%;filter:blur(100px);background:rgba(45,212,191,.28);top:-160px;inset-inline-end:-120px;animation:aur 14s ease-in-out infinite alternate;pointer-events:none}
@keyframes aur{to{transform:translate(-80px,70px) scale(1.2)}}
.hero .container{position:relative;z-index:1}
.hero h1{background:linear-gradient(120deg,#fff 15%,#a7f3e4 50%,var(--gold-light) 90%);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% auto;animation:shn 9s linear infinite}
.hero h1 .sub{-webkit-text-fill-color:var(--turq-light)}
@keyframes shn{to{background-position:200% center}}
.hero-eyebrow{backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.22)!important;background:rgba(255,255,255,.1)!important}
.hero-stats div{backdrop-filter:blur(12px);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:12px 16px;transition:transform .4s var(--ease)}.hero-stats div:hover{transform:translateY(-5px)}
.hero-visual{perspective:1100px}.phone{box-shadow:0 40px 90px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.14),0 0 70px -10px rgba(45,212,191,.45)!important;will-change:transform}
.card{position:relative;overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s,border-color .3s!important}
.card:hover{transform:translateY(-8px)!important;box-shadow:0 26px 60px -18px rgba(15,157,110,.45)!important;border-color:var(--turq)!important}
.card:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),rgba(20,184,196,.2),transparent 70%)}.card:hover:after{opacity:1}
.card .icon,.ic{background:linear-gradient(135deg,var(--emerald),var(--turq))!important;color:#fff;box-shadow:0 12px 26px -8px var(--emerald)}
.ic{display:inline-flex;vertical-align:-.2em;width:1.25em;height:1.25em;background:none!important;box-shadow:none}.ic svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.card .icon .ic{width:28px;height:28px}
.step,.gallery figure,.level,.faq-item,.news{transition:transform .4s var(--ease),box-shadow .4s}
.gallery figure:hover{transform:translateY(-8px) scale(1.02)}.faq-item[open]{box-shadow:0 14px 34px -14px rgba(15,157,110,.45)}
.store.live{display:flex;align-items:center;gap:14px;padding:18px 22px;border-radius:20px;background:linear-gradient(135deg,#fff,#e9fbf6);border:1.5px solid var(--turq);box-shadow:0 18px 44px -14px rgba(20,184,196,.6);transition:transform .4s var(--ease),box-shadow .4s}
.store.live:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 26px 60px -12px rgba(20,184,196,.8)}
.store.live .s-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,var(--emerald),var(--turq));color:#fff;font-size:1.6rem}
.store.live b{font-size:1.2rem;color:var(--emerald-deep)}
.m-cta{display:none}
@media(max-width:820px){.m-cta{display:flex;position:fixed;z-index:120;inset-inline:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));justify-content:center;box-shadow:0 18px 40px -8px rgba(0,0,0,.5)}body{padding-bottom:78px}.phone{animation-duration:7s}}
@media(prefers-reduced-motion:reduce){*,:before,:after{animation:none!important;transition:none!important}}

.play-frame{max-width:420px;margin:auto;height:min(820px,calc(100svh - 110px));border-radius:36px;border:9px solid #0a1a17;overflow:hidden;background:#0e2a52;box-shadow:0 40px 90px -20px rgba(4,40,32,.7),0 0 70px -10px rgba(45,212,191,.4)}
.play-frame iframe{width:100%;height:100%;border:0;display:block}

.brand-logo{width:44px;height:44px;border-radius:13px;box-shadow:0 6px 18px -4px rgba(45,212,191,.6);transition:transform .4s var(--ease)}.brand:hover .brand-logo{transform:rotate(-6deg) scale(1.08)}
.hero-logo{width:clamp(96px,16vw,150px);height:auto;border-radius:30px;margin-bottom:18px;box-shadow:0 24px 60px -12px rgba(0,0,0,.55),0 0 60px -8px rgba(45,212,191,.55);animation:logofl 6s ease-in-out infinite}
@keyframes logofl{50%{transform:translateY(-8px) rotate(-2deg)}}
.store.live .s-icon{overflow:hidden}
