*{box-sizing:border-box}html,body{height:100%;scroll-behavior:smooth}
body{margin:0;color:#fff;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:inherit}

/* Nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(0,0,0,.35);backdrop-filter:blur(6px)}
.nav__inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:12px 20px}
.nav__logo{font-weight:800;letter-spacing:1px;text-decoration:none}
.nav__links a{color:#fff;text-decoration:none;margin-left:18px;font-weight:600;padding:8px 10px;border-radius:999px;transition:transform .15s,background .15s,opacity .15s;opacity:.95}
.nav__links a:hover{background:rgba(255,255,255,.12);transform:translateY(-1px);opacity:1}

/* Section: hero */
.hero{position:relative;min-height:100vh;width:100%;background-image:linear-gradient(to bottom,rgba(0,0,0,.45),rgba(0,0,0,.55)),url('assets/img/hero.png');background-size:cover;background-position:center;background-repeat:no-repeat}
.hero__title{position:absolute;top:12vh;left:50%;transform:translateX(-50%);margin:0;font-family:'Bangers',system-ui,sans-serif;font-size:clamp(56px,10vw,160px);letter-spacing:4px;line-height:.9;text-shadow:0 6px 18px rgba(0,0,0,.55);-webkit-text-stroke:2px rgba(0,0,0,.35)}
.cta{position:absolute;left:50%;transform:translateX(-50%);bottom:12vh;background:#fff;color:#111;text-decoration:none;font-weight:800;padding:12px 18px;border-radius:999px;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.cta:hover{transform:translateX(-50%) translateY(-2px)}

/* Section: lab */
.stage{position:relative;min-height:100vh}
.stage__bg{width:100%;height:100vh;object-fit:cover;display:block}

/* Bubbles */
.bubble{position:absolute;font-family:'Bangers',system-ui,sans-serif;font-size:clamp(18px,2.8vw,44px);padding:.6em .9em;background:#fff;border:4px solid #111;border-radius:24px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.25));line-height:1;white-space:nowrap;color:#111}
.bubble::before{content:'';position:absolute;width:18px;height:18px;background:#fff;border:4px solid #111;border-radius:50%}
.bubble::after{content:attr(data-text);position:relative;z-index:1}

/* Individual positions */
.bubble--rug{left:8%;bottom:16%}.bubble--rug::before{left:12%;bottom:-28px}
.bubble--lfg{left:49%;bottom:30%;transform:translateX(-50%)}.bubble--lfg::before{left:40%;bottom:-28px}
.bubble--dex{left:42%;bottom:54%}.bubble--dex::before{left:20%;bottom:-28px}
.bubble--pump{right:9%;top:10%}.bubble--pump::before{right:18%;top:100%;transform:translateY(6px)}
.bubble--dev{left:30%;top:18%;}
.bubble--dev::before{left:10%;top:100%;transform:translateY(6px);}

@media (max-width:800px){.bubble{border-width:3px}.bubble::before{border-width:3px}}

/* Footer */
.foot{background:#0b0b0b}
.foot__inner{max-width:1200px;margin:0 auto;padding:28px 20px;opacity:.85}


/* Section: page3 */
.panel{min-height:100vh;display:grid;place-items:center;background:radial-gradient(1200px 600px at 10% 10%, rgba(255,255,255,.15), transparent), linear-gradient(160deg,#0b0b0b,#151515 55%, #1c1c1c);padding:80px 20px}
.panel__inner{max-width:1000px;text-align:center}
.panel__title{font-family:'Bangers',system-ui,sans-serif;font-size:clamp(42px,8vw,120px);margin:0 0 12px}
.panel__text{opacity:.9;max-width:800px;margin:0 auto;font-size:clamp(16px,2.3vw,20px);line-height:1.6}


/* Section: page3 image */
.panel-img{position:relative;min-height:100vh;width:100%}
.panel-img__bg{width:100%;height:100vh;object-fit:cover;display:block}


/* Clickable hotspot over pump.fun logo */
.panel-img{position:relative;overflow:hidden}
.panel-img__hotspot{
  position:absolute;
  left:14%; top:32%;
  width:22%; height:16%;
  display:block;
  text-indent:-9999px;
  overflow:hidden;
  background:rgba(0,0,0,0);
}
.panel-img__hotspot:hover{cursor:pointer}


/* Overlay description text in LAB section */
.lab-text{
  position:absolute;
  right:8%;
  top:12%;
  width:28%;
  max-width:340px;
  background:rgba(255,255,255,0.88);
  color:#111;
  padding:16px 20px;
  border-radius:16px;
  font-size:clamp(14px,1.8vw,17px);
  line-height:1.45;
  font-weight:500;
  box-shadow:0 6px 16px rgba(0,0,0,0.25);
}
@media(max-width:900px){
  .lab-text{position:static;width:auto;max-width:none;margin:20px}
}


/* Text block under CTA */
.hero-text{
  position:absolute;
  bottom:6vh;
  left:50%;
  transform:translateX(-50%);
  max-width:700px;
  padding:14px 20px;
  background:rgba(255,255,255,0.9);
  color:#111;
  border-radius:16px;
  font-size:clamp(14px,2vw,18px);
  line-height:1.45;
  text-align:center;
  box-shadow:0 6px 16px rgba(0,0,0,0.25);
}
@media(max-width:800px){
  .hero-text{position:static;transform:none;margin:20px auto}
}


/* Bubble for Pepe with "BUY 0.01 SOL" */
.bubble--buy{left:6%;top:48%;}
.bubble--buy::before{left:15%;top:100%;transform:translateY(4px) rotate(-10deg);}


/* Bubble for bearded sunglasses character with "BUY 2.5 SOL" */
.bubble--buy2{
  left:12%;
  top:18%;
}
.bubble--buy2::before{
  left:50%;
  top:100%;
  transform:translateY(6px) rotate(8deg);
}