@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;600;700&family=Orbitron:wght@700;800;900&display=swap');

:root { --ink:#e9f8ff; --muted:#9eb5c9; --aqua:#4df6ff; --lime:#9eff60; --red:#ff4a58; --night:#030814; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:var(--night); color:var(--ink); font-family:'Chakra Petch',system-ui,sans-serif; }
body::before { content:''; position:fixed; inset:0; pointer-events:none; opacity:.38; background:linear-gradient(rgba(77,246,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(77,246,255,.025) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(#000,transparent); }
.site-shell { width:min(1240px,calc(100% - 48px)); min-height:100vh; margin:auto; padding:24px 0 34px; display:flex; flex-direction:column; }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:12px 0 30px; border-bottom:1px solid rgba(117,197,255,.14); }
.brand { display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none; font-family:Orbitron,sans-serif; font-size:.78rem; letter-spacing:.16em; }
.brand b { color:var(--aqua); } .brand-mark { display:grid; place-items:center; width:36px; height:36px; color:#00131c; background:var(--aqua); font-weight:900; font-size:.66rem; clip-path:polygon(50% 0,100% 24%,100% 76%,50% 100%,0 76%,0 24%); }
.nav-status { font-family:Orbitron,sans-serif; color:var(--muted); letter-spacing:.1em; font-size:.62rem; } .status-dot { display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 14px var(--lime); }
.hero { min-height:560px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:30px; padding:68px 6%; border-bottom:1px solid rgba(117,197,255,.14); }
.eyebrow { margin:0 0 17px; color:var(--lime); font-family:Orbitron,sans-serif; font-size:.66rem; letter-spacing:.2em; }
h1 { margin:0; font-family:Orbitron,sans-serif; font-size:clamp(3.5rem,8vw,7.2rem); line-height:.83; letter-spacing:-.07em; text-shadow:0 0 42px rgba(77,246,255,.17); } h1 em { color:var(--red); font-style:normal; text-shadow:0 0 30px rgba(255,74,88,.35); }
.lede { max-width:520px; margin:26px 0; color:var(--muted); font-size:1.13rem; line-height:1.55; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
.button { display:flex; align-items:center; gap:25px; padding:15px 19px; text-decoration:none; font-family:Orbitron,sans-serif; font-size:.72rem; font-weight:900; letter-spacing:.08em; transition:transform .18s ease,box-shadow .18s ease; }
.button:hover { transform:translateY(-3px); }.button span { font-size:1.25rem; line-height:0; }.button-primary { color:#02141b; background:var(--aqua); box-shadow:0 0 24px rgba(77,246,255,.26); }.button-secondary { color:var(--ink); border:1px solid rgba(158,255,96,.7); background:rgba(158,255,96,.06); }.route-note { color:#65829e; font-size:.8rem; }.route-note code { color:var(--aqua); }
.hero-art { position:relative; min-height:380px; overflow:hidden; border:1px solid rgba(77,246,255,.28); background:#061025; box-shadow:inset 0 0 80px rgba(0,0,0,.55),0 25px 80px rgba(0,0,0,.35); }.hero-image { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:72% center; opacity:.86; }
.hero-art::before { content:''; position:absolute; inset:0; background-image:radial-gradient(#d2faff 1px,transparent 1px); background-size:34px 34px; opacity:.35; }.moon { position:absolute; z-index:2; top:48px; right:20%; width:86px; aspect-ratio:1; border-radius:50%; background:#dffcff; box-shadow:0 0 35px #b9ecff,0 0 110px rgba(77,246,255,.48); }.sound-ring { position:absolute; z-index:1; top:72px; right:13%; border:1px solid rgba(77,246,255,.5); border-radius:50%; }.ring-a { width:152px;height:152px; }.ring-b { width:240px;height:240px;top:28px;right:3%;opacity:.48; }.ring-c { width:340px;height:340px;top:-22px;right:-11%;opacity:.2; }.island-silhouette { position:absolute; z-index:3; bottom:0; left:-5%; width:110%; height:44%; background:linear-gradient(135deg,transparent 18%,#031217 19% 24%,transparent 25% 30%,#061d23 31% 48%,transparent 49%),linear-gradient(35deg,#031015 35%,#08252e 36% 58%,#031015 59%); clip-path:polygon(0 60%,10% 48%,17% 57%,26% 28%,31% 56%,38% 45%,47% 68%,55% 32%,59% 57%,70% 43%,83% 58%,93% 28%,100% 50%,100% 100%,0 100%); }.equalizer { position:absolute; z-index:4; right:10%; bottom:15%; display:flex; align-items:end; gap:6px; height:74px; }.equalizer i { width:8px; background:var(--aqua); box-shadow:0 0 12px var(--aqua); animation:pulse 1.2s infinite alternate ease-in-out; }.equalizer i:nth-child(1){height:30%}.equalizer i:nth-child(2){height:76%;animation-delay:.2s}.equalizer i:nth-child(3){height:52%;animation-delay:.45s}.equalizer i:nth-child(4){height:100%;animation-delay:.14s}.equalizer i:nth-child(5){height:42%;animation-delay:.8s}.equalizer i:nth-child(6){height:84%;animation-delay:.35s}.equalizer i:nth-child(7){height:25%;animation-delay:.6s}@keyframes pulse{to{transform:scaleY(.38);opacity:.55}}.hero-art p { position:absolute; z-index:5; bottom:21px; left:28px; margin:0; font-family:Orbitron,sans-serif; letter-spacing:.19em; color:var(--lime); font-size:.58rem; }
.sol-checkout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr); align-items:center; gap:36px; margin-top:32px; padding:34px; border:1px solid rgba(158,255,96,.38); background:linear-gradient(115deg,rgba(10,32,40,.92),rgba(9,18,46,.9)); box-shadow:inset 0 0 42px rgba(77,246,255,.05); }.sol-checkout h2 { margin:0 0 13px; font-family:Orbitron,sans-serif; font-size:clamp(1.35rem,3vw,2.2rem); letter-spacing:.03em; }.sol-checkout h2 em { color:var(--lime); font-style:normal; }.sol-checkout p { max-width:710px; margin:0; color:var(--muted); line-height:1.55; }.wallet-box { display:grid; gap:10px; margin:20px 0 14px; padding:16px; border:1px solid rgba(77,246,255,.34); background:rgba(2,10,24,.78); }.wallet-box > span { color:var(--aqua); font-family:Orbitron,sans-serif; font-size:.6rem; letter-spacing:.18em; }.wallet-box code { overflow-wrap:anywhere; color:#ecfbff; font-size:.87rem; }.wallet-actions { display:flex; gap:10px; flex-wrap:wrap; }.wallet-actions button,.wallet-actions a { display:inline-flex; align-items:center; min-height:34px; padding:8px 11px; border:1px solid var(--aqua); color:#01131c; background:var(--aqua); font:700 .62rem Orbitron,sans-serif; letter-spacing:.08em; text-decoration:none; cursor:pointer; }.wallet-actions a { color:var(--lime); border-color:rgba(158,255,96,.72); background:transparent; }.checkout-warning { font-size:.82rem; color:#d5b87b !important; }.sol-qr { justify-self:center; margin:0; padding:12px; background:#e9f8ff; text-align:center; }.sol-qr img { display:block; width:min(100%,205px); height:auto; }.sol-qr figcaption { margin-top:8px; color:#061528; font:700 .55rem Orbitron,sans-serif; letter-spacing:.09em; }.raid-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(117,197,255,.14); border:1px solid rgba(117,197,255,.14); margin-top:32px; }.raid-grid article { min-height:195px; padding:28px; background:rgba(5,17,34,.8); }.card-icon { color:var(--aqua); font-size:1.35rem; }.raid-grid h2 { margin:18px 0 9px; color:var(--ink); font-family:Orbitron,sans-serif; letter-spacing:.06em; font-size:.95rem; }.raid-grid p { margin:0; color:var(--muted); line-height:1.48; }.signal-gallery { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:32px; }.signal-gallery article { position:relative; min-height:250px; overflow:hidden; border:1px solid rgba(77,246,255,.22); background:#061025; }.signal-gallery img { position:absolute; width:100%; height:100%; object-fit:cover; object-position:center; opacity:.76; transition:transform .35s ease,opacity .35s ease; }.signal-gallery article:hover img { transform:scale(1.045); opacity:.94; }.signal-gallery article::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(1,8,20,.8),rgba(1,8,20,.05)); }.signal-gallery div { position:absolute; z-index:1; left:26px; bottom:22px; }.signal-gallery p { margin:0 0 7px; color:var(--lime); font-family:Orbitron,sans-serif; font-size:.58rem; letter-spacing:.18em; }.signal-gallery h2 { margin:0; font-family:Orbitron,sans-serif; font-size:1.05rem; letter-spacing:.08em; }
footer { display:flex; justify-content:space-between; padding-top:30px; color:#65829e; font-family:Orbitron,sans-serif; font-size:.58rem; letter-spacing:.13em; } footer a { color:var(--aqua); text-decoration:none; }
@media (max-width:780px) { .site-shell{width:min(100% - 28px,1240px)}.topbar{padding-bottom:20px}.nav-status{display:none}.hero{grid-template-columns:1fr;padding:48px 0}.hero-art{min-height:300px;order:-1}.sol-checkout,.raid-grid,.signal-gallery{grid-template-columns:1fr}.sol-checkout{padding:25px 20px;gap:24px}.sol-qr{justify-self:start}.raid-grid article{min-height:auto}.signal-gallery article{min-height:220px}.topbar{align-items:flex-start}.brand{font-size:.65rem}footer{flex-wrap:wrap;gap:14px} }