*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --void-black:#0A0A0F; --void-deep:#0F0F1A;
  --aether-core:#7B2FBE; --aether-glow:#9D4EDD; --aether-shimmer:#C77DFF; --aether-pale:#E0AAFF;
  --rose-pale:#FF85A1; --teal-glow:#00C5E3;
  --glass-white:rgba(255,255,255,0.06); --glass-border:rgba(255,255,255,0.10);
  --text-primary:#F0ECFF; --text-secondary:#9B96C4; --text-muted:#5A5680;
  --font-display:'Cinzel',serif; --font-body:'Inter',system-ui,sans-serif;
  --ease-out:cubic-bezier(0.4,0,0.2,1); --max-w:1100px; --section-pad:110px 24px;
}
html{scroll-behavior:smooth}
body{background:var(--void-black);color:var(--text-primary);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
code{font-family:'JetBrains Mono',monospace;font-size:.85em;color:var(--aether-pale);background:rgba(155,77,221,.12);padding:2px 6px;border-radius:4px}
#bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.orb{position:absolute;border-radius:50%;filter:blur(100px);animation:orb-breathe 10s ease-in-out infinite;will-change:transform,opacity}
.orb-1{width:600px;height:600px;top:-200px;left:-100px;background:radial-gradient(circle,rgba(123,47,190,.22) 0%,transparent 70%)}
.orb-2{width:500px;height:500px;top:200px;right:-150px;background:radial-gradient(circle,rgba(0,197,227,.12) 0%,transparent 70%);animation-delay:-4s}
.orb-3{width:400px;height:400px;bottom:-100px;left:40%;background:radial-gradient(circle,rgba(255,71,126,.10) 0%,transparent 70%);animation-delay:-8s}
@keyframes orb-breathe{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:.9;transform:scale(1.08)}}
#particles{position:absolute;inset:0}
.void-particle{position:absolute;border-radius:50%;background:rgba(199,125,255,.45);animation:pdrift var(--dur,9s) ease-in infinite var(--delay,0s);will-change:transform,opacity}
@keyframes pdrift{0%{transform:translateY(100vh) translateX(0);opacity:0}8%{opacity:.55}92%{opacity:.2}100%{transform:translateY(-10vh) translateX(var(--dx,0px));opacity:0}}
section{position:relative;z-index:1}
.section-inner{max-width:var(--max-w);margin:0 auto;padding:var(--section-pad)}
.section-eyebrow{font-family:var(--font-display);font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--aether-shimmer);margin-bottom:16px}
.section-title{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);line-height:1.15;color:var(--text-primary);margin-bottom:20px}
.title-accent{color:var(--aether-pale)}
.section-sub{font-size:1.05rem;color:var(--text-secondary);line-height:1.7;max-width:600px;margin-bottom:48px}
#nav{position:fixed;top:0;left:0;right:0;z-index:100;padding:16px 24px;background:rgba(10,10,15,.8);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--glass-border)}
.nav-inner{max-width:var(--max-w);margin:0 auto;display:flex;align-items:center;gap:32px}
.nav-logo{font-family:var(--font-display);font-size:1rem;color:var(--aether-pale);letter-spacing:.05em;margin-right:auto}
.nav-links{display:flex;gap:24px}
.nav-links a{font-size:.875rem;color:var(--text-secondary);transition:color .2s}
.nav-links a:hover{color:var(--text-primary)}
.nav-cta{font-size:.875rem;font-weight:500;padding:8px 20px;border-radius:9999px;background:var(--aether-core);color:var(--text-primary);border:1px solid var(--aether-glow);transition:all .2s}
.nav-cta:hover{background:var(--aether-glow);box-shadow:0 0 20px rgba(155,77,221,.35)}
#hero{min-height:100vh;display:flex;align-items:center;padding:80px 24px 60px}
#hero .section-inner{padding:0;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.hero-inner{display:flex;flex-direction:column}
.hero-eyebrow{font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--aether-shimmer);margin-bottom:20px;font-family:var(--font-display)}
.hero-title{font-family:var(--font-display);font-size:clamp(2.5rem,5vw,3.8rem);line-height:1.1;color:var(--text-primary);margin-bottom:24px}
.hero-accent{color:var(--aether-pale)}
.hero-sub{font-size:1.05rem;color:var(--text-secondary);line-height:1.7;margin-bottom:36px;max-width:500px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.hero-note{font-size:.8rem;color:var(--text-muted)}
.btn-primary{display:inline-flex;align-items:center;padding:14px 28px;border-radius:9999px;background:var(--aether-core);color:var(--text-primary);font-weight:600;font-size:.95rem;border:1px solid var(--aether-glow);transition:all .2s var(--ease-out)}
.btn-primary:hover{background:var(--aether-glow);box-shadow:0 0 28px rgba(155,77,221,.4);transform:translateY(-1px)}
.btn-primary.btn-lg{padding:18px 36px;font-size:1.05rem}
.btn-ghost{display:inline-flex;align-items:center;padding:14px 28px;border-radius:9999px;background:transparent;color:var(--text-secondary);font-size:.95rem;border:1px solid var(--glass-border);transition:all .2s}
.btn-ghost:hover{border-color:var(--aether-glow);color:var(--aether-pale)}
.hero-preview{display:flex;justify-content:center}
.preview-card{width:100%;max-width:400px;background:rgba(15,15,26,.85);border:1px solid var(--glass-border);border-radius:16px;backdrop-filter:blur(20px);overflow:hidden;box-shadow:0 0 0 1px rgba(155,77,221,.12),0 20px 60px rgba(0,0,0,.5);font-size:.8rem;color:var(--text-secondary)}
.preview-ticker{background:rgba(155,77,221,.08);border-bottom:1px solid var(--glass-border);padding:6px 12px;font-size:.65rem;color:var(--aether-shimmer);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.preview-clock{text-align:center;padding:24px 16px 12px}
.preview-time{font-family:var(--font-display);font-size:3.2rem;color:var(--text-primary);letter-spacing:-.02em;display:block}
.preview-colon{animation:colon-blink 1s step-end infinite}
@keyframes colon-blink{0%,44%{opacity:1}50%,94%{opacity:.15}100%{opacity:1}}
.preview-date{font-size:.72rem;color:var(--text-muted);display:block;margin-top:2px}
.preview-focus{margin:8px 16px 16px;padding:10px 14px;background:var(--glass-white);border:1px solid var(--glass-border);border-radius:8px;display:flex;flex-direction:column;gap:3px}
.preview-focus-label{font-size:.6rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}
.preview-focus-text{color:var(--text-primary);font-size:.82rem}
.preview-widgets{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:0 16px 12px}
.pw{background:var(--glass-white);border:1px solid var(--glass-border);border-radius:8px;padding:10px 8px;text-align:center;font-size:.7rem;color:var(--text-secondary);line-height:1.5}
.pw span{font-size:.6rem;color:var(--text-muted)}
.preview-quote{padding:10px 16px 14px;font-style:italic;font-size:.72rem;color:var(--rose-pale);text-align:center;border-top:1px solid var(--glass-border);line-height:1.5}
.preview-footer{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;border-top:1px solid var(--glass-border);background:rgba(10,10,15,.4);font-size:.68rem;color:var(--text-muted)}
.preview-kofi{color:var(--aether-shimmer)}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.feat-card{background:var(--glass-white);border:1px solid var(--glass-border);border-radius:16px;padding:28px 24px;transition:all .2s var(--ease-out)}
.feat-card:hover{border-color:rgba(155,77,221,.3);box-shadow:0 0 24px rgba(155,77,221,.08);transform:translateY(-2px)}
.feat-large{grid-column:span 2}
.feat-icon{font-size:1.5rem;margin-bottom:14px;color:var(--aether-shimmer)}
.feat-card h3{font-family:var(--font-display);font-size:1.1rem;color:var(--text-primary);margin-bottom:10px}
.feat-card p{font-size:.9rem;color:var(--text-secondary);line-height:1.65}
.feat-tag{display:inline-block;margin-top:14px;padding:4px 10px;border-radius:9999px;font-size:.7rem;background:rgba(155,77,221,.12);border:1px solid rgba(155,77,221,.25);color:var(--aether-pale)}
#security{background:rgba(10,10,15,.6);border-top:1px solid var(--glass-border);border-bottom:1px solid var(--glass-border)}
.security-grid{display:flex;flex-direction:column;gap:1px;background:var(--glass-border);border-radius:12px;overflow:hidden;margin-bottom:32px}
.sec-row{display:grid;grid-template-columns:180px 1fr 1fr;gap:24px;padding:16px 20px;background:var(--void-deep);font-size:.875rem;align-items:start}
.sec-issue{font-weight:600;color:var(--text-primary)}
.sec-common{color:var(--text-muted);font-size:.82rem}
.sec-ours{color:var(--teal-glow);font-size:.82rem}
.permissions-box{border:1px solid rgba(0,197,227,.2);background:rgba(0,197,227,.04);border-radius:12px;padding:24px 28px;display:flex;flex-direction:column;gap:8px}
.perms-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--teal-glow);font-family:var(--font-display)}
.perms-code{font-family:'JetBrains Mono',monospace;font-size:1rem;color:var(--text-primary);background:none;padding:0}
.perms-sub{font-size:.82rem;color:var(--text-muted)}
#shards{border-top:1px solid var(--glass-border)}
.shards-inner{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.shard-thresholds{display:flex;flex-direction:column;gap:12px;margin-top:32px}
.st{display:flex;align-items:center;gap:16px;padding:12px 16px;background:var(--glass-white);border:1px solid var(--glass-border);border-radius:8px;font-size:.875rem}
.st-shards{font-family:var(--font-display);font-size:.8rem;color:var(--aether-shimmer);min-width:60px}
.st-unlock{color:var(--text-secondary)}
.shards-visual{display:flex;justify-content:center}
.shard-demo{width:220px;background:var(--glass-white);border:1px solid var(--glass-border);border-radius:16px;padding:32px 24px;text-align:center;box-shadow:0 0 40px rgba(155,77,221,.12)}
.shard-orb{font-size:2.8rem;color:var(--aether-shimmer);display:block;margin-bottom:8px;animation:shard-glow 3s ease-in-out infinite}
@keyframes shard-glow{0%,100%{filter:drop-shadow(0 0 8px rgba(199,125,255,.4))}50%{filter:drop-shadow(0 0 20px rgba(199,125,255,.8)) brightness(1.3)}}
.shard-count-demo{font-family:var(--font-display);font-size:3rem;color:var(--text-primary);line-height:1}
.shard-label-demo{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:20px}
.shard-bar-wrap{height:4px;background:var(--glass-border);border-radius:2px;overflow:hidden;margin-bottom:8px}
.shard-bar{height:100%;background:linear-gradient(90deg,var(--aether-core),var(--aether-shimmer));border-radius:2px}
.shard-progress-text{font-size:.7rem;color:var(--text-muted)}
#rose-quote{background:linear-gradient(180deg,transparent,rgba(123,47,190,.06),transparent);border-top:1px solid var(--glass-border);border-bottom:1px solid var(--glass-border)}
.quote-inner{text-align:center;padding:80px 24px}
.big-quote{font-family:var(--font-display);font-size:clamp(1.3rem,3vw,2rem);line-height:1.5;color:var(--aether-pale);font-style:italic;margin-bottom:16px}
cite{font-size:.875rem;color:var(--rose-pale);letter-spacing:.05em}
#cta{background:rgba(10,10,15,.4)}
.cta-inner{text-align:center;padding:100px 24px;display:flex;flex-direction:column;align-items:center}
.cta-actions{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-bottom:28px}
.cta-support{margin-bottom:20px}
.kofi-link{font-size:.875rem;color:var(--aether-shimmer);border:1px solid rgba(155,77,221,.25);padding:8px 20px;border-radius:9999px;transition:all .2s}
.kofi-link:hover{background:rgba(155,77,221,.08);border-color:var(--aether-glow)}
.cta-builder{font-size:.82rem;color:var(--text-muted)}
.cta-builder strong{color:var(--text-secondary)}
#footer{border-top:1px solid var(--glass-border);padding:32px 24px;position:relative;z-index:1}
.footer-inner{max-width:var(--max-w);margin:0 auto;display:flex;align-items:center;gap:32px}
.footer-logo{font-family:var(--font-display);font-size:.9rem;color:var(--text-secondary);margin-right:auto}
.footer-links{display:flex;gap:20px}
.footer-links a{font-size:.82rem;color:var(--text-muted);transition:color .2s}
.footer-links a:hover{color:var(--text-secondary)}
.footer-copy{font-size:.75rem;color:var(--text-muted)}
@media(max-width:900px){
  #hero .section-inner{grid-template-columns:1fr}
  .hero-preview{display:none}
  .features-grid{grid-template-columns:1fr}
  .feat-large{grid-column:span 1}
  .shards-inner{grid-template-columns:1fr}
  .shards-visual{display:none}
  .sec-row{grid-template-columns:1fr;gap:6px}
  .nav-links,.footer-links{display:none}
}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
.reveal.visible{opacity:1;transform:translateY(0)}