/* Финальная доводка дизайна. Подключается после остальных стилей. */

/* ── 1. Типографика: кириллица в крупных заголовках дышит свободнее ── */
.hero h1{letter-spacing:-.058em}
.section-heading h2,.kept-heading h2,.faq-section h2{letter-spacing:-.05em}
.install-section h2{letter-spacing:-.058em}
.footer-wordmark{letter-spacing:-.058em;line-height:1.06;margin:30px 0 26px;font-kerning:normal;font-feature-settings:"kern" 1}
@media(max-width:760px){
  .hero h1{letter-spacing:-.05em}
  .section-heading h2,.kept-heading h2,.faq-section h2{letter-spacing:-.045em}
  .install-section h2{letter-spacing:-.05em}
  .footer-wordmark{letter-spacing:-.07em;margin:22px 0 20px}
}

/* ── 2. Ритм: единые вертикальные отступы, без провалов ── */
.demo-section{padding-block:clamp(72px,8vw,120px) 0}
.kept-section{padding-block:clamp(72px,8vw,120px) clamp(56px,6vw,96px)}
.faq-section{padding-block:clamp(64px,7.5vw,112px)}
.here{padding-bottom:clamp(8px,2vw,32px)}
.here-link{margin-bottom:0}

/* ── 3. Демо: плашка «сохранено» больше не закрывает текст, окна по центру сцены ── */
#demo .chat .body{padding-bottom:68px}
@media(min-width:1001px){
  #demo .chat{top:36px}
  #demo .pop{top:76px}
  #demo .win{box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 2px 4px rgba(46,58,92,.05),0 36px 80px -28px rgba(46,58,92,.34)}
}
#demo .saved-label{box-shadow:0 1px 0 #fff inset,0 10px 24px -8px rgba(46,58,92,.22)}

