/* ============================================
   ASK YOUR DJ — Shared styles
   Booth black / Laser magenta / Amber cue / Strobe cyan
   ============================================ */
:root{
  --booth:#0A0812;
  --panel:#151021;
  --panel-2:#1D1730;
  --line:#2A2140;
  --laser:#FF2E88;
  --cue:#FFB454;
  --live:#35E0DC;
  --ink:#F2EFFA;
  --dim:#9A92B5;
  --radius:18px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--booth);
  color:var(--ink);
  font-family:'Sora',sans-serif;
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
  min-height:100vh;
}
::selection{background:var(--laser);color:#fff}

.glow{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(600px 400px at 15% -5%, rgba(255,46,136,.14), transparent 70%),
    radial-gradient(700px 500px at 95% 20%, rgba(53,224,220,.08), transparent 70%),
    radial-gradient(500px 400px at 50% 110%, rgba(255,180,84,.07), transparent 70%);
}
main,header,footer,.page{position:relative;z-index:1}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.wrap-narrow{max-width:460px;margin:0 auto;padding:0 20px}

/* nav */
nav{display:flex;align-items:center;justify-content:space-between;padding:20px 0}
.logo{
  font-family:'Unbounded',sans-serif;font-weight:900;font-size:1.05rem;
  letter-spacing:.02em;text-decoration:none;color:var(--ink);
  display:flex;align-items:center;gap:10px;
}
.logo .dot{
  width:12px;height:12px;border-radius:50%;background:var(--laser);
  box-shadow:0 0 12px var(--laser), 0 0 28px rgba(255,46,136,.6);
  animation:pulse 1.6s ease-in-out infinite;
}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
.nav-links{display:flex;gap:12px;align-items:center}
.nav-link{color:var(--dim);text-decoration:none;font-size:15px;font-weight:600}
.nav-link:hover{color:var(--ink)}

/* type */
h1{
  font-family:'Unbounded',sans-serif;font-weight:900;
  font-size:clamp(2rem,6vw,3.4rem);line-height:1.12;letter-spacing:-.01em;
}
h2{
  font-family:'Unbounded',sans-serif;font-weight:700;
  font-size:clamp(1.3rem,3.5vw,2rem);line-height:1.2;
}
.laser-text{color:var(--laser);text-shadow:0 0 34px rgba(255,46,136,.55)}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;font-size:.8rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cue);display:block;margin-bottom:10px;
}
.muted{color:var(--dim)}
.mono{font-family:'IBM Plex Mono',monospace}

/* buttons */
.btn{
  display:inline-block;font-family:'Sora',sans-serif;font-weight:700;font-size:16px;
  padding:15px 30px;border-radius:999px;text-decoration:none;border:none;cursor:pointer;
  transition:transform .15s, box-shadow .2s, opacity .2s;text-align:center;
}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}
.btn-laser{
  color:#fff;background:linear-gradient(120deg,var(--laser),#D6186E);
  box-shadow:0 6px 30px rgba(255,46,136,.4);
}
.btn-laser:hover:not(:disabled){box-shadow:0 6px 44px rgba(255,46,136,.65)}
.btn-ghost{color:var(--ink);background:transparent;border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--dim)}
.btn-block{display:block;width:100%}

/* cards + forms */
.card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:32px 28px;box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.field-label{
  font-size:15px;font-weight:700;color:var(--dim);
  margin:16px 0 6px;text-transform:uppercase;letter-spacing:.08em;display:block;
}
input[type=text],input[type=email],input[type=password]{
  width:100%;background:var(--panel-2);border:1px solid var(--line);
  border-radius:12px;color:var(--ink);font-family:'Sora',sans-serif;
  font-size:16px;padding:14px;outline:none;transition:border-color .2s;
}
input:focus{border-color:var(--laser)}
.form-error{
  background:rgba(255,46,136,.1);border:1px solid rgba(255,46,136,.45);
  color:#FF7AB0;border-radius:12px;padding:12px 16px;font-size:15px;margin-bottom:8px;
}
.form-ok{
  background:rgba(53,224,220,.08);border:1px solid rgba(53,224,220,.4);
  color:var(--live);border-radius:12px;padding:12px 16px;font-size:15px;margin-bottom:8px;
}

/* pills / tags */
.live-pill{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.14em;
  color:var(--live);border:1px solid rgba(53,224,220,.4);border-radius:999px;
  padding:3px 10px;display:inline-flex;align-items:center;gap:6px;
}
.live-pill::before{
  content:"";width:6px;height:6px;border-radius:50%;background:var(--live);
  box-shadow:0 0 8px var(--live);animation:pulse 1.2s infinite;
}
.paid-tag{
  font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:.8rem;
  color:var(--booth);background:var(--cue);border-radius:8px;padding:4px 10px;flex-shrink:0;
}
.free-tag{
  font-family:'IBM Plex Mono',monospace;font-weight:600;font-size:.8rem;
  color:var(--live);border:1px solid rgba(53,224,220,.4);border-radius:8px;
  padding:3px 10px;flex-shrink:0;
}

footer{
  border-top:1px solid var(--line);padding:28px 0;color:var(--dim);
  font-size:15px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  margin-top:60px;
}
footer a{color:var(--dim);text-decoration:none}
footer a:hover{color:var(--ink)}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001s !important;transition-duration:.001s !important}
}
