/* news-latest.css v2 — блок «Последние новости» (компонент [data-news-latest]). Данные: /media/news/news.json, разметка: server/news/latest_build.py
   и /media/news/news-latest.js. Шрифты — vcp-fonts.css (Literata / Golos Text), кнопка — vcp-buttons.css (вариант A, sg-btn--line).
   Оформление рамки повторяет соседний блок «Мы в СМИ»: .nl--home = лист главной (#press .press-block), .nl--visa = карточка .jp-press__in.
   Шкала 8 px; отступ между группами (шапка → карточки) ≥ 2× внутреннего. */
.nl{
  --nl-navy:#142033; --nl-ink:#3a342c; --nl-muted:#6b665c; --nl-gold:#c6a15b; --nl-line:#e3d6be; --nl-card:#fffdf8;
  --nl-bg:#fff1dc; --nl-frame:#c6a15b; --nl-radius:18px; --nl-pt:72px; --nl-pb:0px; --nl-mx:0px;
  --nl-pad:32px 31px 36px; --nl-eye-fs:12px; --nl-eye-fw:600; --nl-eye-ls:.18em; --nl-eye-c:var(--nl-navy);
  --nl-h-fw:400; --nl-h-fs:clamp(30px,2.1vw + 16px,46px); --nl-h-c:var(--nl-navy); --nl-h-ls:-0.02em;
  display:block; margin:0; padding:var(--nl-pt) 0 var(--nl-pb); background:var(--nl-bg); color:var(--nl-navy);
  font-family:var(--font-text,"Golos Text",system-ui,sans-serif);
}
.nl--home{
  --nl-bg:#f7f5f0; --nl-frame:rgba(32,31,28,.14); --nl-radius:24px; --nl-pt:96px; --nl-pad:40px 32px;
  --nl-eye-fs:11px; --nl-eye-fw:500; --nl-eye-ls:.12em; --nl-eye-c:#6b6558; --nl-h-fw:500; --nl-h-fs:clamp(32px,1.1vw + 24px,40px); --nl-h-c:#201f1c; --nl-h-ls:-0.015em;
}
.nl *, .nl *::before, .nl *::after{box-sizing:border-box}
.nl__in{max-width:1280px; margin:0 auto; margin-inline:max(var(--nl-mx),calc((100% - 1280px)/2)); padding:var(--nl-pad); border:1px solid var(--nl-frame); border-radius:var(--nl-radius)}

/* шапка: подпись, заголовок, «Все новости →» */
.nl__head{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 32px}
.nl__titles{min-width:0}
html .nl__eye{margin:0 0 14px; font-size:var(--nl-eye-fs); font-weight:var(--nl-eye-fw); line-height:1.2; letter-spacing:var(--nl-eye-ls); text-transform:uppercase; color:var(--nl-eye-c)}
html .nl__h{margin:0; font-family:var(--font-display,Literata,Georgia,serif); font-weight:var(--nl-h-fw); font-size:var(--nl-h-fs); line-height:1.15; letter-spacing:var(--nl-h-ls); color:var(--nl-h-c)}
html .nl__all{flex:none}

/* карточки: как на /news/ (фон, рамка, радиус, наведение, Literata в заголовке) */
.nl__grid{list-style:none; margin:40px 0 0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px}
.nl-card{position:relative; display:flex; flex-direction:column; min-width:0; overflow:hidden; background:var(--nl-card); border:1px solid var(--nl-line); border-radius:16px;
  transition:border-color 160ms ease, box-shadow 160ms ease}
