:root{
  --magenta:#c6168d;--navy:#162142;--purple:#4c1e58;--white:#ffffff;
  --grey:#585a5e;--grey-light:#a8acb2;--mist:#ebf0f7;--pink:#f7cae2;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Montserrat',system-ui,sans-serif;
  color:var(--white);
  background:
    radial-gradient(900px 520px at 85% -10%, rgba(198,22,141,.38), transparent 60%),
    radial-gradient(760px 540px at 0% 120%, rgba(76,30,88,.6), transparent 55%),
    var(--navy);
  -webkit-font-smoothing:antialiased;
  display:flex;flex-direction:column;min-height:100%;
  position:relative;overflow:hidden;
}
.grid{
  position:absolute;inset:0;z-index:0;opacity:.4;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(circle at 80% 0%,#000,transparent 70%);
  mask-image:radial-gradient(circle at 80% 0%,#000,transparent 70%);
}
main{
  position:relative;z-index:1;flex:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:48px 24px;gap:6px;
}
.logo{height:38px;width:auto;margin-bottom:34px;filter:brightness(0) invert(1)}
.pill{
  display:inline-flex;align-items:center;gap:9px;
  font-family:'JetBrains Mono',monospace;font-size:.74rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.18em;color:var(--pink);
  border:1px solid rgba(247,202,226,.35);border-radius:999px;padding:7px 16px;
  margin-bottom:26px;
}
.pill .dot{
  width:9px;height:9px;border-radius:50%;background:var(--magenta);
  box-shadow:0 0 0 0 rgba(198,22,141,.6);animation:pulse 1.8s ease-out infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(198,22,141,.55)}
  70%{box-shadow:0 0 0 10px rgba(198,22,141,0)}
  100%{box-shadow:0 0 0 0 rgba(198,22,141,0)}
}
h1{
  font-size:clamp(2.2rem,6vw,3.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;
}
h1 b{color:var(--magenta)}
.region{
  font-family:'JetBrains Mono',monospace;font-size:.95rem;color:rgba(255,255,255,.6);
  margin-top:12px;letter-spacing:.05em;
}
p.lead{
  max-width:520px;color:rgba(255,255,255,.8);font-size:1.05rem;font-weight:400;
  margin-top:18px;line-height:1.6;
}
.bar{
  position:relative;width:min(420px,80vw);height:5px;border-radius:999px;
  background:rgba(255,255,255,.12);overflow:hidden;margin-top:38px;
}
.bar::before{
  content:"";position:absolute;top:0;left:0;height:100%;width:40%;border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--magenta),var(--pink),transparent);
  animation:slide 1.8s ease-in-out infinite;
}
@keyframes slide{
  0%{transform:translateX(-110%)}
  100%{transform:translateX(310%)}
}
.back{
  display:inline-block;margin-top:42px;
  color:var(--pink);text-decoration:none;font-size:.92rem;font-weight:500;
}
.back:hover{text-decoration:underline}
footer{
  position:relative;z-index:1;text-align:center;padding:26px 24px;
  font-family:'JetBrains Mono',monospace;font-size:.76rem;color:rgba(255,255,255,.5);
}
footer a{color:rgba(247,202,226,.85);text-decoration:none;margin:0 4px}
footer a:hover{text-decoration:underline}
@media(prefers-reduced-motion:reduce){
  .pill .dot{animation:none}
  .bar::before{animation:none;transform:none;width:100%;
    background:linear-gradient(90deg,var(--purple),var(--magenta))}
}
