/* Переопределения поверх стилей, скопированных из статики (см. tools/sync_static_assets.sh — этот файл синхронизация не трогает).
   Bitrix подключает template_styles.css сам, в конец <head>. */

/* Плавающие подписи форм (контакты, модалка заявки в каталоге). В разметке подпись стоит перед полем,
   поэтому правило «input + label» из contacts.css никогда не срабатывает и подпись остаётся поверх введённого текста.
   Поднимаем подпись по состоянию обёртки: фокус, непустое значение (нужен placeholder=" " на поле) или автозаполнение браузера. */
.contacts-form .contacts-form__field:focus-within .contacts-form__label,
.contacts-form .contacts-form__field:has(.contacts-form__input:not(:placeholder-shown)) .contacts-form__label,
.contacts-form .contacts-form__field:has(.contacts-form__input:-webkit-autofill) .contacts-form__label {
  opacity: 0;
  transform: translateY(-50%) translateY(-8px);
}

/* Новости, набранные в визуальном редакторе админки: голые <p>, <h2>/<h3>/<h4>, <ul>/<ol>, <blockquote>, <img>
   прямо в .news-article__content (без обёрток .news-article__body/__list/__quote из статики) выглядят как в дизайне.
   Только элементы без class (:not([class])) — разметка статики (.news-article__body, __quote, __gallery…) не затрагивается. */
.news-article__content > p:not([class]) {
  margin: 0 0 20px;
  font-size: 16px;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.75);
}
.news-article__content > p:not([class]) a { color: var(--paper-strong); }
.news-article__content > h2:not([class]),
.news-article__content > h3:not([class]) {
  margin: 32px 0 16px;
  font-size: 20px;
  font-weight: 500;
  text-transform: uppercase;
  color: var(--paper-strong);
}
.news-article__content > h4:not([class]) {
  margin: 24px 0 8px;
  font-size: 16px;
  font-weight: 500;
  color: var(--paper-strong);
}
.news-article__content > ul:not([class]),
.news-article__content > ol:not([class]) {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  counter-reset: news-ol;
}
.news-article__content > ul:not([class]) li,
.news-article__content > ol:not([class]) li {
  margin: 0 0 14px;
  padding-left: 20px;
  position: relative;
  font-size: 16px;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.75);
}
.news-article__content > ul:not([class]) li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 6px;
  height: 6px;
  background: var(--accent);
}
.news-article__content > ol:not([class]) li::before {
  counter-increment: news-ol;
  content: counter(news-ol) ".";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--accent);
}
.news-article__content > blockquote:not([class]) {
  margin: 32px 0;
  padding: 32px 36px;
  border: 1px solid var(--line);
  background: var(--bg-1);
  font-size: 22px;
  line-height: 1.5;
  font-style: italic;
  color: var(--paper-strong);
}
.news-article__content > img:not([class]),
.news-article__content > p:not([class]) > img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 8px 0 32px;
  border: 1px solid var(--line);
}