/* ===== VAZHMOJ Pro layer: floating glass header, refined type, dedicated mobile app-style UX ===== */
:root{--ease:cubic-bezier(.2,.8,.2,1)}
body{font-feature-settings:"ss01";text-rendering:optimizeLegibility}
.header{position:fixed!important;top:12px;inset-inline:0;margin:0 auto;width:min(1180px,calc(100% - 28px));border-radius:22px;border:1px solid rgba(255,255,255,.14)!important;background:rgba(5,34,28,.74)!important;box-shadow:0 18px 50px -14px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08);z-index:200}
.header .container{padding:8px 14px!important;max-width:none!important}
.nav a{white-space:nowrap;font-size:.86rem;padding:.42rem .72rem}
@media(min-width:1061px){.nav a[href="gallery.html"],.nav a[href="updates.html"],.nav a[href="about.html"],.nav a[href="faq.html"],.nav a[href="features.html"]{display:none}}
.hero{padding-top:132px!important;min-height:auto}.page-head{padding-top:132px!important}
.hero-logo{width:72px!important;height:72px;margin:0 0 16px!important;border-radius:20px!important;animation:none!important}
.hero h1{font-size:clamp(3.2rem,8vw,6rem)!important;line-height:1.05;letter-spacing:-.02em}
.hero .tagline{font-weight:800}
.btn{border-radius:14px!important;min-height:48px;justify-content:center;font-weight:800}
.section{padding-block:clamp(60px,9vw,112px)}
.section-head h2{font-size:clamp(1.8rem,4vw,2.8rem);letter-spacing:-.02em;line-height:1.2}
.section-head .kicker{display:inline-block;padding:.25rem .9rem;border-radius:99px;background:rgba(15,157,110,.1);color:var(--emerald-deep);font-weight:800;font-size:.8rem}
.card{border-radius:26px!important;padding:28px!important;background:linear-gradient(180deg,#fff,#f5faf8)!important;border:1px solid rgba(15,157,110,.14)!important;box-shadow:inset 0 1px 0 #fff,0 14px 34px -22px rgba(4,61,46,.45)}
.dark .card{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.14)!important}
.card .icon{width:54px;height:54px;border-radius:17px}
.gallery figure img{border-radius:26px}
.faq-item{border-radius:20px}
.tabbar{display:none}
@media(max-width:820px){
 html{scroll-padding-top:84px}
 body{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
 .m-cta{display:none!important}
 .header{top:8px;width:calc(100% - 16px);border-radius:18px}
 .header .btn,.nav .btn{display:none}
 .hero{padding:96px 0 34px!important}.page-head{padding:96px 0 30px!important}
 .hero .container{display:flex!important;flex-direction:column;text-align:center;gap:20px}
 .hero-logo{width:64px!important;height:64px;margin:0 auto 12px!important}
 .hero h1{font-size:clamp(3rem,15vw,4.2rem)!important}
 .hero p.lead{font-size:1rem;line-height:1.9}
 .hero-cta{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;width:100%}
 .hero-cta .btn{width:100%}.hero-cta .btn-gold{grid-column:1/-1;min-height:54px;font-size:1.05rem}
 .hero-stats{display:grid!important;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
 .hero-stats div{padding:12px 6px!important;border-radius:16px!important;text-align:center}.hero-stats div strong{font-size:1.3rem}.hero-stats div span{font-size:.72rem;line-height:1.4}
 .hero-visual{height:380px;margin-top:6px}.hero-visual .phone.front{width:200px}.hero-visual .phone.back{width:160px}
 .grid-3,.grid-4,.gallery,.steps{display:flex!important;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;width:100vw;margin-inline:calc(50% - 50vw);padding:6px 20px 20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .grid-3::-webkit-scrollbar,.grid-4::-webkit-scrollbar,.gallery::-webkit-scrollbar,.steps::-webkit-scrollbar{display:none}
 .grid-3>*,.grid-4>*,.gallery>*,.steps>*{flex:0 0 80%;scroll-snap-align:center}
 #vg{display:grid!important;width:auto;margin:0;padding:0;overflow:visible}#vg>*{flex:none}
 input,select{font-size:16px!important;min-height:50px}
 .section{padding-block:52px}
 .tabbar{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;position:fixed;z-index:300;inset-inline:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));padding:8px 6px;border-radius:26px;background:rgba(5,34,28,.86);backdrop-filter:blur(22px) saturate(1.6);-webkit-backdrop-filter:blur(22px) saturate(1.6);border:1px solid rgba(255,255,255,.16);box-shadow:0 20px 50px -10px rgba(0,0,0,.65)}
 .tabbar a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;color:#9fc7bb;text-decoration:none;font-size:.68rem;font-weight:700;border-radius:16px;transition:color .25s,transform .25s var(--ease);-webkit-tap-highlight-color:transparent}
 .tabbar a svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
 .tabbar a:active{transform:scale(.9)}.tabbar a.on{color:#fff}.tabbar a.on svg{color:var(--turq-light);filter:drop-shadow(0 0 8px var(--turq))}
 .tabbar a.mid{transform:translateY(-16px);color:#2b1d00}.tabbar a.mid span.pl{width:56px;height:56px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,#ffd86b,var(--gold) 55%,#e39b1e);box-shadow:0 14px 28px -6px rgba(245,192,74,.6);border:3px solid rgba(5,34,28,.9)}.tabbar a.mid{color:#ffd86b}
 .tabbar a.mid svg{stroke:#2b1d00;fill:#2b1d00;width:22px;height:22px}
 .play-frame{height:calc(100svh - 190px)!important;border-width:6px;border-radius:28px}
}
.hero h1 .sub{display:block;font-size:.2em!important;letter-spacing:.32em;font-weight:700;margin-top:.9rem;line-height:1.6;white-space:normal}
html,body{overflow-x:clip}
@media(max-width:820px){.hero h1 .sub{font-size:.3em!important;letter-spacing:.18em}}