/* 10.10.2026: блок «Поговорите со мной» — диалог с ИИ-версией Андрея.
   Секция молочная (как «Формат»), окно диалога тёмное. Прямые углы и тонкие линии, как во всём сайте. */
.talk{--t-bg:#0d0d0c;--t-panel:#151513;--t-line:#2b2b28;--t-muted:#9b998f;--t-fg:#f0ede5;--t-accent:var(--acid,#d06a4e);
  background:#efebe1;color:#0a0a0a;padding:clamp(90px,11vw,180px) var(--pad);border-bottom:1px solid #d9d4c7;
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,6vw,110px);align-items:start}
.talk .section-no{color:#77746b}
.talk h2{font-size:clamp(48px,6vw,96px);line-height:.95;letter-spacing:-.06em;margin:55px 0 34px}
.talk-lead{font-size:clamp(17px,1.25vw,20px);line-height:1.55;color:#3d3b36;max-width:470px;margin:0 0 38px}

/* окно диалога */
.talk-window{background:var(--t-bg);color:var(--t-fg);border:1px solid #1e1e1c;display:flex;flex-direction:column;height:min(680px,80svh);min-height:520px;box-shadow:0 30px 80px rgba(20,18,12,.18)}
.talk-head{display:flex;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid var(--t-line)}
.talk-avatar{position:relative;width:44px;height:44px;flex:none}
.talk-avatar img{width:44px;height:44px;object-fit:cover;object-position:50% 18%;filter:grayscale(1) contrast(1.05)}
.talk-dot{position:absolute;right:-3px;bottom:-3px;width:11px;height:11px;border-radius:50%;background:#5fbf7a;border:2px solid var(--t-bg)}
.talk-who{flex:1;display:flex;flex-direction:column;gap:4px;min-width:0}
.talk-who strong{font-size:16px;font-weight:600}
.talk-who span{font-size:12px;color:var(--t-muted);letter-spacing:.04em}
.talk-reset{all:unset;cursor:pointer;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--t-muted);padding:12px 6px;border-bottom:1px solid transparent}
.talk-reset:hover{color:var(--t-fg);border-bottom-color:#555}
.talk-reset:focus-visible{outline:2px solid var(--t-accent);outline-offset:2px}

.talk-log{flex:1;overflow-y:auto;padding:22px 20px;display:flex;flex-direction:column;gap:22px;scroll-behavior:smooth;overscroll-behavior:contain}
.talk-msg{max-width:88%;display:flex;flex-direction:column;gap:7px}
.talk-msg .talk-meta{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-muted);font-weight:600}
.talk-msg .talk-text{font-size:16px;line-height:1.6;overflow-wrap:anywhere}
.talk-msg .talk-text p{margin:0 0 .7em}
.talk-msg .talk-text p:last-child{margin-bottom:0}
.talk-bot{align-self:flex-start;padding-left:14px;border-left:2px solid var(--t-accent)}
.talk-user{align-self:flex-end;align-items:flex-end}
.talk-user .talk-text{background:var(--t-fg);color:#0a0a0a;padding:11px 15px}
.talk-error .talk-text{color:#e7b3a1}
.talk-retry{all:unset;cursor:pointer;margin-top:8px;font-size:13px;color:var(--t-fg);border-bottom:1px solid #666;align-self:flex-start}
.talk-typing{display:inline-flex;gap:5px;padding:6px 0}
.talk-typing i{width:6px;height:6px;border-radius:50%;background:var(--t-muted);animation:talk-dot 1.2s infinite ease-in-out}
.talk-typing i:nth-child(2){animation-delay:.15s}.talk-typing i:nth-child(3){animation-delay:.3s}
@keyframes talk-dot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}


.talk-form{border-top:1px solid var(--t-line);padding:14px 18px 16px}
.talk-label{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-muted);margin-bottom:8px;font-weight:600}
.talk-field{display:flex;gap:10px;align-items:flex-end}
.talk-field textarea{flex:1;box-sizing:border-box;resize:none;height:48px;min-height:48px;max-height:140px;padding:13px 14px;line-height:20px !important;display:block;background:var(--t-panel);color:var(--t-fg);border:1px solid var(--t-line);border-radius:0;font:16px/1.4 'Onest',Arial,sans-serif}
.talk-field textarea::placeholder{color:#6f6d66}
.talk-field textarea:focus{outline:none;border-color:var(--t-accent)}
.talk-send{width:48px;height:48px;flex:none;align-self:flex-end;border:0;border-radius:0;background:var(--t-fg);color:#0a0a0a;font-size:20px;cursor:pointer;transition:background .2s ease}
.talk-send:hover:not(:disabled){background:#fff}
.talk-send:disabled{opacity:.35;cursor:default}
.talk-send:focus-visible{outline:2px solid var(--t-accent);outline-offset:2px}
.talk-foot{display:flex;justify-content:flex-end}
.talk-count{margin-top:8px}
.talk-count{font-size:12px;color:var(--t-muted);flex:none}
.talk-count[hidden]{display:none}

@media(max-width:900px){
  .talk{grid-template-columns:minmax(0,1fr);gap:36px}
  .talk h2{margin:40px 0 24px}
        }
@media(max-width:560px){
  .talk{padding-top:90px;padding-bottom:90px}
  .talk h2{font-size:clamp(42px,11.5vw,60px)}
  .talk-window{height:78svh;min-height:480px;margin:0 calc(var(--pad) * -1);border-left:0;border-right:0}
  .talk-log{padding:18px 16px}
  .talk-msg{max-width:94%}
  .talk-form{padding:12px 14px 14px}
  .talk-who-long{display:none}
}
@media(prefers-reduced-motion:reduce){.talk-log{scroll-behavior:auto}.talk-typing i{animation:none;opacity:.6}}

/* ссылки в ответах аватара — как обычные ссылки в тексте */
.talk-link{color:#7fb0ff;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.talk-link:hover{color:#a9c9ff}
.talk-link:focus-visible{outline:2px solid #7fb0ff;outline-offset:2px}
/* на телефоне окно чата встаёт вплотную к следующему разделу, без молочной полосы */
@media(max-width:560px){.talk{padding-bottom:0;border-bottom:0}.talk-window{border-bottom:0}}

/* телефон: до начала диалога окно компактное, с первым сообщением плавно вытягивается; поле ввода на две строки */
@media(max-width:560px){
  .talk-window{transition:height .45s ease}
  .talk-window.is-empty{height:386px;min-height:0}   /* шапка 77 + шесть строк текста ~190 + поле ввода 117 */
  .talk-field textarea{height:68px;min-height:68px}
  .talk-send{height:68px}
}
@media(max-width:560px) and (prefers-reduced-motion:reduce){.talk-window{transition:none}}