/* Новости: лента, архив, детальная */

/* Заголовок и ссылка на архив в одной строке */
/* 300 × 60, 80 от ленты */
.newshead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  margin-top: 2.5rem;              /* с зазором ленты даёт 80 от крошек */
  padding: 0 3.75rem;
}
.newshead .inner__title { padding: 0; }

/* Лента */
.newsbody {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;                    /* 20 между активной новостью и сеткой */
  padding: 0 3.75rem;
}
.news-feed {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}
.news-date {
  flex: none;
  display: flex;
  align-items: flex-start;
  gap: .3125rem;                   /* 5 */
  height: 3.8125rem;               /* 61 */
  color: #0a1226;
}
.news-date__day { font-size: 5rem; line-height: 3.8125rem; }
.news-date__rest {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-self: stretch;
  font-size: 1.25rem;
  line-height: 1.875rem;
}
.news-tag {
  color: var(--orange);
  font-size: 1.125rem;             /* 18 caps */
  line-height: normal;
  text-transform: uppercase;
}
.read-more {
  display: inline-flex;
  align-items: baseline;            /* низ стрелки — на базовой линии текста */
  gap: .9375rem;                   /* 15 */
  color: var(--orange);
  font-size: 1.25rem;              /* 20 Semibold caps */
  line-height: 1.3258rem;          /* строка ровно по высоте стрелки (21.2), как в макете */
  font-weight: 600;
  text-transform: uppercase;
}
/* стрелка «→» без поворота высотой в прописные буквы (0,675 em у Myriad Pro): размер от шрифта строки */
.read-more__arrow {
  flex: none;
  width: 1em;
  height: .675em;
  background: url('../../../img/icon-arrow-read-more.svg') no-repeat center / 100% 100%;
}
/* черта под текстом и стрелкой цветом текста — видна при --read-more-line: 1 (наведение на карточку).
   Отсчёт от низа стрелки: он стоит на базовой линии; по горизонтали — на всю ширину .read-more */
