@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap");

:root{
  --violet:#8B5CF6;--violet-dark:#6D28D9;--yellow:#FFD93D;
  --bg1:#0B0F24;--bg2:#24185B;
  --card:#1B1236F2;--card-glow:#9F7AEA33;
  --txt:#fff;--txt2:#cfc2ff;--r:18px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Poppins",system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
     min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
     background:linear-gradient(135deg,var(--bg1),var(--bg2));color:var(--txt)}

/* ── карточка ── */
.box{width:100%;max-width:480px;background:var(--card);border-radius:var(--r);
     box-shadow:0 10px 32px rgba(0,0,0,.6);padding:44px 34px;text-align:center;position:relative;
     opacity:1;transform:none}
.box.animate{opacity:0;transform:translateY(20px)}
.box::before{content:"";position:absolute;inset:0;border-radius:inherit;
             box-shadow:0 0 24px var(--card-glow);pointer-events:none}

h1{font-size:clamp(23px,7vw,40px);margin-bottom:.6em}
.tagline{font-size:clamp(15px,4.5vw,18px);color:var(--txt2);margin:16px 0}
.yellow{color:var(--yellow);font-weight:600}

/* превью-видео */
.preview{width:100%;border-radius:var(--r);margin-bottom:20px}

/* таймер */
.timer{font-weight:600;margin-bottom:18px}
.timer.exp{color:#f87171}

/* кнопки */
.btn{width:100%;padding:16px;border:none;border-radius:var(--r);
     background:linear-gradient(135deg,var(--violet),var(--violet-dark));
     color:#fff;font-size:17px;font-weight:600;cursor:pointer;
     box-shadow:0 6px 20px rgba(0,0,0,.45);transition:.25s}
.btn:hover{transform:translateY(-3px)}
.btn.alt{background:var(--yellow);color:#000;margin-top:14px}

/* отзывы */
.testi-wrap{overflow:hidden;border-top:1px solid #302458;margin-top:26px;padding-top:22px}
#testi{display:flex;transition:.6s}
#testi figure{flex:0 0 100%;padding:0 10px}
#testi blockquote{font-size:17px;font-style:italic;color:var(--txt2);margin-bottom:6px}
#testi figcaption{font-size:14px}

/* тост */
.toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,100%);
       background:#1e293b;color:#fff;padding:12px 20px;border-radius:var(--r);
       box-shadow:0 8px 24px rgba(0,0,0,.5);font-size:14px;opacity:0;transition:.4s}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ── формы (login / register) ── */
input,select{width:100%;padding:16px;border:none;border-radius:var(--r);background:#2A1C48;
             color:#fff;font-size:16px;margin-bottom:14px}
input::placeholder{color:#8b82b0}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='%23cfc2ff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
       background-repeat:no-repeat;background-position:right 16px center}
input:focus,select:focus{outline:none;box-shadow:0 0 0 3px var(--violet-dark)}
.alert{background:#ef4444;border-radius:var(--r);padding:14px;margin-bottom:14px;font-size:15px}
.req{color:#f87171;font-weight:700;margin-left:4px}
.row{display:flex;gap:8px;margin-bottom:14px}
.row select{flex:1}
.btn-secondary{display:block;width:100%;padding:16px;border:none;border-radius:var(--r);
               background:#374151;color:#fff;font-weight:600;font-size:17px;margin-top:12px;text-decoration:none}
.btn-secondary:hover{transform:translateY(-3px);background:#4B5563}
/* ─── Telegram-кнопки ниже отзывов ─── */
.tg-row{display:flex;gap:12px;justify-content:center;margin-top:26px}
.tg-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
        padding:8px;border-radius:var(--r);
        background:#2A1C48;color:#fff;font-weight:600;font-size:14px;
        text-decoration:none;box-shadow:0 4px 14px rgba(0,0,0,.45);transition:.25s}
.tg-btn:hover{transform:translateY(-3px);background:var(--violet-dark)}
.tg-ico{font-size:18px;line-height:1}
/* маленькая текстовая ссылка */
.link-small{font-size:14px;color:#9bf;text-decoration:none}
.link-small:hover{text-decoration:underline}