/* Форма "Ваш вопрос Сталину" в hero главной — только в открытом режиме (scripts/site_build.py::ask_form).
   Перенос с vlenin.com (04.10.2026); цвета — токены style.css ("Сталь и латунь"): поле дышит латунью, как у
   Ленина красным. Отдельный файл, а не style.css: закрытая сборка остаётся байт-в-байт прежней (?v= у style.css). */

.ask-hero {
  margin: 0 0 4px;
  max-width: 560px;
}

.ask-label {
  display: block;
  font-size: 14px;
  color: var(--paper-dim);
  margin: 0 0 6px;
}

.ask-field-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.ask-textarea {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 2.8em;
  max-height: 7.5em;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--bg-1);
  color: var(--paper);
  font: inherit;
  font-size: 16px;      /* не меньше 16px — иначе iOS увеличивает страницу при фокусе */
  line-height: 1.5;
  resize: none;
  overflow-y: auto;
}

.ask-textarea:focus-visible {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(201, 164, 92, .25);
}

/* Рамка мягко дышит латунью, пока поле пустое и не в фокусе; начал писать — анимация гаснет. */
.ask-textarea { animation: ask-glow 2.6s ease-in-out infinite; }
.ask-textarea:focus, .ask-textarea:not(:placeholder-shown) { animation: none; }
.ask-textarea::placeholder { color: var(--paper-dim); opacity: .8; }
@keyframes ask-glow {
  0%, 100% { border-color: var(--line); box-shadow: 0 0 0 0 rgba(201, 164, 92, 0); }
  50% { border-color: rgba(221, 188, 120, .95); box-shadow: 0 0 0 3px rgba(201, 164, 92, .26), 0 0 28px rgba(201, 164, 92, .34); }
}
@media (prefers-reduced-motion: reduce) {
  .ask-textarea { border-color: rgba(201, 164, 92, .6); }
}

.ask-submit {
  flex: none;
  min-height: 48px;
  padding-top: 12px;
  padding-bottom: 12px;
  white-space: nowrap;
  cursor: pointer;
  font-family: inherit;
}
.ask-submit:disabled { opacity: .7; cursor: progress; }

.ask-status {
  margin: 10px 0 0;
  min-height: 1.3em;
  color: var(--paper-dim);
  font-size: 14px;
}
.ask-status:empty { min-height: 0; margin: 0; }
.ask-status--error { color: var(--accent-hi); }
.ask-status a { color: var(--accent); text-underline-offset: 3px; }

.ask-hint {
  margin: 10px 0 0;
  color: var(--paper-dim);
  font-size: 14px;
}

/* пример — кнопка-текст: вставляет вопрос в поле (assets/ask.js) */
.ask-example {
  display: inline-block;
  min-height: 24px;     /* цель ≥ 24px (WCAG 2.5.8) */
  padding: 2px 0;
  border: 0;
  background: none;
  color: var(--accent);
  font: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.ask-example:hover, .ask-example:focus-visible { color: var(--accent-hi); }

.ask-quiet {
  margin: 12px 0 0;
  font-size: 15px;
}
.ask-quiet a { color: var(--paper-dim); display: inline-block; padding: 6px 0; text-underline-offset: 3px; }
.ask-quiet a:hover, .ask-quiet a:focus-visible { color: var(--accent); }

/* узкий экран: поле и кнопка друг под другом, кнопка во всю ширину — иначе кнопка выталкивает hero за экран */
@media (max-width: 560px) {
  .ask-field-row { flex-direction: column; align-items: stretch; }
  .ask-submit { width: 100%; }
}