.read-more { position: relative; }
.read-more__arrow::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  margin-top: calc(.675em + .15em);
  background-color: currentColor;
  opacity: var(--read-more-line, 0);
  transition: opacity .2s ease;
}
.news-card,
.news-feature {
  position: relative;
  isolation: isolate;               /* подложка должна лечь под текст, но над фоном */
  padding: 1.25rem;
  border: 1px solid var(--orange);
  border-radius: var(--radius);
  background: var(--white);
  overflow: hidden;                 /* кадр подложки обрезаем по скруглению */
}
.news-card::before,
.news-feature::before {
  content: '';
  position: absolute;
  z-index: -1;
  background: url('../../../img/news-pattern.jpg') no-repeat center / 100% 100%;
  opacity: .1;
  pointer-events: none;
}
.news-feature::before { top: -178.31%; left: 0; width: 100%; height: 278.31%; }
.news-card::before { content: none; }
.news-card[hidden],
.news-feature[hidden] { display: none; }
.news-card {
  display: flex;
  flex-direction: column;
  gap: 3.125rem;                   /* 50 */
  min-height: 29.3125rem;          /* 469 — высота плашки из макета */
}
.news-card__top { display: flex; align-items: stretch; justify-content: space-between; gap: 3.25rem; }
/* 52 в макете */
.news-card__head {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 1.25rem;
  flex: 1 1 auto;
  min-width: 0;
}
.news-card__title {
  font-size: 1.625rem;             /* 26/36 Semibold caps */
  line-height: 2.25rem;
  font-weight: 600;
  text-transform: uppercase;
  color: #0a1226;
}
.news-card__photo {
  flex: none;
  width: 48.36%;                   /* 429 из 887 внутренней ширины плашки */
  aspect-ratio: 429 / 247.384;
  border-radius: var(--radius);
  overflow: hidden;
}
.news-card__lead,
.news-feature__lead { font-size: 1.25rem; line-height: 1.5; color: #0a1226; }
/* 20/30 */
.news-card__foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.25rem;
  margin-top: auto;                /* строка со ссылкой всегда у нижнего края */
}
.news-feature {
  display: grid;
  grid-template-columns: 867fr 870fr;
  gap: 3.5625rem;                  /* 57 */
  padding: 1.25rem 2.5rem;         /* 20 / 40 */
}
/* новость без фотографии: сетка в одну колонку, мера набора заголовка и лида как у текстовой колонки макета (870) */
.news-feature:not(:has(.news-feature__photo)) { grid-template-columns: minmax(0, 1fr); }
.news-feature:not(:has(.news-feature__photo)) .news-feature__title,
.news-feature:not(:has(.news-feature__photo)) .news-feature__lead { max-width: 54.375rem; }
.news-feature__photo {
  align-self: center;
  aspect-ratio: 867 / 425.58;
  border-radius: var(--radius);
  overflow: hidden;
}
.news-feature__body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 3.125rem;
  min-height: 28.75rem;            /* 460 из макета */
  padding: 1.25rem 0;
}
.news-feature__text { display: flex; flex-direction: column; gap: 1.875rem; }
/* 30 до лида */
/* «читать полностью» по ширине текста, а не всей колонки — иначе черта наведения тянется на весь блок */
.news-feature .news-feature__more { align-self: flex-start; }
.news-feature__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.25rem; }
.news-feature__title {
  margin-top: 1.25rem;             /* с зазором блока даёт 50 от даты */
  font-size: 2.5rem;               /* 40/50 Semibold caps */
  line-height: 3.125rem;
  font-weight: 600;
  text-transform: uppercase;
  color: #0a1226;
}
.news-card__photo img,
.news-feature__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Детальная новость (news-detail.html, node 3210-3696 / 3210-4565) */
.inner--ndetail .news-detail { margin-top: 2.5rem; }
/* с зазором ленты даёт 80 от крошек */
.news-detail {
  display: grid;
  grid-template-columns: 1246fr 613fr;
  align-items: start;
  gap: 1rem 1.3125rem;             /* строки 16, колонки 21 */
  padding: 0 3.75rem;
}
.news-detail__title { grid-column: 1 / -1; grid-row: 1; }
.news-detail__main { grid-column: 1; grid-row: 2; display: flex; flex-direction: column; gap: 1rem; }
/* 16 до плашки */
.news-latest { grid-column: 2; grid-row: 2; margin-top: .3125rem; }
/* как поле у фото — верх анонсов ровно по верху фото */
.news-detail__title {
  font-size: 2.5rem;               /* 40/50 Semibold caps */
  line-height: 3.125rem;
  font-weight: 600;
  text-transform: uppercase;
  color: #0a1226;
}
.news-detail__photo {
  margin-top: .3125rem;             /* с зазором колонки даёт 21 от заголовка */
  aspect-ratio: 1246 / 581;
  border-radius: var(--radius);
  overflow: hidden;
}
.news-detail__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.news-detail__body {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;                     /* 40 */
  padding: 1.25rem;
  border: 1px solid var(--orange);
  border-radius: var(--radius);
  background: #fff;
  overflow: hidden;
}
.news-detail__body::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: -11.62%;
  left: 0;
  width: 100%;
  height: 111.62%;
  background: url('../../../img/news-pattern.jpg') no-repeat center / 100% 100%;
  opacity: .1;
  pointer-events: none;
}
.news-detail__head { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; }
.news-detail__text { font-size: 1.25rem; line-height: 1.5rem; color: #0a1226; }
/* 20/24 */
.news-detail__text > * + * { margin-top: 1.5rem; }
.news-detail__text h2 {
  font-size: 1.25rem;
  line-height: 1.5rem;
  font-weight: 600;
  text-transform: uppercase;
}
.news-detail__text ul { padding-left: 1.875rem; list-style: disc; }
.news-detail__text li + li { margin-top: .25rem; }
.news-detail__text li::marker { color: var(--orange); }
.news-detail__text a { color: var(--orange); }
.news-detail__text a:hover,
.news-detail__text a:focus-visible { color: #f18f34; text-decoration: underline; }
/* Фотографии новости — плитки галереи изделия во всю ширину колонки: поля даёт сама страница, */
/* а 4 к зазору колонки (16) дают 20 от текста до ряда снимков */
.news-detail__gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 0; margin-top: .25rem; }
/* Видео новости — плеер «Видеогалереи» во всю ширину колонки: поля страницы ему здесь не нужны, */
/* те же 4 к зазору колонки дают 20 от ряда снимков до ролика */
.news-detail__main .news-detail__video { margin: .25rem 0 0; }
.news-detail__specs { width: 100%; border-collapse: collapse; }
.news-detail__specs th,
.news-detail__specs td {
  padding: .5rem 1.25rem .5rem 0;
  text-align: left;
  vertical-align: top;
  font-weight: 400;
}
.news-detail__specs th { width: 25rem; color: rgba(10, 18, 38, .7); }
.news-detail__specs thead th { width: auto; font-weight: 600; color: #0a1226; }

/* Колонка «Последние новости» */
.news-latest {
  display: flex;
  flex-direction: column;
  gap: 1.875rem;                   /* 30 */
  padding: 1.25rem;
  border: 1px solid var(--orange);
  border-radius: var(--radius);
  background: #f4f7fa;
}
.news-latest__title {
  font-size: 1.625rem;             /* 26 caps Bold, как заголовки блоков макета */
  line-height: 1.625rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #0a1226;
}
.news-latest .news-latest__btn { width: 100%; height: 3.75rem; }
/* Анонс: дата и заголовок в шапке, ниже лид и строка со ссылкой и тегом */
.news-announce {
  display: flex;
  flex-direction: column;
  gap: 1.875rem;                   /* 30 */
  padding: 1.25rem;
  border: 1px solid var(--orange);
  border-radius: var(--radius);
  background: var(--white);
}
.news-announce__head { display: flex; align-items: center; gap: 3.8125rem; }
/* 61 */
.news-announce__title {
  font-size: 1.25rem;              /* 20/20 Semibold caps */
  line-height: 1.25rem;
  font-weight: 600;
  text-transform: uppercase;
  color: #0a1226;
}
.news-announce__body { display: flex; flex-direction: column; gap: 1.625rem; }
/* 26 */
.news-announce__lead { font-size: 1rem; line-height: 1.15; color: #0a1226; }
.news-announce__foot { display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; }
.news-announce .news-announce__tag { font-size: 1rem; }
.news-announce .news-announce__more { gap: .625rem; font-size: 1rem; line-height: 1.125rem; }

/* Планшет (< 1280) */
@media (max-width: 1279px) {
  .newshead { gap: 1rem; margin-top: 0; padding: 0 1rem; }
  .newsbody { padding: 0 1rem; }
  .news-date { height: 2.5rem; }
  .news-date__day { font-size: 2.5rem; line-height: 2.5rem; }
  .news-date__rest { font-size: .875rem; line-height: 1.25rem; }
  .news-card { gap: 1.25rem; min-height: 0; }
  .news-card__title { font-size: 1.125rem; line-height: 1.4; }
  .news-card__lead,
  .news-feature__lead { font-size: .9375rem; }
  .news-feature { gap: 1.25rem; padding: 1rem; }
  .news-feature__body { min-height: 0; padding: 0; gap: 1.25rem; }
  .news-feature__text { gap: 1.25rem; }
  .news-feature__title { margin-top: 0; font-size: 1.5rem; line-height: 1.3; }
  .news-card__top { gap: 1rem; }
  .read-more { gap: .5rem; font-size: .875rem; line-height: 1.25rem; }
  .news-tag { font-size: .8125rem; }
  .inner--ndetail .news-detail { margin-top: 0; }
  .news-detail { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 0 1rem; }
  /* одна колонка: заголовок, фото со статьёй, анонсы — по порядку разметки */
  .news-detail__title,
  .news-detail__main,
  .news-latest { grid-column: auto; grid-row: auto; }
  .news-latest { margin-top: 0; }
  .news-detail__title { font-size: 1.5rem; line-height: 1.875rem; }
  .news-detail__body { gap: 1.5rem; }
  .news-detail__gallery { padding: 0; margin-top: .25rem; }
  .news-detail__main .news-detail__video { margin: .25rem 0 0; }
  .news-detail__text { font-size: 1rem; line-height: 1.4; }
  .news-detail__text > * + * { margin-top: 1rem; }
  .news-detail__text h2 { font-size: 1rem; line-height: 1.4; }
  .news-detail__specs th { width: 40%; }
  .news-latest { gap: 1.25rem; }
  .news-latest__title { font-size: 1.25rem; line-height: 1.25rem; }
  .news-latest .news-latest__btn { height: 2.75rem; font-size: .875rem; }
  .news-announce { gap: 1.25rem; }
  .news-announce__head { gap: 1.25rem; }
  .news-announce__title { font-size: 1rem; line-height: 1.25rem; }
  .news-announce__body { gap: 1rem; }
  .news-announce__lead { font-size: .875rem; }
  .news-announce .news-announce__tag,
  .news-announce .news-announce__more { font-size: .8125rem; }
}

/* Мобильная (< 768, макет 866-21109) */
@media (max-width: 767px) {
  .newshead { align-items: center; gap: 15px; margin-top: 20px; padding: 0 16px; }
  .newsbody { padding: 0 16px; }
  .news-feed { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .news-card,
  .news-feature { padding: 20px; }
  .news-card::before,
  .news-feature::before {
    content: '';
    top: 0;
    left: -67.11%;
    width: 234.23%;
    height: 108.64%;
  }
  .news-feature__body { min-height: 0; padding: 0; }
  .news-feature__title { margin-top: 0; }
  .news-feature__photo { align-self: stretch; }
  .news-card,
  .news-feature__body,
  .news-feature__text { gap: 20px; }
  .news-card { min-height: 0; }
  .news-card__top,
  .news-card__head,
  .news-feature__body,
  .news-feature__text,
  .news-feature__head { display: contents; }
  .news-card .news-card__date,
  .news-feature .news-feature__date { order: 1; }
  .news-card__photo,
  .news-feature__photo { order: 2; width: 100%; aspect-ratio: 288 / 158; }
  .news-card__title,
  .news-feature__title { order: 3; }
  .news-card__lead,
  .news-feature__lead { order: 4; }
  .news-card .news-card__tag,
  .news-feature .news-feature__tag { order: 5; }
  .news-card__foot,
  .news-feature .news-feature__more { order: 6; }
  .news-date { height: 38px; gap: 5px; align-items: center; }
  .news-date__day { font-size: 30px; line-height: 38px; }
  .news-date__rest { gap: 0; justify-content: flex-end; font-size: 14px; line-height: 20px; }
  .news-card__title,
  .news-feature__title { font-size: 16px; line-height: 20px; }
  .news-card__lead,
  .news-feature__lead { font-size: 14px; line-height: 20px; }
  .news-tag { font-size: 14px; line-height: 20px; }
  /* от лида до тега в макете 24, остальные зазоры по 20 */
  .news-card .news-card__tag,
  .news-feature .news-feature__tag { margin-top: 4px; }
  /* в макете тег стоит над ссылкой «читать полностью», а не в одну строку */
  .news-card__foot { flex-direction: column-reverse; align-items: flex-start; gap: 20px; }
  .news-feature { display: flex; flex-direction: column; gap: 20px; }
  .read-more { gap: 5px; font-size: 14px; line-height: 20px; font-weight: 700; }
  .news-detail { grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 0 16px; }
  .news-detail__main { gap: 16px; }
  .news-detail__title { font-size: 26px; line-height: 30px; }
  .news-detail__photo { margin-top: 5px; }
  .news-detail__body { gap: 20px; padding: 20px; }
  /* на телефоне плитки по две в ряд, как в остальных галереях */
  .news-detail__gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0; margin-top: 4px; }
  .news-detail__main .news-detail__video { margin: 4px 0 0; }
  .news-detail__head { align-items: flex-start; }
  .news-detail__text { font-size: 14px; line-height: 20px; }
  .news-detail__text > * + * { margin-top: 16px; }
  .news-detail__text h2 { font-size: 16px; line-height: 20px; }
  .news-detail__text ul { padding-left: 20px; }
  .news-detail__specs th,
  .news-detail__specs td { padding: 6px 10px 6px 0; }
  .news-detail__specs th { width: 45%; }
  .news-latest { gap: 20px; padding: 20px; }
  .news-latest__title { font-size: 16px; line-height: 20px; }
  .news-latest .news-latest__btn { width: auto; height: 48px; margin: 0; font-size: 14px; }
  /* в мобильном макете тег стоит над ссылкой «читать полностью» */
  .news-announce { gap: 20px; padding: 20px; }
  .news-announce__head { flex-direction: column; align-items: flex-start; gap: 20px; }
  .news-announce__title { font-size: 16px; line-height: 20px; }
  .news-announce__body { gap: 20px; }
  .news-announce__lead { font-size: 14px; line-height: 20px; }
  .news-announce__foot { flex-direction: column-reverse; align-items: flex-start; gap: 20px; }
  .news-announce .news-announce__tag { font-size: 14px; line-height: 20px; }
  .news-announce .news-announce__more { gap: 15px; font-size: 14px; line-height: 20px; font-weight: 700; }
}

/* Карточка целиком — ссылка: ссылка заголовка растянута на всю плашку */
.news-announce { position: relative; }
.news-card__link::after,
.news-feature__link::after,
.news-announce__link::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}
.news-card:hover .news-card__link,
.news-feature:hover .news-feature__link,
.news-announce:hover .news-announce__link { color: var(--orange); }
/* «читать полностью» не перекрашивается — подчёркивается вместе со стрелкой */
.news-card:hover .news-card__more,
.news-feature:hover .news-feature__more,
.news-announce:hover .news-announce__more,
.news-card:has(.news-card__link:focus-visible) .news-card__more,
.news-feature:has(.news-feature__link:focus-visible) .news-feature__more,
.news-announce:has(.news-announce__link:focus-visible) .news-announce__more { --read-more-line: 1; }
/* рамка фокуса — у всей карточки, а не у строки заголовка */
.news-card:has(.news-card__link:focus-visible),
.news-feature:has(.news-feature__link:focus-visible),
.news-announce:has(.news-announce__link:focus-visible) {
  outline: 2px solid var(--orange);
  outline-offset: 3px;
}
.news-card__link:focus-visible,
.news-feature__link:focus-visible,
.news-announce__link:focus-visible { outline: none; }
