/* ═════════════  Landing page  ═════════════ */
.lp{position:relative;overflow-x:clip}
.lp-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(#ffffff14 1px,transparent 1px);background-size:22px 22px;
  -webkit-mask-image:radial-gradient(90% 70% at 50% 0%,#000 30%,transparent 80%);mask-image:radial-gradient(90% 70% at 50% 0%,#000 30%,transparent 80%)}
.lp-spot{position:fixed;z-index:-1;width:640px;height:640px;border-radius:50%;pointer-events:none;left:0;top:0;
  background:radial-gradient(closest-side,#6cc8ff14,transparent);transform:translate(-50%,-50%);transition:opacity .3s}
.lp-nav{position:sticky;top:0;z-index:40;backdrop-filter:blur(12px);background:#08090ab8;border-bottom:1px solid transparent;transition:border-color .2s}
.lp-nav.scrolled{border-color:var(--border)}
.lp-nav .in{max-width:1180px;margin:0 auto;height:64px;padding:0 24px;display:flex;align-items:center;gap:28px}
.lp-nav .links{display:flex;gap:4px;flex:1}.lp-nav .links a{color:var(--text3);padding:6px 10px;border-radius:7px;font-size:13.5px}.lp-nav .links a:hover{color:var(--text);background:var(--hover)}
.wrapx{max-width:1180px;margin:0 auto;padding:0 24px}

/* hero */
.lp-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:72px 0 56px}
.lp-hero h1{font-size:clamp(40px,5.4vw,66px);line-height:1;letter-spacing:-.05em;font-weight:600;margin:18px 0 0}
.lp-hero h1 .rot{display:inline-block;color:var(--accent);min-width:2ch;position:relative}
.lp-hero h1 .rot::after{content:'';display:inline-block;width:3px;height:.85em;background:var(--accent);margin-left:4px;vertical-align:-.06em;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.lp-hero p.lead{color:var(--text3);font-size:17.5px;line-height:1.55;max-width:520px;margin:22px 0 30px}
.lp-hero .cta{display:flex;gap:10px;flex-wrap:wrap}
.lp-hero .trust{display:flex;align-items:center;gap:10px;margin-top:28px;color:var(--text4);font-size:13px}
.lp-hero .trust .faces{display:flex}.lp-hero .trust .faces img{width:26px;height:26px;border-radius:50%;border:2px solid var(--canvas);margin-left:-8px}.lp-hero .trust .faces img:first-child{margin:0}

/* Discord window */
.dwin{border-radius:14px;overflow:hidden;border:1px solid #ffffff14;background:#313338;box-shadow:0 50px 120px -30px #000,0 0 0 1px #000;transform:perspective(1400px) rotateY(-7deg) rotateX(3deg);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.dwin:hover{transform:perspective(1400px) rotateY(0) rotateX(0)}
.dwin .tb{height:38px;background:#2b2d31;display:flex;align-items:center;gap:8px;padding:0 14px;border-bottom:1px solid #1f2023;color:#f2f3f5;font:600 14px 'gg sans','Noto Sans',Geist,sans-serif}
.dwin .tb .hash{color:#80848e;font-size:20px;font-weight:400}
.dwin .tb .dots{margin-left:auto;display:flex;gap:6px}.dwin .tb .dots i{width:10px;height:10px;border-radius:50%;background:#4e5058}
.dwin .feed{height:430px;overflow:hidden;padding:12px 4px 4px;display:flex;flex-direction:column;justify-content:flex-end;font:15px/1.375 'gg sans','Noto Sans',Geist,sans-serif;color:#dbdee1}
.dmsg{display:flex;gap:14px;padding:4px 14px;animation:msgin .35s cubic-bezier(.2,.9,.3,1.1)}
@keyframes msgin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.dmsg>img{width:38px;height:38px;border-radius:50%;flex-shrink:0;object-fit:cover;background:#1e1f22}
.dmsg .n{font-weight:500;color:#f2f3f5}.dmsg .n.blue{color:#6cc8ff}.dmsg .t{color:#949ba4;font-size:12px;margin-left:6px}
.dmsg .slash{display:inline-flex;align-items:center;gap:6px;color:#949ba4;font-size:13px;margin-bottom:2px}.dmsg .slash b{color:#00a8fc;font-weight:500}
.dmsg .emb{border-left:4px solid #6cc8ff;background:#2b2d31;border-radius:4px;padding:10px 14px 12px;margin-top:4px;max-width:380px}
.dmsg .emb .et{font-weight:600;color:#f2f3f5;margin-bottom:4px}.dmsg .emb .ed{font-size:14px}
.dmsg .emb .bar{height:8px;border-radius:4px;background:#1e1f22;margin:8px 0 4px;overflow:hidden}.dmsg .emb .bar i{display:block;height:100%;background:#6cc8ff;border-radius:4px;animation:fill 1.2s ease-out both}
@keyframes fill{from{width:0}}
.dmsg .emb .ef{font-size:12px;color:#b5bac1;margin-top:8px}
.dmsg .bt{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}.dmsg .bt span{background:#5865f2;color:#fff;height:32px;padding:0 14px;border-radius:8px;display:inline-flex;align-items:center;font-size:14px;font-weight:500}
.dmsg .bt .g{background:#248046}.dmsg .bt .s{background:#4e5058}
.typing{display:flex;align-items:center;gap:8px;padding:2px 14px 6px 66px;color:#b5bac1;font-size:13px;height:22px}
.typing i{width:6px;height:6px;border-radius:50%;background:#b5bac1;animation:bounce 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes bounce{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-3px);opacity:1}}
.dwin .composer{margin:8px 14px 14px;height:44px;border-radius:8px;background:#383a40;color:#6d6f78;display:flex;align-items:center;padding:0 14px;font-size:15px}

/* stats band */
.band{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--border);border-radius:16px;background:var(--panel);overflow:hidden;margin:20px 0 110px}
.band div{padding:26px 24px;border-left:1px solid var(--border)}.band div:first-child{border-left:0}
.band b{display:block;font:600 40px Geist,sans-serif;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.band small{color:var(--text3);font-size:13px;text-transform:uppercase;letter-spacing:.08em;font-family:"Geist Mono",monospace}

/* section heads */
.sh{text-align:center;max-width:720px;margin:0 auto 40px}
.sh .eb{font:500 12px "Geist Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.sh h2{font-size:clamp(30px,4vw,44px);letter-spacing:-.04em;line-height:1.05;margin:12px 0}
.sh p{color:var(--text3);font-size:16.5px}

/* rename demo */
.rename{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-bottom:120px}
.rename .card{border-radius:18px;background:#232428;border:1px solid #ffffff12;overflow:hidden;max-width:420px;margin-left:auto;box-shadow:0 40px 90px -30px #000}
.rename .bn{height:110px;transition:background .6s}
.rename .pb{padding:0 20px 20px;position:relative}
.rename .pa{width:92px;height:92px;border-radius:50%;border:7px solid #232428;margin-top:-46px;object-fit:cover;background:#1e1f22;transition:opacity .25s}
.rename .pn{font:700 24px 'gg sans',Geist,sans-serif;color:#f2f3f5;display:flex;align-items:center;gap:8px;margin-top:6px;min-height:32px}
.rename .pn .lpapp{background:#5865f2;color:#fff;font-size:11px;padding:1px 5px;border-radius:4px}
.rename .ps{margin-top:12px;padding:12px;border-radius:10px;background:#111214;color:#b5bac1;font-size:14px}
.rename ul{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:12px}.rename li{display:flex;gap:10px;color:var(--text2)}.rename li svg{color:var(--accent);margin-top:2px}

/* feature browser */
.fb-tabs{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.fb-tabs button{height:34px;padding:0 14px;border-radius:99px;border:1px solid var(--border2);background:var(--panel);color:var(--text3);font:500 13.5px Geist,sans-serif;cursor:pointer;transition:.15s}
.fb-tabs button:hover{color:var(--text)}.fb-tabs button.on{background:var(--accent);color:var(--accent-ink);border-color:transparent}
.fb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:120px;min-height:260px}
.fb-card{padding:20px;border-radius:14px;background:var(--panel);border:1px solid var(--border);transition:border-color .2s,transform .2s;animation:msgin .35s both}
.fb-card:hover{border-color:var(--accent-line);transform:translateY(-2px)}
.fb-card .ic{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--accent);margin-bottom:14px}
.fb-card h3{font-size:15.5px}.fb-card p{color:var(--text3);margin-top:4px;font-size:13.5px}

/* showcase marquee */
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);margin-bottom:120px}
.marquee .track{display:flex;gap:12px;width:max-content;animation:scroll 40s linear infinite}
.marquee:hover .track{animation-play-state:paused}
@keyframes scroll{to{transform:translateX(-50%)}}
.mq{display:flex;align-items:center;gap:12px;padding:10px 18px 10px 10px;border-radius:14px;background:var(--panel);border:1px solid var(--border);white-space:nowrap}
.mq img{width:40px;height:40px;border-radius:12px}.mq b{display:block;font-weight:500}.mq small{color:var(--text3)}

/* FAQ */
.faq{max-width:760px;margin:0 auto 120px}
.faq details{border-bottom:1px solid var(--border);padding:18px 4px}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;font-weight:500;font-size:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font:300 24px Geist;color:var(--text3);transition:transform .2s}.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--text3);margin-top:10px;line-height:1.6}

/* final CTA */
.final{position:relative;text-align:center;padding:72px 24px;border-radius:24px;border:1px solid var(--border2);background:var(--panel);overflow:hidden;margin-bottom:80px}
.final::before{content:'';position:absolute;inset:-1px;background:radial-gradient(60% 80% at 50% 120%,#6cc8ff26,transparent 70%);pointer-events:none}
.final h2{font-size:clamp(30px,4vw,46px);letter-spacing:-.04em;position:relative}.final p{color:var(--text3);margin:12px 0 28px;position:relative}
.final .cta{display:flex;gap:10px;justify-content:center;position:relative}

/* reveal on scroll */
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}.marquee .track{animation:none}.dwin{transform:none}}

@media (max-width:980px){
  .lp-hero,.rename{grid-template-columns:1fr}.lp-hero{padding-top:40px}.dwin{transform:none}.rename .card{margin:0}
  .band{grid-template-columns:repeat(2,1fr)}.band div:nth-child(3){border-left:0}.band div:nth-child(n+3){border-top:1px solid var(--border)}
  .fb-grid{grid-template-columns:1fr 1fr}.lp-nav .links{display:none}
}
@media (max-width:620px){.fb-grid{grid-template-columns:1fr}.dwin .feed{height:380px}.band b{font-size:30px}}

.hin{animation:hin .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes hin{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hin{animation:none}}

.fb-grid{align-items:start;align-content:start}