{"id":2026,"date":"2026-05-21T14:39:10","date_gmt":"2026-05-21T07:39:10","guid":{"rendered":"https:\/\/ifuturevietnam.com\/gravastar\/"},"modified":"2026-06-05T10:09:53","modified_gmt":"2026-06-05T03:09:53","slug":"gravastar","status":"publish","type":"page","link":"https:\/\/ifuturevietnam.com\/vi\/gravastar\/","title":{"rendered":"GRAVASTAR"},"content":{"rendered":"\n<style data-wp-block-html=\"css\">\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   RESET & TOKENS\n\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\n*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}\n:root{\n  --bg:#03020a;\n  --bg2:#08060f;\n  --bg3:#0e0c18;\n  --red:#C8102E;\n  --red2:#E8192F;\n  --red3:#ff3347;\n  --red-dim:rgba(200,16,46,0.12);\n  --red-glow:rgba(200,16,46,0.05);\n  --gold:#8C7A5E;\n  --gold2:#B09070;\n  --t1:#FFFFFF;\n  --t2:#928EA3;\n  --t3:#4E4A5C;\n  --ease-out-expo:cubic-bezier(0.16,1,0.3,1);\n}\nhtml{scroll-behavior:smooth}\nbody{\n  background:var(--bg);\n  color:var(--t1);\n  font-family:'Inter',sans-serif;\n  overflow-x:hidden;\n  cursor:none;\n}\n\n\/* \u2500\u2500 CURSOR \u2500\u2500 *\/\n#cur,#cur-r{position:fixed;pointer-events:none;z-index:9999;border-radius:50%;transform:translate(-50%,-50%)}\n#cur{width:8px;height:8px;background:var(--red3);top:0;left:0;z-index:9999;mix-blend-mode:difference}\n#cur-r{width:36px;height:36px;border:1px solid rgba(200,16,46,.35);top:0;left:0;z-index:9998;transition:width .22s var(--ease-out-expo),height .22s var(--ease-out-expo),border-color .2s,background .2s}\nbody:has(a:hover,button:hover,.hoverable:hover) #cur-r{width:56px;height:56px;background:rgba(200,16,46,.06);border-color:rgba(200,16,46,.7)}\nbody:has(a:hover,button:hover,.hoverable:hover) #cur{width:0px;height:0px}\n\n\/* \u2500\u2500 SCROLLBAR \u2500\u2500 *\/\n::-webkit-scrollbar{width:2px}\n::-webkit-scrollbar-track{background:var(--bg)}\n::-webkit-scrollbar-thumb{background:var(--red)}\n\n\/* \u2500\u2500 PROGRESS \u2500\u2500 *\/\n#prog{position:fixed;top:0;left:0;height:2px;background:linear-gradient(90deg,var(--red),var(--red3));z-index:10000;width:0%;box-shadow:0 0 12px var(--red);transition:width .1s linear}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 NAV \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\nnav{\n  position:fixed;top:0;left:0;right:0;z-index:1000;\n  display:flex;align-items:center;justify-content:space-between;\n  padding:30px 60px;\n  transition:padding .4s var(--ease-out-expo),background .4s,border-color .4s;\n  border-bottom:1px solid transparent;\n}\nnav.scrolled{\n  padding:16px 60px;\n  background:rgba(3,2,10,.94);\n  backdrop-filter:blur(28px) saturate(1.4);\n  -webkit-backdrop-filter:blur(28px) saturate(1.4);\n  border-color:rgba(200,16,46,.13);\n}\n.logo{\n  font-family:'Bebas Neue',sans-serif;\n  font-size:22px;letter-spacing:6px;\n  color:#fff;text-decoration:none;\n  display:flex;align-items:center;gap:2px;\n  position:relative;\n}\n.logo-star{color:var(--red3);display:inline-block;animation:star-pulse 3s ease-in-out infinite}\n@keyframes star-pulse{0%,100%{opacity:1;transform:scale(1) rotate(0deg)}50%{opacity:.55;transform:scale(.85) rotate(20deg)}}\n.nav-links{display:flex;align-items:center;gap:44px;list-style:none}\n.nav-links a{\n  font-size:9.5px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;\n  color:var(--t2);text-decoration:none;transition:color .2s;position:relative;\n}\n.nav-links a::after{content:'';position:absolute;bottom:-5px;left:0;width:0;height:1px;background:var(--red3);transition:width .25s var(--ease-out-expo)}\n.nav-links a:hover{color:#fff}\n.nav-links a:hover::after{width:100%}\n.nav-cta{\n  background:var(--red)!important;color:#fff!important;\n  padding:11px 28px;font-size:9px!important;letter-spacing:3px!important;\n  clip-path:polygon(10px 0%,100% 0%,calc(100% - 10px) 100%,0% 100%);\n  transition:background .2s,box-shadow .2s,transform .2s!important;\n}\n.nav-cta:hover{background:var(--red3)!important;box-shadow:0 0 24px rgba(232,25,47,.5)!important;transform:translateY(-1px)!important}\n.nav-cta::after{display:none!important}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 HERO \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#hero{height:100vh;min-height:720px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column}\n.hero-bg{\n  position:absolute;inset:0;\n  background:\n    radial-gradient(ellipse 80% 60% at 50% 70%,rgba(200,16,46,.08) 0%,transparent 60%),\n    radial-gradient(ellipse 35% 35% at 10% 90%,rgba(180,10,40,.05) 0%,transparent 50%),\n    radial-gradient(ellipse 40% 30% at 90% 15%,rgba(100,5,20,.04) 0%,transparent 50%),\n    var(--bg);\n}\n.hero-bg::after{\n  content:'';position:absolute;inset:0;\n  background-image:url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='4' stitchTiles='stitch'\/%3E%3C\/filter%3E%3Crect width='400' height='400' filter='url(%23n)' opacity='.035'\/%3E%3C\/svg%3E\");\n  pointer-events:none;opacity:.5;\n}\n.hero-grid{\n  position:absolute;inset:0;\n  background-image:linear-gradient(rgba(200,16,46,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(200,16,46,.022) 1px,transparent 1px);\n  background-size:80px 80px;\n  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 15%,transparent 72%);\n  -webkit-mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 15%,transparent 72%);\n}\n.hero-scanlines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,.05) 3px,rgba(0,0,0,.05) 4px);pointer-events:none}\n\/* Rings *\/\n.hero-ring{position:absolute;top:50%;left:50%;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}\n.hr1{width:420px;height:420px;border:1px solid rgba(200,16,46,.2);animation:ring-spin 16s linear infinite}\n.hr2{width:620px;height:620px;border:1px dashed rgba(200,16,46,.07);animation:ring-spin 28s linear infinite reverse}\n.hr3{width:820px;height:820px;border:1px solid rgba(140,122,94,.05);animation:ring-spin 44s linear infinite}\n.hr1::before,.hr1::after{content:'';position:absolute;width:8px;height:8px;border-radius:50%;background:var(--red3);box-shadow:0 0 12px var(--red),0 0 24px rgba(200,16,46,.4)}\n.hr1::before{top:-4px;left:calc(50% - 4px)}\n.hr1::after{bottom:-4px;left:calc(50% - 4px);background:rgba(200,16,46,.4)}\n@keyframes ring-spin{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}\n\n.hero-core{position:absolute;top:50%;left:50%;width:240px;height:240px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(200,16,46,.16) 0%,transparent 70%);animation:core-breathe 4.5s ease-in-out infinite}\n@keyframes core-breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.4);opacity:1}}\n\n\/* Floating particles *\/\n.particle{position:absolute;border-radius:50%;pointer-events:none;animation:float-particle var(--dur,8s) ease-in-out var(--delay,0s) infinite alternate}\n@keyframes float-particle{0%{transform:translateY(0) translateX(0) scale(1);opacity:var(--op,.4)}100%{transform:translateY(var(--ty,-40px)) translateX(var(--tx,20px)) scale(1.2);opacity:calc(var(--op,.4) * .3)}}\n\n.hero-content{position:relative;z-index:10;text-align:center;display:flex;flex-direction:column;align-items:center}\n.hero-eyebrow{\n  font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:5px;text-transform:uppercase;\n  color:var(--red3);margin-bottom:30px;\n  display:flex;align-items:center;gap:16px;\n  opacity:0;animation:fu-anim .9s var(--ease-out-expo) .3s forwards;\n}\n.hero-eyebrow::before,.hero-eyebrow::after{content:'';display:block;width:52px;height:1px;opacity:.55}\n.hero-eyebrow::before{background:linear-gradient(90deg,transparent,var(--red))}\n.hero-eyebrow::after{background:linear-gradient(90deg,var(--red),transparent)}\n\n.hero-h{\n  font-family:'Bebas Neue',sans-serif;\n  font-size:clamp(86px,14vw,185px);\n  line-height:.86;letter-spacing:-1px;\n  opacity:0;animation:fu-anim 1.1s var(--ease-out-expo) .5s forwards;\n}\n.hero-h .ghost{display:block;color:transparent;-webkit-text-stroke:1px rgba(200,16,46,.45)}\n.hero-h .fill{display:block;color:var(--red3);text-shadow:0 0 80px rgba(232,25,47,.35),0 0 160px rgba(200,16,46,.15)}\n.hero-h .white{display:block;color:#fff}\n\n\/* Glitch effect on FUTURE text *\/\n.hero-h .fill{position:relative}\n.hero-h .fill::before,.hero-h .fill::after{\n  content:attr(data-text);position:absolute;top:0;left:0;width:100%;\n  background:inherit;-webkit-background-clip:text;-webkit-text-fill-color:transparent;\n}\n.hero-h .fill::before{\n  color:var(--red3);text-shadow:none;\n  clip-path:polygon(0 0,100% 0,100% 35%,0 35%);\n  animation:glitch-top 4s steps(1) 2s infinite;\n}\n.hero-h .fill::after{\n  color:var(--red3);text-shadow:none;\n  clip-path:polygon(0 65%,100% 65%,100% 100%,0 100%);\n  animation:glitch-bot 4s steps(1) 2.5s infinite;\n}\n@keyframes glitch-top{0%,90%,100%{transform:none;opacity:0}91%{transform:translateX(-3px);opacity:.7}93%{transform:translateX(3px);opacity:.5}95%{transform:none;opacity:0}}\n@keyframes glitch-bot{0%,88%,100%{transform:none;opacity:0}89%{transform:translateX(3px);opacity:.6}91%{transform:translateX(-2px);opacity:.4}93%{transform:none;opacity:0}}\n\n.hero-tagline{\n  margin-top:20px;\n  font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:300;letter-spacing:3px;\n  color:var(--t3);text-transform:uppercase;\n  opacity:0;animation:fu-anim .7s var(--ease-out-expo) .85s forwards;\n}\n.hero-tagline em{font-style:italic;color:var(--t2);font-weight:400}\n.hero-rule{width:1px;height:44px;background:linear-gradient(to bottom,var(--red),transparent);margin:22px auto 0;opacity:0;animation:fu-anim .6s ease .9s forwards}\n\n.hero-ctas{\n  margin-top:44px;display:flex;align-items:center;gap:20px;\n  opacity:0;animation:fu-anim .7s var(--ease-out-expo) 1.05s forwards;\n}\n.hero-btn-primary{\n  display:inline-flex;align-items:center;gap:12px;\n  background:var(--red);border:1px solid var(--red3);\n  color:#fff;padding:16px 42px;\n  font-family:'Space Grotesk',sans-serif;font-size:10px;font-weight:600;letter-spacing:4px;text-transform:uppercase;\n  text-decoration:none;\n  clip-path:polygon(12px 0%,100% 0%,calc(100% - 12px) 100%,0% 100%);\n  transition:background .25s,box-shadow .25s,transform .2s;\n}\n.hero-btn-primary:hover{background:var(--red3);box-shadow:0 0 32px rgba(232,25,47,.45),0 12px 40px rgba(200,16,46,.25);transform:translateY(-3px)}\n.hero-btn-ghost{\n  display:inline-flex;align-items:center;gap:10px;\n  background:transparent;border:1px solid rgba(200,16,46,.3);\n  color:var(--t2);padding:16px 36px;\n  font-family:'Space Grotesk',sans-serif;font-size:10px;font-weight:500;letter-spacing:4px;text-transform:uppercase;\n  text-decoration:none;\n  clip-path:polygon(12px 0%,100% 0%,calc(100% - 12px) 100%,0% 100%);\n  transition:all .25s;\n}\n.hero-btn-ghost:hover{border-color:var(--red);color:#fff;background:rgba(200,16,46,.08)}\n.arr{transition:transform .2s}\n.hero-btn-primary:hover .arr,.hero-btn-ghost:hover .arr{transform:translateX(5px)}\n\n.scroll-cue{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;opacity:0;animation:fu-anim .6s ease 1.5s forwards}\n.scroll-txt{font-family:'Space Grotesk',sans-serif;font-size:8px;letter-spacing:3px;color:var(--t3);text-transform:uppercase}\n.scroll-line{width:1px;height:44px;background:linear-gradient(to bottom,var(--red),transparent);animation:scroll-tick 2.4s ease-in-out infinite}\n@keyframes scroll-tick{0%,100%{opacity:.2;transform:scaleY(.35)}50%{opacity:1;transform:scaleY(1)}}\n\n\/* \u2500\u2500 SHARED ANIMATIONS \u2500\u2500 *\/\n@keyframes fu-anim{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}\n.fu{opacity:0;transform:translateY(44px);transition:opacity .85s var(--ease-out-expo),transform .85s var(--ease-out-expo)}\n.fu.vis{opacity:1;transform:none}\n.fu.d1{transition-delay:.1s}.fu.d2{transition-delay:.2s}.fu.d3{transition-delay:.3s}.fu.d4{transition-delay:.4s}.fu.d5{transition-delay:.55s}\n\n.chapter-tag{\n  font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:4.5px;text-transform:uppercase;\n  color:var(--red3);display:flex;align-items:center;gap:12px;margin-bottom:20px;\n}\n.chapter-tag::after{content:'';display:block;width:32px;height:1px;background:var(--red);opacity:.45}\n.divider{width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(200,16,46,.1),transparent)}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 STAT BAR \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.red-bar{\n  width:100%;padding:18px 60px;\n  background:linear-gradient(90deg,#a80d26,var(--red) 30%,#d81030 70%,#a80d26);\n  display:flex;justify-content:center;gap:96px;align-items:center;\n  position:relative;overflow:hidden;\n}\n.red-bar::before{\n  content:'';position:absolute;inset:0;\n  background:repeating-linear-gradient(90deg,transparent,transparent 120px,rgba(255,255,255,.04) 120px,rgba(255,255,255,.04) 121px);\n}\n.stat-item{display:flex;flex-direction:column;align-items:center;gap:2px;position:relative;z-index:1}\n.stat-num{font-family:'Bebas Neue',sans-serif;font-size:30px;letter-spacing:2px;color:#fff}\n.stat-label{font-family:'Space Grotesk',sans-serif;font-size:8px;font-weight:500;letter-spacing:3.5px;text-transform:uppercase;color:rgba(255,255,255,.6)}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 MANIFESTO TICKER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n.ticker-wrap{overflow:hidden;background:var(--bg2);border-top:1px solid rgba(200,16,46,.06);border-bottom:1px solid rgba(200,16,46,.06);padding:12px 0;position:relative}\n.ticker-wrap::before,.ticker-wrap::after{content:'';position:absolute;top:0;bottom:0;width:80px;z-index:1;pointer-events:none}\n.ticker-wrap::before{left:0;background:linear-gradient(90deg,var(--bg2),transparent)}\n.ticker-wrap::after{right:0;background:linear-gradient(90deg,transparent,var(--bg2))}\n.ticker-track{display:flex;gap:0;width:max-content;animation:ticker 25s linear infinite}\n.ticker-track:hover{animation-play-state:paused}\n@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}\n.ticker-item{\n  font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:4px;text-transform:uppercase;\n  color:var(--t3);white-space:nowrap;padding:0 36px;\n  display:flex;align-items:center;gap:36px;\n}\n.ticker-item .dot{width:4px;height:4px;border-radius:50%;background:var(--red);flex-shrink:0;box-shadow:0 0 6px var(--red)}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 01 \u2014 ORIGIN \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#origin{padding:180px 60px;background:var(--bg)}\n.origin-wrap{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}\n.origin-h{font-family:'Bebas Neue',sans-serif;font-size:clamp(58px,7.5vw,108px);line-height:.87;margin-bottom:40px}\n.origin-h em{font-style:normal;color:transparent;-webkit-text-stroke:1px rgba(200,16,46,.5);display:block}\n.origin-h span{color:var(--red3);display:block;text-shadow:0 0 60px rgba(232,25,47,.25)}\n\n\/* Story paragraphs with left-bar emphasis *\/\n.story-block{position:relative;padding-left:20px;margin-bottom:28px}\n.story-block::before{content:'';position:absolute;left:0;top:4px;bottom:4px;width:2px;background:linear-gradient(to bottom,var(--red),transparent)}\n.body-text{font-size:14.5px;line-height:1.9;color:var(--t2)}\n.body-text strong{color:var(--t1);font-weight:500}\n.quote-pull{\n  margin:36px 0;padding:28px 32px;\n  border:1px solid rgba(200,16,46,.15);\n  background:rgba(200,16,46,.03);\n  clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);\n  position:relative;\n}\n.quote-pull::before{content:'\"';position:absolute;top:-8px;left:24px;font-family:'Bebas Neue',sans-serif;font-size:64px;color:rgba(200,16,46,.25);line-height:1}\n.quote-text{font-family:'Space Grotesk',sans-serif;font-size:15px;font-weight:400;font-style:italic;color:var(--t1);line-height:1.65}\n.quote-attr{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:3px;color:var(--red3);margin-top:12px;text-transform:uppercase}\n\n\/* Video card *\/\n.origin-media{position:relative;aspect-ratio:4\/3;overflow:hidden;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px))}\n.origin-media::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(200,16,46,.2) 0%,transparent 45%);z-index:1;pointer-events:none}\n.vid-inner{width:100%;height:100%;background:linear-gradient(145deg,#1c0a0c,#08030d);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;position:relative}\n.vid-inner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.65;filter:saturate(1.3) contrast(1.1)}\n.vid-overlay{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.3),rgba(0,0,0,.7));z-index:1}\n.play-btn{\n  width:80px;height:80px;border:1px solid rgba(200,16,46,.5);border-radius:50%;\n  display:flex;align-items:center;justify-content:center;\n  background:rgba(0,0,0,.6);cursor:pointer;transition:all .3s;position:relative;z-index:2;\n  backdrop-filter:blur(8px);\n}\n.play-btn:hover{background:rgba(200,16,46,.25);border-color:var(--red3);box-shadow:0 0 32px rgba(200,16,46,.4),inset 0 0 20px rgba(200,16,46,.1);transform:scale(1.08)}\n.play-arrow{border-left:26px solid var(--red3);border-top:15px solid transparent;border-bottom:15px solid transparent;margin-left:7px}\n.play-label{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:3px;color:rgba(255,255,255,.6);text-transform:uppercase;position:relative;z-index:2}\n.origin-frame{position:absolute;inset:-1px;border:1px solid rgba(200,16,46,.2);clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));pointer-events:none;z-index:2}\n.tick{position:absolute;z-index:3;width:12px;height:12px}\n.tick.tl{top:0;left:0;border-top:2px solid var(--red);border-left:2px solid var(--red)}\n.tick.tr{top:0;right:0;border-top:2px solid var(--red);border-right:2px solid var(--red)}\n.tick.bl{bottom:0;left:0;border-bottom:2px solid var(--red);border-left:2px solid var(--red)}\n.tick.br{bottom:0;right:0;border-bottom:2px solid var(--red);border-right:2px solid var(--red)}\n\/* HUD label *\/\n.hud-label{\n  position:absolute;top:16px;left:20px;z-index:4;\n  font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:500;letter-spacing:3px;\n  color:var(--red3);text-transform:uppercase;\n  display:flex;align-items:center;gap:8px;\n}\n.hud-dot{width:6px;height:6px;border-radius:50%;background:var(--red3);box-shadow:0 0 8px var(--red);animation:hud-blink 2s ease-in-out infinite}\n@keyframes hud-blink{0%,100%{opacity:1}50%{opacity:.2}}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 02 \u2014 AUDIO \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#audio{padding:180px 60px;background:radial-gradient(ellipse 75% 65% at 50% 50%,rgba(200,16,46,.06) 0%,transparent 60%),var(--bg2)}\n.audio-wrap{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}\n\n\/* Speaker Orb \u2014 enhanced *\/\n.speaker-orb{position:relative;width:100%;aspect-ratio:1;max-width:460px;display:flex;align-items:center;justify-content:center}\n.orb-outer{width:340px;height:340px;border-radius:50%;border:1px solid rgba(200,16,46,.2);display:flex;align-items:center;justify-content:center;position:relative;animation:ring-spin 14s linear infinite}\n.orb-outer::before,.orb-outer::after{content:'';position:absolute;border-radius:50%;box-shadow:0 0 12px var(--red),0 0 24px rgba(200,16,46,.3)}\n.orb-outer::before{top:-5px;left:calc(50% - 5px);width:10px;height:10px;background:var(--red3)}\n.orb-outer::after{bottom:-5px;left:calc(50% - 3px);width:6px;height:6px;background:rgba(200,16,46,.5)}\n.orb-mid{width:255px;height:255px;border-radius:50%;border:1px dashed rgba(200,16,46,.12);display:flex;align-items:center;justify-content:center;animation:ring-spin 9s linear infinite reverse}\n.orb-core{\n  width:170px;height:170px;border-radius:50%;\n  background:radial-gradient(circle at 38% 38%,rgba(220,30,50,.28),rgba(70,4,14,.75));\n  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;\n  position:relative;box-shadow:0 0 40px rgba(200,16,46,.25),inset 0 0 30px rgba(0,0,0,.5);\n}\n.orb-core::after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 60% 60%,transparent 40%,rgba(0,0,0,.55))}\n.orb-name{font-family:'Bebas Neue',sans-serif;font-size:17px;letter-spacing:5px;color:rgba(232,25,47,.85);position:relative;z-index:1}\n.orb-sub{font-family:'Space Grotesk',sans-serif;font-size:7px;letter-spacing:3px;color:rgba(200,16,46,.4);text-transform:uppercase;position:relative;z-index:1}\n\n\/* Product image in orb *\/\n.orb-product-img{position:absolute;bottom:-60px;left:50%;transform:translateX(-50%);width:200px;height:200px;object-fit:contain;filter:drop-shadow(0 0 20px rgba(200,16,46,.3));z-index:10;pointer-events:none;animation:float-img 5s ease-in-out infinite}\n@keyframes float-img{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-12px)}}\n\n.freq-bars{position:absolute;bottom:-80px;left:50%;transform:translateX(-50%);display:flex;align-items:flex-end;gap:4px;height:44px}\n.freq-bar{width:3px;border-radius:3px;background:linear-gradient(to top,var(--red3),rgba(200,16,46,.3));opacity:.55}\n\n.audio-h{font-family:'Bebas Neue',sans-serif;font-size:clamp(54px,6.5vw,96px);line-height:.88;margin-bottom:36px}\n.audio-h em{font-style:normal;display:block;color:var(--red3);text-shadow:0 0 50px rgba(232,25,47,.25)}\n.audio-h .outline{display:block;color:transparent;-webkit-text-stroke:1px rgba(200,16,46,.45)}\n\n.feat-list{list-style:none;margin:36px 0}\n.feat-item{display:flex;align-items:flex-start;gap:20px;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.04);cursor:default;transition:padding-left .2s}\n.feat-item:last-child{border-bottom:none}\n.feat-item:hover{padding-left:6px}\n.feat-n{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:700;letter-spacing:2px;color:var(--red3);min-width:26px;margin-top:2px}\n.feat-body strong{display:block;color:var(--t1);font-size:12.5px;font-weight:500;letter-spacing:1.5px;margin-bottom:5px;text-transform:uppercase}\n.feat-body{font-size:13px;color:var(--t2);line-height:1.75}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 03 \u2014 GAMING \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#gaming{padding:180px 60px;background:var(--bg)}\n.gaming-wrap{max-width:1240px;margin:0 auto}\n.gaming-hed{margin-bottom:90px}\n.gaming-hed h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(82px,13vw,172px);line-height:.84}\n.gaming-hed h2 .ghost{display:block;color:transparent;-webkit-text-stroke:1px rgba(200,16,46,.38)}\n.gaming-hed h2 .fill2{display:block;color:var(--red3);text-shadow:0 0 80px rgba(232,25,47,.2)}\n.gaming-lead{font-size:15px;color:var(--t2);max-width:520px;line-height:1.8;margin-top:20px}\n\n.game-grid{display:grid;grid-template-columns:1.45fr 1fr;grid-template-rows:1fr 1fr;gap:14px}\n.game-card{background:var(--bg2);overflow:hidden;clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%);position:relative;aspect-ratio:4\/3;display:flex;align-items:flex-end;padding:32px;cursor:pointer;transition:transform .4s var(--ease-out-expo)}\n.game-card:hover{transform:scale(1.015)}\n.game-card.tall{grid-row:1\/3;aspect-ratio:auto}\n.game-card-bg{position:absolute;inset:0;transition:transform .8s var(--ease-out-expo)}\n.game-card:hover .game-card-bg{transform:scale(1.06)}\n.gc1 .game-card-bg{background:linear-gradient(155deg,rgba(200,16,46,.16),#090212 55%)}\n.gc2 .game-card-bg{background:linear-gradient(135deg,rgba(160,10,30,.12),#07030f 60%)}\n.gc3 .game-card-bg{background:linear-gradient(135deg,rgba(120,10,25,.1),#06020e 60%)}\n\/* Real image overlay in game cards *\/\n.gc1 .game-card-img,.gc2 .game-card-img,.gc3 .game-card-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;filter:saturate(1.5) contrast(1.2);transition:opacity .5s}\n.game-card:hover .game-card-img{opacity:.4}\n.game-card::before{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.8) 0%,transparent 55%);z-index:1}\n.game-card::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 4px,rgba(0,0,0,.03) 4px,rgba(0,0,0,.03) 5px);pointer-events:none;z-index:2}\n\/* Top highlight on hover *\/\n.game-card .top-bar{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--red),transparent);transform:scaleX(0);transition:transform .4s;z-index:3}\n.game-card:hover .top-bar{transform:scaleX(1)}\n.game-card-info{position:relative;z-index:4}\n.gc-tag{font-family:'Space Grotesk',sans-serif;font-size:9px;letter-spacing:3px;color:var(--red3);text-transform:uppercase;margin-bottom:7px}\n.gc-name{font-family:'Bebas Neue',sans-serif;font-size:26px;letter-spacing:1.5px}\n.gc-cta{font-family:'Space Grotesk',sans-serif;font-size:9px;letter-spacing:2px;color:var(--t3);text-transform:uppercase;margin-top:8px;display:flex;align-items:center;gap:6px;transition:color .2s}\n.game-card:hover .gc-cta{color:var(--red3)}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 04 \u2014 POWER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#power{padding:180px 60px;background:radial-gradient(ellipse 65% 55% at 50% 100%,rgba(200,16,46,.065),transparent 58%),var(--bg2)}\n.power-wrap{max-width:1240px;margin:0 auto;text-align:center}\n.power-h{font-family:'Bebas Neue',sans-serif;font-size:clamp(80px,12vw,165px);line-height:.87;margin-bottom:24px}\n.power-h span{color:var(--red3);text-shadow:0 0 80px rgba(232,25,47,.2)}\n.power-sub{font-size:14.5px;color:var(--t2);max-width:480px;margin:0 auto 90px;line-height:1.8}\n.pow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}\n.pow-card{background:var(--bg3);padding:56px 36px;position:relative;overflow:hidden;transition:background .35s,transform .35s;cursor:default;text-align:left}\n.pow-card:hover{background:#17101e;transform:translateY(-6px)}\n.pow-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--red),transparent);transform:scaleX(0);transform-origin:center;transition:transform .45s}\n.pow-card:hover::before{transform:scaleX(1)}\n.pow-card::after{content:'';position:absolute;bottom:0;left:0;right:0;top:0;background:radial-gradient(ellipse 80% 70% at 50% 110%,rgba(200,16,46,.07),transparent);opacity:0;transition:opacity .35s}\n.pow-card:hover::after{opacity:1}\n\/* Product image in power card *\/\n.pow-prod-img{width:100%;aspect-ratio:16\/9;object-fit:contain;margin-bottom:32px;filter:drop-shadow(0 8px 24px rgba(200,16,46,.2));transition:transform .4s var(--ease-out-expo);position:relative;z-index:1}\n.pow-card:hover .pow-prod-img{transform:scale(1.04) translateY(-4px)}\n.pow-hex{width:56px;height:56px;clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);background:rgba(200,16,46,.1);display:flex;align-items:center;justify-content:center;margin-bottom:28px;transition:background .3s,box-shadow .3s;position:relative;z-index:1}\n.pow-card:hover .pow-hex{background:rgba(200,16,46,.2);box-shadow:0 0 20px rgba(200,16,46,.25)}\n.pow-hex svg{color:var(--red3);width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.5}\n.pow-title{font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:2.5px;margin-bottom:14px;position:relative;z-index:1}\n.pow-text{font-size:13px;color:var(--t2);line-height:1.75;position:relative;z-index:1}\n.pow-spec{margin-top:20px;display:flex;gap:16px;position:relative;z-index:1}\n.pow-spec-item{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:2px;color:var(--red3);text-transform:uppercase;padding:5px 12px;border:1px solid rgba(200,16,46,.2);background:rgba(200,16,46,.05)}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 05 \u2014 ENGINEERING \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#engineering{padding:180px 60px;background:var(--bg)}\n.eng-wrap{max-width:1240px;margin:0 auto}\n.eng-top{text-align:center;margin-bottom:110px}\n.eng-h{font-family:'Bebas Neue',sans-serif;font-size:clamp(72px,11vw,152px);line-height:.86}\n.eng-h em{font-style:normal;color:var(--red3);text-shadow:0 0 60px rgba(232,25,47,.2)}\n.eng-sub{font-size:14px;color:var(--t2);max-width:480px;margin:24px auto 0;line-height:1.8}\n.eng-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}\n.eng-card{padding:44px 28px;border:1px solid rgba(255,255,255,.04);position:relative;overflow:hidden;transition:border-color .3s,transform .35s var(--ease-out-expo)}\n.eng-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--red);transform:scaleX(0);transition:transform .4s var(--ease-out-expo)}\n.eng-card:hover::after{transform:scaleX(1)}\n.eng-card::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 110%,rgba(200,16,46,.07),transparent);opacity:0;transition:opacity .35s}\n.eng-card:hover::before{opacity:1}\n.eng-card:hover{border-color:rgba(200,16,46,.18);transform:translateY(-8px)}\n.eng-svg{margin-bottom:28px;opacity:.5;transition:opacity .3s,transform .35s}\n.eng-card:hover .eng-svg{opacity:1;transform:scale(1.05)}\n.eng-n{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:700;letter-spacing:3px;color:var(--red3);margin-bottom:12px;text-transform:uppercase}\n.eng-title{font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:2px;margin-bottom:14px}\n.eng-text{font-size:12.5px;color:var(--t2);line-height:1.8}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 06 \u2014 COMMUNITY \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#resistance{padding:180px 60px;background:var(--bg2)}\n.res-wrap{max-width:1240px;margin:0 auto}\n.res-top{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:64px;gap:40px}\n.res-h{font-family:'Bebas Neue',sans-serif;font-size:clamp(58px,9vw,125px);line-height:.87}\n.res-h em{font-style:normal;color:var(--red3);text-shadow:0 0 60px rgba(232,25,47,.2)}\n.res-desc{max-width:280px;text-align:right}\n.res-desc p{font-size:14px;color:var(--t2);line-height:1.8;margin-bottom:16px}\n.res-count{font-family:'Bebas Neue',sans-serif;font-size:44px;color:var(--red3);line-height:1}\n.res-count-label{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:3px;color:var(--t3);text-transform:uppercase}\n.res-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}\n.res-cell{aspect-ratio:3\/4;overflow:hidden;position:relative;background:var(--bg3);transition:transform .45s var(--ease-out-expo),filter .3s;cursor:pointer}\n.res-cell:hover{transform:scale(1.05);z-index:1;filter:brightness(1.1)}\n.res-cell:nth-child(2n){margin-top:24px}\n.res-cell-inner{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px}\n.res-icon{font-size:36px;opacity:.12;transition:opacity .3s}\n.res-cell:hover .res-icon{opacity:.2}\n.res-cell-label{font-family:'Bebas Neue',sans-serif;font-size:12px;letter-spacing:4px;color:rgba(200,16,46,.3);transition:color .3s}\n.res-cell:hover .res-cell-label{color:rgba(200,16,46,.6)}\n.res-cell::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,.03) 3px,rgba(0,0,0,.03) 4px);pointer-events:none}\n.res-cell:nth-child(1){background:linear-gradient(145deg,#18080a,#090310)}\n.res-cell:nth-child(2){background:linear-gradient(145deg,#0f0814,#070410)}\n.res-cell:nth-child(3){background:linear-gradient(145deg,#160810,#09030a)}\n.res-cell:nth-child(4){background:linear-gradient(145deg,#0e0914,#06040e)}\n.res-cell:nth-child(5){background:linear-gradient(145deg,#170910,#0a030a)}\n\/* Bottom overlay *\/\n.res-cell-overlay{position:absolute;bottom:0;left:0;right:0;padding:12px;background:linear-gradient(to top,rgba(0,0,0,.6),transparent);opacity:0;transition:opacity .3s}\n.res-cell:hover .res-cell-overlay{opacity:1}\n.res-cell-tag{font-family:'Space Grotesk',sans-serif;font-size:8px;font-weight:600;letter-spacing:2.5px;color:var(--red3);text-transform:uppercase}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 07 \u2014 PRESS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#press{padding:100px 60px;background:#020109;border-top:1px solid rgba(255,255,255,.025)}\n.press-wrap{max-width:1240px;margin:0 auto;text-align:center}\n.press-eyebrow{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:4px;color:var(--t3);text-transform:uppercase;margin-bottom:56px}\n.press-logos{display:flex;align-items:center;justify-content:center;gap:72px;flex-wrap:wrap}\n.press-logo{font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:5px;color:rgba(255,255,255,.1);transition:color .35s,text-shadow .35s,transform .25s;cursor:default}\n.press-logo:hover{color:rgba(200,16,46,.65);text-shadow:0 0 20px rgba(200,16,46,.25);transform:translateY(-2px)}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 CHAPTER 08 \u2014 STORE \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#store{padding:180px 60px;background:var(--bg)}\n.store-wrap{max-width:1240px;margin:0 auto}\n.store-hed{text-align:center;margin-bottom:56px}\n.store-hed h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(62px,9vw,112px);line-height:.88;margin-bottom:16px}\n.store-hed h2 em{font-style:normal;color:var(--red3);text-shadow:0 0 60px rgba(232,25,47,.2)}\n.store-hed p{font-size:14px;color:var(--t2)}\n.store-tabs{display:flex;justify-content:center;gap:2px;margin-bottom:64px}\n.tab{\n  font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:3px;text-transform:uppercase;\n  background:transparent;border:1px solid rgba(255,255,255,.07);color:var(--t2);padding:12px 36px;\n  cursor:pointer;transition:all .25s;\n}\n.tab.active,.tab:hover{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 0 20px rgba(200,16,46,.35),0 4px 16px rgba(200,16,46,.2)}\n.prod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}\n.prod-card{background:var(--bg2);overflow:hidden;position:relative;transition:transform .35s var(--ease-out-expo)}\n.prod-card:hover{transform:translateY(-7px)}\n.prod-img{aspect-ratio:4\/3;position:relative;overflow:hidden;background:linear-gradient(145deg,var(--bg3),var(--bg2));display:flex;align-items:center;justify-content:center}\n.prod-img::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,var(--bg2) 0%,transparent 50%)}\n.prod-img img{width:85%;height:85%;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 8px 32px rgba(200,16,46,.2));transition:transform .45s var(--ease-out-expo),filter .35s}\n.prod-card:hover .prod-img img{transform:scale(1.07) translateY(-6px);filter:drop-shadow(0 16px 48px rgba(200,16,46,.35))}\n\/* fallback icon if no img *\/\n.prod-icon{font-family:'Bebas Neue',sans-serif;font-size:88px;color:rgba(200,16,46,.1);letter-spacing:-2px;position:relative;z-index:1;transition:transform .4s,color .3s}\n.prod-card:hover .prod-icon{transform:scale(1.1);color:rgba(200,16,46,.18)}\n.prod-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--red),transparent);transform:scaleX(0);transition:transform .35s;z-index:2}\n.prod-card:hover::before{transform:scaleX(1)}\n\/* Badge *\/\n.prod-badge{position:absolute;top:16px;right:16px;z-index:3;background:var(--red);color:#fff;font-family:'Space Grotesk',sans-serif;font-size:8px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:4px 10px;clip-path:polygon(6px 0%,100% 0%,calc(100% - 6px) 100%,0% 100%)}\n.prod-info{padding:24px 28px 28px}\n.prod-cat{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:3px;color:var(--red3);text-transform:uppercase;margin-bottom:7px}\n.prod-name{font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:1.5px;margin-bottom:16px}\n.prod-foot{display:flex;align-items:center;justify-content:space-between}\n.prod-price{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:700;color:var(--red3)}\n.prod-price small{font-size:11px;font-weight:400;color:var(--t3);margin-left:3px}\n.buy-btn{background:transparent;border:1px solid rgba(200,16,46,.4);color:var(--red3);padding:9px 22px;font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:2px;text-transform:uppercase;cursor:pointer;clip-path:polygon(7px 0%,100% 0%,calc(100% - 7px) 100%,0% 100%);transition:all .22s}\n.buy-btn:hover{background:var(--red);color:#fff;border-color:var(--red);box-shadow:0 0 16px rgba(200,16,46,.35)}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 TESTIMONIALS \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n#testimonials{padding:120px 60px;background:var(--bg2);border-top:1px solid rgba(200,16,46,.07)}\n.test-wrap{max-width:1240px;margin:0 auto}\n.test-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:60px}\n.test-card{background:var(--bg3);padding:40px 32px;position:relative;overflow:hidden;transition:transform .35s var(--ease-out-expo)}\n.test-card:hover{transform:translateY(-5px);background:#14101c}\n.test-quote{font-size:14px;line-height:1.85;color:var(--t2);margin-bottom:28px;font-style:italic;position:relative;z-index:1}\n.test-quote::before{content:'\"';font-family:'Bebas Neue',sans-serif;font-size:72px;color:rgba(200,16,46,.12);position:absolute;top:-16px;left:-8px;line-height:1;z-index:-1}\n.test-author{display:flex;align-items:center;gap:14px}\n.test-avatar{width:44px;height:44px;border-radius:50%;border:2px solid rgba(200,16,46,.3);display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:18px;color:var(--red3);background:rgba(200,16,46,.08)}\n.test-name{font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;color:var(--t1)}\n.test-role{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:500;letter-spacing:2px;color:var(--t3);text-transform:uppercase;margin-top:2px}\n.stars{color:var(--red3);font-size:11px;margin-bottom:16px}\n\n\/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 FOOTER \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\nfooter{padding:120px 60px 60px;background:#020109;border-top:1px solid rgba(200,16,46,.1)}\n.foot-wrap{max-width:1240px;margin:0 auto}\n.foot-h{font-family:'Bebas Neue',sans-serif;font-size:clamp(64px,10.5vw,140px);line-height:.86;margin-bottom:72px}\n.foot-h span{color:transparent;-webkit-text-stroke:1px rgba(200,16,46,.45)}\n.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:72px;margin-bottom:64px}\n.foot-nl label{display:block;font-size:9px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--t3);margin-bottom:16px}\n.foot-nl p{font-size:13px;color:var(--t2);line-height:1.75;margin-bottom:20px}\n.foot-inp-wrap{display:flex;border:1px solid rgba(255,255,255,.07)}\n.foot-inp{background:transparent;border:none;outline:none;padding:13px 18px;color:#fff;font-family:'Inter',sans-serif;font-size:13px;flex:1}\n.foot-inp::placeholder{color:rgba(255,255,255,.18)}\n.foot-sub{background:var(--red);border:none;padding:13px 22px;color:#fff;font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;cursor:pointer;transition:background .2s,box-shadow .2s}\n.foot-sub:hover{background:var(--red3);box-shadow:0 0 18px rgba(232,25,47,.4)}\n.foot-col-title{font-family:'Space Grotesk',sans-serif;font-size:9px;font-weight:700;letter-spacing:3.5px;text-transform:uppercase;color:var(--t3);margin-bottom:22px}\n.foot-links{list-style:none}\n.foot-links li{margin-bottom:13px}\n.foot-links a{font-size:13.5px;color:var(--t2);text-decoration:none;transition:color .2s,padding-left .2s;display:block}\n.foot-links a:hover{color:var(--red3);padding-left:5px}\n.social-row{display:flex;gap:12px;margin-top:24px}\n.social-btn{width:36px;height:36px;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:var(--t2);font-size:13px;text-decoration:none;transition:all .2s;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:10px;letter-spacing:1px}\n.social-btn:hover{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 0 12px rgba(200,16,46,.3)}\n.foot-btm{display:flex;justify-content:space-between;align-items:center;padding-top:30px;border-top:1px solid rgba(255,255,255,.04);flex-wrap:wrap;gap:12px}\n.foot-copy{font-family:'Space Grotesk',sans-serif;font-size:10px;color:var(--t3)}\n.foot-logo-btm{font-family:'Bebas Neue',sans-serif;font-size:18px;letter-spacing:6px;color:rgba(255,255,255,.1)}\n.foot-logo-btm span{color:rgba(200,16,46,.35)}\n\n\/* \u2500\u2500 TOAST NOTIFICATION \u2500\u2500 *\/\n.toast{\n  position:fixed;bottom:40px;right:40px;z-index:9000;\n  background:rgba(200,16,46,.95);color:#fff;\n  padding:14px 24px;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:500;letter-spacing:1.5px;\n  clip-path:polygon(8px 0%,100% 0%,calc(100% - 8px) 100%,0% 100%);\n  backdrop-filter:blur(16px);\n  transform:translateX(120%);transition:transform .4s var(--ease-out-expo);\n}\n.toast.show{transform:translateX(0)}\n\n\/* \u2500\u2500 MODAL VIDEO \u2500\u2500 *\/\n.vid-modal{position:fixed;inset:0;z-index:8000;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .35s;backdrop-filter:blur(8px)}\n.vid-modal.open{opacity:1;pointer-events:all}\n.vid-modal-inner{width:min(800px,90vw);aspect-ratio:16\/9;background:#000;position:relative;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px))}\n.vid-close{position:absolute;top:-44px;right:0;font-family:'Space Grotesk',sans-serif;font-size:11px;font-weight:600;letter-spacing:3px;color:var(--t2);background:none;border:none;cursor:pointer;text-transform:uppercase;transition:color .2s}\n.vid-close:hover{color:var(--red3)}\n.vid-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;background:linear-gradient(145deg,#180612,#050210)}\n.vid-placeholder p{font-family:'Space Grotesk',sans-serif;font-size:11px;letter-spacing:3px;color:var(--t3);text-transform:uppercase}\n\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\n@media(max-width:900px){\n  nav{padding:22px 28px}\n  nav.scrolled{padding:14px 28px}\n  .nav-links{gap:24px}\n  #origin,#audio,#gaming,#power,#engineering,#resistance,#store,#testimonials,footer{padding:100px 28px}\n  .origin-wrap,.audio-wrap{grid-template-columns:1fr;gap:60px}\n  .game-grid{grid-template-columns:1fr;grid-template-rows:auto}\n  .game-card.tall{grid-row:auto}\n  .pow-grid,.eng-grid,.test-grid,.prod-grid{grid-template-columns:1fr}\n  .res-grid{grid-template-columns:repeat(2,1fr)}\n  .foot-grid{grid-template-columns:1fr 1fr;gap:40px}\n  .res-top{flex-direction:column;align-items:flex-start}\n  .res-desc{text-align:left}\n  .red-bar{gap:40px;flex-wrap:wrap;padding:18px 28px}\n  .store-tabs{flex-wrap:wrap}\n}\n\n<\/style>\n\n<script data-wp-block-html=\"js\">\n\/\/ \u2550\u2550\u2550 CURSOR (RAF-based, no CSS transition on dot) \u2550\u2550\u2550\nconst cur=document.getElementById('cur'),curR=document.getElementById('cur-r');\nlet mx=window.innerWidth\/2,my=window.innerHeight\/2,rx=mx,ry=my;\ndocument.addEventListener('mousemove',e=>{mx=e.clientX;my=e.clientY});\n(function animCursor(){\n  rx+=(mx-rx)*.12;ry+=(my-ry)*.12;\n  cur.style.left=mx+'px';cur.style.top=my+'px';\n  curR.style.left=rx+'px';curR.style.top=ry+'px';\n  requestAnimationFrame(animCursor);\n})();\n\n\/\/ \u2550\u2550\u2550 SCROLL \u2550\u2550\u2550\nconst nav=document.getElementById('nav'),prog=document.getElementById('prog');\nwindow.addEventListener('scroll',()=>{\n  const s=window.scrollY,maxS=document.body.scrollHeight-window.innerHeight;\n  nav.classList.toggle('scrolled',s>60);\n  prog.style.width=(s\/maxS*100)+'%';\n},{ passive:true });\n\n\/\/ \u2550\u2550\u2550 INTERSECTION FADE-UP \u2550\u2550\u2550\nconst observer=new IntersectionObserver(entries=>{\n  entries.forEach(e=>{if(e.isIntersecting){e.target.classList.add('vis')}});\n},{threshold:.08,rootMargin:'0px 0px -40px 0px'});\ndocument.querySelectorAll('.fu').forEach(el=>observer.observe(el));\n\n\/\/ \u2550\u2550\u2550 HERO PARALLAX \u2550\u2550\u2550\nwindow.addEventListener('scroll',()=>{\n  const s=window.scrollY,h=window.innerHeight;\n  if(s<h*1.5){\n    const hc=document.querySelector('.hero-content');\n    const hg=document.querySelector('.hero-grid');\n    if(hc)hc.style.transform=`translateY(${s*.07}px)`;\n    if(hg)hg.style.transform=`translateY(${s*.14}px)`;\n  }\n},{passive:true});\n\n\/\/ \u2550\u2550\u2550 PARTICLES \u2550\u2550\u2550\n(function createParticles(){\n  const container=document.getElementById('particles-hero');\n  const count=18;\n  for(let i=0;i<count;i++){\n    const p=document.createElement('div');\n    const size=Math.random()*3+1;\n    const x=Math.random()*100;\n    const y=Math.random()*100;\n    const dur=(Math.random()*6+6).toFixed(1);\n    const delay=(Math.random()*4).toFixed(1);\n    const ty=-(Math.random()*60+20);\n    const tx=(Math.random()*40-20);\n    const op=(Math.random()*0.3+0.1).toFixed(2);\n    p.className='particle';\n    p.style.cssText=`\n      width:${size}px;height:${size}px;\n      left:${x}%;top:${y}%;\n      background:rgba(200,16,46,${op});\n      box-shadow:0 0 ${size*3}px rgba(200,16,46,${op});\n      --dur:${dur}s;--delay:-${delay}s;\n      --ty:${ty}px;--tx:${tx}px;--op:${op};\n      animation-delay:-${delay}s;\n    `;\n    container.appendChild(p);\n  }\n})();\n\n\/\/ \u2550\u2550\u2550 TICKER \u2550\u2550\u2550\n(function buildTicker(){\n  const items=[\n    'Zinc Alloy Shell','Mecha Design','Battle-Worn Texture','Custom Drivers',\n    'Limited Edition','Sci-Fi Aesthetic','CNC Precision','Made for Collectors',\n    'GravaStar Vietnam','Official Distributor'\n  ];\n  const track=document.getElementById('tickerTrack');\n  \/\/ duplicate for seamless loop\n  [0,1].forEach(()=>{\n    items.forEach(txt=>{\n      const el=document.createElement('span');\n      el.className='ticker-item';\n      el.innerHTML=txt+'<span class=\"dot\"><\/span>';\n      track.appendChild(el);\n    });\n  });\n})();\n\n\/\/ \u2550\u2550\u2550 COUNTER ANIMATION \u2550\u2550\u2550\nfunction animateCount(el,target,suffix=''){\n  let start=0;const dur=1800;const startTime=performance.now();\n  function step(now){\n    const progress=Math.min((now-startTime)\/dur,1);\n    const ease=1-Math.pow(1-progress,3);\n    el.textContent=Math.round(ease*target);\n    if(progress<1)requestAnimationFrame(step);\n  }\n  requestAnimationFrame(step);\n}\nconst statObs=new IntersectionObserver(entries=>{\n  entries.forEach(e=>{\n    if(e.isIntersecting){\n      const target=parseInt(e.target.dataset.count);\n      animateCount(e.target,target);\n      statObs.unobserve(e.target);\n    }\n  });\n},{threshold:.5});\ndocument.querySelectorAll('.stat-num[data-count]').forEach(el=>statObs.observe(el));\n\n\/\/ \u2550\u2550\u2550 FREQ BARS \u2550\u2550\u2550\n(function buildFreqBars(){\n  const fb=document.getElementById('freqBars');\n  const heights=[8,14,22,32,20,28,16,24,12,18,26,10,20,8,18,30,14];\n  heights.forEach(h=>{\n    const b=document.createElement('div');\n    b.className='freq-bar';\n    const dur=(.4+Math.random()*.65).toFixed(2);\n    const delay=(Math.random()*.3).toFixed(2);\n    b.style.cssText=`height:${h}px;animation:bar-anim ${dur}s ease-in-out -${delay}s infinite alternate`;\n    fb.appendChild(b);\n  });\n  const sty=document.createElement('style');\n  sty.textContent='@keyframes bar-anim{from{transform:scaleY(.25);opacity:.25}to{transform:scaleY(1);opacity:.75}}';\n  document.head.appendChild(sty);\n})();\n\n\/\/ \u2550\u2550\u2550 VIDEO MODAL \u2550\u2550\u2550\ndocument.getElementById('openVideo').addEventListener('click',()=>{\n  document.getElementById('vidModal').classList.add('open');\n  document.body.style.overflow='hidden';\n});\ndocument.getElementById('closeModal').addEventListener('click',()=>{\n  document.getElementById('vidModal').classList.remove('open');\n  document.body.style.overflow='';\n});\ndocument.getElementById('vidModal').addEventListener('click',e=>{\n  if(e.target===document.getElementById('vidModal')){\n    document.getElementById('vidModal').classList.remove('open');\n    document.body.style.overflow='';\n  }\n});\ndocument.addEventListener('keydown',e=>{\n  if(e.key==='Escape'){\n    document.getElementById('vidModal').classList.remove('open');\n    document.body.style.overflow='';\n  }\n});\n\n\/\/ \u2550\u2550\u2550 TOAST \u2550\u2550\u2550\nfunction showToast(msg,dur=3000){\n  const t=document.getElementById('toast');\n  t.textContent=msg;t.classList.add('show');\n  setTimeout(()=>t.classList.remove('show'),dur);\n}\n\n\/\/ \u2550\u2550\u2550 SUBSCRIBE \u2550\u2550\u2550\nfunction handleSubscribe(){\n  const email=document.getElementById('email').value.trim();\n  if(!email||!email.includes('@'))return showToast('\u26a0  Vui l\u00f2ng nh\u1eadp email h\u1ee3p l\u1ec7');\n  showToast('\u2713  C\u1ea3m \u01a1n! B\u1ea1n \u0111\u00e3 \u0111\u0103ng k\u00fd th\u00e0nh c\u00f4ng.');\n  document.getElementById('email').value='';\n}\ndocument.getElementById('email').addEventListener('keydown',e=>{if(e.key==='Enter')handleSubscribe()});\n\n\/\/ \u2550\u2550\u2550 PRODUCTS \u2550\u2550\u2550\nconst prods={\n  audio:[\n    {name:'MARS PRO 2',cat:'Bluetooth Speaker',price:'1.890.000',img:'img_mars_pro.png',badge:'Best Seller',desc:'Zinc alloy \u00b7 360\u00b0 Sound \u00b7 12h battery'},\n    {name:'SIRIUS X1',cat:'TWS Earbuds',price:'1.290.000',img:null,icon:'\u25c9',badge:null,desc:'ANC \u00b7 30h total \u00b7 IPX5'},\n    {name:'MARS P5',cat:'Portable Speaker',price:'2.390.000',img:null,icon:'\u25c6',badge:'New',desc:'RGB \u00b7 IPX7 \u00b7 360\u00b0 surround'},\n  ],\n  gaming:[\n    {name:'MERCURY M1 PRO',cat:'Mechanical Keyboard',price:'3.490.000',img:'img_keyboard.png',badge:'Trending',desc:'Custom switches \u00b7 Hot-swap \u00b7 RGB'},\n    {name:'WAR MACE M5',cat:'Gaming Mouse',price:'1.590.000',img:null,icon:'\u25ce',badge:null,desc:'26000 DPI \u00b7 Zinc alloy \u00b7 60g'},\n    {name:'MECH REST PRO',cat:'Wrist Rest',price:'890.000',img:null,icon:'\u25ac',badge:null,desc:'Memory foam \u00b7 PU leather \u00b7 Zinc frame'},\n  ],\n  power:[\n    {name:'GAN 100W',cat:'Fast Charger',price:'990.000',img:null,icon:'\u2b21',badge:'New',desc:'GaN \u00b7 Multi-port \u00b7 Foldable prongs'},\n    {name:'ORBIT MAG',cat:'Magnetic Charger',price:'690.000',img:null,icon:'\u25d0',badge:null,desc:'MagSafe \u00b7 15W \u00b7 Orbital design'},\n    {name:'ARMOR BANK 20K',cat:'Power Bank',price:'1.490.000',img:'img_power.png',badge:null,desc:'20000mAh \u00b7 65W PD \u00b7 Zinc alloy'},\n  ]\n};\n\nfunction filterProd(cat,btn){\n  document.querySelectorAll('.tab').forEach(b=>b.classList.remove('active'));\n  btn.classList.add('active');\n  const g=document.getElementById('prodGrid');\n  g.style.opacity='0';g.style.transform='translateY(20px)';g.style.transition='none';\n  setTimeout(()=>{\n    g.innerHTML='';\n    prods[cat].forEach((p,i)=>{\n      const c=document.createElement('div');\n      c.className='prod-card hoverable';\n      const imgEl=p.img\n        ?`<img decoding=\"async\" src=\"${p.img}\" alt=\"${p.name}\" style=\"width:80%;height:80%;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 8px 28px rgba(200,16,46,.22));transition:transform .45s cubic-bezier(.16,1,.3,1),filter .35s\">`\n        :`<div class=\"prod-icon\">${p.icon}<\/div>`;\n      const badgeEl=p.badge?`<div class=\"prod-badge\">${p.badge}<\/div>`:'';\n      c.innerHTML=`\n        <div class=\"prod-img\">${badgeEl}${imgEl}<\/div>\n        <div class=\"prod-info\">\n          <div class=\"prod-cat\">${p.cat}<\/div>\n          <div class=\"prod-name\">${p.name}<\/div>\n          <div style=\"font-size:11px;color:var(--t3);margin-bottom:16px;letter-spacing:.5px\">${p.desc}<\/div>\n          <div class=\"prod-foot\">\n            <div class=\"prod-price\">${p.price}<small>VND<\/small><\/div>\n            <button class=\"buy-btn hoverable\" onclick=\"showToast('\u2713 \u0110\u00e3 th\u00eam ${p.name} v\u00e0o gi\u1ecf h\u00e0ng')\">Mua Ngay<\/button>\n          <\/div>\n        <\/div>`;\n      c.style.transitionDelay=(i*.07)+'s';\n      g.appendChild(c);\n    });\n    requestAnimationFrame(()=>{\n      g.style.transition='opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1)';\n      g.style.opacity='1';g.style.transform='none';\n    });\n    \/\/ hover effects on product images\n    g.querySelectorAll('.prod-img img').forEach(img=>{\n      img.addEventListener('mouseenter',()=>{img.style.transform='scale(1.08) translateY(-6px)';img.style.filter='drop-shadow(0 16px 48px rgba(200,16,46,.38))'});\n      img.addEventListener('mouseleave',()=>{img.style.transform='';img.style.filter=''});\n    });\n  },240);\n}\n\nfilterProd('audio',document.querySelector('.tab.active'));\n\n\/\/ \u2550\u2550\u2550 SMOOTH HOVER cursor targeting \u2550\u2550\u2550\n\/\/ Re-attach on dynamic content changes\nconst mutObs=new MutationObserver(()=>{\/* cursor handled via CSS :has() *\/});\nmutObs.observe(document.getElementById('prodGrid'),{childList:true});\n\n<\/script>\n\n<!DOCTYPE html>\n<html lang=\"vi\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>GravaStar Vietnam \u2014 The Mechanical Future<\/title>\n<meta name=\"description\" content=\"GravaStar Vietnam \u2014 Nh\u00e0 ph\u00e2n ph\u1ed1i ch\u00ednh th\u1ee9c. C\u00f4ng ngh\u1ec7 mang h\u01a1i th\u1edf t\u1eeb t\u01b0\u01a1ng lai: loa c\u01a1 h\u1ecdc, b\u00e0n ph\u00edm gaming, v\u00e0 thi\u1ebft b\u1ecb s\u1ea1c mecha design.\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Bebas+Neue&#038;family=Inter:ital,wght@0,300;0,400;0,500;1,300&#038;family=Space+Grotesk:wght@300;400;500;600;700&#038;display=swap\" rel=\"stylesheet\">\n<link rel=\"stylesheet\" href=\"style.css\">\n<\/head>\n<body>\n\n<!-- CUSTOM CURSOR -->\n<div id=\"cur\"><\/div>\n<div id=\"cur-r\"><\/div>\n<div id=\"prog\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 NAV \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<nav id=\"nav\">\n  <a href=\"#\" class=\"logo\">GRAVA<span class=\"logo-star\">\u2605<\/span>STAR<\/a>\n  <ul class=\"nav-links\">\n    <li><a href=\"#audio\">Audio<\/a><\/li>\n    <li><a href=\"#gaming\">Gaming<\/a><\/li>\n    <li><a href=\"#power\">Power<\/a><\/li>\n    <li><a href=\"#origin\">Story<\/a><\/li>\n    <li><a href=\"#store\" class=\"nav-cta\">Shop Now<\/a><\/li>\n  <\/ul>\n<\/nav>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 HERO \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"hero\">\n  <div class=\"hero-bg\"><\/div>\n  <div class=\"hero-grid\"><\/div>\n  <div class=\"hero-scanlines\"><\/div>\n  <div class=\"hero-core\"><\/div>\n  <div class=\"hero-ring hr3\"><\/div>\n  <div class=\"hero-ring hr2\"><\/div>\n  <div class=\"hero-ring hr1\"><\/div>\n  <!-- Particles injected by JS -->\n  <div id=\"particles-hero\"><\/div>\n\n  <div class=\"hero-content\">\n    <div class=\"hero-eyebrow\">Nh\u00e0 Ph\u00e2n Ph\u1ed1i Ch\u00ednh Th\u1ee9c T\u1ea1i Vi\u1ec7t Nam \u00b7 Est. 2025<\/div>\n    <h1 class=\"hero-h\">\n      <span class=\"white\">THE<\/span>\n      <span class=\"ghost\">MECHANICAL<\/span>\n      <span class=\"fill\" data-text=\"FUTURE\">FUTURE<\/span>\n    <\/h1>\n    <p class=\"hero-tagline\">C\u00f4ng ngh\u1ec7 mang h\u01a1i th\u1edf t\u1eeb <em>t\u01b0\u01a1ng lai<\/em><\/p>\n    <div class=\"hero-rule\"><\/div>\n    <div class=\"hero-ctas\">\n      <a href=\"#origin\" class=\"hero-btn-primary hoverable\">\n        Kh\u00e1m Ph\u00e1 Th\u1ebf Gi\u1edbi\n        <svg class=\"arr\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\n      <\/a>\n      <a href=\"#store\" class=\"hero-btn-ghost hoverable\">\n        Shop Now\n      <\/a>\n    <\/div>\n  <\/div>\n  <div class=\"scroll-cue\">\n    <div class=\"scroll-txt\">Scroll<\/div>\n    <div class=\"scroll-line\"><\/div>\n  <\/div>\n<\/section>\n\n<!-- STAT BAR -->\n<div class=\"red-bar\">\n  <div class=\"stat-item\"><span class=\"stat-num\" data-count=\"50\">0<\/span><span style=\"font-family:'Bebas Neue',sans-serif;font-size:30px;color:#fff\">+<\/span><span class=\"stat-label\">Qu\u1ed1c Gia<\/span><\/div>\n  <div class=\"stat-item\"><span class=\"stat-num\" data-count=\"2\">0<\/span><span style=\"font-family:'Bebas Neue',sans-serif;font-size:30px;color:#fff\">M+<\/span><span class=\"stat-label\">\u0110\u01a1n V\u1ecb B\u00e1n Ra<\/span><\/div>\n  <div class=\"stat-item\"><span class=\"stat-num\" data-count=\"12\">0<\/span><span style=\"font-family:'Bebas Neue',sans-serif;font-size:30px;color:#fff\">+<\/span><span class=\"stat-label\">Gi\u1ea3i Th\u01b0\u1edfng<\/span><\/div>\n  <div class=\"stat-item\"><span class=\"stat-num\" data-count=\"2019\">0<\/span><span class=\"stat-label\">N\u0103m Th\u00e0nh L\u1eadp<\/span><\/div>\n<\/div>\n\n<!-- TICKER -->\n<div class=\"ticker-wrap\">\n  <div class=\"ticker-track\" id=\"tickerTrack\"><\/div>\n<\/div>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CHAPTER 01 \u2014 ORIGIN \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"origin\">\n  <div class=\"origin-wrap\">\n    <div>\n      <div class=\"chapter-tag fu\">Chapter 01 \u00b7 The Origin<\/div>\n      <h2 class=\"origin-h fu d1\">\n        NOT<br>JUST<br>\n        <em>TECH \u2014<\/em>\n        <span>ART.<\/span>\n      <\/h2>\n\n      <div class=\"story-block fu d2\">\n        <p class=\"body-text\">N\u0103m 2019, m\u1ed9t nh\u00f3m k\u1ef9 s\u01b0 v\u00e0 ngh\u1ec7 s\u0129 concept art t\u1ea1i Th\u00e2m Quy\u1ebfn \u0111\u1eb7t ra c\u00e2u h\u1ecfi m\u00e0 kh\u00f4ng ai d\u00e1m h\u1ecfi tr\u01b0\u1edbc \u0111\u00f3: <strong>N\u1ebfu thi\u1ebft b\u1ecb c\u00f4ng ngh\u1ec7 kh\u00f4ng c\u1ea7n che gi\u1ea5u b\u1ea3n th\u00e2n m\u00ecnh th\u00ec sao?<\/strong><\/p>\n      <\/div>\n\n      <div class=\"story-block fu d3\">\n        <p class=\"body-text\">L\u1ea5y c\u1ea3m h\u1ee9ng t\u1eeb anime mecha Nh\u1eadt B\u1ea3n, phim dystopia Hollywood v\u00e0 v\u0103n h\u00f3a modding PC underground \u2014 h\u1ecd t\u1ea1o ra GravaStar. Kh\u00f4ng ph\u1ea3i m\u1ed9t th\u01b0\u01a1ng hi\u1ec7u gadget th\u00f4ng th\u01b0\u1eddng. \u0110\u00e2y l\u00e0 m\u1ed9t <strong>tuy\u00ean ng\u00f4n th\u1ea9m m\u1ef9<\/strong>.<\/p>\n      <\/div>\n\n      <div class=\"quote-pull fu d4\">\n        <p class=\"quote-text\">Ch\u00fang t\u00f4i kh\u00f4ng thi\u1ebft k\u1ebf s\u1ea3n ph\u1ea9m. Ch\u00fang t\u00f4i thi\u1ebft k\u1ebf nh\u1eefng v\u1eadt th\u1ec3 m\u00e0 b\u1ea1n mu\u1ed1n \u0111\u1eb7t l\u00ean k\u1ec7 tr\u01b0ng b\u00e0y \u2014 nh\u01b0ng ch\u00fang c\u0169ng v\u00f4 t\u00ecnh l\u00e0 speaker t\u1ed1t nh\u1ea5t b\u1ea1n t\u1eebng nghe.<\/p>\n        <div class=\"quote-attr\">\u2014 GravaStar Design Manifesto, 2019<\/div>\n      <\/div>\n\n      <div class=\"story-block fu d5\">\n        <p class=\"body-text\">M\u1ed7i s\u1ea3n ph\u1ea9m b\u1eaft \u0111\u1ea7u l\u00e0 m\u1ed9t b\u1ea3n v\u1ebd concept art. <strong>V\u1ecf ngo\u00e0i zinc alloy<\/strong> \u0111\u01b0\u1ee3c CNC t\u1eebng milimet, t\u1eebng kh\u1edbp c\u01a1 h\u1ecdc \u0111\u01b0\u1ee3c c\u00e2n ch\u1ec9nh, t\u1eebng l\u1ed7 th\u00f4ng h\u01a1i mang l\u00fd do t\u1ed3n t\u1ea1i c\u1ee7a n\u00f3. K\u1ebft qu\u1ea3: th\u1ee9 g\u00ec \u0111\u00f3 kh\u00f4ng thu\u1ed9c v\u1ec1 th\u1eddi \u0111\u1ea1i n\u00e0y.<\/p>\n      <\/div>\n    <\/div>\n\n    <div class=\"fu d2\">\n      <div class=\"origin-media hoverable\" id=\"openVideo\" style=\"cursor:pointer\">\n        <img decoding=\"async\" src=\"img_mars_pro.png\" alt=\"GravaStar MARS PRO 2\" style=\"width:100%;height:100%;object-fit:cover;opacity:.75;filter:saturate(1.3) contrast(1.1);position:absolute;inset:0\" title=\"GRAVASTAR\">\n        <div style=\"position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.35),rgba(0,0,0,.7));z-index:1\"><\/div>\n        <div class=\"vid-inner\" style=\"background:transparent;position:relative;z-index:2\">\n          <div class=\"play-btn hoverable\">\n            <div class=\"play-arrow\"><\/div>\n          <\/div>\n          <div class=\"play-label\">Watch The Story<\/div>\n        <\/div>\n        <div class=\"hud-label\"><span class=\"hud-dot\"><\/span>GRAVASTAR ORIGIN FILM<\/div>\n        <div class=\"origin-frame\"><\/div>\n        <span class=\"tick tl\"><\/span><span class=\"tick tr\"><\/span>\n        <span class=\"tick bl\"><\/span><span class=\"tick br\"><\/span>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CHAPTER 02 \u2014 AUDIO \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"audio\">\n  <div class=\"audio-wrap\">\n    <div class=\"fu\" style=\"display:flex;justify-content:center\">\n      <div class=\"speaker-orb\">\n        <div class=\"orb-outer\">\n          <div class=\"orb-mid\">\n            <div class=\"orb-core\">\n              <div class=\"orb-name\">MARS<\/div>\n              <div class=\"orb-sub\">Pro 2.0<\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n        <img decoding=\"async\" src=\"img_mars_pro.png\" alt=\"MARS PRO 2\" class=\"orb-product-img\" title=\"GRAVASTAR\">\n        <div class=\"freq-bars\" id=\"freqBars\"><\/div>\n      <\/div>\n    <\/div>\n    <div>\n      <div class=\"chapter-tag fu\">Chapter 02 \u00b7 Audio<\/div>\n      <h2 class=\"audio-h fu d1\">\n        SOUND<br>\n        <span class=\"outline\">FROM THE<\/span>\n        <em>VOID<\/em>\n      <\/h2>\n      <div class=\"story-block fu d2\">\n        <p class=\"body-text\">MARS PRO 2 kh\u00f4ng ph\u1ea3i loa bluetooth. \u0110\u00e2y l\u00e0 <strong>m\u1ed9t t\u00e1c ph\u1ea9m \u0111i\u00eau kh\u1eafc c\u00f3 kh\u1ea3 n\u0103ng ph\u00e1t nh\u1ea1c<\/strong>. V\u1ecf zinc alloy \u0111\u1eb7c ch\u1eafc, texture battle-worn th\u1ee7 c\u00f4ng, c\u00e1c kh\u1edbp c\u01a1 h\u1ecdc m\u1edf ra nh\u01b0 mech \u0111ang tri\u1ec3n khai v\u0169 kh\u00ed.<\/p>\n      <\/div>\n      <ul class=\"feat-list\">\n        <li class=\"feat-item fu d2\">\n          <span class=\"feat-n\">01<\/span>\n          <div class=\"feat-body\">\n            <strong>Zinc Alloy Armor Shell<\/strong>\n            V\u1ecf kim lo\u1ea1i nguy\u00ean kh\u1ed1i, texture chi\u1ebfn tr\u01b0\u1eddng, kh\u00f4ng c\u00f3 m\u1ed9t m\u1ea3nh nh\u1ef1a n\u00e0o. N\u1eb7ng tay \u2014 theo ngh\u0129a \u0111en v\u00e0 ngh\u0129a b\u00f3ng.\n          <\/div>\n        <\/li>\n        <li class=\"feat-item fu d3\">\n          <span class=\"feat-n\">02<\/span>\n          <div class=\"feat-body\">\n            <strong>40mm Custom Drivers<\/strong>\n            Bass s\u00e2u \u0111\u1ee7 rung b\u00e0n, treble s\u1eafc \u0111\u1ee7 nghe t\u1eebng chi ti\u1ebft. Tuned b\u1edfi audio engineers, approved b\u1edfi audiophiles.\n          <\/div>\n        <\/li>\n        <li class=\"feat-item fu d4\">\n          <span class=\"feat-n\">03<\/span>\n          <div class=\"feat-body\">\n            <strong>Collectible Limited Edition<\/strong>\n            M\u1ed7i colorway ra \u0111\u1eddi v\u1edbi s\u1ed1 l\u01b0\u1ee3ng ki\u1ec3m so\u00e1t. Khi h\u1ebft l\u00e0 h\u1ebft. C\u00e1i n\u00e0y kh\u00f4ng restock \u2014 n\u00f3 \u0111\u01b0\u1ee3c framed.\n          <\/div>\n        <\/li>\n      <\/ul>\n      <a href=\"#store\" class=\"hero-btn-primary hoverable fu d5\" style=\"display:inline-flex;margin-top:8px;text-decoration:none\">\n        Xem Audio Collection <svg class=\"arr\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\n      <\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CHAPTER 03 \u2014 GAMING \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"gaming\">\n  <div class=\"gaming-wrap\">\n    <div class=\"gaming-hed\">\n      <div class=\"chapter-tag fu\">Chapter 03 \u00b7 Gaming<\/div>\n      <h2 class=\"fu d1\">\n        <span class=\"ghost\">BUILT FOR<\/span>\n        <span class=\"fill2\">BATTLE<\/span>\n      <\/h2>\n      <p class=\"gaming-lead fu d2\">Thi\u1ebft b\u1ecb gaming kh\u00f4ng c\u1ea7n tr\u00f4ng nh\u01b0 \u0111\u1ed3 ch\u01a1i. GravaStar \u0111\u01b0a m\u1ef9 h\u1ecdc chi\u1ebfn tr\u01b0\u1eddng l\u00ean m\u1eb7t b\u00e0n c\u1ee7a b\u1ea1n \u2014 keyboard, mouse, v\u00e0 wrist rest nh\u01b0 b\u1ed9 gi\u00e1p c\u1ee7a m\u1ed9t chi\u1ebfn binh.<\/p>\n    <\/div>\n    <div class=\"game-grid\">\n      <div class=\"game-card tall gc1 fu hoverable\">\n        <div class=\"top-bar\"><\/div>\n        <img decoding=\"async\" src=\"img_keyboard.png\" alt=\"Mercury M1 Pro\" class=\"game-card-img\" title=\"GRAVASTAR\">\n        <div class=\"game-card-bg\"><\/div>\n        <div class=\"game-card-info\">\n          <div class=\"gc-tag\">Mechanical Keyboard<\/div>\n          <div class=\"gc-name\">MERCURY M1<br>PRO<\/div>\n          <div class=\"gc-cta\">Kh\u00e1m ph\u00e1 <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><\/div>\n        <\/div>\n      <\/div>\n      <div class=\"game-card gc2 fu d1 hoverable\">\n        <div class=\"top-bar\"><\/div>\n        <div class=\"game-card-bg\"><\/div>\n        <div class=\"game-card-info\">\n          <div class=\"gc-tag\">Gaming Mouse<\/div>\n          <div class=\"gc-name\">WAR MACE<br>M5 PRO<\/div>\n          <div class=\"gc-cta\">Kh\u00e1m ph\u00e1 <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><\/div>\n        <\/div>\n      <\/div>\n      <div class=\"game-card gc3 fu d2 hoverable\">\n        <div class=\"top-bar\"><\/div>\n        <div class=\"game-card-bg\"><\/div>\n        <div class=\"game-card-info\">\n          <div class=\"gc-tag\">Wrist Rest<\/div>\n          <div class=\"gc-name\">MECH REST<br>PRO<\/div>\n          <div class=\"gc-cta\">Kh\u00e1m ph\u00e1 <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CHAPTER 04 \u2014 POWER \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"power\">\n  <div class=\"power-wrap\">\n    <div class=\"chapter-tag fu\" style=\"justify-content:center\">Chapter 04 \u00b7 Power<\/div>\n    <h2 class=\"power-h fu d1\">ENERGY<br><span>REIMAGINED<\/span><\/h2>\n    <p class=\"power-sub fu d2\">S\u1ea1c pin kh\u00f4ng nh\u1ea5t thi\u1ebft ph\u1ea3i x\u1ea5u. GravaStar bi\u1ebfn thi\u1ebft b\u1ecb s\u1ea1c th\u00e0nh statement piece \u2014 \u0111\u1eb7t l\u00ean b\u00e0n nh\u01b0 trang tr\u00ed, c\u1eafm v\u00e0o th\u00ec 100W GaN.<\/p>\n    <div class=\"pow-grid\">\n      <div class=\"pow-card fu hoverable\">\n        <img decoding=\"async\" src=\"img_power.png\" alt=\"Armor Bank 20K\" class=\"pow-prod-img\" onerror=\"this.style.display=\" title=\"GRAVASTAR\">\n        <div class=\"pow-hex\">\n          <svg viewBox=\"0 0 24 24\"><path d=\"M13 2L3 14h9l-1 8 10-12h-9l1-8z\"\/><\/svg>\n        <\/div>\n        <div class=\"pow-title\">GAN 100W FAST CHARGE<\/div>\n        <p class=\"pow-text\">C\u00f4ng ngh\u1ec7 Gallium Nitride th\u1ebf h\u1ec7 m\u1edbi \u2014 nh\u1ecf h\u01a1n 40% so v\u1edbi s\u1ea1c truy\u1ec1n th\u1ed1ng, m\u1ea1nh h\u01a1n 100W. V\u1ecf mechanical nh\u01b0 m\u1ed9 kh\u1ea9u s\u00fang t\u1eeb n\u0103m 2089.<\/p>\n        <div class=\"pow-spec\"><span class=\"pow-spec-item\">100W GaN<\/span><span class=\"pow-spec-item\">Multi-port<\/span><\/div>\n      <\/div>\n      <div class=\"pow-card fu d1 hoverable\">\n        <div class=\"pow-hex\">\n          <svg viewBox=\"0 0 24 24\"><circle cx=\"12\" cy=\"12\" r=\"3\"\/><path d=\"M12 1v4M12 19v4M4.22 4.22l2.83 2.83M16.95 16.95l2.83 2.83M1 12h4M19 12h4M4.22 19.78l2.83-2.83M16.95 7.05l2.83-2.83\"\/><\/svg>\n        <\/div>\n        <div class=\"pow-title\">ORBIT MAG DOCK<\/div>\n        <p class=\"pow-text\">Magnetic charging dock v\u1edbi thi\u1ebft k\u1ebf orbital. MagSafe-compatible, \u0111\u1eb7t l\u00ean b\u00e0n nh\u01b0 m\u1ed9t v\u1eadt th\u1ec3 ngo\u00e0i h\u00e0nh tinh v\u1eeba h\u1ea1 c\u00e1nh. Nghi l\u1ec5 s\u1ea1c pin m\u1ed7i t\u1ed1i.<\/p>\n        <div class=\"pow-spec\"><span class=\"pow-spec-item\">15W MagSafe<\/span><span class=\"pow-spec-item\">360\u00b0 Orbital<\/span><\/div>\n      <\/div>\n      <div class=\"pow-card fu d2 hoverable\">\n        <div class=\"pow-hex\">\n          <svg viewBox=\"0 0 24 24\"><rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\"\/><path d=\"M16 7V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v2\"\/><line x1=\"12\" y1=\"12\" x2=\"12\" y2=\"16\"\/><line x1=\"10\" y1=\"14\" x2=\"14\" y2=\"14\"\/><\/svg>\n        <\/div>\n        <div class=\"pow-title\">ARMOR BANK 20K<\/div>\n        <p class=\"pow-text\">20,000mAh trong v\u1ecf zinc alloy. N\u1eb7ng nh\u01b0 vi\u00ean \u0111\u1ea1n, b\u1ec1n nh\u01b0 \u00e1o gi\u00e1p, \u0111\u1ee7 s\u1ea1c laptop + \u0111i\u1ec7n tho\u1ea1i. \u0110\u00e2y l\u00e0 lo\u1ea1i power bank ng\u01b0\u1eddi ta h\u1ecfi th\u0103m.<\/p>\n        <div class=\"pow-spec\"><span class=\"pow-spec-item\">20,000mAh<\/span><span class=\"pow-spec-item\">65W PD<\/span><\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CHAPTER 05 \u2014 ENGINEERING \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"engineering\">\n  <div class=\"eng-wrap\">\n    <div class=\"eng-top\">\n      <div class=\"chapter-tag fu\" style=\"justify-content:center\">Chapter 05 \u00b7 Engineering<\/div>\n      <h2 class=\"eng-h fu d1\">BUILT<br><em>DIFFERENT<\/em><\/h2>\n      <p class=\"eng-sub fu d2\">Quy tr\u00ecnh s\u1ea3n xu\u1ea5t c\u1ee7a GravaStar kh\u00f4ng c\u00f3 ch\u1ed7 cho s\u1ef1 th\u1ecfa hi\u1ec7p. T\u1eeb b\u1ea3n v\u1ebd concept \u0111\u1ebfn tay b\u1ea1n \u2014 m\u1ed7i b\u01b0\u1edbc l\u00e0 m\u1ed9t h\u00e0nh \u0111\u1ed9ng c\u1ed1 \u00fd.<\/p>\n    <\/div>\n    <div class=\"eng-grid\">\n      <div class=\"eng-card fu hoverable\">\n        <div class=\"eng-svg\">\n          <svg width=\"52\" height=\"52\" viewBox=\"0 0 52 52\" fill=\"none\" stroke=\"#C8102E\" stroke-width=\"1\">\n            <circle cx=\"26\" cy=\"26\" r=\"20\"\/><circle cx=\"26\" cy=\"26\" r=\"11\"\/>\n            <circle cx=\"26\" cy=\"26\" r=\"3\" fill=\"#C8102E\" stroke=\"none\"\/>\n            <line x1=\"26\" y1=\"6\" x2=\"26\" y2=\"15\"\/><line x1=\"26\" y1=\"37\" x2=\"26\" y2=\"46\"\/>\n            <line x1=\"6\" y1=\"26\" x2=\"15\" y2=\"26\"\/><line x1=\"37\" y1=\"26\" x2=\"46\" y2=\"26\"\/>\n            <path d=\"M26 15 L30 26 L26 37 L22 26 Z\" fill=\"rgba(200,16,46,0.15)\"\/>\n            <circle cx=\"26\" cy=\"6\" r=\"2\" fill=\"#C8102E\" stroke=\"none\"\/>\n          <\/svg>\n        <\/div>\n        <div class=\"eng-n\">01 \u00b7 Vision<\/div>\n        <div class=\"eng-title\">CONCEPT ART FIRST<\/div>\n        <p class=\"eng-text\">M\u1ecdi s\u1ea3n ph\u1ea9m b\u1eaft \u0111\u1ea7u b\u1eb1ng concept art, kh\u00f4ng ph\u1ea3i spec sheet. Ngh\u1ec7 thu\u1eadt d\u1eabn \u0111\u01b0\u1eddng, k\u1ef9 thu\u1eadt theo sau. \u0110\u00f3 l\u00e0 l\u00fd do t\u1ea1i sao GravaStar tr\u00f4ng kh\u00f4ng gi\u1ed1ng b\u1ea5t k\u1ef3 th\u1ee9 g\u00ec kh\u00e1c.<\/p>\n      <\/div>\n      <div class=\"eng-card fu d1 hoverable\">\n        <div class=\"eng-svg\">\n          <svg width=\"52\" height=\"52\" viewBox=\"0 0 52 52\" fill=\"none\" stroke=\"#C8102E\" stroke-width=\"1\">\n            <rect x=\"8\" y=\"8\" width=\"36\" height=\"36\" rx=\"2\"\/><rect x=\"16\" y=\"16\" width=\"20\" height=\"20\" rx=\"1\"\/>\n            <line x1=\"8\" y1=\"20\" x2=\"16\" y2=\"20\"\/><line x1=\"8\" y1=\"26\" x2=\"16\" y2=\"26\"\/><line x1=\"8\" y1=\"32\" x2=\"16\" y2=\"32\"\/>\n            <line x1=\"36\" y1=\"20\" x2=\"44\" y2=\"20\"\/><line x1=\"36\" y1=\"26\" x2=\"44\" y2=\"26\"\/><line x1=\"36\" y1=\"32\" x2=\"44\" y2=\"32\"\/>\n            <rect x=\"22\" y=\"22\" width=\"8\" height=\"8\" fill=\"rgba(200,16,46,0.2)\" stroke=\"none\"\/>\n          <\/svg>\n        <\/div>\n        <div class=\"eng-n\">02 \u00b7 Material<\/div>\n        <div class=\"eng-title\">ZINC ALLOY SHELL<\/div>\n        <p class=\"eng-text\">Kh\u00f4ng nh\u1ef1a. Kh\u00f4ng ABS. Zinc alloy nguy\u00ean kh\u1ed1i, CNC milled, anodized. M\u1ed7i m\u1ea3nh v\u1ecf n\u1eb7ng h\u01a1n v\u00e0 m\u00e1t h\u01a1n tay b\u1ea1n. \u0110\u00f3 l\u00e0 c\u1ea3m gi\u00e1c premium th\u1eadt s\u1ef1.<\/p>\n      <\/div>\n      <div class=\"eng-card fu d2 hoverable\">\n        <div class=\"eng-svg\">\n          <svg width=\"52\" height=\"52\" viewBox=\"0 0 52 52\" fill=\"none\" stroke=\"#C8102E\" stroke-width=\"1\">\n            <circle cx=\"26\" cy=\"26\" r=\"4\" fill=\"#C8102E\" stroke=\"none\"\/>\n            <circle cx=\"26\" cy=\"26\" r=\"12\" stroke-dasharray=\"2 4\"\/>\n            <circle cx=\"26\" cy=\"26\" r=\"21\" stroke-dasharray=\"1 6\"\/>\n            <line x1=\"26\" y1=\"5\" x2=\"26\" y2=\"14\"\/><line x1=\"47\" y1=\"26\" x2=\"38\" y2=\"26\"\/>\n            <line x1=\"26\" y1=\"47\" x2=\"26\" y2=\"38\"\/><line x1=\"5\" y1=\"26\" x2=\"14\" y2=\"26\"\/>\n            <circle cx=\"26\" cy=\"5\" r=\"2\" fill=\"#C8102E\" stroke=\"none\"\/>\n            <circle cx=\"47\" cy=\"26\" r=\"2\" fill=\"#C8102E\" stroke=\"none\"\/>\n          <\/svg>\n        <\/div>\n        <div class=\"eng-n\">03 \u00b7 Craft<\/div>\n        <div class=\"eng-title\">PRECISION DOWN TO MICRONS<\/div>\n        <p class=\"eng-text\">Dung sai l\u1eafp gh\u00e9p \u0111\u01b0\u1ee3c \u0111o b\u1eb1ng micron. Assembly b\u1eb1ng tay t\u1ea1i x\u01b0\u1edfng Th\u00e2m Quy\u1ebfn. M\u1ed7i \u0111\u01a1n v\u1ecb qua ki\u1ec3m tra 28 \u0111i\u1ec3m tr\u01b0\u1edbc khi \u0111\u00f3ng g\u00f3i. Zero compromise.<\/p>\n      <\/div>\n      <div class=\"eng-card fu d3 hoverable\">\n        <div class=\"eng-svg\">\n          <svg width=\"52\" height=\"52\" viewBox=\"0 0 52 52\" fill=\"none\" stroke=\"#C8102E\" stroke-width=\"1\">\n            <path d=\"M26 4 L44 13 L44 39 L26 48 L8 39 L8 13 Z\"\/>\n            <path d=\"M26 14 L38 20 L38 36 L26 42 L14 36 L14 20 Z\" stroke-dasharray=\"2 3\"\/>\n            <circle cx=\"26\" cy=\"28\" r=\"4\"\/><circle cx=\"26\" cy=\"28\" r=\"2\" fill=\"#C8102E\" stroke=\"none\"\/>\n            <line x1=\"26\" y1=\"4\" x2=\"26\" y2=\"14\"\/><line x1=\"44\" y1=\"13\" x2=\"38\" y2=\"20\"\/>\n          <\/svg>\n        <\/div>\n        <div class=\"eng-n\">04 \u00b7 Rarity<\/div>\n        <div class=\"eng-title\">CONTROLLED SCARCITY<\/div>\n        <p class=\"eng-text\">Limited drop. Ki\u1ec3m so\u00e1t s\u1ed1 l\u01b0\u1ee3ng theo t\u1eebng colorway. Kh\u00f4ng ph\u1ea3i chi\u00eau marketing \u2014 l\u00e0 cam k\u1ebft. Khi h\u1ebft, h\u1ebft. \u0110\u00f3 l\u00e0 l\u00fd do collector s\u0103n GravaStar.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 CHAPTER 06 \u2014 COMMUNITY \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"resistance\">\n  <div class=\"res-wrap\">\n    <div class=\"res-top\">\n      <div>\n        <div class=\"chapter-tag fu\">Chapter 06 \u00b7 Community<\/div>\n        <h2 class=\"res-h fu d1\">JOIN THE<br><em>RESISTANCE<\/em><\/h2>\n      <\/div>\n      <div class=\"res-desc fu d2\">\n        <p>H\u00e0ng ngh\u00ecn creators, streamers, v\u00e0 collectors tr\u00ean to\u00e0n th\u1ebf gi\u1edbi \u2014 t\u1ea5t c\u1ea3 \u0111\u1ec1u c\u00f3 \u0111i\u1ec3m chung: h\u1ecd kh\u00f4ng th\u1ec3 d\u00f9ng th\u1ee9 g\u00ec \u0111\u00f3 tr\u00f4ng b\u00ecnh th\u01b0\u1eddng n\u1eefa.<\/p>\n        <div class=\"res-count\">48K+<\/div>\n        <div class=\"res-count-label\">Global Community Members<\/div>\n      <\/div>\n    <\/div>\n    <div class=\"res-grid\">\n      <div class=\"res-cell fu hoverable\"><div class=\"res-cell-inner\"><div class=\"res-icon\">\ud83c\udfa8<\/div><div class=\"res-cell-label\">CREATOR<\/div><\/div><div class=\"res-cell-overlay\"><div class=\"res-cell-tag\">Content Creator<\/div><\/div><\/div>\n      <div class=\"res-cell fu d1 hoverable\"><div class=\"res-cell-inner\"><div class=\"res-icon\">\ud83d\udda5\ufe0f<\/div><div class=\"res-cell-label\">SETUP<\/div><\/div><div class=\"res-cell-overlay\"><div class=\"res-cell-tag\">Battle Station<\/div><\/div><\/div>\n      <div class=\"res-cell fu d2 hoverable\"><div class=\"res-cell-inner\"><div class=\"res-icon\">\ud83c\udfae<\/div><div class=\"res-cell-label\">STREAMER<\/div><\/div><div class=\"res-cell-overlay\"><div class=\"res-cell-tag\">Live Streamer<\/div><\/div><\/div>\n      <div class=\"res-cell fu d3 hoverable\"><div class=\"res-cell-inner\"><div class=\"res-icon\">\u2694\ufe0f<\/div><div class=\"res-cell-label\">COSPLAY<\/div><\/div><div class=\"res-cell-overlay\"><div class=\"res-cell-tag\">Mech Cosplayer<\/div><\/div><\/div>\n      <div class=\"res-cell fu d4 hoverable\"><div class=\"res-cell-inner\"><div class=\"res-icon\">\ud83d\udd27<\/div><div class=\"res-cell-label\">BUILDER<\/div><\/div><div class=\"res-cell-overlay\"><div class=\"res-cell-tag\">PC Builder<\/div><\/div><\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 TESTIMONIALS \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"testimonials\">\n  <div class=\"test-wrap\">\n    <div style=\"text-align:center\">\n      <div class=\"chapter-tag fu\" style=\"justify-content:center\">Real Users \u00b7 Real Talk<\/div>\n      <h2 style=\"font-family:'Bebas Neue',sans-serif;font-size:clamp(52px,7vw,88px);line-height:.9\" class=\"fu d1\">NG\u01af\u1edcI D\u00d9NG<br><span style=\"color:var(--red3)\">N\u00d3I G\u00cc<\/span><\/h2>\n    <\/div>\n    <div class=\"test-grid\">\n      <div class=\"test-card fu hoverable\">\n        <div class=\"stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n        <p class=\"test-quote\">Mars Pro 2 l\u00e0 th\u1ee9 \u0111\u1ea7u ti\u00ean \u0111\u1eb7t l\u00ean b\u00e0n m\u00e0 kh\u00e1ch \u0111\u1ebfn nh\u00e0 c\u0169ng ph\u1ea3i h\u1ecfi &#8220;c\u00e1i n\u00e0y l\u00e0 g\u00ec v\u1eady?&#8221;. \u00c2m thanh th\u00ec kh\u1ecfi n\u00f3i \u2014 bass \u0111\u1eadp ng\u1ef1c.<\/p>\n        <div class=\"test-author\">\n          <div class=\"test-avatar\">TN<\/div>\n          <div><div class=\"test-name\">Tr\u1ea7n Nh\u1eadt<\/div><div class=\"test-role\">Content Creator \u00b7 HCM<\/div><\/div>\n        <\/div>\n      <\/div>\n      <div class=\"test-card fu d1 hoverable\">\n        <div class=\"stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n        <p class=\"test-quote\">Mercury M1 Pro l\u00e0 b\u00e0n ph\u00edm \u0111\u1ea7u ti\u00ean t\u00f4i kh\u00f4ng bao gi\u1edd mu\u1ed1n b\u1ecf v\u00e0o t\u00fai gi\u1ea5u \u0111i. N\u00f3 \u0111\u1eb9p \u0111\u1ebfn m\u1ee9c t\u00f4i mua th\u00eam \u0111\u00e8n spotlight \u0111\u1ec3 chi\u1ebfu l\u00ean khi kh\u00f4ng d\u00f9ng.<\/p>\n        <div class=\"test-author\">\n          <div class=\"test-avatar\">MH<\/div>\n          <div><div class=\"test-name\">Minh Ho\u00e0ng<\/div><div class=\"test-role\">Pro Gamer \u00b7 H\u00e0 N\u1ed9i<\/div><\/div>\n        <\/div>\n      <\/div>\n      <div class=\"test-card fu d2 hoverable\">\n        <div class=\"stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\n        <p class=\"test-quote\">Armor Bank 20K n\u1eb7ng v\u00e0 c\u1ee9ng nh\u01b0 vi\u00ean \u0111\u00e1. Nh\u01b0ng \u0111\u00f3 ch\u00ednh x\u00e1c l\u00e0 c\u1ea3m gi\u00e1c t\u00f4i mu\u1ed1n. \u0110\u00e2y l\u00e0 power bank t\u00f4i t\u1ef1 h\u00e0o \u0111\u1ec3 l\u00ean b\u00e0n h\u1ecdp.<\/p>\n        <div class=\"test-author\">\n          <div class=\"test-avatar\">QA<\/div>\n          <div><div class=\"test-name\">Qu\u1ef3nh Anh<\/div><div class=\"test-role\">Designer \u00b7 \u0110\u00e0 N\u1eb5ng<\/div><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 PRESS \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"press\">\n  <div class=\"press-wrap\">\n    <div class=\"press-eyebrow fu\">As featured in<\/div>\n    <div class=\"press-logos fu d1\">\n      <span class=\"press-logo hoverable\">IGN<\/span>\n      <span class=\"press-logo hoverable\">TECHRADAR<\/span>\n      <span class=\"press-logo hoverable\">PC GAMER<\/span>\n      <span class=\"press-logo hoverable\">YANKO DESIGN<\/span>\n      <span class=\"press-logo hoverable\">THE VERGE<\/span>\n    <\/div>\n  <\/div>\n<\/section>\n\n<div class=\"divider\"><\/div>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 STORE \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<section id=\"store\">\n  <div class=\"store-wrap\">\n    <div class=\"store-hed\">\n      <div class=\"chapter-tag fu\" style=\"justify-content:center\">Chapter 07 \u00b7 Store<\/div>\n      <h2 class=\"fu d1\">OWN A PIECE<br>OF THE <em>FUTURE<\/em><\/h2>\n      <p class=\"fu d2\">Giao h\u00e0ng to\u00e0n qu\u1ed1c \u00b7 B\u1ea3o h\u00e0nh ch\u00ednh h\u00e3ng 12 th\u00e1ng \u00b7 Thanh to\u00e1n linh ho\u1ea1t<\/p>\n    <\/div>\n    <div class=\"store-tabs fu d3\">\n      <button class=\"tab active\" onclick=\"filterProd('audio',this)\">Audio<\/button>\n      <button class=\"tab\" onclick=\"filterProd('gaming',this)\">Gaming<\/button>\n      <button class=\"tab\" onclick=\"filterProd('power',this)\">Power<\/button>\n    <\/div>\n    <div class=\"prod-grid\" id=\"prodGrid\"><\/div>\n  <\/div>\n<\/section>\n\n<!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 FOOTER \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n<footer>\n  <div class=\"foot-wrap\">\n    <h2 class=\"foot-h fu\">\n      ENTER<br>\n      THE <span>FUTURE<\/span>\n    <\/h2>\n    <div class=\"foot-grid\">\n      <div class=\"fu\">\n        <div class=\"foot-col-title\">Newsletter<\/div>\n        <p>Drops \u0111\u1ed9c quy\u1ec1n, tin t\u1ee9c m\u1edbi nh\u1ea5t v\u00e0 \u01b0u \u0111\u00e3i ch\u1ec9 d\u00e0nh cho community Vietnam.<\/p>\n        <div class=\"foot-inp-wrap\">\n          <input type=\"email\" id=\"email\" class=\"foot-inp\" placeholder=\"your@email.com\">\n          <button class=\"foot-sub hoverable\" onclick=\"handleSubscribe()\">Tham Gia<\/button>\n        <\/div>\n        <div class=\"social-row\" style=\"margin-top:20px\">\n          <a href=\"#\" class=\"social-btn hoverable\">FB<\/a>\n          <a href=\"#\" class=\"social-btn hoverable\">IG<\/a>\n          <a href=\"#\" class=\"social-btn hoverable\">YT<\/a>\n          <a href=\"#\" class=\"social-btn hoverable\">TK<\/a>\n        <\/div>\n      <\/div>\n      <div class=\"fu d1\">\n        <div class=\"foot-col-title\">S\u1ea3n Ph\u1ea9m<\/div>\n        <ul class=\"foot-links\">\n          <li><a href=\"#audio\">Audio<\/a><\/li>\n          <li><a href=\"#gaming\">Gaming<\/a><\/li>\n          <li><a href=\"#power\">Power<\/a><\/li>\n          <li><a href=\"#\">Accessories<\/a><\/li>\n        <\/ul>\n      <\/div>\n      <div class=\"fu d2\">\n        <div class=\"foot-col-title\">H\u1ed7 Tr\u1ee3<\/div>\n        <ul class=\"foot-links\">\n          <li><a href=\"#\">B\u1ea3o H\u00e0nh<\/a><\/li>\n          <li><a href=\"#\">\u0110\u1ed5i Tr\u1ea3<\/a><\/li>\n          <li><a href=\"#\">Li\u00ean H\u1ec7<\/a><\/li>\n          <li><a href=\"#\">FAQ<\/a><\/li>\n        <\/ul>\n      <\/div>\n      <div class=\"fu d3\">\n        <div class=\"foot-col-title\">Vi\u1ec7t Nam<\/div>\n        <ul class=\"foot-links\">\n          <li><a href=\"#\">Nh\u00e0 Ph\u00e2n Ph\u1ed1i<\/a><\/li>\n          <li><a href=\"#\">Showroom HCM<\/a><\/li>\n          <li><a href=\"#\">Showroom HN<\/a><\/li>\n          <li><a href=\"#\">\u0110\u1ea1i L\u00fd<\/a><\/li>\n        <\/ul>\n      <\/div>\n    <\/div>\n    <div class=\"foot-btm\">\n      <span class=\"foot-copy\">\u00a9 2025 GravaStar Vietnam \u00b7 Nh\u00e0 Ph\u00e2n Ph\u1ed1i Ch\u00ednh Th\u1ee9c \u00b7 B\u1ea3o l\u01b0u m\u1ecdi quy\u1ec1n<\/span>\n      <span class=\"foot-logo-btm\">GRAVA<span>\u2605<\/span>STAR<\/span>\n    <\/div>\n  <\/div>\n<\/footer>\n\n<!-- VIDEO MODAL -->\n<div class=\"vid-modal\" id=\"vidModal\">\n  <div class=\"vid-modal-inner\">\n    <button class=\"vid-close hoverable\" id=\"closeModal\">\u2715 &nbsp; \u0110\u00d3NG<\/button>\n    <div class=\"vid-placeholder\">\n      <div style=\"font-size:60px;opacity:.15\">\u25b6<\/div>\n      <p>GravaStar Origin Film<\/p>\n      <p style=\"font-size:8px;color:var(--t3)\">Coming Soon \u00b7 2025<\/p>\n    <\/div>\n  <\/div>\n<\/div>\n\n<!-- TOAST -->\n<div class=\"toast\" id=\"toast\"><\/div>\n\n<script src=\"main.js\" defer><\/script>\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>GravaStar Vietnam \u2014 The Mechanical Future GRAVA\u2605STAR Audio Gaming Power Story Shop Now Nh\u00e0 Ph\u00e2n Ph\u1ed1i Ch\u00ednh Th\u1ee9c T\u1ea1i Vi\u1ec7t Nam \u00b7 Est. 2025 THE MECHANICAL FUTURE C\u00f4ng ngh\u1ec7 mang h\u01a1i th\u1edf t\u1eeb t\u01b0\u01a1ng lai Kh\u00e1m Ph\u00e1 Th\u1ebf Gi\u1edbi Shop Now Scroll 0+Qu\u1ed1c Gia 0M+\u0110\u01a1n V\u1ecb B\u00e1n Ra 0+Gi\u1ea3i Th\u01b0\u1edfng 0N\u0103m Th\u00e0nh L\u1eadp Chapter 01 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"angie-canvas","meta":{"_angie_page":false,"_uag_custom_page_level_css":"","footnotes":""},"class_list":["post-2026","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"admin","author_link":"https:\/\/ifuturevietnam.com\/vi\/author\/ifuturevietnam\/"},"uagb_comment_info":0,"uagb_excerpt":"GravaStar Vietnam \u2014 The Mechanical Future GRAVA\u2605STAR Audio Gaming Power Story Shop Now Nh\u00e0 Ph\u00e2n Ph\u1ed1i Ch\u00ednh Th\u1ee9c T\u1ea1i Vi\u1ec7t Nam \u00b7 Est. 2025 THE MECHANICAL FUTURE C\u00f4ng ngh\u1ec7 mang h\u01a1i th\u1edf t\u1eeb t\u01b0\u01a1ng lai Kh\u00e1m Ph\u00e1 Th\u1ebf Gi\u1edbi Shop Now Scroll 0+Qu\u1ed1c Gia 0M+\u0110\u01a1n V\u1ecb B\u00e1n Ra 0+Gi\u1ea3i Th\u01b0\u1edfng 0N\u0103m Th\u00e0nh L\u1eadp Chapter 01&hellip;","_links":{"self":[{"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/pages\/2026","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/comments?post=2026"}],"version-history":[{"count":8,"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/pages\/2026\/revisions"}],"predecessor-version":[{"id":2288,"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/pages\/2026\/revisions\/2288"}],"wp:attachment":[{"href":"https:\/\/ifuturevietnam.com\/vi\/wp-json\/wp\/v2\/media?parent=2026"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}