/* ============================================================
   Заявка-стекло (приём из ролика Glassy Login Form v3)
   Родные углы формы на отправке уезжают к центру, форма
   остаётся без них; в центре углы встают квадратом, вокруг
   крутится кольцо, потом возвращаются и показывается «принято».
   Подключается к #leadForm на боевых страницах, разметку не трогает.
   ============================================================ */

.lf-stage{
  position:relative;width:100%;
  --lfs-notch:52px;
  --lfs-shx:0px;--lfs-shy:0px;--lfs-shx2:0px;--lfs-shy2:0px;
  --lfs-ease:cubic-bezier(.22,.61,.36,1);
}

/* обрезаем у формы два угла: именно эти углы и уезжают */
.lf-glass{
  position:relative;
  border-radius:18px;
  clip-path:polygon(
    var(--lfs-notch) 0, 100% 0,
    100% calc(100% - var(--lfs-notch)), calc(100% - var(--lfs-notch)) 100%,
    0 100%, 0 var(--lfs-notch));
  transition:height .46s var(--lfs-ease);
  will-change:height;
}

/* сама карточка формы — стекло */
.lf-stage .lead-form-title,#leadForm .lead-form-title{line-height:1.45}
.lf-stage .lead-form{
  position:relative;width:100%;margin:0;
  padding:24px 24px 24px;
  border-radius:18px;
  background:linear-gradient(166deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.045) 40%, rgba(6,6,14,.62) 100%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  backdrop-filter:blur(18px) saturate(140%);
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 26px 70px rgba(0,0,0,.5), 0 2px 0 rgba(255,255,255,.18) inset;
  transition:opacity .28s ease-out, filter .28s ease-out;
}

/* уголки: ножки по кромкам формы, зазор только по диагонали */
.lf-shard{
  position:absolute;z-index:6;width:var(--lfs-notch);height:var(--lfs-notch);
  pointer-events:none;transform:translate3d(0,0,0);
  transition:transform .54s cubic-bezier(.42,.02,.24,1);
  will-change:transform;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.35));
}
.lf-shard svg{display:block;width:100%;height:100%;overflow:visible}
.lf-shard path{
  fill:rgba(214,228,255,.07);
  stroke:rgba(228,238,255,.55);
  stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round;
}
.lf-shard--tl{left:0;top:0}
.lf-shard--br{right:0;bottom:0}
.lf-shard--br svg{transform:rotate(180deg)}

/* кольцо-загрузка вокруг сошедшихся углов */
.lf-ring{
  position:absolute;left:50%;top:50%;width:118px;height:118px;margin:-59px 0 0 -59px;
  border-radius:50%;border:1.5px solid rgba(196,218,255,.22);z-index:5;pointer-events:none;
  opacity:0;transform:scale(.62);
  transition:opacity .28s ease-out, transform .5s var(--lfs-ease);
}
.lf-ring::before{
  content:"";position:absolute;inset:-1.5px;border-radius:50%;
  border:1.5px solid transparent;border-top-color:rgba(236,246,255,.95);border-right-color:rgba(200,222,255,.35);
  animation:lfSpin 1.15s linear infinite;
}
@keyframes lfSpin{to{transform:rotate(360deg)}}

.lf-stage .lead-form.lf-panel-out{position:absolute;left:0;top:0;width:100%;opacity:0;filter:blur(9px);pointer-events:none;visibility:hidden}
.lf-stage.is-sending .lead-form{opacity:0;filter:blur(10px)}
.lf-stage.is-sending .lf-ring{opacity:1;transform:scale(1)}
.lf-stage.is-sending .lf-shard--tl{transform:translate3d(var(--lfs-shx),var(--lfs-shy),0) scale(1.72)}
.lf-stage.is-sending .lf-shard--br{transform:translate3d(var(--lfs-shx2),var(--lfs-shy2),0) scale(1.72)}

/* ============ Экран «принято» ============ */
.lf-done{
  position:absolute;left:0;top:0;width:100%;
  margin:0;padding:32px 24px 28px;text-align:center;
  opacity:0;filter:blur(9px);pointer-events:none;
  transition:opacity .26s ease-out, filter .26s ease-out;
}
.lf-done.is-on{position:relative;opacity:1;filter:none;pointer-events:auto}
.lf-done.is-out{position:absolute;opacity:0;filter:blur(9px);pointer-events:none}
.lf-done__mark{
  width:70px;height:70px;margin:0 auto 16px;border-radius:50%;
  background:radial-gradient(circle at 50% 40%, rgba(95,211,154,.22), rgba(95,211,154,.05) 62%, transparent 72%);
  display:grid;place-items:center;
}
.lf-done__mark svg{width:70px;height:70px;overflow:visible}
.lf-done__ring{fill:none;stroke:rgba(95,211,154,.45);stroke-width:2;stroke-dasharray:208;stroke-dashoffset:208}
.lf-done.is-on .lf-done__ring{animation:lfDraw .7s var(--lfs-ease) .05s forwards}
.lf-done__tick{fill:none;stroke:#7fe3b3;stroke-width:4.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:34;stroke-dashoffset:34;filter:drop-shadow(0 0 8px rgba(95,211,154,.65))}
.lf-done.is-on .lf-done__tick{animation:lfDraw .42s var(--lfs-ease) .42s forwards}
@keyframes lfDraw{to{stroke-dashoffset:0}}
.lf-done__title{margin:0 0 8px;font-size:24px;line-height:1.2;font-weight:700;color:var(--text)}
.lf-done__text{margin:0 auto 24px;max-width:34ch;color:var(--muted);font-size:15px;line-height:1.6}
.lf-done__text a{color:var(--text);text-decoration:underline}
.lf-done__sum{
  display:grid;gap:1px;margin:0 0 8px;border-radius:14px;overflow:hidden;text-align:left;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.14);
}
.lf-done__row{display:grid;grid-template-columns:104px 1fr;gap:16px;padding:11px 16px;background:rgba(6,6,14,.5);font-size:13px}
.lf-done__row dt{margin:0;color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding-top:2px}
.lf-done__row dd{margin:0;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media (max-width:520px){
  .lf-stage{--lfs-notch:44px}
  .lf-stage .lead-form-title,#leadForm .lead-form-title{line-height:1.45}
.lf-stage .lead-form{padding:24px 16px 16px}
  .lf-done{padding:28px 16px 24px}
  .lf-done__row{grid-template-columns:84px 1fr}
}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .lf-stage .lead-form-title,#leadForm .lead-form-title{line-height:1.45}
.lf-stage .lead-form{background:rgba(14,14,22,.94)}
}
@media (prefers-reduced-motion:reduce){
  .lf-glass{transition:none}
  .lf-shard,.lf-ring,.lf-done,.lf-stage .lead-form-title,#leadForm .lead-form-title{line-height:1.45}
.lf-stage .lead-form{transition-duration:.001ms}
  .lf-shard{transition-duration:.001ms}
  .lf-ring::before{animation:none}
  .lf-done__ring,.lf-done__tick{stroke-dashoffset:0}
}