:root { color-scheme: dark; font-family: Inter, "Segoe UI", Arial, sans-serif; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { min-width: 320px; margin: 0; color: #f7f7fa; background: #030304; }
button, a { font: inherit; }
.home-topbar { position: fixed; z-index: 20; top: 0; left: 50%; width: min(calc(100% - 40px), 1180px); height: 72px; display: flex; align-items: center; justify-content: space-between; transform: translateX(-50%); }
.home-brand { display: flex; align-items: center; gap: 9px; color: #fff; text-decoration: none; }
.home-brand span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #fece57; border-radius: 50%; color: #ffdb70; background: #241c0c; box-shadow: 0 0 22px rgba(255,204,68,.22); }
.home-brand strong { font-size: 22px; }
.language-menu { position: relative; }.language-trigger { height: 38px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid #39343f; border-radius: 7px; color: #d9d5df; background: rgba(13,12,17,.82); }.language-trigger svg { width: 16px; }.language-popover { position: absolute; top: 44px; right: 0; width: 150px; display: grid; padding: 6px; border: 1px solid #39343f; border-radius: 7px; background: #121116; box-shadow: 0 18px 40px rgba(0,0,0,.5); }.language-popover:not(.open) { display: none; }.language-popover button { padding: 9px 10px; border: 0; color: #bcb7c5; background: transparent; text-align: left; }
.home-hero { position: relative; min-height: min(820px, calc(100vh - 20px)); display: grid; align-items: center; overflow: hidden; padding: 112px max(24px, calc((100vw - 1180px) / 2)) 92px; }.home-hero::after { content: ""; position: absolute; z-index: -1; inset: 30% 0 0; background: linear-gradient(transparent, rgba(3,3,4,.7) 54%, #030304); }.hero-copy { width: min(690px, 100%); }.hero-kicker { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; color: #f7c95c; font-size: 13px; font-weight: 700; }.hero-kicker svg { width: 17px; }.hero-copy h1 { margin: 0; color: #fff; font-size: 92px; line-height: .95; letter-spacing: 0; text-shadow: 0 0 45px rgba(129,90,255,.28); }.hero-copy > p:not(.hero-kicker) { max-width: 580px; margin: 25px 0 32px; color: #aaa6b1; font-size: 18px; line-height: 1.8; }.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }.hero-actions a { min-height: 46px; display: flex; align-items: center; gap: 9px; padding: 0 18px; border: 1px solid #45404c; border-radius: 7px; color: #e9e6ee; background: rgba(20,18,25,.84); text-decoration: none; }.hero-actions a.primary { border-color: #8b70ff; color: #fff; background: #6e4ee8; box-shadow: 0 12px 36px rgba(100,70,225,.28); }.hero-actions svg { width: 18px; }
.hero-orbit { position: absolute; z-index: -1; top: 18%; right: max(5%, calc((100vw - 1180px) / 2)); width: 330px; height: 330px; display: grid; place-items: center; border: 1px solid rgba(127,101,226,.24); border-radius: 50%; animation: home-orbit 16s linear infinite; }.hero-orbit::before,.hero-orbit::after { content: ""; position: absolute; inset: 38px -24px; border: 1px solid rgba(246,201,85,.17); border-radius: 50%; transform: rotate(25deg); }.hero-orbit::after { inset: 76px -52px; transform: rotate(-32deg); }.hero-orbit b { width: 148px; height: 148px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: radial-gradient(circle at 34% 26%, #e2d8ff, #7653e8 31%, #251456 72%); box-shadow: inset -25px -20px 40px rgba(0,0,0,.42), 0 0 70px rgba(118,80,233,.38); font-size: 66px; }.hero-orbit span,.hero-orbit i { position: absolute; width: 17px; height: 17px; border-radius: 50%; background: #ffd25f; box-shadow: 0 0 20px #ffca41; }.hero-orbit span { top: 22px; left: 62px; }.hero-orbit i { right: 18px; bottom: 92px; width: 9px; height: 9px; background: #8df0c0; }.hero-scroll { position: absolute; bottom: 28px; left: 50%; color: #81798e; animation: home-scroll 1.8s ease-in-out infinite; }
.home-metrics { width: min(calc(100% - 40px), 1180px); display: grid; grid-template-columns: repeat(3,1fr); margin: 0 auto; border-block: 1px solid #25232a; }.home-metrics div { min-height: 112px; display: grid; align-content: center; gap: 8px; padding: 20px 34px; border-right: 1px solid #25232a; }.home-metrics div:last-child { border: 0; }.home-metrics strong { font-size: 26px; }.home-metrics span { color: #7f7b85; font-size: 12px; }
.home-band { width: min(calc(100% - 40px),1180px); margin: 0 auto; padding: 94px 0; }.home-band > header { position: relative; margin-bottom: 32px; }.home-band header small,.home-ecosystem small { color: #8f74ff; font-weight: 800; }.home-band h2,.home-ecosystem h2 { max-width: 720px; margin: 9px 0 0; font-size: 34px; letter-spacing: 0; }.capability-grid { display: grid; grid-template-columns: repeat(4,1fr); border-block: 1px solid #29262f; }.capability-grid article { position: relative; min-height: 245px; padding: 30px 26px; border-right: 1px solid #29262f; }.capability-grid article:last-child { border: 0; }.capability-grid article > svg { width: 30px; color: #f1c85f; }.capability-grid h3 { margin: 45px 0 12px; font-size: 18px; }.capability-grid p { margin: 0; color: #85818b; font-size: 13px; line-height: 1.7; }.capability-grid a { position: absolute; right: 22px; bottom: 24px; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #3c3744; border-radius: 50%; color: #bbb4c7; }.capability-grid a svg { width: 15px; }
.popular > header { display: flex; align-items: end; justify-content: space-between; }.popular > header small { position: absolute; top: 0; }.popular > header a { color: #b79fff; text-decoration: none; font-size: 13px; }.popular-list { border-top: 1px solid #29262f; }.popular-list article { display: grid; grid-template-columns: 46px minmax(180px,1.5fr) 1fr 1fr; align-items: center; gap: 18px; min-height: 82px; border-bottom: 1px solid #29262f; }.popular-list img { border-radius: 7px; object-fit: cover; }.popular-list article > div { min-width: 0; display: grid; gap: 5px; }.popular-list span,.popular-list small { color: #77727f; font-size: 11px; }.popular-list b { overflow: hidden; color: #dcd8e1; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }.popular-list article > div:last-child b { color: #68dfa2; }.popular-empty { padding: 50px 0; color: #77727f; text-align: center; }
.home-ecosystem { width: min(calc(100% - 40px),1180px); display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 60px; margin: 0 auto 16px; padding: 68px 0; border-block: 1px solid #29262f; }.home-ecosystem p { color: #85818b; line-height: 1.8; }.ecosystem-flow { display: flex; align-items: center; }.ecosystem-flow span { width: 52px; height: 52px; display: grid; flex: none; place-items: center; border: 1px solid #6049b4; border-radius: 50%; color: #d2c6ff; background: #171127; }.ecosystem-flow span svg { width: 20px; }.ecosystem-flow b { height: 1px; flex: 1; background: linear-gradient(90deg,#6049b4,#e4c657); }
@keyframes home-orbit { to { transform: rotate(360deg); } } @keyframes home-scroll { 50% { transform: translateY(7px); } }
@media(max-width:820px){.home-hero{min-height:720px}.hero-copy h1{font-size:68px}.hero-orbit{top:15%;right:-145px;opacity:.64}.capability-grid{grid-template-columns:repeat(2,1fr)}.capability-grid article:nth-child(2){border-right:0}.capability-grid article:nth-child(-n+2){border-bottom:1px solid #29262f}.home-ecosystem{grid-template-columns:1fr}}
@media(max-width:560px){.home-topbar{width:calc(100% - 28px)}.home-hero{min-height:680px;padding:96px 20px 78px}.hero-copy h1{font-size:58px}.hero-copy>p:not(.hero-kicker){max-width:330px;font-size:15px}.hero-actions a{padding:0 13px;font-size:12px}.hero-actions a.primary{width:100%;justify-content:center}.hero-orbit{width:260px;height:260px;top:16%;right:-150px}.hero-orbit b{width:110px;height:110px;font-size:48px}.home-metrics{width:calc(100% - 28px);grid-template-columns:1fr}.home-metrics div{min-height:84px;padding:16px 8px;border-right:0;border-bottom:1px solid #25232a;text-align:center}.home-band,.home-ecosystem{width:calc(100% - 28px);padding:70px 0}.home-band h2,.home-ecosystem h2{font-size:27px}.capability-grid{grid-template-columns:1fr}.capability-grid article{min-height:205px;border-right:0;border-bottom:1px solid #29262f}.popular-list article{grid-template-columns:42px 1fr auto;gap:12px;padding:12px 0}.popular-list article>div:nth-child(3){display:none}.popular-list article>div:last-child{text-align:right}.ecosystem-flow span{width:42px;height:42px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-orbit,.hero-scroll{animation:none}}