*,*::before,*::after{font-family:'Outfit',sans-serif}
html{scroll-behavior:smooth}
body{background:#050505;color:#fff;overflow-x:hidden}
.hero-grid{background-image:linear-gradient(rgba(217,42,58,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(217,42,58,.06) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.5) 0%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to bottom,rgba(0,0,0,.5) 0%,rgba(0,0,0,0) 100%)}
.hero-glow{position:absolute;top:-10%;left:50%;transform:translateX(-50%);width:800px;height:600px;background:radial-gradient(ellipse,rgba(217,42,58,.08) 0%,transparent 70%);pointer-events:none}
.glass{background:rgba(255,255,255,.03);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.06)}
.glass-strong{background:rgba(255,255,255,.05);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08)}
.card-glow{position:relative;overflow:hidden}
.card-glow::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 30%,rgba(217,42,58,.06) 0%,transparent 60%);pointer-events:none;transition:opacity .4s}
.card-glow:hover::before{opacity:.8}
.feat-card{position:relative;overflow:hidden;transition:border-color .3s,transform .3s}
.feat-card:hover{border-color:rgba(217,42,58,.2);transform:translateY(-2px)}
.feat-card .feat-icon{transition:transform .3s,color .3s}
.feat-card:hover .feat-icon{transform:scale(1.15);color:#D92A3A}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes barAnim{0%,100%{height:30%}50%{height:90%}}
@keyframes pulse-dot{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes loadTrack{0%{width:10%}50%{width:80%}100%{width:10%}}
@keyframes graphLine{0%{stroke-dashoffset:200}100%{stroke-dashoffset:0}}
@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.bar-anim{animation:barAnim 2s ease-in-out infinite}
.bar-d1{animation-delay:.2s}.bar-d2{animation-delay:.4s}.bar-d3{animation-delay:.6s}.bar-d4{animation-delay:.8s}
.load-track{animation:loadTrack 3s ease-in-out infinite}
.graph-anim{stroke-dasharray:200;animation:graphLine 3s linear infinite}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.faq-item{border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.02);border-radius:12px;transition:border-color .3s}
.faq-item:hover{border-color:rgba(255,255,255,.1)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1),padding .3s}
.faq-item.open .faq-answer{max-height:500px}
.faq-item.open .faq-chevron{transform:rotate(180deg)}
.faq-item.open{border-color:rgba(217,42,58,.25);background:rgba(217,42,58,.03)}
.faq-chevron{transition:transform .3s ease}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:#0a0a0a}
::-webkit-scrollbar-thumb{background:#333;border-radius:3px}
.device-tabs{scrollbar-width:none}
.device-tabs::-webkit-scrollbar{display:none}
.changelog-ver.active{background:rgba(217,42,58,.15);border-color:#D92A3A}
.changelog-content{display:none}
.changelog-content.active{display:block}
.nav-link{position:relative}
.nav-link::after{content:'';position:absolute;bottom:-2px;left:0;width:0;height:1px;background:#D92A3A;transition:width .3s ease}
.nav-link:hover::after{width:100%}