.nl-card:hover, .nl-card:focus-within{border-color:var(--nl-gold); box-shadow:0 10px 32px rgba(20,32,51,.08)}
.nl-card__media{position:relative; flex:none; aspect-ratio:16/9; background:#e9e1d2; overflow:hidden}
.nl-card__media picture{display:block; width:100%; height:100%}
.nl-card__media img{display:block; width:100%; height:100%; object-fit:cover; transition:transform 400ms ease}
.nl-card:hover .nl-card__media img{transform:scale(1.03)}
.nl-card__body{display:flex; flex-direction:column; flex:1; min-width:0; padding:20px 24px 24px}
html .nl-card__kind{display:flex; flex-wrap:wrap; align-items:baseline; margin:0; font-size:12px; font-weight:600; line-height:1.4; letter-spacing:.08em; text-transform:uppercase; color:var(--nl-navy)}
.nl-card__kind span{color:var(--nl-muted)}
.nl-card__kind span{white-space:nowrap}
.nl-card__kind span::before{content:"·"; margin:0 6px; color:var(--nl-gold)}
html .nl-card__title{margin:8px 0 0; font-family:var(--font-display,Literata,Georgia,serif); font-weight:500; font-size:20px; line-height:1.3; letter-spacing:-0.005em; color:var(--nl-navy); overflow-wrap:break-word}
.nl-card__title a{color:inherit; text-decoration:none}
.nl-card__title a::after{content:""; position:absolute; inset:0; border-radius:16px}
.nl-card__title a:focus-visible{outline:none}
.nl-card__title a:focus-visible::after{box-shadow:inset 0 0 0 2px var(--nl-navy)}
.nl-card__date{display:block; margin-top:auto; padding-top:16px; font-size:14px; line-height:1.45; color:var(--nl-muted); font-variant-numeric:lining-nums}
.nl-card--brief{background:#faf6ef}
.nl-card--nocover{border-left:3px solid var(--nl-gold)}

/* планшет и телефон: строки (обложка 16:9 слева), чтобы три материала не растягивали страницу */
@media (max-width:959px){
  .nl__grid{grid-template-columns:minmax(0,1fr); gap:16px; margin-top:32px}
  .nl-card{flex-direction:row; align-items:stretch}
  .nl-card__media{width:clamp(112px,34%,240px); aspect-ratio:16/9; align-self:flex-start; margin:16px 0 16px 16px; border-radius:10px}
  .nl-card__body{padding:16px 20px}
  html .nl-card__title{font-size:18px}
  .nl-card__date{padding-top:8px}
}
@media (max-width:767px){
  .nl--home{--nl-pt:64px; --nl-pad:40px 24px}
  .nl--visa, .nl:not(.nl--home){--nl-pt:64px; --nl-pad:32px 28px 36px; --nl-mx:20px}
  .nl__head{align-items:flex-start; flex-direction:column}
}
@media (min-width:768px) and (max-width:1023px){
  .nl:not(.nl--home){--nl-mx:20px; --nl-pad:32px 28px 36px}
}
@media (max-width:479px){
  .nl:not(.nl--home){--nl-pt:48px; --nl-pad:22px 16px 24px; --nl-mx:16px}
  .nl-card__media{margin:12px 0 12px 12px; width:clamp(104px,36%,160px)}
  .nl-card__body{padding:12px 16px 14px}
  html .nl-card__title{font-size:17px}
}
/* самые узкие телефоны: обложка сверху, текст на всю ширину карточки */
@media (max-width:374px){
  .nl-card{flex-direction:column}
  .nl-card__media{width:auto; margin:0; border-radius:0; align-self:stretch}
  .nl-card__body{padding:16px 16px 18px}
}
/* v2 (11.10): главная. #press стоит с margin-top:-2px и непрозрачным фоном и закрывал нижнюю рамку листа новостей
   (низ и нижние скругления «недорисованы»). Отступ 2px снизу оставляет рамку целой. Зазор до листа «Мы в СМИ» — 72px
   (на телефоне 48px), как между карточками на страницах виз. Правило действует только если #press идёт сразу после блока. */
html .nl--home{--nl-pb:2px}
html .nl--home + #press{padding-top:72px}
@media (max-width:767px){html .nl--home + #press{padding-top:48px}}
@media (prefers-reduced-motion:reduce){.nl-card, .nl-card__media img{transition:none} .nl-card:hover .nl-card__media img{transform:none}}