*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background:#1a0000;color:#fff;overflow-x:hidden;min-height:100vh}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@font-face{font-family:kungfont;src:url(/Kungfont-Regular.ttf)}.logo-text{font-family:kungfont}.fade-in{animation:fadeIn .6s ease-out forwards}.logo-vn{width:250px}.vn-button{font-size:14px;padding:12px 24px}@media (max-width: 768px){u{font-size:10px}.vn-button{font-size:10px;padding:6px 12px}.logo-vn{width:260px}.button-row{flex-wrap:wrap}.button-row button{min-width:100px;padding:10px 16px;font-size:8px}.large-button{padding:14px 30px;font-size:10px}.announcement{margin:20px 15px;padding:15px}.logo{max-width:200px}}@media (max-width: 480px){.button-row{flex-direction:column;align-items:center}.button-row button{width:80%;max-width:250px}}.counter{font-size:16px;padding:5px 10px;border-radius:5px;color:var(--accent);background:var(--accent-bg);border:2px solid transparent;transition:border-color .3s;margin-bottom:24px}.counter:hover{border-color:var(--accent-border)}.counter:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{position:relative}.hero .base,.hero .framework,.hero .vite{inset-inline:0;margin:0 auto}.hero .base{width:170px;position:relative;z-index:0}.hero .framework,.hero .vite{position:absolute}.hero .framework{z-index:1;top:34px;height:28px;transform:perspective(2000px) rotate(300deg) rotateX(44deg) rotateY(39deg) scale(1.4)}.hero .vite{z-index:0;top:107px;height:26px;width:auto;transform:perspective(2000px) rotate(300deg) rotateX(40deg) rotateY(39deg) scale(.8)}#center{display:flex;flex-direction:column;gap:25px;place-content:center;place-items:center;flex-grow:1}@media (max-width: 1024px){#center{padding:32px 20px 24px;gap:18px}}#next-steps{display:flex;border-top:1px solid var(--border);text-align:left}#next-steps>div{flex:1 1 0;padding:32px}@media (max-width: 1024px){#next-steps>div{padding:24px 20px}}#next-steps .icon{margin-bottom:16px;width:22px;height:22px}@media (max-width: 1024px){#next-steps{flex-direction:column;text-align:center}}#docs{border-right:1px solid var(--border)}@media (max-width: 1024px){#docs{border-right:none;border-bottom:1px solid var(--border)}}#next-steps ul{list-style:none;padding:0;display:flex;gap:8px;margin:32px 0 0;a {color: var(--text-h); font-size: 16px; border-radius: 6px; background: var(--social-bg); display: flex; padding: 6px 12px; align-items: center; gap: 8px; text-decoration: none; transition: box-shadow .3s; &:hover {box-shadow: var(--shadow);} .button-icon {height: 18px; width: 18px;}} @media (max-width: 1024px) {margin-top: 20px; flex-wrap: wrap; justify-content: center; li {flex: 1 1 calc(50% - 8px);} a {width: 100%; justify-content: center; box-sizing: border-box;}}}#next-steps ul .logo{height:18px}#spacer{height:88px;border-top:1px solid var(--border)}@media (max-width: 1024px){#spacer{height:48px}}.ticks{position:relative;width:100%}.ticks:before,.ticks:after{content:"";position:absolute;top:-4.5px;border:5px solid transparent}.ticks:before{left:0;border-left-color:var(--border)}.ticks:after{right:0;border-right-color:var(--border)}