/* ── 4. «Что сохраняется»: карточки с глубиной и живым откликом ── */
.kept-item .specimen{border-radius:16px;border:1px solid rgba(32,35,31,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.8);transition:transform .45s var(--ease),box-shadow .45s var(--ease);overflow:hidden}
.kept-item h3{font-weight:500;letter-spacing:-.035em}
@media(hover:hover){
  .kept-item:hover .specimen{transform:translateY(-4px);box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 22px 40px -26px rgba(46,58,92,.38)}
}
.limits>summary{color:#5f6658}

/* ── 5. Контраст мелкого текста ── */
.footer-top{color:#6f7766}
.footer-top nav{color:#5f6658}
.footer-bottom{color:#6a7260}
.back-top{color:#5f6658}

/* ── 6. Финальный призыв: стеклянная панель, как в герое ── */
.install-section{
  position:relative;isolation:isolate;overflow:hidden;border:0;border-radius:clamp(20px,2.4vw,36px);
  margin-top:clamp(8px,2vw,24px);margin-bottom:clamp(40px,5vw,72px);
  padding:clamp(40px,5.5vw,92px) clamp(24px,5vw,84px);
  background:#e9eefb;
}
.install-section::before{
  content:'';position:absolute;inset:0;z-index:-2;
  background:url(flow-glass.webp) 72% 38%/cover no-repeat;
}
.install-section::after{
  content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(236,241,252,.95) 0%,rgba(236,241,252,.72) 33%,rgba(40,66,170,.32) 50%,rgba(14,30,112,.52) 60%,rgba(12,26,100,.58) 100%);
}
.install-section h2{color:#2447cb}
.install-cta>p{color:#fff;text-shadow:0 1px 14px rgba(10,24,90,.45);max-width:30em}
@media(max-width:760px){
  .install-section{padding:40px 24px 44px}
  .install-section::after{background:linear-gradient(180deg,rgba(236,241,252,.95) 0%,rgba(236,241,252,.82) 28%,rgba(30,54,160,.52) 44%,rgba(12,26,100,.64) 100%)}
  .footer-wordmark{font-size:21vw}
}

/* ── 7. Кнопка установки ── */
.cta{--cta-blue:#2d4dbd}
.hero-actions>.btn.cta,.install-cta>.btn.cta{gap:15px;min-height:66px;padding:7px 28px 7px 7px;text-align:left;justify-content:flex-start}
.cta-ico{flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--cta-blue);
  box-shadow:0 6px 14px -6px rgba(8,22,86,.55),inset 0 -3px 5px rgba(45,77,189,.14);position:relative}
.cta-ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;transition:transform .35s var(--ease)}
.cta-text{display:flex;flex-direction:column;gap:2px;line-height:1.15}
.cta-text b{font:600 18px/1.15 var(--text);letter-spacing:-.015em}
.cta-text small{font:500 12.5px/1.2 var(--text);opacity:.82;letter-spacing:.005em}
@keyframes cta-ring{0%{box-shadow:0 6px 14px -6px rgba(8,22,86,.55),0 0 0 0 rgba(255,255,255,.55)}70%,100%{box-shadow:0 6px 14px -6px rgba(8,22,86,.55),0 0 0 12px rgba(255,255,255,0)}}
@keyframes cta-bob{0%{transform:translateY(0)}35%{transform:translateY(5px)}65%{transform:translateY(-2px)}100%{transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){
  .hero-actions>.btn.cta .cta-ico{animation:cta-ring 3.4s ease-out 1.6s infinite}
  .install-cta>.btn.cta .cta-ico{animation:cta-ring 3.4s ease-out infinite}
}
@media(hover:hover){
  .btn.cta:hover .cta-ico svg{animation:cta-bob .7s var(--ease)}
  .btn.cta:hover .cta-ico{animation:none}
}
/* на тёмно-синей панели кнопка светлая, на светлом фоне синяя */
.install-cta>.btn.cta.primary{border-color:rgba(255,255,255,.9);color:#16329e;
  background:linear-gradient(160deg,#fff,#e8eefc);
  box-shadow:inset 0 1px 1px #fff,0 14px 30px -12px rgba(4,14,70,.65),0 2px 4px rgba(4,14,70,.18)}
.install-cta>.btn.cta.primary .cta-ico{background:linear-gradient(155deg,#4f72e8,#2447cb);color:#fff;box-shadow:0 6px 12px -6px rgba(20,50,160,.8),inset 0 1px 1px rgba(255,255,255,.45)}
.install-cta>.btn.cta.primary:hover{background:linear-gradient(160deg,#fff,#dfe8fd);transform:translateY(-2px);
  box-shadow:inset 0 1px 1px #fff,0 20px 34px -12px rgba(4,14,70,.7),0 2px 4px rgba(4,14,70,.18)}
@media(max-width:760px){
  .hero-actions>.btn.cta,.install-cta>.btn.cta{width:100%;min-height:64px}
  .cta-ico{width:48px;height:48px}
}

/* кнопка в шапке */
.nav-end{display:flex;align-items:center;gap:14px}
.nav-install{gap:9px}
.nav-dl{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lang-switch{font:600 12.5px/1 var(--text);letter-spacing:.08em;color:#5f6658;padding:9px 11px;border-radius:99px;border:1px solid transparent;transition:border-color .2s,background .2s,color .2s}
.lang-switch:hover{border-color:var(--line);background:#fff;color:#20231f}
.mobile-menu nav a[hreflang]{color:#2447cb}

/* уведомление, пока магазина ещё нет */
.kf-toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom,0px));z-index:80;transform:translate(-50%,16px);opacity:0;pointer-events:none;
  max-width:min(440px,calc(100vw - 32px));padding:14px 20px;border-radius:16px;background:rgba(24,28,46,.94);color:#fff;
  font:500 14.5px/1.5 var(--text);text-align:center;box-shadow:0 20px 44px -16px rgba(10,16,50,.6);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:opacity .3s,transform .4s var(--ease)}
.kf-toast.show{opacity:1;transform:translate(-50%,0)}

/* английская версия: подпись HERE стоит чуть правее */
html[lang="en"] .here-title{left:27%}
html[lang="en"] .hero h1{letter-spacing:-.05em}
@media(max-width:860px){.nav>.nav-end{display:none}}

/* подпись под заголовком секции данных: плотнее и контрастнее */
.here-title p{color:#3f443a;font-weight:500;text-shadow:0 0 .55em rgba(249,249,246,.98),0 0 .22em rgba(249,249,246,.95),0 0 .9em rgba(249,249,246,.9)}
@media(max-width:860px){.here-title p{text-shadow:none;color:#5f6658;font-weight:inherit}}