:root{
  --pink-a:#fe3c72;--pink-b:#ff655b;--pink-c:#ff8e61;--bg:#08080c;--border:#26262f;
  --muted:#9a9aab;--grad:linear-gradient(135deg,var(--pink-a),var(--pink-b) 55%,var(--pink-c));
  --padx:clamp(24px,5vw,80px);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;color:#f4f4f7;-webkit-font-smoothing:antialiased;background:var(--bg)}
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(55% 50% at 8% 12%,rgba(254,60,114,.16),transparent 60%),
    radial-gradient(45% 45% at 96% 96%,rgba(255,142,97,.10),transparent 60%)}
.page{position:relative;z-index:1;min-height:100svh;display:flex;flex-direction:column;padding:0 var(--padx)}

/* top: бренд слева, «Закрыть» справа (на главную) */
.top{display:flex;align-items:center;justify-content:space-between;padding:clamp(22px,3.5vw,38px) 0}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff}
.brand img{width:38px;height:38px;border-radius:11px}.brand b{font-weight:800;font-size:17px}
.close{color:var(--muted);text-decoration:none;font-size:15px;font-weight:500;transition:color .2s}
.close:hover{color:#fff}

/* центр: форма по вертикали, по левому краю */
.center{flex:1;display:flex;align-items:center;padding:24px 0}
.block{width:100%;max-width:600px;min-width:0}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--pink-a);margin-bottom:14px}
h1{font-size:clamp(34px,5vw,52px);font-weight:900;letter-spacing:-.03em;line-height:1;margin-bottom:14px}
.lead{color:var(--muted);font-size:17px;line-height:1.55;margin-bottom:36px;max-width:46ch}

.alert{border:1px solid var(--border);border-radius:14px;padding:14px 16px;font-size:14px;margin-bottom:26px}
.alert--success{background:rgba(40,200,120,.12);border-color:rgba(40,200,120,.4);color:#9ef0c0}

.row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.group{margin-bottom:22px}
label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin:0 0 8px}
.field{width:100%;background:transparent;border:0;border-bottom:2px solid var(--border);color:#f4f4f7;
  font-family:inherit;font-size:17px;padding:10px 2px;outline:none;transition:border-color .15s}
.field:focus{border-color:var(--pink-a)}
.field::placeholder{color:#6a6a76}
textarea.field{resize:vertical;min-height:120px;border:2px solid var(--border);border-radius:14px;padding:14px}
select.field{appearance:none;-webkit-appearance:none}
.err{color:#ff7a7a;font-size:13px;margin-top:6px}
/* подсветка невалидных полей (клиентская валидация, без нативных пузырей) */
.field.invalid{border-bottom-color:#ff5a5a}
textarea.field.invalid{border-color:#ff5a5a}
.check.invalid{outline:2px solid #ff5a5a;outline-offset:2px;border-radius:5px}

/* обязательное согласие */
.consent-group{margin-top:6px;max-width:46ch}
.consent{display:flex;align-items:flex-start;gap:11px;cursor:pointer}
.consent .check{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--pink-a);cursor:pointer}
.consent span{font-size:13.5px;line-height:1.45;color:var(--muted)}
.consent a{color:#ff7aa8;text-decoration:none;border-bottom:1px solid rgba(255,122,168,.45)}
.consent a:hover{color:#fff;border-bottom-color:#fff}

.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;font-family:inherit;
  font-size:16px;font-weight:700;color:#fff;text-decoration:none;padding:16px 40px;margin-top:6px;cursor:pointer;
  background:var(--grad);box-shadow:0 14px 34px rgba(254,60,114,.35)}
.btn:hover{filter:brightness(1.05)}

/* низ: меню как на главной */
.foot{padding:clamp(18px,3vw,26px) 0;font-size:14px;color:var(--muted)}
.foot a{color:var(--muted);text-decoration:none;transition:color .2s}.foot a:hover{color:#fff}
.foot .dot{margin:0 9px;opacity:.5}

@media(max-width:560px){.row{grid-template-columns:1fr;gap:0}.lead{font-size:16px}}

/* ---------- success-стейт (после успешной отправки) ---------- */
.success{display:flex;flex-direction:column;align-items:flex-start;animation:rise .55s both}
.success__icon{position:relative;width:88px;height:88px;border-radius:50%;background:var(--grad);
  display:flex;align-items:center;justify-content:center;margin-bottom:28px;
  box-shadow:0 18px 50px rgba(254,60,114,.45);animation:pop .55s cubic-bezier(.2,.8,.3,1.4) both}
.success__icon::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(254,60,114,.55);
  opacity:0;animation:ring 1.1s .15s ease-out forwards}
.success__icon svg{width:46px;height:46px}
.success__icon path{fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:30;stroke-dashoffset:30;animation:draw .45s .3s ease forwards}
.success h1{margin-bottom:12px}
.success__text{color:var(--muted);font-size:17px;line-height:1.55;max-width:42ch;margin-bottom:30px}
.success__actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.success .link{color:var(--muted);text-decoration:none;font-size:15px}
.success .link:hover{color:#fff}

@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes ring{0%{opacity:.7;transform:scale(.78)}100%{opacity:0;transform:scale(1.5)}}
@media(prefers-reduced-motion:reduce){
  .success,.success__icon{animation:none}
  .success__icon::after{display:none}
  .success__icon path{animation:none;stroke-dashoffset:0}
}
