/* PEPONS lottery entry points + compact live burn pill */
.header-burn-pill{display:inline-flex;align-items:center;gap:.45rem;min-height:2rem;padding:.48rem .78rem;border:1px solid rgba(126,240,198,.28);border-radius:999px;background:rgba(5,17,13,.7);color:#dce8e3;text-decoration:none;font-size:.66rem;letter-spacing:.04em;white-space:nowrap;backdrop-filter:blur(10px);transition:transform .25s ease,border-color .25s ease,background .25s ease}
.header-burn-pill:hover{transform:translateY(-2px);border-color:#68e0b5;background:rgba(13,31,24,.9)}
.header-burn-pill .burn-flame{color:#68e0b5;font-size:.8rem}
.header-burn-pill [data-header-burn]{color:#8ff4cf;font-weight:700}
.topbar-nav .lottery-nav{color:#8ff4cf}

.lottery-teaser{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2rem;margin-top:.35rem;padding:clamp(1.5rem,3vw,2.4rem);border:1px solid rgba(126,240,198,.2);border-radius:24px;overflow:hidden;background:radial-gradient(70% 180% at 0% 50%,rgba(104,224,181,.14),transparent 65%),linear-gradient(115deg,rgba(11,22,18,.96),rgba(3,7,6,.98));text-decoration:none;color:inherit;isolation:isolate;transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.lottery-teaser:before{content:"";position:absolute;inset:-60% -15%;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.065) 48%,transparent 58%);transform:translateX(-45%);transition:transform .75s ease;z-index:-1}
.lottery-teaser:hover{transform:translateY(-3px);border-color:rgba(126,240,198,.55);box-shadow:0 18px 50px rgba(0,0,0,.24)}
.lottery-teaser:hover:before{transform:translateX(45%)}
.lottery-teaser-kicker{margin:0 0 .65rem;color:#68e0b5;font-size:.72rem;letter-spacing:.12em}
.lottery-teaser h3{margin:0;font-size:clamp(1.65rem,4.6vw,3.6rem);line-height:.98;letter-spacing:-.055em;color:#f1f8f5}
.lottery-teaser-copy{max-width:42rem;margin:.8rem 0 0;color:#a9b8b2;font-size:clamp(.95rem,1.35vw,1.12rem)}
.lottery-teaser-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-top:1rem;color:#899a93;font-size:.69rem;letter-spacing:.06em}
.lottery-teaser-meta strong{color:#8ff4cf}
.lottery-teaser-cta{display:inline-flex;align-items:center;justify-content:center;min-width:10rem;padding:.95rem 1.35rem;border-radius:999px;background:#68e0b5;color:#04120c;font-weight:800;font-size:.75rem;letter-spacing:.07em;white-space:nowrap}
.lottery-teaser-arrow{margin-left:.45rem;font-size:1.05em}

@media(max-width:1050px){.header-burn-pill{padding:.45rem .62rem}.header-burn-pill .burn-word{display:none}}
@media(max-width:900px){.header-burn-pill{font-size:.61rem;min-height:1.9rem}.lottery-teaser{grid-template-columns:1fr;gap:1.35rem}.lottery-teaser-cta{justify-self:start}.lottery-teaser h3{font-size:clamp(2rem,10vw,3.6rem)}}
@media(max-width:560px){#topbar{gap:.5rem}.header-burn-pill{padding:.42rem .55rem}.header-burn-pill .burn-flame{display:none}.header-burn-pill .burn-unit{display:none}.lottery-teaser{border-radius:19px;padding:1.35rem}.lottery-teaser-cta{width:100%}}

/* V5 header burn treatment: more separation + animated flame/embers */
.header-burn-pill{
  position:relative;
  margin-right:1rem;
  overflow:visible;
  box-shadow:0 0 0 rgba(104,224,181,0);
}
.header-burn-pill::after{
  content:"";
  position:absolute;
  inset:-5px;
  border-radius:999px;
  border:1px solid rgba(104,224,181,.16);
  opacity:0;
  pointer-events:none;
  animation:burn-ring 2.8s ease-out infinite;
}
.header-burn-pill .burn-flame{
  position:relative;
  width:13px;
  height:16px;
  flex:0 0 13px;
  display:inline-block;
  font-size:0;
  filter:drop-shadow(0 0 5px rgba(104,224,181,.55));
  animation:burn-float 1.6s ease-in-out infinite;
}
.header-burn-pill .burn-flame::before{
  content:"";
  position:absolute;
  left:2px;
  bottom:1px;
  width:10px;
  height:13px;
  border-radius:75% 25% 68% 32% / 76% 30% 70% 24%;
  background:linear-gradient(145deg,#d8fff0 0%,#68e0b5 36%,#1a7c5b 75%,rgba(7,31,23,.15) 100%);
  transform:rotate(42deg) skew(-4deg,-3deg);
  transform-origin:50% 80%;
  animation:burn-flicker .72s ease-in-out infinite alternate;
}
.header-burn-pill .burn-flame::after{
  content:"";
  position:absolute;
  left:5px;
  bottom:3px;
  width:5px;
  height:8px;
  border-radius:70% 30% 70% 30%;
  background:rgba(238,255,248,.92);
  transform:rotate(42deg);
  animation:burn-core .54s ease-in-out infinite alternate;
}
.header-burn-pill:hover{
  box-shadow:0 0 22px rgba(104,224,181,.18);
}
.header-burn-pill:hover .burn-flame{
  filter:drop-shadow(0 0 8px rgba(104,224,181,.9));
}
@keyframes burn-flicker{
  0%{transform:rotate(38deg) skew(-6deg,-4deg) scale(.92,1.06)}
  45%{transform:rotate(45deg) skew(0,-7deg) scale(1.07,.94)}
  100%{transform:rotate(40deg) skew(4deg,-2deg) scale(.98,1.12)}
}
@keyframes burn-core{
  from{transform:rotate(38deg) scale(.75,.95);opacity:.65}
  to{transform:rotate(47deg) scale(1.08,1.05);opacity:1}
}
@keyframes burn-float{
  0%,100%{transform:translateY(1px)}
  50%{transform:translateY(-1.5px)}
}
@keyframes burn-ring{
  0%{opacity:.36;transform:scale(.96)}
  55%{opacity:0;transform:scale(1.07)}
  100%{opacity:0;transform:scale(1.07)}
}
@media(max-width:900px){.header-burn-pill{margin-right:.55rem}}
@media(max-width:560px){.header-burn-pill{margin-right:.3rem}.header-burn-pill .burn-flame{display:inline-block;width:11px;height:14px;flex-basis:11px}}
@media(prefers-reduced-motion:reduce){.header-burn-pill::after,.header-burn-pill .burn-flame,.header-burn-pill .burn-flame::before,.header-burn-pill .burn-flame::after{animation:none}}

/* V5.1 header geometry: true centered nav + aligned burn/action controls */
@media (min-width:901px){
  #topbar{position:fixed}
  .topbar-brand{position:relative;z-index:2;flex:0 0 auto}
  .topbar-nav{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    z-index:1;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
  }
  .action-row{
    position:relative;
    z-index:2;
    margin-left:auto;
    align-items:center;
  }
  .header-burn-pill{
    align-self:center;
    margin-right:1.25rem;
    transform:translateY(0);
  }
  .header-burn-pill:hover{transform:translateY(-1px)}
  .buy-art,.social-chip{display:flex;align-items:center;justify-content:center}
  .buy-art img,.social-chip img{display:block}
}

/* Keep the exact-centered nav comfortable before the mobile breakpoint. */
@media (min-width:901px) and (max-width:1180px){
  .topbar-nav{gap:1.05rem}
  .header-burn-pill{margin-right:.8rem;padding:.45rem .58rem}
  .header-burn-pill .burn-unit{display:none}
}

/* Tiny ember accents around the live burn flame. */
.header-burn-pill .burn-flame{isolation:isolate}
.header-burn-pill .burn-flame span{display:none}
.header-burn-pill .burn-flame{--ember:#8ff4cf}
.header-burn-pill .burn-word{position:relative}
.header-burn-pill .burn-word::before,
.header-burn-pill .burn-word::after{
  content:"";
  position:absolute;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#8ff4cf;
  opacity:0;
  pointer-events:none;
  box-shadow:0 0 7px rgba(143,244,207,.9);
}
.header-burn-pill .burn-word::before{
  left:-19px;
  top:45%;
  animation:burn-ember-a 1.85s ease-out infinite;
}
.header-burn-pill .burn-word::after{
  left:-14px;
  top:55%;
  animation:burn-ember-b 2.15s .55s ease-out infinite;
}
@keyframes burn-ember-a{
  0%,22%{opacity:0;transform:translate(0,2px) scale(.65)}
  35%{opacity:.9}
  72%{opacity:.3}
  100%{opacity:0;transform:translate(-4px,-13px) scale(.2)}
}
@keyframes burn-ember-b{
  0%,32%{opacity:0;transform:translate(0,1px) scale(.55)}
  43%{opacity:.75}
  100%{opacity:0;transform:translate(5px,-11px) scale(.15)}
}
@media(prefers-reduced-motion:reduce){.header-burn-pill .burn-word::before,.header-burn-pill .burn-word::after{animation:none}}

/* V6 hero lottery: homepage CTA lives inside the hero; duplicate hero socials removed. */
.hero-lottery-teaser{
  position:relative;
  width:min(42rem, 92%);
  margin-top:clamp(.4rem,1.1vh,.8rem);
  padding:clamp(.9rem,1.4vw,1.15rem) clamp(1rem,1.8vw,1.4rem);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:clamp(1rem,2vw,2rem);
  border:1px solid rgba(126,240,198,.22);
  border-radius:18px;
  background:
    radial-gradient(85% 170% at 0% 50%,rgba(104,224,181,.13),transparent 66%),
    linear-gradient(110deg,rgba(8,20,15,.91),rgba(3,7,6,.96));
  box-shadow:0 18px 50px rgba(0,0,0,.18), inset 0 1px rgba(255,255,255,.04);
  color:inherit;
  text-align:left;
  overflow:hidden;
  isolation:isolate;
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.hero-lottery-teaser::before{
  content:"";
  position:absolute;
  inset:-90% -28%;
  z-index:-1;
  background:linear-gradient(105deg,transparent 43%,rgba(255,255,255,.07) 50%,transparent 57%);
  transform:translateX(-38%);
  transition:transform .75s ease;
}
.hero-lottery-teaser:hover{
  transform:translateY(-2px);
  border-color:rgba(126,240,198,.52);
  box-shadow:0 22px 60px rgba(0,0,0,.28),0 0 28px rgba(104,224,181,.07),inset 0 1px rgba(255,255,255,.06);
}
.hero-lottery-teaser:hover::before{transform:translateX(38%)}
.hero-lottery-main{display:grid;gap:.22rem;min-width:0}
.hero-lottery-kicker{color:#68e0b5;font-size:.58rem;letter-spacing:.13em;white-space:nowrap}
.hero-lottery-title{color:#f1f8f5;font-size:clamp(1rem,1.55vw,1.28rem);font-weight:650;letter-spacing:-.025em;line-height:1.05}
.hero-lottery-meta{color:#83958e;font-size:.56rem;letter-spacing:.055em;white-space:nowrap}
.hero-lottery-meta strong{color:#8ff4cf;font-weight:750}
.hero-lottery-cta{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.48rem;
  min-width:9rem;
  padding:.78rem 1rem;
  border-radius:999px;
  background:#68e0b5;
  color:#04120c;
  font-size:.61rem;
  font-weight:850;
  letter-spacing:.065em;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 8px 22px rgba(104,224,181,.08);
}
.hero-lottery-teaser:hover .hero-lottery-cta{background:#80edc7}

/* With the duplicate hero action row gone, give the remaining focal elements air. */
#hero .hero-lockup{gap:min(1.35rem,2vh)}
#hero .hero-ca{margin-top:clamp(.15rem,.7vh,.4rem)}

@media(max-width:900px){
  .hero-lottery-teaser{width:min(35rem,94vw);margin-top:.35rem;padding:1rem 1rem;border-radius:17px;gap:.8rem}
  .hero-lottery-kicker{font-size:.54rem}
  .hero-lottery-title{font-size:clamp(.98rem,4.5vw,1.2rem)}
  .hero-lottery-meta{font-size:.5rem}
  .hero-lottery-cta{min-width:auto;padding:.72rem .84rem;font-size:.54rem}
}
@media(max-width:560px){
  .hero-lottery-teaser{width:100%;max-width:25rem;display:grid;grid-template-columns:1fr;padding:.95rem;text-align:center;justify-items:center;gap:.75rem}
  .hero-lottery-main{justify-items:center}
  .hero-lottery-kicker,.hero-lottery-meta{white-space:normal;text-align:center}
  .hero-lottery-cta{width:100%;max-width:16rem}
}
@media(prefers-reduced-motion:reduce){.hero-lottery-teaser,.hero-lottery-teaser::before{transition:none}}


/* V7 polish: align the visible BUY button face with TG/X and make the hero lottery
   reveal/use the same glass card treatment on desktop + mobile. */
.buy-art{
  position:relative;
  top:-7px;
}

/* The hero lottery is part of the same intro reveal as the CA pill (JS adds it to
   the exact same GSAP group). Keep the visual treatment consistent at every size. */
.hero-lottery-teaser{
  min-height:84px;
}

@media(max-width:900px){
  .buy-art{top:-6px}
  .hero-lottery-teaser{
    width:min(35rem,94vw);
    min-height:82px;
    margin-top:.45rem;
    padding:.95rem 1rem;
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
    gap:.9rem;
    border:1px solid rgba(126,240,198,.24);
    border-radius:17px;
    background:
      radial-gradient(85% 170% at 0% 50%,rgba(104,224,181,.13),transparent 66%),
      linear-gradient(110deg,rgba(8,20,15,.94),rgba(3,7,6,.97));
    box-shadow:0 16px 42px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.04);
    text-align:left;
  }
  .hero-lottery-main{justify-items:start;text-align:left;min-width:0}
  .hero-lottery-kicker,.hero-lottery-meta{white-space:nowrap;text-align:left}
  .hero-lottery-cta{width:auto;max-width:none;flex:0 0 auto;min-width:8.4rem;padding:.72rem .85rem}
}

@media(max-width:560px){
  .buy-art{top:-5px}
  .hero-lottery-teaser{
    width:calc(100vw - (var(--gutter) * 2));
    max-width:25rem;
    min-height:0;
    padding:.9rem .9rem;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    justify-items:stretch;
    gap:.7rem;
    border:1px solid rgba(126,240,198,.28);
    border-radius:16px;
    background:
      radial-gradient(95% 190% at 0% 50%,rgba(104,224,181,.16),transparent 66%),
      linear-gradient(110deg,rgba(8,20,15,.97),rgba(3,7,6,.985));
    box-shadow:0 14px 36px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.05);
    text-align:left;
  }
  .hero-lottery-main{justify-items:start;text-align:left;gap:.2rem}
  .hero-lottery-kicker{font-size:.48rem;line-height:1.25;white-space:normal;text-align:left}
  .hero-lottery-title{font-size:clamp(.92rem,4.4vw,1.08rem);line-height:1.05}
  .hero-lottery-meta{font-size:.47rem;line-height:1.25;white-space:normal;text-align:left}
  .hero-lottery-cta{
    width:auto;
    max-width:none;
    min-width:0;
    padding:.68rem .72rem;
    font-size:.49rem;
    white-space:nowrap;
  }
}

@media(max-width:390px){
  .hero-lottery-teaser{grid-template-columns:1fr;gap:.65rem}
  .hero-lottery-cta{width:100%;justify-self:stretch}
}