*{box-sizing:border-box}
:root{
  color-scheme:dark;
  --bg:#07060d;
  --ink:#f8efff;
  --purple:#b33cff;
  --violet:#7c2cff;
  --cyan:#19fff0;
  --pink:#f059ff;
}
html,body{min-height:100%}
body{
  margin:0;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 50% 34%,rgba(179,60,255,.14),transparent 31rem),
    radial-gradient(circle at 36% 52%,rgba(25,255,240,.08),transparent 30rem),
    radial-gradient(circle at 80% 80%,rgba(124,44,255,.07),transparent 28rem),
    var(--bg);
  color:var(--ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.018),transparent 35%,rgba(0,0,0,.22));
  background:#000 !important;
}
#stars{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}
.hero{
  position:relative;
  z-index:1;
  width:min(1120px,92vw);
  min-height:100svh;
  margin:auto;
  padding:4.5vh 0 6vh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.brand{
  width:min(770px,78vw);
  margin-bottom:clamp(8rem,1vh,1rem);
  filter:drop-shadow(0 0 18px rgba(179,60,255,.35)) drop-shadow(0 0 34px rgba(25,255,240,.12));
  filter:none !important;
}
.brand img{display:block;width:100%;height:auto}
.content{margin-top:clamp(-1rem,-1.3vw,-.2rem)}
h1{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(3.3rem,8.3vw,6.1rem);
  line-height:.9;
  letter-spacing:-.055em;
  color:#f4d8ff;
  text-shadow:
    0 0 8px rgba(240,89,255,.9),
    0 0 24px rgba(179,60,255,.68),
    0 0 58px rgba(124,44,255,.48);
}
.eyebrow{
  margin:1rem 0 2.35rem;
  color:#8efff7;
  font-size:clamp(.72rem,1.25vw,1.05rem);
  letter-spacing:.38em;
  text-transform:uppercase;
}
.rule{
  width:min(280px,52vw);
  height:1px;
  margin:0 auto 2rem;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
  box-shadow:0 0 12px var(--cyan);
}
.badge{
  display:inline-block;
  padding:.62rem 1.5rem;
  border:1px solid rgba(240,89,255,.65);
  border-radius:999px;
  color:#f58cff;
  background:rgba(91,18,115,.16);
  box-shadow:inset 0 0 18px rgba(179,60,255,.12),0 0 15px rgba(179,60,255,.2);
  font-weight:700;
  font-size:.85rem;
  letter-spacing:.24em;
  text-transform:uppercase;
}
h2{
  margin:3.0rem 0 0rem 0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.4rem,2.25vw,2.2rem);
  font-style:italic;
  color:#f5ceff;
  text-shadow:0 0 9px var(--pink),0 0 22px rgba(179,60,255,.7);
}
.follow{
  margin:1.25rem 0 1.8rem;
  color:#9ffcf6;
  font-size:clamp(.85rem,1.1vw,1rem);
}
.socials{display:flex;justify-content:center;gap:1rem}
.socials a{
  width:48px;height:48px;
  display:grid;place-items:center;
  border:1px solid rgba(25,255,240,.45);
  border-radius:50%;
  color:var(--cyan);
  background:rgba(11,27,31,.45);
  box-shadow:0 0 14px rgba(25,255,240,.18);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.socials a:nth-child(2){color:#ee7bff;border-color:rgba(240,89,255,.5)}
.socials a:hover,.socials a:focus-visible{
  transform:translateY(-2px) scale(1.04);
  border-color:currentColor;
  box-shadow:0 0 22px currentColor;
  outline:none;
}
.socials svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (max-height:760px) and (min-width:700px){
  .hero{padding-block:2rem}
  .brand{width:min(620px,68vw)}
  h1{font-size:clamp(3.2rem,7vw,6rem)}
  .eyebrow{margin-bottom:1.4rem}
  .rule{margin-bottom:1.25rem}
  .follow{margin-top:1.7rem}
}
@media (max-width:600px){
  .hero{width:94vw;padding:2.2rem 0 3rem;justify-content:flex-start}
  .brand{width:96vw;margin-top:2rem}
  .content{margin-top:.4rem}
  h1{font-size:clamp(3.4rem,17vw,5.2rem)}
  .eyebrow{letter-spacing:.25em}
}
@media (prefers-reduced-motion:reduce){
  .socials a{transition:none}
}
