/* Урок Просто — дополнения кода к публичным страницам (x-pub.css, techkarta-back#257). На макете этих правил нет:
   здесь только то, чего в up-pub.css нет, а сайту нужно. Файлы up-*.css не правятся.
   1. Вопросы-аккордеон (src/pages/public/FaqCard.tsx, UpFaq): плавная высота ответа и ссылки в HTML ответа.
   2. Страница «Вопросы и ответы» (FaqPage.tsx) — в конце файла. */

/* ответ раскрывается высотой: строка сетки 0fr → 1fr (как .up-sb-fold оболочки). Раскрытие — анимация по [open]
   у вопроса, который уже нажимали (data-touched ставит скрипт: вопрос, открытый с загрузки, не растёт на глазах);
   закрытие — data-closing ставит скрипт и снимает open по окончании. Без движения — обычный details */
.up-x-faq-body { display: grid; grid-template-rows: 1fr; }
.up-x-faq-clip { min-height: 0; overflow: hidden; }
.up-faq-i[data-touched][open] > .up-x-faq-body { animation: up-x-faq-open .34s var(--ease-out) both; }
.up-faq-i[data-touched][open] > .up-x-faq-body > .up-x-faq-clip > .up-faq-a { animation: up-x-faq-text .34s var(--ease-out) both; }
.up-faq-i[data-closing] > .up-x-faq-body { animation: up-x-faq-close .24s var(--ease-out) both; }
.up-faq-i[data-closing] > .up-x-faq-body > .up-x-faq-clip > .up-faq-a { animation: up-x-faq-text .2s var(--ease-out) reverse both; }
.up-faq-i[data-closing] .up-faq-ic { transform: none; background: var(--surface-2); color: var(--text-2); }
@keyframes up-x-faq-open { from { grid-template-rows: 0fr; } to { grid-template-rows: 1fr; } }
@keyframes up-x-faq-close { from { grid-template-rows: 1fr; } to { grid-template-rows: 0fr; } }
@keyframes up-x-faq-text { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

/* ссылки в ответе приходят из данных без класса — вид как у .up-acct-a (up-acct.css) */
.up-faq-a a { color: var(--ws-accent-ink); font-weight: 600; text-decoration: none; }
.up-faq-a a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- 2. страница «Вопросы и ответы» (src/pages/public/FaqPage.tsx) ----------
   Вопрос, раскрытый уже в HTML (первый), при загрузке не анимируется: его раскрытие сдвигало всё, что ниже.
   Плавная высота — у вопроса, который нажали (data-anim ставит страница по нажатию). */
.up-faq-page .up-faq-i[open]:not([data-anim]) > .up-x-faq-body,
.up-faq-page .up-faq-i[open]:not([data-anim]) > .up-x-faq-body > .up-x-faq-clip > .up-faq-a { animation: none; }
