/* SLEDMIG — тёмный лендинг. Self-contained, без внешних ресурсов. */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#05060c; --ink:#eef1fb; --mut:#8b93b2; --line:rgba(255,255,255,.09);
  --c1:#7c5cff; --c2:#16d6c9; --c3:#ff5d9e; --c4:#3b82f6;
}
html,body{height:100%}
body{
  background:var(--bg); color:var(--ink); min-height:100vh; overflow-x:hidden;
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased; display:grid; place-items:center; position:relative;
}
/* живой ауроровый фон из плывущих радиальных пятен */
.aurora{position:fixed;inset:-30vmax;z-index:0;filter:blur(90px) saturate(135%);opacity:.85;pointer-events:none}
.aurora span{position:absolute;border-radius:50%;mix-blend-mode:screen;animation:drift 26s ease-in-out infinite}
.aurora .a{width:46vmax;height:46vmax;left:6%;top:2%;background:radial-gradient(circle at 30% 30%,var(--c1),transparent 60%)}
.aurora .b{width:40vmax;height:40vmax;right:4%;top:8%;background:radial-gradient(circle at 60% 40%,var(--c2),transparent 60%);animation-delay:-6s}
.aurora .c{width:50vmax;height:50vmax;left:18%;bottom:-12%;background:radial-gradient(circle at 50% 50%,var(--c3),transparent 60%);animation-delay:-12s}
.aurora .d{width:34vmax;height:34vmax;right:14%;bottom:-6%;background:radial-gradient(circle at 50% 50%,var(--c4),transparent 60%);animation-delay:-18s}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(6vmax,-4vmax) scale(1.12)}66%{transform:translate(-5vmax,5vmax) scale(.92)}}
/* зернистость поверх — даёт «киношную» текстуру */
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* виньетка */
body::after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 80% at 50% 30%,transparent 55%,rgba(0,0,0,.55) 100%)}

.card{position:relative;z-index:2;width:min(92vw,640px);margin:24px;padding:52px 46px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  border:1px solid var(--line);border-radius:28px;backdrop-filter:blur(22px) saturate(120%);
  box-shadow:0 40px 120px -40px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.08);
  text-align:center;animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

.pill{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--mut);border:1px solid var(--line);
  padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.03)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--c2);
  box-shadow:0 0 0 0 rgba(22,214,201,.6);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(22,214,201,.55)}70%{box-shadow:0 0 0 12px rgba(22,214,201,0)}100%{box-shadow:0 0 0 0 rgba(22,214,201,0)}}

.mark{margin:26px 0 6px;font-weight:800;letter-spacing:.34em;font-size:clamp(34px,8vw,62px);
  line-height:1;padding-left:.34em;
  background:linear-gradient(110deg,var(--c1),var(--c2),var(--c3),var(--c1));
  background-size:280% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shift 9s linear infinite}
@keyframes shift{to{background-position:280% 0}}
.sub{color:var(--ink);opacity:.92;font-size:15px;letter-spacing:.32em;text-transform:uppercase}
.lead{margin:22px auto 0;max-width:430px;color:var(--mut);font-size:16px}

.form{display:flex;gap:10px;margin:30px auto 4px;max-width:420px}
.form input{flex:1;min-width:0;background:rgba(255,255,255,.04);border:1px solid var(--line);
  color:var(--ink);padding:13px 16px;border-radius:13px;font-size:15px;outline:none;transition:.2s}
.form input::placeholder{color:#5f6786}
.form input:focus{border-color:rgba(124,92,255,.6);box-shadow:0 0 0 4px rgba(124,92,255,.16)}
.form button{border:0;cursor:pointer;padding:13px 20px;border-radius:13px;font-weight:700;font-size:15px;
  color:#0a0b12;background:linear-gradient(120deg,var(--c2),var(--c1));transition:.2s}
.form button:hover{filter:brightness(1.08);transform:translateY(-1px)}
.hint{margin-top:12px;font-size:12.5px;color:#5f6786}

.meta{position:relative;z-index:2;margin:22px;color:#525a78;font-size:12.5px;letter-spacing:.06em}
.meta a{color:#7b83a3;text-decoration:none}.meta a:hover{color:var(--ink)}
@media(max-width:520px){.card{padding:40px 24px}.form{flex-direction:column}}
