:root{--bg:#061206;--ink:#efffe8;--muted:#a8c69d;--acid:#6cff4f;--water:#1bc7a6;--line:#6cff4f}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:radial-gradient(circle at 72% 28%,rgba(108,255,79,.2),transparent 24rem),linear-gradient(135deg,#020602,var(--bg));overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background:repeating-linear-gradient(90deg,transparent 0 44px,rgba(108,255,79,.05) 45px),repeating-linear-gradient(0deg,transparent 0 44px,rgba(108,255,79,.04) 45px);pointer-events:none}nav{position:relative;z-index:2;display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;margin:1rem;padding:.8rem;border:1px solid rgba(108,255,79,.45);background:rgba(3,10,3,.78);backdrop-filter:blur(16px)}nav b{margin-right:auto}nav span,nav a{height:40px;display:grid;place-items:center;padding:0 .9rem;border:1px solid rgba(108,255,79,.35);color:var(--ink);text-decoration:none;text-transform:uppercase;font-size:.78rem;font-weight:900}.hero{position:relative;min-height:calc(100vh - 84px);display:grid;grid-template-columns:minmax(310px,.9fr) minmax(320px,1.1fr);align-items:center;gap:clamp(2rem,6vw,6rem);padding:clamp(1.2rem,4vw,4.5rem)}.pond{position:relative;justify-self:center;width:min(40vw,510px);min-width:310px;aspect-ratio:1;display:grid;place-items:center}.pond:before{content:"";position:absolute;inset:3%;border:1px dashed var(--line);border-radius:50%;animation:spin 18s linear infinite}.pond img{width:82%;height:82%;object-fit:cover;border:2px solid var(--line);border-radius:50%;box-shadow:0 0 0 12px rgba(108,255,79,.1),0 0 70px rgba(108,255,79,.44);animation:hop 2.7s ease-in-out infinite}.pond i{position:absolute;width:24px;height:24px;border-radius:50%;background:var(--water);box-shadow:0 0 20px var(--water);animation:bubble 2.5s ease-in-out infinite}.pond i:nth-child(2){left:8%;top:28%}.pond i:nth-child(3){right:12%;bottom:20%;animation-delay:.4s}.pond i:nth-child(4){right:18%;top:14%;animation-delay:.8s}.copy p{color:var(--acid);font-family:ui-monospace,Consolas,monospace;font-size:.78rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase}h1{margin:0;font-size:clamp(4.5rem,12vw,12rem);line-height:.78;text-transform:uppercase;text-shadow:0 0 18px rgba(108,255,79,.8);animation:wobble 2.8s ease-in-out infinite}h2{max-width:680px;margin:1.2rem 0;color:#fff;font-size:clamp(1.4rem,3vw,3.2rem)}.copy span{display:block;max-width:620px;color:var(--muted);font-size:clamp(1rem,1.4vw,1.18rem);line-height:1.65}.tape{border-top:1px solid rgba(108,255,79,.45);border-bottom:1px solid rgba(108,255,79,.45);background:rgba(108,255,79,.12);overflow:hidden}.tape div{display:flex;width:max-content;gap:1rem;padding:.9rem;animation:tape 18s linear infinite}.tape span{white-space:nowrap;color:var(--acid);font-weight:1000}@keyframes hop{50%{transform:translateY(-22px) scale(1.02)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes bubble{50%{transform:translateY(-22px) scale(1.15);opacity:.55}}@keyframes wobble{50%{transform:translateX(10px) skewX(-4deg)}}@keyframes tape{to{transform:translateX(-50%)}}@media(max-width:840px){.hero{grid-template-columns:1fr}.pond{width:min(82vw,420px);min-width:0}h1{font-size:clamp(4rem,20vw,7.4rem)}}
