/* MediaLead — встроенный блок-чат с менеджером (для вариантов A и B).
   Блок стоит прямо в ленте страницы: человек долистывает — менеджер уже пишет. */

.talk{--t-ink:var(--ink,#0d0d0f);--t-ink2:var(--ink-2,#4f5056);--t-ink3:var(--ink-3,#8a8b91);--t-line:var(--line,#e3e3df);--t-acc:var(--accent,#e2412e);--t-ok:var(--good,#1f9d55);--t-paper:var(--paper,#f3f3f1)}
.talk__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:64px;align-items:center}
.talk__copy .lead{margin-top:20px;max-width:30em}
.talk__steps{display:grid;gap:14px;margin:30px 0 0;padding:0;list-style:none}
.talk__steps li{display:flex;gap:14px;align-items:flex-start}
.talk__steps i{display:grid;place-items:center;width:32px;height:32px;flex:none;border-radius:10px;background:#fff;font-style:normal;font-weight:600;font-size:14px;color:var(--t-ink);box-shadow:0 0 0 1px var(--t-line)}
.talk__steps span{font-size:15px;line-height:1.4;color:var(--t-ink2)}
.talk__steps b{display:block;font-size:16px;font-weight:600;color:var(--t-ink)}
.talk__col{display:grid;gap:14px;min-width:0}

/* Карточка чата */
.tk{display:flex;flex-direction:column;height:600px;border-radius:28px;background:#fff;box-shadow:0 0 0 1px var(--t-line),0 30px 60px -40px rgba(13,13,15,.35);overflow:hidden;font-family:inherit}
.tk__hd{display:flex;align-items:center;gap:14px;padding:20px 22px 0}
.tk__ava{position:relative;display:grid;place-items:center;width:52px;height:52px;flex:none;border-radius:50%;background:linear-gradient(140deg,#f3a08f,var(--t-acc));color:#fff;font-weight:600;font-size:19px}
.tk__ava i{position:absolute;right:0;bottom:1px;width:13px;height:13px;border-radius:50%;background:var(--t-ok);border:2.5px solid #fff}
.tk__who{min-width:0}
.tk__who b{display:block;font-size:18px;font-weight:600;letter-spacing:-.01em;color:var(--t-ink)}
.tk__who small{display:block;margin-top:2px;font-size:14px;line-height:1.35;color:var(--t-ink2)}
.tk__who em{font-style:normal;font-weight:600;color:var(--t-ok)}
.tk__who em.is-typing{color:var(--t-acc)}
.tk__q{align-self:flex-start;margin:16px 22px 0;padding:8px 14px;border-radius:999px;background:var(--t-paper);font-size:14px;font-weight:600;color:var(--t-ink)}
.tk__q.is-done{background:rgba(31,157,85,.1);color:var(--t-ok)}
.tk__line{height:3px;margin-top:16px;background:var(--t-line)}
.tk__line span{display:block;height:100%;width:var(--prog,0%);background:var(--t-ink);transition:width .6s cubic-bezier(.2,.7,.2,1)}
.tk__log{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:18px 18px 10px;overscroll-behavior:contain;scroll-behavior:smooth}
.tk__msg{display:flex;align-items:flex-end;gap:10px;max-width:92%;animation:tkIn .4s cubic-bezier(.2,.7,.2,1) both}
@keyframes tkIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.tk__msg--me{align-self:flex-end;flex-direction:row-reverse;margin-top:4px}
.tk__mava{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:50%;background:linear-gradient(140deg,#f3a08f,var(--t-acc));color:#fff;font-size:13px;font-weight:600;visibility:hidden}
.tk__msg--mgr.is-last .tk__mava{visibility:visible}
.tk__bub{position:relative;padding:12px 16px;border-radius:20px;background:var(--t-paper);font-size:15.5px;line-height:1.45;color:var(--t-ink);overflow-wrap:anywhere}
.tk__msg--mgr .tk__bub{border-bottom-left-radius:6px}
.tk__msg--q .tk__bub{font-weight:600}
.tk__msg--me .tk__bub{background:var(--t-ink);color:#fff;border-bottom-right-radius:6px}
.tk__tick{display:inline-block;width:17px;height:11px;margin-left:8px;vertical-align:-1px;color:#8a8a92;transition:color .3s}
.tk__tick.is-read{color:#7cc0ff}
.tk__react{position:absolute;left:-12px;bottom:-14px;padding:2px 6px;border-radius:999px;background:#fff;font-size:15px;box-shadow:0 2px 10px rgba(13,13,15,.16);animation:tkPop .45s cubic-bezier(.3,1.5,.5,1)}
@keyframes tkPop{from{transform:scale(0)}to{transform:none}}
.tk__typing .tk__bub{display:flex;gap:5px;padding:16px}
.tk__typing .tk__bub i{width:7px;height:7px;border-radius:50%;background:#a9a9ad;animation:tkDot 1.2s infinite}
.tk__typing .tk__bub i:nth-child(2){animation-delay:.15s}
.tk__typing .tk__bub i:nth-child(3){animation-delay:.3s}
@keyframes tkDot{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-4px);opacity:1}}
.tk__dock{padding:6px 18px 18px}
.tk__qr{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
.tk__qr button{height:42px;padding:0 16px;border:1px solid var(--t-line);border-radius:14px;background:#fff;font-weight:500;font-size:15px;font-family:inherit;color:var(--t-ink);cursor:pointer;animation:tkIn .35s cubic-bezier(.2,.7,.2,1) both;transition:border-color .2s,background .2s}
.tk__qr button:hover{border-color:var(--t-ink)}
.tk__form{display:grid;gap:8px}
.tk__ch{display:flex;gap:6px}
.tk__ch button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;border:1px solid var(--t-line);border-radius:12px;background:#fff;font-weight:500;font-size:14px;font-family:inherit;color:var(--t-ink);cursor:pointer}
.tk__ch button[aria-pressed="true"]{background:var(--t-ink);border-color:var(--t-ink);color:#fff}
.tk__ch svg{width:16px;height:16px}
.tk__row{display:flex;gap:8px}
.tk__pf{position:relative;flex:1}
.tk__pf input{width:100%;height:54px;padding:20px 14px 4px;border:1.5px solid var(--t-line);border-radius:14px;background:#fff;font-weight:500;font-size:16px;font-family:inherit;color:var(--t-ink);outline:none;transition:border-color .2s}
.tk__pf label{position:absolute;left:15px;top:17px;font-size:15px;color:var(--t-ink3);pointer-events:none;transition:transform .2s,font-size .2s}
.tk__pf.is-f label,.tk__pf.has-v label{transform:translateY(-10px);font-size:12px}
.tk__pf.is-f input{border-color:var(--t-ink)}
.tk__pf.is-ok input{border-color:var(--t-ok)}
.tk__pf.is-err input{border-color:var(--t-acc);animation:tkShake .4s}
@keyframes tkShake{25%,75%{transform:translateX(-4px)}50%{transform:translateX(4px)}}
.tk__send{width:54px;height:54px;flex:none;border:0;border-radius:14px;background:var(--t-acc);color:#fff;display:grid;place-items:center;cursor:pointer}
.tk__send svg{width:20px;height:20px}
.tk__legal{font-size:12px;line-height:1.4;color:var(--t-ink3)}
.tk__legal a{color:inherit}
.tk__done{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(31,157,85,.08);font-size:14.5px;font-weight:600;color:var(--t-ok)}
.tk__done button{border:0;background:none;font-weight:400;font-size:13px;font-family:inherit;color:var(--t-ink3);text-decoration:underline;cursor:pointer}

/* Карточка «Нет времени?» */
.tk-call{padding:22px 24px;border-radius:24px;background:#fff;box-shadow:0 0 0 1px var(--t-line);text-align:center}
.tk-call p{margin:0;font-size:16px;line-height:1.4;color:var(--t-ink2)}
.tk-call__row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:16px}
.tk-call__tel{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 18px;border-radius:14px;background:var(--t-paper);font-size:19px;font-weight:600;color:var(--t-ink);text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.tk-call__tel svg{width:20px;height:20px}
.tk-call__ic{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 16px;border-radius:14px;font-size:15px;font-weight:600;text-decoration:none;color:#fff}
.tk-call__ic svg{width:20px;height:20px}
.tk-call__ic--tg{background:#2aabee}
.tk-call__ic--max{background:linear-gradient(135deg,#3b6cff,#8b3dff)}
.tk-call__ic--max b{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:rgba(255,255,255,.22);font-size:11px;font-weight:800}
.tk-call small{display:block;margin-top:12px;font-size:13px;color:var(--t-ink3)}

@media (max-width:1100px){
  .talk__grid{grid-template-columns:minmax(0,1fr);gap:36px}
  .talk__col{max-width:560px;width:100%}
}
@media (max-width:640px){
  .talk__steps{display:none}
  .tk{height:min(600px,78svh);border-radius:24px}
  .tk__hd{padding:16px 16px 0}
  .tk__ava{width:46px;height:46px}
  .tk__who b{font-size:17px}
  .tk__who small{font-size:13px}
  .tk__q{margin:14px 16px 0}
  .tk__log{padding:16px 14px 8px}
  .tk__bub{font-size:15px}
  .tk__dock{padding:6px 14px 14px}
  .tk__qr button{height:40px;padding:0 14px;font-size:14.5px}
  .tk-call{padding:20px 16px}
  .tk-call__tel{width:100%;justify-content:center}
  .tk-call__ic{flex:1}
}
@media (prefers-reduced-motion:reduce){
  .tk *,.tk-call *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}
@media (min-width:641px){.tk-call__row{flex-wrap:nowrap;gap:8px}.tk-call__tel{font-size:17px;padding:0 14px}.tk-call__ic{padding:0 14px}}

/* Призыв к действию над вариантами ответа */
.tk__hint{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:0 0 10px;font-size:14px;font-weight:600;color:var(--t-acc);animation:tkIn .35s cubic-bezier(.2,.7,.2,1) both}
.tk__hint svg{width:16px;height:16px;flex:none;animation:tkHint 1.4s ease-in-out infinite}
@keyframes tkHint{50%{transform:translateY(3px)}}
.tk__qr button{box-shadow:0 1px 0 rgba(13,13,15,.04)}
.tk__qr button:hover{background:var(--t-ink);border-color:var(--t-ink);color:#fff}
@media (prefers-reduced-motion:reduce){.tk__hint svg{animation:none}}
