

/* Start:/local/templates/festonika/components/bitrix/news.list/feed/page.css?17913132424826*/
/* Страница ленты «Истории и новости» (/istorii/): первый экран, чипы рубрик, «пока материалов нет».
   Подключает сама страница (/istorii/index.php) — рядом со style.css шаблона, как home.css у главной.
   Прототип app.js, строки 1042–1055; subheroPad 110/120px, pageTitle, отступы ленты 34px/96px (контракт §2).
   Подтяг первого экрана под прозрачную шапку (html.js body.has-hero) — общее правило каркаса, здесь не дублируется. */

.feed-hero{position:relative;overflow:hidden;background:var(--night);color:var(--white)}
.feed-hero__bg{position:absolute;inset:0}
/* выше блока на 18%: параллакс (data-par, ui.js) сдвигает картинку, и края не должны показаться */
.feed-hero__img{position:absolute;top:-9%;left:0;display:block;width:100%;height:118%;max-width:none;object-fit:cover;object-position:center 32%}
.feed-hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,18,38,.88),rgba(10,18,38,.7))}
/* Верхний отступ прототипа (120px, на телефоне 110px) включает высоту шапки — он нужен, только когда блок подтянут
   под прозрачную шапку (html.js). Без JS шапка непрозрачна и стоит над блоком — там отступ как у тела страницы,
   иначе вышла бы пустая тёмная полоса (так же у сабхиро текстовых страниц, css/text-pages.css).
   Ширина и поля — свои, а не класс .shell: Битрикс подключает CSS страницы и компонентов РАНЬШЕ template_styles.css,
   и при равной специфичности .shell{padding:0 var(--gutter)} обнулил бы вертикальные отступы. По той же причине
   отступ надзаголовка — с родителем в селекторе, иначе его перебьёт .eyebrow{margin:0 0 14px} каркаса */
.feed-hero__inner{position:relative;max-width:var(--shell);margin:0 auto;padding:56px var(--gutter) 54px}
html.js body.has-hero .feed-hero__inner{padding-top:120px}
.feed-hero .feed-hero__eyebrow{margin:0 0 12px}
.feed-hero__title{margin:0 0 14px;font-family:var(--font-display);font-weight:800;font-size:var(--fs-page-title);line-height:1.02;letter-spacing:-.03em;color:var(--white);text-wrap:balance;overflow-wrap:break-word;hyphens:auto}
.feed-hero__lead{max-width:60ch;margin:0;font-size:17px;color:var(--on-dark-soft);text-wrap:pretty}
.feed-hero__lead a{color:var(--gold);text-decoration-thickness:.06em;text-underline-offset:.16em}
.feed-hero__lead a:hover{color:var(--gold-hover)}
/* лид ленты: на телефоне — короткий вариант заказчика (06.10.2026), как слоган главной (до 599px) */
.feed-hero__lead-short{display:none}
@media (max-width:599.98px){
    .feed-hero__lead-full{display:none}
    .feed-hero__lead-short{display:inline}
}
/* на тёмном синяя рамка фокуса каркаса почти не видна — золотая */
.feed-hero :focus-visible{outline-color:var(--gold)}

.feed{padding:34px 0 96px}

/* Чипы рубрик: ссылки, выбранная — тёмная (в макете кнопки с тем же видом) */
.feed-chips{margin:0 0 26px}
.feed-chips__list{display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:0;list-style:none}
.feed-chip{display:inline-flex;align-items:center;min-height:38px;padding:9px 16px;border:1.5px solid var(--line);border-radius:999px;background:var(--white);color:var(--night);font-size:13px;font-weight:500;line-height:1.2;text-decoration:none;transition:border-color .2s ease,background-color .2s ease,color .2s ease}
.feed-chip:hover{border-color:var(--night);color:var(--night)}
.feed-chip[aria-current]{background:var(--night);border-color:var(--night);color:var(--white)}
.feed-chip[aria-current]:hover{color:var(--white)}

/* Пустая рубрика или пустая лента */
.feed-empty{max-width:62ch;padding:28px;border-radius:var(--radius-card);background:var(--white);box-shadow:var(--shadow-card)}
.feed-empty__text{margin:0 0 14px;font-size:17px;color:var(--ink);text-wrap:pretty}
.feed-empty__more{margin:0}
.feed-empty__actions{display:flex;flex-wrap:wrap;gap:12px}

@media (max-width:899.98px){
    html.js body.has-hero .feed-hero__inner{padding-top:110px}
    .feed{padding:26px 0 64px}
    .feed-empty{padding:22px}
}

/* End */


