/* финальный экран: сверху — приложение (PWA), снизу — подвал и большое имя. Один экран, тёплый фон как у первого экрана. Макет: design-fable/fresh/footer-install.html, CEO 10.10 */
.end{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;display:grid;grid-template-rows:1fr auto;
  --end-glass:color-mix(in srgb,var(--kl-surface) 75%,transparent);--end-muted:#575C69;
  --end-word-a:color-mix(in srgb,var(--kl-on-warm) 92%,transparent);--end-word-b:color-mix(in srgb,var(--kl-on-warm) 40%,transparent)}
[data-theme=dark] .end{--end-glass:color-mix(in srgb,var(--kl-surface) 70%,transparent);--end-muted:#B9BCC7;--end-word-a:rgba(255,255,255,.92);--end-word-b:rgba(255,255,255,.3)}

/* фон: мягкие пятна без filter — дёшево, плывут только transform */
.end-bg{position:absolute;inset:0;z-index:-1;background:var(--kl-surface);overflow:hidden}
[data-theme=dark] .end-bg{background:var(--kl-bg)}
.end-bg i{position:absolute;border-radius:50%;animation:end-drift 22s ease-in-out infinite alternate}
.end-bg i:nth-child(1){width:90%;height:110%;left:30%;top:-35%;background:radial-gradient(closest-side,var(--kl-brand-orange),transparent)}
.end-bg i:nth-child(2){width:70%;height:90%;left:-20%;top:10%;background:radial-gradient(closest-side,var(--kl-brand-orange-light),transparent);animation-duration:28s;animation-direction:alternate-reverse}
.end-bg i:nth-child(3){width:60%;height:70%;left:55%;top:45%;background:radial-gradient(closest-side,#FF9A3D,transparent);animation-duration:32s}
[data-theme=dark] .end-bg i{opacity:.5}
@keyframes end-drift{to{transform:translate(6%,8%) scale(1.12)}}
@media(prefers-reduced-motion:reduce){.end-bg i{animation:none}}

.end a{text-decoration:none}
.end-wrap{width:min(var(--kl-container),calc(100% - 2*var(--kl-margin,40px)));margin:0 auto}
.end-glass{background:var(--end-glass);-webkit-backdrop-filter:blur(24px) saturate(1.6);backdrop-filter:blur(24px) saturate(1.6);border:var(--kl-border) solid color-mix(in srgb,var(--kl-line) 70%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
[data-theme=dark] .end-glass{box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.end-glass{background:var(--kl-surface);-webkit-backdrop-filter:none;backdrop-filter:none}}

/* --- верх: приложение --- */
.end-app{align-self:center;padding:calc(var(--kl-space-16) + var(--kl-space-4)) 0 var(--kl-space-6)}
.end-card{border-radius:var(--kl-radius-modal);padding:var(--kl-space-8) 40px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--kl-space-12);align-items:center}
.end-eyebrow{font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--kl-on-warm)}
.end-card h2{margin:var(--kl-space-3) 0 var(--kl-space-2);font-size:clamp(28px,3.4vw,44px);line-height:1.1;font-weight:700;letter-spacing:-.02em;text-wrap:balance}
.end-card h2 span{color:var(--kl-on-warm)}
.end-lead{margin:0 0 var(--kl-space-6);color:var(--end-muted);max-width:46ch}
.end-tabs{display:inline-flex;padding:4px;gap:4px;border-radius:14px;background:color-mix(in srgb,var(--kl-surface-2) 80%,transparent);margin-bottom:var(--kl-space-4)}
.end-tabs button{height:36px;padding:0 var(--kl-space-4);border:0;border-radius:10px;background:transparent;font-size:var(--kl-ui-size);font-weight:500;cursor:pointer;color:var(--end-muted)}
.end-tabs button[aria-selected=true]{background:var(--kl-surface);color:var(--kl-text);box-shadow:0 1px 3px rgba(20,22,40,.12)}
.end-tabs button:focus-visible{outline:2px solid var(--kl-focus);outline-offset:2px}
.end-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--kl-space-3);margin:0;padding:0;list-style:none;counter-reset:s}
.end-steps[hidden]{display:none}
.end-steps li{counter-increment:s;border-radius:16px;padding:14px;background:color-mix(in srgb,var(--kl-surface) 65%,transparent);border:var(--kl-border) solid var(--kl-line);font-size:var(--kl-ui-size);line-height:1.4}
.end-steps li::before{content:counter(s);display:grid;place-items:center;width:28px;height:28px;margin-bottom:10px;border-radius:9px;background:var(--kl-btn-bg);color:var(--kl-btn-text);font-weight:600;font-size:13px}
.end-steps b{font-weight:600}
.end-key{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;background:var(--kl-surface-2);vertical-align:-5px;margin:0 2px}
.end-key svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.end-side{display:flex;align-items:center;gap:28px}
.end-phone{width:136px;aspect-ratio:9/18.5;border-radius:30px;padding:8px;background:#111318;box-shadow:0 24px 48px rgba(120,50,0,.25)}
.end-screen{height:100%;border-radius:23px;overflow:hidden;position:relative;background:linear-gradient(160deg,#FFB86B,var(--kl-brand-orange) 55%,#E2560B);padding:30px 12px 12px;display:grid;grid-template-columns:repeat(4,1fr);align-content:start;gap:10px 7px}
.end-screen::before{content:"";position:absolute;top:7px;left:50%;width:40px;height:11px;margin-left:-20px;border-radius:8px;background:#111318}
.end-ic{aspect-ratio:1;border-radius:24%;background:rgba(255,255,255,.35)}
.end-ic.me{background:#fff;display:grid;place-items:center;box-shadow:0 0 0 3px rgba(255,255,255,.6);animation:end-pop 2.4s ease-out infinite}
.end-ic.me img{width:70%;height:auto}
@keyframes end-pop{0%,60%,100%{transform:scale(1)}30%{transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.end-ic.me{animation:none}}
.end-dock{position:absolute;left:10px;right:10px;bottom:10px;height:32px;border-radius:13px;background:rgba(255,255,255,.3)}
.end-qr{display:grid;justify-items:center;gap:10px;text-align:center}
.end-qr img{width:128px;height:128px;padding:10px;border-radius:16px;background:#fff;box-sizing:border-box}
.end-qr small{font-size:13px;color:var(--end-muted);max-width:16ch;line-height:1.35}

/* --- низ: подвал --- */
.end-foot-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--kl-space-6);padding:var(--kl-space-4) 0 var(--kl-space-3);border-top:var(--kl-border) solid color-mix(in srgb,var(--kl-text) 14%,transparent)}
.end-brand{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:20px}
.end-about p{margin:10px 0 var(--kl-space-2);color:var(--end-muted);font-size:var(--kl-ui-size);max-width:30ch}
.end-legal .lang{grid-column:3;justify-self:start}
@media(min-width:641px){.end .end-legal .lang-menu{left:0;right:auto}}
.end-legal .lang-btn{border:var(--kl-border) solid var(--kl-line);background:var(--end-glass)}
.end-col h3{margin:0 0 10px;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--end-muted)}
.end-col ul{margin:0;padding:0;list-style:none;display:grid;gap:0 var(--kl-space-6)}
.end-col.two ul{grid-template-columns:repeat(2,max-content)}
.end-col a,.end-col button{display:inline-flex;align-items:center;min-height:28px;font-size:var(--kl-ui-size);color:var(--kl-text);background:none;border:0;padding:0;cursor:pointer;text-align:left;font:inherit;font-size:var(--kl-ui-size)}
.end-col a:hover,.end-col button:hover{color:var(--kl-on-warm)}
.end-legal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center;gap:var(--kl-space-2) var(--kl-space-6);padding-bottom:var(--kl-space-4);font-size:13px;color:var(--end-muted)}
.end-word{display:block;width:100%;font-weight:800;letter-spacing:-.06em;line-height:.74;font-size:clamp(72px,14vw,240px);text-align:center;white-space:nowrap;
  background:linear-gradient(180deg,var(--end-word-a) 0%,var(--end-word-b) 92%);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:.06em;user-select:none}

@media(max-width:1024px){
  .end-card{grid-template-columns:minmax(0,1fr);gap:var(--kl-space-8)}
  .end-side{justify-content:center}
  .end-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .end-wrap{width:calc(100% - 2*var(--kl-margin-mobile,16px))}
  .end-app{padding:72px 0 var(--kl-space-6)}
  .end-card{padding:var(--kl-space-6) 20px;border-radius:var(--kl-radius-card)}
  .end-steps{grid-template-columns:minmax(0,1fr)}
  .end-steps li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:var(--kl-space-3);align-items:center}
  .end-steps li::before{margin:0}
  .end-side{display:none} /* сайт уже открыт на телефоне: QR и рисунок не нужны, сразу шаги */
  .end-foot-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--kl-space-6)}
  .end-foot-row>.end-about{grid-column:1/-1}
  .end-legal{grid-template-columns:repeat(2,minmax(0,1fr))}
  .end-legal .lang{grid-column:2}
  .end-col a,.end-col button{min-height:var(--kl-h-touch)}
}