:root{
  --saffron:#E8721A;
  --saffron-light:#F5B33C;
  --gold-pale:#FFE7B8;
  --ivory:#FFF6E8;
  --ink:#0B0503;
  --ink-mid:#1A0805;
  --ink-warm:#3A1608;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);font-family:'Lora',Georgia,serif;color:var(--ivory)}
img{max-width:100%;display:block}
a{color:var(--saffron-light);text-decoration:none}
a:hover{color:var(--gold-pale)}

.stage{
  position:relative;
  width:100%;
  min-height:100svh;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(46px,9vw,88px) clamp(22px,5vw,48px);
  background:radial-gradient(ellipse at 50% 42%,var(--ink-warm) 0%,var(--ink-mid) 45%,var(--ink) 100%);
}

.bg-image{
  position:absolute;inset:0;z-index:0;
  background-image:url('assets/background.png');
  background-size:cover;background-position:center;
  opacity:.9;
}
.bg-scrim{
  position:absolute;inset:0;z-index:1;
  background:radial-gradient(ellipse at 50% 45%,rgba(58,22,8,.32) 0%,rgba(11,5,3,.86) 62%,rgba(11,5,3,.97) 100%);
}

.starfield{
  position:absolute;inset:-10% 0;z-index:1;pointer-events:none;opacity:.55;
  animation:drift 24s linear infinite alternate;
  background-image:
    radial-gradient(1.4px 1.4px at 12% 18%,var(--gold-pale),transparent),
    radial-gradient(1.2px 1.2px at 78% 12%,#F5C877,transparent),
    radial-gradient(1.6px 1.6px at 33% 66%,#FFFDF6,transparent),
    radial-gradient(1.2px 1.2px at 88% 58%,#FFD79A,transparent),
    radial-gradient(1.3px 1.3px at 58% 84%,#FFF3DC,transparent),
    radial-gradient(1.1px 1.1px at 6% 78%,var(--saffron-light),transparent),
    radial-gradient(1.4px 1.4px at 68% 33%,#FFFDF6,transparent),
    radial-gradient(1.1px 1.1px at 44% 8%,#FFD79A,transparent),
    radial-gradient(1.2px 1.2px at 92% 88%,var(--gold-pale),transparent),
    radial-gradient(1.3px 1.3px at 22% 42%,#FFFDF6,transparent);
}

.glow-cursor{
  position:absolute;left:50%;top:42%;
  transform:translate(-50%,-50%);
  width:min(440px,80vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(232,114,26,.3),rgba(245,179,60,.1) 45%,transparent 72%);
  pointer-events:none;z-index:2;mix-blend-mode:screen;
  transition:left .35s ease-out,top .35s ease-out;
}
.glow-aura{
  position:absolute;left:50%;top:44%;
  width:min(820px,150vw);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(226,114,26,.22),transparent 66%);
  animation:auraPulse 7s ease-in-out infinite;
  pointer-events:none;z-index:2;mix-blend-mode:screen;
}

.frame{
  position:absolute;inset:clamp(12px,3vw,24px);
  border:1px solid rgba(245,179,60,.28);
  pointer-events:none;z-index:3;
}

.content{
  position:relative;z-index:4;
  width:100%;max-width:600px;
  display:flex;flex-direction:column;align-items:center;text-align:center;
}

.eyebrow{
  margin:0 0 26px;
  font-size:11px;letter-spacing:clamp(3px,1.2vw,5px);
  text-transform:uppercase;color:var(--saffron-light);
  animation:fadeUp .8s ease .05s both;
}

.logo{
  width:min(100%,520px);height:auto;
  filter:drop-shadow(0 0 40px rgba(232,114,26,.5));
  animation:fadeUp .9s ease .15s both;
}

.rule{
  width:80px;height:1px;margin-top:26px;
  background:linear-gradient(90deg,transparent,var(--saffron-light),transparent);
  animation:drawLine 1.1s ease .5s both;
}

.tagline{
  margin:24px 0 0;
  font-size:12px;letter-spacing:clamp(2.5px,1.1vw,5px);
  text-transform:uppercase;color:var(--gold-pale);
  animation:fadeUp .8s ease .25s both;
}

.lede{
  margin:26px 0 0;max-width:470px;
  font-style:italic;font-size:clamp(15px,4vw,17px);line-height:1.8;
  color:rgba(255,236,209,.75);text-wrap:pretty;
  animation:fadeUp .8s ease .35s both;
}

.waitlist{
  width:100%;margin-top:44px;
  display:flex;flex-direction:column;gap:14px;
  animation:fadeUp .8s ease .45s both;
}
.waitlist input{
  width:100%;min-height:50px;padding:15px 18px;border-radius:0;
  background:rgba(46,18,7,.55);
  border:1px solid rgba(245,179,60,.35);
  font-family:'Lora',Georgia,serif;font-size:16px;color:var(--ivory);
  outline:none;transition:border-color .2s ease,background .2s ease;
}
.waitlist input::placeholder{color:rgba(255,236,209,.45)}
.waitlist input:focus{border-color:var(--saffron-light);background:rgba(70,26,10,.7)}

.waitlist button{
  margin-top:6px;min-height:52px;padding:17px 22px;border-radius:0;
  background:linear-gradient(180deg,#F0912A,#D2600F);
  border:1px solid var(--saffron-light);
  color:var(--ivory);font-family:'Lora',Georgia,serif;font-weight:600;
  font-size:12px;letter-spacing:3px;text-transform:uppercase;
  cursor:pointer;box-shadow:0 0 28px rgba(232,114,26,.4);
  transition:transform .2s ease,box-shadow .2s ease;
}
.waitlist button:hover{transform:translateY(-1px);box-shadow:0 0 36px rgba(232,114,26,.55)}

.error{margin:0;text-align:left;font-size:12px;color:#FF9E6B}
.fineprint{margin:0;font-size:11px;letter-spacing:1px;color:rgba(255,236,209,.5)}

.success{
  width:100%;margin-top:44px;padding:34px 30px;
  border:1px solid rgba(245,179,60,.42);
  background:rgba(70,26,10,.5);
  backdrop-filter:blur(6px);
  animation:fadeUp .6s ease both;
}
.success-title{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:clamp(24px,7vw,30px);color:var(--ivory)}
.success-body{margin:12px 0 0;font-size:14px;line-height:1.7;color:rgba(255,236,209,.75)}

.socials{
  display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:46px;
  animation:fadeUp .8s ease .55s both;
}
.socials a{
  width:44px;height:44px;flex:0 0 auto;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(245,179,60,.45);
  font-size:10px;letter-spacing:.5px;color:var(--gold-pale);
  transition:all .25s ease;
}
.socials a:hover{border-color:var(--saffron-light);color:var(--ivory);transform:scale(1.1);box-shadow:0 0 18px rgba(232,114,26,.55)}

.copyright{margin:34px 0 0;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,236,209,.45)}

@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes drawLine{from{width:0}to{width:80px}}
@keyframes auraPulse{
  0%,100%{opacity:.45;transform:translate(-50%,-50%) scale(1)}
  50%{opacity:.8;transform:translate(-50%,-50%) scale(1.08)}
}
@keyframes drift{from{transform:translateY(0)}to{transform:translateY(-60px)}}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
}