/* Start:/local/templates/festonika/components/bitrix/news.list/feed/style.css?17913134865669*/
/* Карточки ленты «Истории и новости» и страницы ленты. Прототип app.js, строки 1056–1068:
   сетка auto-fill minmax(reviewMin 340px, 1fr), gap 20px; карточка — белая, радиус 26px, фото 200px;
   плашка 11px uppercase .08em; дата 13px muted; заголовок Unbounded 18px/1.3 (у отзыва 400, у остального 600);
   анонс 14px text-muted; строка автора 13px muted. Точка перелома mobile — max-width: 899.98px (контракт §2). */

.feed-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px}
/* отзывы: короткая цитата без фото не тянется до высоты соседней карточки с фото — пустого поля в полкарточки нет */
.feed-grid--reviews{align-items:start}

.feed-card{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--radius-card);background:var(--white);box-shadow:var(--shadow-card);transition:box-shadow .4s ease}
.feed-card--link:hover{box-shadow:var(--shadow-card-hover)}
/* фокус с клавиатуры на заголовке подсвечивает всю карточку — она и есть ссылка; без :has остаётся рамка на самой ссылке */
@supports selector(:has(a)){
    .feed-card:has(.feed-card__link:focus-visible){outline:3px solid var(--blue);outline-offset:3px}
    .feed-card__link:focus-visible{outline:none}
}

.feed-card__media{position:relative;height:200px;overflow:hidden;background:var(--night-2)}
.feed-card__img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 32%;transition:transform .7s var(--ease)}
.feed-card--link:hover .feed-card__img{transform:scale(1.06)}
/* ▶ у видео — по центру фото, как в макете */
.feed-card__play{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:999px;background:var(--gold);color:var(--night);font-size:20px}

.feed-card__body{display:flex;flex-direction:column;flex:1;gap:10px;padding:22px 24px}
.feed-card__top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
/* цвета рубрики приходят из полей раздела (style); здесь — запасные, если поля пусты */
.feed-card__tag{display:inline-flex;padding:5px 11px;border-radius:999px;background:#F4F0E7;color:var(--ink);font-size:11px;font-weight:600;letter-spacing:.08em;line-height:1.3;text-transform:uppercase}
.feed-card__date{font-size:13px;color:var(--muted)}
.feed-card__title{margin:0;font-family:var(--font-display);font-weight:600;font-size:18px;line-height:1.3;letter-spacing:-.01em;color:var(--ink);text-wrap:pretty;overflow-wrap:break-word}
/* Отзыв (06.10.2026, документ заказчика: «шрифт отзывов очень яркий, плотный и крупный»): цитата — шрифтом текста,
   как отзывы на главной; длинная обрезается до 9 строк — целиком она на странице отзыва (карточка — ссылка);
   автор — тёмным и жирнее, чем подпись у новостей */
.feed-card--review .feed-card__title{font-family:var(--font-body);font-weight:400;font-size:16px;line-height:1.6;letter-spacing:0;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:9;line-clamp:9;overflow:hidden}
.feed-card--review .feed-card__meta{font-size:14px;font-weight:600;color:var(--ink);line-height:1.45}
.feed-card__link,.feed-card__link:hover{color:inherit;text-decoration:none}
/* вся карточка — ссылка заголовка */
.feed-card__link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.feed-card--link:hover .feed-card__title{color:var(--blue)}
.feed-card__text{margin:0;font-size:14px;color:var(--text-muted);text-wrap:pretty}
/* строка автора прижата книзу: в ряду сетки карточки разной длины выравниваются по ней (в макете это делал flex:1 анонса) */
.feed-card__meta{margin:auto 0 0;font-size:13px;color:var(--muted)}

/* Страницы ленты (system.pagenavigation/feed) */
.feed-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 18px;margin-top:44px}
.feed-pager__list{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;padding:0;list-style:none}
.feed-pager__page{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 12px;border:1.5px solid var(--line);border-radius:999px;background:var(--white);color:var(--night);font-weight:600;text-decoration:none;transition:border-color .2s ease,color .2s ease}
a.feed-pager__page:hover{border-color:var(--night);color:var(--night)}
.feed-pager__page[aria-current]{background:var(--night);border-color:var(--night);color:var(--white)}
.feed-pager__gap{display:inline-flex;justify-content:center;min-width:20px;color:var(--muted)}
.feed-pager__step{display:inline-flex;align-items:center;min-height:44px;font-weight:600;text-decoration:none}

@media (max-width:899.98px){
    .feed-grid{grid-template-columns:1fr}
    .feed-card__body{padding:20px}
}

@media (prefers-reduced-motion:reduce){
    .feed-card__img{transition:none}
    .feed-card--link:hover .feed-card__img{transform:none}
}

/* End */
/* /local/templates/festonika/components/bitrix/news.list/feed/page.css?17913132424826 */
/* /local/templates/festonika/components/bitrix/news.list/feed/style.css?17913134865669 */
