/* v3 · связка нового дизайна с общими модулями сайта (forms.js, phone-mask.js, captcha.js).
   В шаблонах этих состояний нет: там формы были заглушками. */

/* Ловушка для ботов: поле есть в DOM, человек его не видит */
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* Ошибки полей. forms.js вешает .is-error на поле и кладёт текст в .form-error рядом */
.form-field { display: grid; }
.field input.is-error, .field textarea.is-error { border-color: #ff6b5b; }
.consent input.is-error { outline: 2px solid #ff6b5b; outline-offset: 2px; }
.form-error { margin-top: 6px; font: 400 13px/1.3 var(--body); color: #ff8a7d; }
.form-error--submit { margin-top: 12px; }

/* Ссылка в согласии */
.consent a { color: var(--fg); text-decoration: underline; text-underline-offset: 2px; }
.consent a:hover { color: var(--accent); }

/* Поле файла в итоговой форме */
.final__file { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; color: var(--muted); font-size: 15px; }
.final__file:hover, .final__file.is-dragover { color: var(--accent); }
.final__file input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.final__file svg { width: 20px; height: 20px; flex: none; }
.final__file:focus-within { outline: 2px solid var(--accent-2); outline-offset: 3px; border-radius: 6px; }

/* «Спасибо» на месте формы */
.final__done { display: grid; justify-items: start; gap: 14px; padding: clamp(28px, 4vw, 48px); }
.final__done svg { width: 48px; height: 48px; }
.final__done h3 { margin: 0; font: 500 clamp(28px, 3vw, 40px)/1.05 var(--display); text-transform: uppercase; color: var(--fg); }
.final__done p { margin: 0; color: var(--muted); }

/* Логотипы стека — файлы /assets/v3/img/stack (обрезанный viewBox из шаблона), ширина задаётся атрибутом width в процентах плитки */
.marquee .logo img { height: auto; }

/* hidden должен побеждать display: grid у .final__form */
.final__form[hidden], .final__done[hidden] { display: none; }

/* Модальное окно (<dialog>, открывает site.js по [data-dialog]) — форма резюме на главной */
.dlg { width: min(720px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 0; background: transparent; color: var(--text); overflow: visible; }
.dlg::backdrop { background: rgba(3,4,2,.82); backdrop-filter: blur(6px); }
.dlg__in { position: relative; max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--edge); border-radius: var(--r); background: radial-gradient(70% 60% at 0% 0%, rgba(128,210,7,.14), transparent 60%), #0b0e08; }
.dlg__title { margin: 0; padding: 32px 72px 0 32px; font: 500 clamp(30px, 4vw, 44px)/1.05 var(--display); text-transform: uppercase; color: var(--fg); }
.dlg .final__form { margin: 0; max-width: none; background: none; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.dlg__close { position: absolute; top: 20px; right: 20px; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--edge); border-radius: 50%; background: rgba(0,0,0,.4); color: var(--fg); cursor: pointer; transition: color .2s, border-color .2s; }
.dlg__close:hover { color: var(--accent); border-color: var(--accent); }
.dlg__close svg { width: 20px; height: 20px; }
body.dlg-lock { overflow: hidden; }
@media (max-width: 640px) { .dlg__title { padding: 24px 64px 0 22px; } .dlg__close { top: 14px; right: 14px; } }
@media (prefers-reduced-motion: reduce) { .dlg__close { transition: none; } }

/* Фон первого экрана: в шаблоне filter: blur(60px) на движущемся слое больше экрана — браузер
   размывал его заново каждый кадр, скролл проседал до ~10 fps. Градиенты и так мягкие:
   растягиваем их до полной прозрачности вместо размытия — на вид то же, blur не нужен. */
.hero__mesh { filter: none;
  background:
    radial-gradient(48% 60% at 78% 30%, rgba(128,210,7,.30), transparent 100%),
    radial-gradient(42% 54% at 92% 75%, rgba(46,230,197,.18), transparent 100%),
    radial-gradient(36% 48% at 55% 105%, rgba(128,210,7,.15), transparent 100%); }