/* ============================================================
   FINGERS ✌️💕 — Lovely Pastel  |  styles (v3: new motion + zig-zag)
   ============================================================ */
:root{
  --pink:#FF8FB1;
  --pink-deep:#FF6FA0;
  --lavender:#C9A7FF;
  --purple:#9B6BFF;
  --mint:#9DEFC9;
  --mint-deep:#54D6A6;
  --peach:#FFD3A5;
  --sky:#A9D8FF;
  --butter:#FFE680;
  --cream:#FFF6FB;
  --ink:#4A3A5A;
  --ink-soft:#7A6A8A;
  --white:#ffffff;
  --r:26px;
  --soft:0 16px 36px rgba(155,107,255,.18);
  --soft-sm:0 10px 22px rgba(255,143,177,.22);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Fredoka',sans-serif;
  color:var(--ink);
  background:#FFEAF4;
  overflow-x:hidden;
  position:relative;
  min-height:100vh;
}
a{color:inherit;text-decoration:none}
strong{font-weight:700}

/* ===================== BACKGROUND LAYERS ===================== */
.bg-sky,.bg-aurora,.bg-dots{position:fixed;inset:0;z-index:-5;pointer-events:none}
.bg-sky{
  background:
    radial-gradient(1000px 700px at 15% 0%, #FFE3F1 0%, transparent 55%),
    radial-gradient(900px 700px at 85% 10%, #E6DBFF 0%, transparent 55%),
    radial-gradient(900px 800px at 80% 100%, #D8F5E8 0%, transparent 55%),
    radial-gradient(900px 800px at 10% 95%, #FFE9D6 0%, transparent 55%),
    linear-gradient(160deg,#FFF0F8,#F3EBFF 50%,#E9FBF3);
}
/* NEW: slow rotating aurora ribbon instead of drifting bokeh */
.bg-aurora{
  z-index:-4;opacity:.55;mix-blend-mode:multiply;
  background:conic-gradient(from 0deg at 50% 50%,
    rgba(255,143,177,.45),rgba(201,167,255,.45),rgba(157,239,201,.45),
    rgba(255,211,165,.45),rgba(169,216,255,.45),rgba(255,143,177,.45));
  filter:blur(70px);
  animation:auroraSpin 28s linear infinite;
}
@keyframes auroraSpin{to{transform:rotate(360deg) scale(1.2)}}

.bg-dots{
  z-index:-3;opacity:.45;
  background-image:radial-gradient(rgba(255,255,255,.9) 3px, transparent 3.4px);
  background-size:34px 34px;
  animation:dots 60s linear infinite;
}
@keyframes dots{to{background-position:0 680px}}

/* NEW: falling, swaying petals (was rising emojis) */
.floaties{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.floaties span{
  position:absolute;top:-8%;font-size:1.7rem;opacity:.85;--sway:6vw;
  animation:fall linear infinite;filter:drop-shadow(0 6px 8px rgba(155,107,255,.2));
  will-change:transform;
}
@keyframes fall{
  0%{transform:translateY(-10vh) translateX(0) rotate(0);opacity:0}
  10%{opacity:.9}
  50%{transform:translateY(55vh) translateX(var(--sway)) rotate(190deg)}
  90%{opacity:.9}
  100%{transform:translateY(115vh) translateX(0) rotate(380deg);opacity:0}
}

/* ===================== TICKER ===================== */
.ticker{
  position:relative;z-index:30;
  background:linear-gradient(90deg,var(--pink),var(--lavender),var(--mint),var(--peach),var(--pink));
  background-size:300% 100%;animation:tickerHue 16s linear infinite;
  overflow:hidden;
}
@keyframes tickerHue{to{background-position:300% 0}}
.ticker__track{
  display:inline-flex;gap:2.6rem;white-space:nowrap;padding:.55rem 0;
  font-family:'Baloo 2',cursive;font-weight:700;font-size:.9rem;letter-spacing:.5px;
  color:#fff;text-shadow:0 1px 2px rgba(122,80,120,.3);
  animation:scrollX 30s linear infinite;
}
@keyframes scrollX{to{transform:translateX(-50%)}}

/* ===================== NAV ===================== */
.nav{
  position:sticky;top:0;z-index:40;
  display:flex;align-items:center;gap:1rem;
  padding:.7rem 5vw;
  background:rgba(255,255,255,.72);backdrop-filter:blur(14px);
  border-bottom:2px solid rgba(255,143,177,.3);
  box-shadow:0 8px 24px rgba(155,107,255,.12);
  transition:padding .25s ease;
}
.nav.scrolled{padding:.45rem 5vw}
.nav__brand{display:flex;align-items:center;gap:.6rem}
.nav__logo{width:46px;height:46px;object-fit:cover;border-radius:50%;border:3px solid #fff;box-shadow:var(--soft-sm);animation:swing 4s ease-in-out infinite}
.nav__name{font-family:'Baloo 2',cursive;font-weight:800;font-size:1.7rem;
  background:linear-gradient(90deg,var(--pink-deep),var(--purple));
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.nav__links{display:flex;gap:1.5rem;margin-left:auto;font-weight:600}
.nav__links a{position:relative;padding:.15rem .2rem;transition:.15s}
.nav__links a::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:3px;border-radius:3px;background:var(--pink-deep);transition:width .25s}
.nav__links a:hover{color:var(--pink-deep)}
.nav__links a:hover::after{width:100%}
.nav__cta{margin-left:.4rem}
.nav__burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;margin-left:auto}
.nav__burger span{width:28px;height:3px;background:var(--purple);border-radius:3px;transition:.3s}

/* shared gentle motions */
@keyframes swing{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
@keyframes heartbeat{0%,100%{transform:scale(1)}15%{transform:scale(1.12)}30%{transform:scale(1)}45%{transform:scale(1.08)}60%{transform:scale(1)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* ===================== BUTTONS ===================== */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:'Baloo 2',cursive;font-weight:700;font-size:1rem;letter-spacing:.3px;
  padding:.85rem 1.7rem;border-radius:50px;cursor:pointer;
  border:0;color:#fff;
  transition:transform .15s ease, box-shadow .15s ease, filter .2s;
  white-space:nowrap;
}
/* NEW: buy button now "heartbeats" instead of ring-pulse */
.btn--buy{background:linear-gradient(120deg,var(--pink),var(--pink-deep));box-shadow:0 12px 24px rgba(255,111,160,.45);animation:heartbeat 2.4s ease-in-out infinite}
.btn--buy:hover{transform:translateY(-3px) scale(1.05);filter:brightness(1.05)}
.btn--ghost{background:#fff;color:var(--purple);box-shadow:var(--soft-sm)}
.btn--ghost:hover{transform:translateY(-3px) scale(1.03)}
.btn--lg{font-size:1.2rem;padding:1.15rem 2.4rem}
.btn:active{transform:translateY(0) scale(.97)}

/* ===================== SHARED SECTION ===================== */
.section{padding:6rem 6vw;position:relative;z-index:1}
.section__title{
  font-family:'Baloo 2',cursive;font-weight:800;font-size:clamp(2.2rem,5.5vw,3.8rem);
  letter-spacing:.5px;text-align:center;margin-bottom:3rem;color:var(--ink);
}
.section__title .halo{
  font-family:'Pacifico',cursive;font-weight:400;
  background:linear-gradient(90deg,var(--pink-deep),var(--purple),var(--mint-deep),var(--pink-deep));
  background-size:300% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shine 6s linear infinite;
}
/* NEW: animated gradient "shine" sweeping through the script word */
@keyframes shine{to{background-position:300% 0}}

/* soft card */
.panel{
  position:relative;background:rgba(255,255,255,.8);backdrop-filter:blur(8px);
  border:2px solid #fff;border-radius:var(--r);
  padding:2.4rem;box-shadow:var(--soft);
}

/* ===================== HERO (side-by-side) ===================== */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;padding:5rem 6vw;overflow:hidden}
.hero__inner{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center;width:100%;max-width:1240px;margin:auto}
.badge{display:inline-flex;align-items:center;gap:.4rem;font-family:'Baloo 2',cursive;font-weight:700;font-size:.85rem;
  background:rgba(255,255,255,.85);color:var(--purple);padding:.5rem 1.1rem;border-radius:50px;
  box-shadow:var(--soft-sm);margin-bottom:1.2rem}
.hero__title{font-family:'Baloo 2',cursive;line-height:.95;margin-bottom:.4rem}
.hero__hi{display:block;font-family:'Pacifico',cursive;font-size:1.5rem;color:var(--pink-deep);transform:rotate(-3deg);margin-bottom:.2rem}
.outline-pop{display:block;font-weight:800;font-size:clamp(3.4rem,11vw,6.5rem);
  background:linear-gradient(120deg,var(--pink-deep) 0%,var(--purple) 50%,var(--mint-deep) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 8px 14px rgba(155,107,255,.3));}
.hero__symbol{display:inline-block;font-family:'Baloo 2',cursive;font-weight:700;font-size:1.15rem;color:var(--purple);
  background:rgba(255,255,255,.85);border-radius:50px;padding:.4rem 1.1rem;box-shadow:var(--soft-sm);margin:.4rem 0 1rem}
.hero__bio{font-size:1.15rem;font-weight:500;color:var(--ink-soft);max-width:42ch;margin-bottom:1.8rem}
.hero__cta{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:1.4rem}

.hero__art{position:relative;display:flex;justify-content:center}
.hero__art-glow{position:absolute;inset:-12%;background:radial-gradient(circle,rgba(255,143,177,.55),rgba(201,167,255,.4) 45%,transparent 70%);filter:blur(22px);animation:pulseGlow 4s ease-in-out infinite}
@keyframes pulseGlow{0%,100%{opacity:.7;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}}
/* NEW: hero art gently swings like a pendant (was float-bob) */
.hero__img{position:relative;width:100%;max-width:340px;aspect-ratio:1;object-fit:cover;border-radius:50%;
  background:#fff;border:7px solid #fff;
  box-shadow:0 22px 44px rgba(155,107,255,.35);
  transform-origin:top center;animation:swing 5s ease-in-out infinite;}
.hero__sticker{position:absolute;font-size:2.6rem;filter:drop-shadow(0 6px 8px rgba(122,80,120,.3));animation:bob 3.2s ease-in-out infinite}
.hero__sticker--tl{top:-4px;left:6%;animation-delay:.3s}
.hero__sticker--br{bottom:-4px;right:6%}

.ca{display:inline-flex;align-items:center;gap:.6rem;cursor:pointer;
  background:rgba(255,255,255,.9);border:2px dashed var(--lavender);border-radius:50px;
  padding:.5rem .8rem;font-family:'Fredoka';color:var(--ink);box-shadow:var(--soft-sm);transition:.15s}
.ca:hover{transform:translateY(-2px)}
.ca__label{background:linear-gradient(120deg,var(--pink-deep),var(--purple));color:#fff;padding:.2rem .65rem;border-radius:50px;font-weight:700;font-size:.75rem}
.ca__addr{font-size:.82rem;max-width:30vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-soft)}
.ca__copy{font-size:.8rem;color:var(--pink-deep);font-weight:700}

/* NEW: sparkles spin-twinkle */
.sparkle{position:absolute;font-size:2rem;z-index:2;animation:spinkle 4s ease-in-out infinite}
.sparkle--1{top:14%;left:10%;animation-delay:.2s}
.sparkle--2{bottom:20%;right:10%;font-size:2.4rem;animation-delay:1s}
.sparkle--3{top:64%;left:6%;font-size:2.2rem;animation-delay:.6s}
@keyframes spinkle{0%,100%{transform:scale(.7) rotate(0);opacity:.5}50%{transform:scale(1.25) rotate(180deg);opacity:1}}

.scroll-cue{position:absolute;bottom:1.4rem;left:50%;transform:translateX(-50%);
  font-family:'Baloo 2',cursive;font-weight:600;font-size:.7rem;letter-spacing:2px;color:var(--ink-soft);opacity:.8;
  display:flex;flex-direction:column;align-items:center;gap:.4rem}
.scroll-cue span{width:24px;height:38px;border:2px solid var(--lavender);border-radius:14px;position:relative}
.scroll-cue span::after{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:var(--pink-deep);animation:scrollDot 1.4s infinite}
@keyframes scrollDot{0%{opacity:1;top:6px}80%{opacity:0;top:24px}100%{opacity:0}}

/* ===================== ABOUT (side-by-side) ===================== */
.about__row{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem;max-width:1140px;margin:auto;align-items:center}
.about__lead{font-size:1.25rem;margin-bottom:1rem;font-weight:600;color:var(--ink)}
.panel p{margin-bottom:1rem;line-height:1.8;color:var(--ink-soft);font-weight:500}
.panel p:last-child{margin-bottom:0}
.panel strong{color:var(--pink-deep)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem}
.stat{border-radius:var(--r);padding:1.8rem 1rem 1.4rem;text-align:center;color:#fff;
  box-shadow:var(--soft);transition:transform .2s}
.stat:hover{transform:translateY(-8px) scale(1.04) rotate(-1deg)}
.stat--a{background:linear-gradient(150deg,#FFA6C9,#FF6FA0)}
.stat--b{background:linear-gradient(150deg,#BBA1FF,#9B6BFF)}
.stat--c{background:linear-gradient(150deg,#9DEFC9,#54D6A6)}
.stat--d{background:linear-gradient(150deg,#FFD89B,#FFB066)}
.stat__emoji{display:block;font-size:1.8rem;margin-bottom:.3rem}
.stat__num{display:block;font-family:'Baloo 2',cursive;font-weight:800;font-size:2.8rem;line-height:1}
.stat__lbl{font-family:'Baloo 2',cursive;font-weight:600;font-size:.82rem;letter-spacing:.3px}

/* ===================== HOW TO BUY (alternating timeline) ===================== */
.timeline{position:relative;max-width:920px;margin:0 auto 3rem;padding:1rem 0}
.timeline::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:4px;transform:translateX(-50%);
  background:linear-gradient(180deg,var(--pink),var(--lavender),var(--mint-deep));border-radius:4px;opacity:.6}
.tl-item{position:relative;width:50%;padding:1.4rem 2.4rem}
.tl-item--left{left:0;text-align:right}
.tl-item--right{left:50%}
.tl-item::after{content:"";position:absolute;top:2.6rem;width:18px;height:18px;border-radius:50%;
  background:#fff;border:4px solid var(--pink-deep);box-shadow:var(--soft-sm)}
.tl-item--left::after{right:-9px}
.tl-item--right::after{left:-9px}
.step{position:relative;background:rgba(255,255,255,.88);backdrop-filter:blur(6px);border-radius:var(--r);
  padding:2.6rem 1.5rem 1.5rem;box-shadow:var(--soft);text-align:left;transition:transform .2s}
.step:hover{transform:translateY(-6px) scale(1.02)}
.step__no{position:absolute;top:-22px;left:1.5rem;
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  font-family:'Baloo 2',cursive;font-weight:800;font-size:1.45rem;color:#fff;
  box-shadow:var(--soft-sm)}
.step--a .step__no{background:linear-gradient(150deg,#FFA6C9,#FF6FA0)}
.step--b .step__no{background:linear-gradient(150deg,#BBA1FF,#9B6BFF)}
.step--c .step__no{background:linear-gradient(150deg,#9DEFC9,#54D6A6)}
.step--d .step__no{background:linear-gradient(150deg,#FFD89B,#FFB066)}
.step h3{font-family:'Baloo 2',cursive;font-weight:700;font-size:1.1rem;margin:.4rem 0 .6rem;color:var(--purple)}
.step p{font-size:.95rem;line-height:1.6;color:var(--ink-soft);font-weight:500}
.step p strong{color:var(--pink-deep)}
.howto__cta{text-align:center}

/* ===================== CHART ===================== */
.chart__frame{max-width:1000px;margin:auto;width:100%}
.dexscreener-embed{position:relative;width:100%;padding-bottom:125%;
  border:6px solid #fff;border-radius:var(--r);overflow:hidden;
  box-shadow:var(--soft);background:#1a1226}
@media(min-width:700px){.dexscreener-embed{padding-bottom:62%}}
.dexscreener-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.chart__note{margin-top:1rem;font-size:.9rem;font-weight:600;color:var(--ink-soft);text-align:center}
.chart__note a{color:var(--pink-deep);font-weight:700}

/* ===================== JOIN US (side-by-side) ===================== */
.joinus__row{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center;max-width:1140px;margin:auto}
.joinus__art{position:relative;display:inline-block}
.joinus__img{position:relative;display:block;width:100%;border-radius:var(--r);border:7px solid #fff;
  box-shadow:0 24px 50px rgba(255,111,160,.35);transform:rotate(-1.5deg);transition:transform .3s}
.joinus__img:hover{transform:rotate(0) scale(1.01)}
.joinus__sticker{position:absolute;font-size:3rem;z-index:2;filter:drop-shadow(0 6px 8px rgba(122,80,120,.3));animation:bob 3.5s ease-in-out infinite}
.joinus__sticker--1{top:-26px;left:-18px;transform:rotate(-12deg)}
.joinus__sticker--2{bottom:-26px;right:-16px;animation-delay:.6s}
.joinus__lead{font-size:1.3rem;line-height:1.7;margin-bottom:2rem;font-weight:500;color:var(--ink-soft)}
.joinus__lead strong{color:var(--purple);font-weight:700}
.socials{display:flex;flex-direction:column;gap:1rem}
.social{display:flex;align-items:center;gap:.7rem;font-family:'Baloo 2',cursive;font-weight:700;font-size:1rem;
  padding:1rem 1.6rem;border-radius:50px;color:#fff;
  box-shadow:var(--soft-sm);transition:transform .15s,box-shadow .15s}
.social:hover{transform:translateX(8px) scale(1.02);box-shadow:var(--soft)}
.social__icon{font-size:1.3rem}
.social--x{background:linear-gradient(120deg,#5a5a72,#2f2f44)}
.social--buy{background:linear-gradient(120deg,var(--pink-deep),var(--purple))}

/* ===================== FOOTER ===================== */
.footer{text-align:center;padding:3.5rem 6vw 4rem;position:relative;z-index:1;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.7));border-top:2px solid rgba(255,143,177,.25)}
.footer__logo{width:66px;height:66px;object-fit:cover;border-radius:50%;border:4px solid #fff;box-shadow:var(--soft-sm);animation:swing 4s ease-in-out infinite}
.footer__name{font-family:'Baloo 2',cursive;font-weight:800;font-size:1.6rem;margin:.6rem 0 1rem;
  background:linear-gradient(90deg,var(--pink-deep),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}
.footer__links{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;font-weight:600;margin-bottom:1.4rem;color:var(--ink)}
.footer__links a:hover{color:var(--pink-deep)}
.footer__disc{font-size:.78rem;color:var(--ink-soft);opacity:.8;max-width:640px;margin:auto;line-height:1.6;font-weight:500}

/* ===================== TOAST ===================== */
.toast{position:fixed;left:50%;bottom:30px;
  transform:translateX(-50%) translateY(140%);
  background:linear-gradient(120deg,var(--pink),var(--pink-deep));color:#fff;font-family:'Baloo 2',cursive;font-weight:700;
  padding:.85rem 1.7rem;border-radius:50px;box-shadow:0 14px 30px rgba(255,111,160,.5);
  z-index:90;transition:transform .35s cubic-bezier(.18,.89,.32,1.28)}
.toast.show{transform:translateX(-50%) translateY(0)}

/* ===================== NEW REVEAL ANIMATIONS (directional pops) ===================== */
.reveal{opacity:0;transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1)}
.reveal--left{transform:translateX(-60px) rotate(-2deg)}
.reveal--right{transform:translateX(60px) rotate(2deg)}
.reveal--pop{transform:scale(.7)}
.reveal.in{opacity:1;transform:none}

/* ===================== RESPONSIVE ===================== */
@media(max-width:900px){
  .nav__links{position:fixed;top:0;right:-100%;height:100vh;width:72%;max-width:330px;
    flex-direction:column;justify-content:center;gap:2rem;font-size:1.3rem;
    background:rgba(255,255,255,.96);backdrop-filter:blur(16px);box-shadow:-10px 0 30px rgba(155,107,255,.18);
    transition:right .35s ease;z-index:45}
  .nav__links.open{right:0}
  .nav__burger{display:flex;order:3}
  .nav__cta{display:none}
  .hero__inner{grid-template-columns:1fr;text-align:center;gap:2rem}
  .hero__copy{order:2}
  .hero__art{order:1}
  .badge,.hero__cta,.hero__bio{margin-left:auto;margin-right:auto}
  .hero__bio{max-width:46ch}
  .about__row,.joinus__row{grid-template-columns:1fr;gap:2rem}
  .ca__addr{max-width:55vw}

  /* timeline collapses to single side */
  .timeline::before{left:18px}
  .tl-item{width:100%;left:0!important;padding:1rem 0 1rem 3rem;text-align:left}
  .tl-item--left::after,.tl-item--right::after{left:9px;right:auto}
}
@media(max-width:520px){
  .section{padding:4.5rem 6vw}
  .stats{grid-template-columns:1fr 1fr}
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  .reveal{opacity:1!important;transform:none!important}
}
