@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&family=Space+Grotesk:wght@500;700&display=swap');
:root{--bg:#040207;--panel:#0c0712;--pink:#ff12d4;--violet:#8d20ff;--cyan:#13f4ff;--white:#f8f4ff;--muted:#9a8fa7;--line:rgba(214,70,255,.22)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% 8%,#27083b 0,#09030f 26%,#040207 70%);color:var(--white);font-family:Inter,sans-serif;overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");z-index:50}
.nav{height:78px;display:flex;align-items:center;gap:35px;padding:0 5vw;border-bottom:1px solid var(--line);background:rgba(4,2,7,.8);backdrop-filter:blur(18px);position:sticky;top:0;z-index:20}.logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:#fff;font:900 17px/16px "Space Grotesk"}.logo img{width:44px;height:44px;object-fit:cover;border-radius:50%}.logo span{display:none}.logo b{color:var(--pink)}nav{display:flex;gap:28px;margin-left:auto}nav a,.footer-links a{font-size:10px;font-weight:800;letter-spacing:.1em;color:#aaa0b4;text-decoration:none}nav a:hover,nav a.active{color:#fff}nav a.active{padding-bottom:12px;border-bottom:2px solid var(--pink)}.social{display:flex;gap:8px}.social a,.footer-social a{width:34px;height:34px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;color:#d4b4ff;text-decoration:none}.menu{display:none;background:none;border:0;color:#fff;font-size:24px}
.wrap{width:min(1120px,92%);margin:auto}.hero{min-height:650px;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;position:relative}.pill{display:inline-block;border:1px solid #16e8ef;color:var(--cyan);padding:9px 14px;border-radius:8px;font-size:10px;font-weight:900;letter-spacing:.12em;background:#07131a}.hero h1{font:900 clamp(48px,6vw,82px)/.9 "Space Grotesk";letter-spacing:-.06em;margin:22px 0}.hero h1 span,.section-title em,.accent{color:var(--pink)}.hero p{color:#aaa0b2;line-height:1.75;max-width:520px}.buttons{display:flex;gap:12px;margin-top:28px}.btn,.outline{display:inline-block;padding:14px 20px;border-radius:9px;text-decoration:none;font-size:11px;font-weight:900;letter-spacing:.06em}.btn.pink{color:#fff;background:linear-gradient(90deg,#9c15ff,#ff12c8);box-shadow:0 0 28px rgba(255,18,210,.25)}.btn.cyan{border:1px solid var(--cyan);color:var(--cyan);background:#061014}.trust{display:flex;gap:28px;margin-top:34px}.trust div{display:flex;align-items:center;gap:8px;color:#91869c;font-size:8px;font-weight:800;line-height:1.4}.trust b{font-size:22px;color:var(--cyan)}.hero-art{height:620px;position:relative;display:flex;align-items:flex-end;justify-content:center}.hero-art img{width:min(580px,100%);height:auto;max-height:620px;object-fit:contain;border-radius:0;filter:drop-shadow(0 0 40px rgba(182,26,255,.45));position:relative;z-index:2}.moon{position:absolute;width:330px;height:330px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#45217c,#130c2b);right:15%;top:8%;box-shadow:0 0 70px #5a12a5;opacity:.9}.city{position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,#09030f),repeating-linear-gradient(90deg,transparent 0 45px,#100a1a 46px 75px);clip-path:polygon(0 35%,8% 30%,8% 52%,15% 44%,15% 65%,23% 42%,23% 55%,31% 35%,31% 60%,40% 48%,40% 70%,48% 40%,48% 62%,58% 30%,58% 60%,68% 45%,68% 67%,78% 33%,78% 60%,90% 42%,90% 70%,100% 35%,100% 100%,0 100%)}.neon-tag{position:absolute;right:1%;top:28%;z-index:4;color:var(--pink);font:900 27px/1 "Space Grotesk";text-shadow:0 0 20px #ff00dd;transform:rotate(8deg)}
.ticker{overflow:hidden;border-block:1px solid var(--line);background:#09040e;color:#bfb1cb;white-space:nowrap;padding:13px;font-size:9px;font-weight:900;letter-spacing:.16em}.ticker div{animation:scroll 20s linear infinite}.ticker b{color:var(--pink);margin:0 18px}@keyframes scroll{to{transform:translateX(-45%)}}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:rgba(13,7,20,.82);border-radius:18px;margin-top:35px;overflow:hidden}.stats div{text-align:center;padding:24px;border-right:1px solid var(--line)}.stats div:last-child{border:0}.stats strong{display:block;font:800 30px "Space Grotesk";color:#fff}.stats span{font-size:9px;color:#82778c;letter-spacing:.12em;font-weight:800}
section:not(.hero){padding-top:100px}.section-title{display:flex;align-items:center;gap:14px;margin-bottom:28px}.section-title span{font:800 12px "Space Grotesk";color:var(--cyan)}.section-title h2{font:900 clamp(28px,4vw,44px) "Space Grotesk";margin:0;letter-spacing:-.04em}.section-title.center{justify-content:center}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.about-text,.about-card,.feature-grid article,.token-card,.donut,.roadline article,details,.cta{border:1px solid var(--line);background:linear-gradient(135deg,rgba(20,8,29,.9),rgba(7,5,12,.9));border-radius:18px}.about-text{padding:35px}.lead{font:800 28px/1.1 "Space Grotesk";margin-top:0}.about-text p:not(.lead):not(.accent){color:#a69bae;line-height:1.8}.accent{font-weight:800;line-height:1.7}.outline{border:1px solid var(--pink);color:#fff;margin-top:10px}.about-card{position:relative;overflow:hidden;min-height:370px;display:grid;place-items:center}.about-card img{width:82%;border-radius:50%;filter:drop-shadow(0 0 40px #8c17ff)}.graffiti{position:absolute;bottom:22px;left:25px;color:var(--pink);font:900 30px/.9 "Space Grotesk";transform:rotate(-5deg)}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature-grid article{padding:28px 20px;text-align:center}.feature-grid i{font-style:normal;font-size:34px;color:var(--pink);text-shadow:0 0 20px #ff0bd0}.feature-grid h3{font:800 15px "Space Grotesk";margin:15px 0 7px}.feature-grid p{font-size:11px;line-height:1.6;color:#887d91}
.token-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:20px}.token-card{display:grid;grid-template-columns:1fr 1fr;padding:30px;gap:22px}.token-card small{display:block;color:#71677a;font-size:8px;font-weight:900;letter-spacing:.12em;margin-bottom:7px}.token-card b{font:700 16px "Space Grotesk"}.donut{display:grid;place-items:center;min-height:300px;background:radial-gradient(circle at center,transparent 0 27%,#111 28% 30%,transparent 31%),conic-gradient(var(--pink) 0 90%,var(--cyan) 90% 100%);border-radius:50%;width:220px;height:220px;margin:auto;position:relative}.donut:after{content:"";position:absolute;width:118px;height:118px;border-radius:50%;background:#0b0610}.donut div{position:relative;z-index:2;text-align:center}.donut b,.donut span{display:block}.donut b{font-size:17px}.donut span{font-size:11px;color:var(--cyan);margin-top:6px}
.roadline{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;position:relative}.roadline:before{content:"";position:absolute;top:35px;left:8%;right:8%;height:2px;background:linear-gradient(90deg,var(--pink),var(--cyan),var(--pink))}.roadline article{padding:24px;position:relative}.roadline i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#140b1d;border:1px solid var(--pink);color:var(--pink);font-style:normal;font-weight:900;position:relative}.roadline h3{font:800 17px "Space Grotesk";margin:20px 0 8px}.roadline p{color:#867b90;font-size:11px;line-height:1.7}
.faq details{margin:12px 0;padding:18px 22px}.faq summary{cursor:pointer;font:800 12px "Space Grotesk";color:#eee}.faq details p{color:#8d8296;font-size:11px;line-height:1.7;margin:14px 0 0}
.cta{text-align:center;margin-top:100px;padding:70px 20px;background:radial-gradient(circle,#25103a,#0b0610 60%);overflow:hidden}.cta span{font-size:9px;letter-spacing:.25em;color:var(--cyan);font-weight:900}.cta h2{font:900 clamp(42px,7vw,76px)/.9 "Space Grotesk";margin:18px 0 28px;letter-spacing:-.05em}.cta em{color:var(--pink);font-style:normal}
footer{margin-top:100px;border-top:1px solid var(--line);padding:40px 5vw 80px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;align-items:center;background:#050308}.footer-logo{display:flex;align-items:center;gap:9px;font:900 17px "Space Grotesk"}.footer-logo img{width:40px;height:40px;border-radius:50%;object-fit:cover}.footer-links{display:flex;justify-content:center;gap:20px}.footer-social{display:flex;justify-content:flex-end;gap:8px}.footer-social a{border-radius:50%}footer p{grid-column:1/-1;text-align:center;color:#5f5668;font-size:9px;margin:15px 0 0}
@media(max-width:800px){.nav{height:66px;padding:0 14px}.nav nav,.social{display:none}.menu{display:block;margin-left:auto}.hero{grid-template-columns:1fr;min-height:auto;padding-top:38px}.hero h1{font-size:51px}.hero-art{height:410px;order:-1}.hero-art img{width:360px;height:auto;max-height:410px}.moon{width:220px;height:220px}.neon-tag{font-size:20px}.trust{gap:15px}.stats{grid-template-columns:1fr 1fr}.stats div:nth-child(2){border-right:0}.stats div:nth-child(1),.stats div:nth-child(2){border-bottom:1px solid var(--line)}.stats div{padding:18px 10px}.stats strong{font-size:24px}.about-grid,.token-grid{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr 1fr}.roadline{grid-template-columns:1fr 1fr}.roadline:before{display:none}.donut{width:200px;height:200px}.footer-links{display:none}footer{grid-template-columns:1fr 1fr}.footer-social{justify-content:flex-end}section:not(.hero){padding-top:75px}}
@media(max-width:480px){.hero h1{font-size:43px}.hero-art{height:330px}.hero-art img{width:290px;height:auto;max-height:330px}.buttons{flex-direction:column}.btn{text-align:center}.trust{justify-content:space-between}.trust div{font-size:7px}.feature-grid,.roadline{grid-template-columns:1fr}.token-card{grid-template-columns:1fr}.section-title h2{font-size:31px}.about-text{padding:24px}.stats strong{font-size:21px}.stats span{font-size:7px}}

/* HERO IMAGE - APE PUNK NEW PORTRAIT */
.hero-art img{
  border-radius:0 !important;
  clip-path:none !important;
  mask:none !important;
  -webkit-mask:none !important;
  object-fit:contain !important;
  background:transparent !important;
}

/* FIX HERO IMAGE - JANGAN BULAT */
.hero-art{
  overflow:visible !important;
  border-radius:0 !important;
  clip-path:none !important;
  mask:none !important;
}

.hero-art img{
  border-radius:0 !important;
  clip-path:none !important;
  mask:none !important;
  object-fit:contain !important;
  width:min(580px,100%) !important;
  height:auto !important;
  max-height:620px !important;
}

/* MOBILE */
@media(max-width:800px){
  .hero-art{
    overflow:visible !important;
    border-radius:0 !important;
    clip-path:none !important;
  }

  .hero-art img{
    width:360px !important;
    height:auto !important;
    max-height:none !important;
    border-radius:0 !important;
    clip-path:none !important;
    mask:none !important;
  }
}

@media(max-width:480px){
  .hero-art img{
    width:100% !important;
    max-width:360px !important;
    height:auto !important;
    border-radius:0 !important;
  }
}

/* HERO: gambar asli, jangan bulat dan jangan dipotong */
.hero-art{
  overflow:visible !important;
}

.hero-art img{
  border-radius:0 !important;
  clip-path:none !important;
  object-fit:contain !important;
  width:min(580px,100%) !important;
  height:auto !important;
  max-height:none !important;
}

@media(max-width:800px){
  .hero-art{
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }

  .hero-art img{
    width:100% !important;
    max-width:520px !important;
    max-height:none !important;
    height:auto !important;
    object-fit:contain !important;
  }
}

@media(max-width:480px){
  .hero-art{
    height:auto !important;
  }

  .hero-art img{
    width:100% !important;
    max-width:520px !important;
    max-height:none !important;
  }
}

.hero-art{
  overflow:visible !important;
}

.hero-art img{
  border-radius:0 !important;
  clip-path:none !important;
  object-fit:contain !important;
  width:min(580px,100%) !important;
  height:auto !important;
  max-height:none !important;
}

@media(max-width:800px){
  .hero-art{
    height:auto !important;
    min-height:0 !important;
    overflow:visible !important;
  }

  .hero-art img{
    width:100% !important;
    max-width:520px !important;
    height:auto !important;
    max-height:none !important;
  }
}

@media(max-width:480px){
  .hero-art img{
    width:100% !important;
    max-width:520px !important;
  }
}

/* HERO IMAGE FINAL - DO NOT AFFECT ABOUT */
.hero-art > img{
  border-radius:0 !important;
  clip-path:none !important;
  width:min(580px,100%) !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  display:block !important;
}

/* LIVE TOKEN LOGO - TOKEN INFO ONLY */
#live-token-info .live-token{
  display:flex;
  align-items:center;
  gap:8px;
}

#live-token-logo{
  width:38px;
  height:38px;
  border-radius:50%;
  object-fit:cover;
  border:1px solid rgba(255,18,200,.5);
  box-shadow:0 0 18px rgba(255,18,200,.35);
}

#live-token-name{
  font-size:8px;
  font-weight:900;
  line-height:1.4;
  color:#aaa0b4;
}

.waitlist{
  padding-top:80px;
  padding-bottom:80px;
}

.waitlist-card{
  max-width:850px;
  margin:auto;
  padding:55px 30px;
  text-align:center;
  border:1px solid var(--line);
  border-radius:22px;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,11,208,.16),transparent 45%),
    linear-gradient(135deg,rgba(20,8,29,.95),rgba(7,5,12,.98));
  box-shadow:0 0 60px rgba(140,23,255,.12);
}

.waitlist-label{
  color:var(--cyan);
  font:900 10px "Space Grotesk";
  letter-spacing:.22em;
}

.waitlist-card h2{
  margin:14px 0;
  font:900 clamp(32px,6vw,58px)/1 "Space Grotesk";
  letter-spacing:-.04em;
}

.waitlist-card h2 em{
  color:var(--pink);
  font-style:normal;
}

.waitlist-card p{
  max-width:600px;
  margin:0 auto 25px;
  color:#91869b;
  font-size:12px;
  line-height:1.7;
}

.waitlist-form{
  display:flex;
  max-width:600px;
  margin:auto;
  gap:10px;
}

.waitlist-form input{
  flex:1;
  min-width:0;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:10px;
  outline:none;
  background:#0b0610;
  color:#fff;
  font:600 12px "Space Grotesk";
}

.waitlist-form input::placeholder{
  color:#62586b;
}

.waitlist-form button{
  border:0;
  border-radius:10px;
  padding:0 22px;
  background:var(--pink);
  color:#fff;
  font:900 11px "Space Grotesk";
  cursor:pointer;
  box-shadow:0 0 25px rgba(255,11,208,.25);
}

.waitlist-card small{
  display:block;
  margin-top:18px;
  color:#62586b;
  font-size:9px;
}

@media(max-width:600px){
  .waitlist-card{
    padding:40px 18px;
  }

  .waitlist-form{
    flex-direction:column;
  }

  .waitlist-form button{
    height:48px;
  }
}


.waitlist-success{
  display:none;
  margin-top:14px;
  color:var(--cyan);
  font:800 10px "Space Grotesk";
  letter-spacing:.04em;
}

.waitlist-success{
  display:none;
  margin-top:16px;
  color:var(--cyan);
  font:900 11px "Space Grotesk";
  letter-spacing:.08em;
}

@media(max-width:800px){
  .token .donut{
    width:160px !important;
    height:160px !important;
    min-height:160px !important;
  }

  .token .donut:after{
    width:86px !important;
    height:86px !important;
  }
}