/* =====================================================================
   ГАЗЕТА MediaMatrix Спорт — 4 сентября 2026
   =====================================================================
   Газета обязана отличаться от ленты, иначе она не газета, а та же
   лента с другим адресом. Отличия взяты не из украшений, а из того,
   чем выпуск отличается от потока:

     мачта по центру и номер выпуска  — «это выпуск, а не поток»;
     колонки и линейки                — заданный порядок чтения;
     буквица и узкая мера строки      — газетная привычка глаза;
     ЯВНЫЙ конец выпуска              — обещание «вы всё прочитали»,
                                        которого у ленты нет.

   Палитра и шрифт те же, что у портала: это одно издание, а не два.
   Файл дополняет sport.css, а не заменяет его.
   ===================================================================== */

.gz-body{ background:var(--bg) }

/* ---------- мачта ---------- */
.gz-machta{ background:var(--surface); border-bottom:3px double var(--ink);
  padding:30px 40px 22px; text-align:center }
.gz-metka{ font:700 11px/1 var(--font-body); letter-spacing:.28em;
  text-transform:uppercase; color:var(--accent-ink) }
[data-style="night"] .gz-metka{ color:var(--accent) }
.gz-h1{ margin:12px 0 0; font:700 40px/1.08 var(--font-display);
  letter-spacing:-.03em; color:var(--ink); text-wrap:balance }
.gz-podzag{ margin-top:8px; font:400 15px/1.45 var(--font-body);
  color:var(--ink-2) }
.gz-liniya{ margin-top:18px; padding-top:10px;
  border-top:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  font:500 12px/1 var(--font-body); letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-3) }
.gz-nomer{ font-family:var(--font-mono); letter-spacing:.08em }

/* ---------- переключатель выпусков ---------- */
.gz-perekluchatel{ background:var(--bg); border-bottom:1px solid var(--border) }
.gz-perekluchatel > .wrap{ display:flex; gap:10px; padding:12px 40px;
  flex-wrap:wrap }
.gz-perekluchatel a{ padding:8px 16px; border-radius:999px;
  border:1px solid var(--border); background:var(--surface);
  color:var(--ink); text-decoration:none;
  font:500 14px/1 var(--font-body) }
.gz-perekluchatel a.gz-on{ background:var(--ink); color:var(--bg);
  border-color:var(--ink); font-weight:600 }
[data-style="night"] .gz-perekluchatel a.gz-on{ background:var(--g-25);
  color:var(--g-900) }

/* ---------- полоса ---------- */
.gz-list{ padding:0 40px 60px }
.gz-list > .wrap{ max-width:1180px }

.gz-cifry{ display:flex; gap:26px; flex-wrap:wrap; align-items:baseline;
  padding:16px 0 20px; border-bottom:1px solid var(--border);
  font:400 13.5px/1.4 var(--font-body); color:var(--ink-2) }
.gz-cifry b{ font:700 18px/1 var(--font-display); color:var(--ink);
  margin-right:5px }

/* ---------- врез выпуска ---------- */
/* Абзац считается по самому выпуску, поэтому каждый раз другой. Он же
   не даёт странице быть списком заголовков без единого предложения. */
.gz-vrez{ margin:16px 0 0; max-width:78ch;
  font:400 16px/1.6 var(--font-body); color:var(--ink-2) }
.gz-vrez b{ color:var(--ink); font-weight:600 }

/* ---------- главный материал ---------- */
.gz-glavnoe{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:34px; align-items:start;
  padding:26px 0 30px; border-bottom:1px solid var(--border) }
.gz-glavnoe-foto{ display:block }
.gz-rubrika{ font:600 10.5px/1 var(--font-body); letter-spacing:.2em;
  text-transform:uppercase; color:var(--accent-ink) }
[data-style="night"] .gz-rubrika{ color:var(--accent) }
.gz-zag-1{ margin:10px 0 0; font:700 34px/1.12 var(--font-display);
  letter-spacing:-.03em; text-wrap:balance }
.gz-zag-1 a{ color:var(--ink); text-decoration:none }
.gz-zag-1 a:hover{ text-decoration:underline; text-underline-offset:4px }

/* Картинки одного формата во всей газете: 3:2. Разнобой пропорций и
   был тем, из-за чего полосы «прыгали». */
.gz-foto, .gz-mini, .gz-krosh{ display:block; overflow:hidden;
  border-radius:4px; aspect-ratio:3/2; background:var(--g-100) }
.gz-foto img, .gz-mini img, .gz-krosh img{ width:100%; height:100%;
  object-fit:cover; display:block }
.gz-zagl{ display:flex; flex-direction:column; align-items:center;
  justify-content:center; gap:6px;
  background:var(--g-800); border:1px solid var(--g-700) }
.gz-zagl .ic{ width:auto; height:auto; max-width:30px; color:var(--accent);
  opacity:.9 }
.gz-zagl .zg-imya{ font:600 8.5px/1 var(--font-body); letter-spacing:.16em;
  text-transform:uppercase; color:rgba(255,255,255,.62); font-style:normal }
.gz-glavnoe .gz-zagl .ic{ max-width:64px }
.gz-glavnoe .gz-zagl .zg-imya{ font-size:12px }

.gz-punkty{ margin:16px 0 0; padding:0; list-style:none;
  font:400 16px/1.6 var(--font-body); color:var(--ink-2) }
.gz-punkty li{ margin-bottom:8px }
/* Буквица — газетный приём, который лента себе не позволяет. */
.gz-bukvica li:first-child::first-letter{
  float:left; font:700 44px/0.82 var(--font-display); color:var(--ink);
  padding:4px 8px 0 0 }
.gz-schet{ display:inline-block; margin-top:12px; padding:3px 10px 4px;
  border-radius:999px; background:rgba(232,166,60,.18);
  font:600 12.5px/1 var(--font-body); color:var(--accent-ink) }
[data-style="night"] .gz-schet{ color:var(--accent) }

/* ---------- полосы: жёсткая сетка вместо текстовых колонок ---------- */
/* CSS-колонки разливали заметки по высоте как придётся, из-за чего
   низ полосы выглядел рваным, а линейки не сходились. Сетка ставит
   все ячейки в один ряд и выравнивает их по низу. */
.gz-polosa{ padding:26px 0 8px }
.gz-polosa-h{ display:flex; align-items:baseline; justify-content:space-between;
  gap:16px; margin:0 0 20px; padding-bottom:10px;
  border-bottom:2px solid var(--ink);
  font:700 13px/1 var(--font-body); letter-spacing:.18em;
  text-transform:uppercase; color:var(--ink) }
.gz-vse{ font:500 11px/1 var(--font-body); letter-spacing:.06em;
  text-transform:none; color:var(--ink-3); text-decoration:none }
.gz-vse:hover{ color:var(--ink) }

.gz-setka{ display:grid; gap:26px 30px }
.gz-setka-3{ grid-template-columns:repeat(3, minmax(0, 1fr)) }

.gz-zametka{ display:flex; flex-direction:column;
  padding-bottom:18px; border-bottom:1px solid var(--border) }
.gz-zametka-foto{ display:block; margin-bottom:12px }
.gz-zametka h3{ margin:6px 0 0; font:600 18px/1.28 var(--font-display);
  letter-spacing:-.015em; text-wrap:pretty }
.gz-zametka .gz-punkty{ font-size:14.5px; line-height:1.5; margin-top:8px }
.gz-zametka .gz-schet{ margin-top:auto; align-self:flex-start;
  padding-top:0 }

.gz-stroka{ display:grid; grid-template-columns:84px minmax(0,1fr);
  gap:14px; align-items:start;
  padding-bottom:16px; border-bottom:1px solid var(--border) }
.gz-stroka-foto{ display:block }
.gz-stroka h3{ margin:0; font:600 15.5px/1.3 var(--font-display);
  letter-spacing:-.01em; text-wrap:pretty }
.gz-stroka .gz-schet{ margin-top:8px; font-size:11.5px; padding:2px 9px 3px }

.gz-zametka h3 a, .gz-stroka h3 a{ color:var(--ink); text-decoration:none }
.gz-zametka h3 a:hover, .gz-stroka h3 a:hover{ text-decoration:underline;
  text-underline-offset:3px }

/* ---------- правило и подшивка ---------- */
.gz-pravilo, .gz-pusto{ padding:26px 0 8px; max-width:70ch }
.gz-pravilo h2, .gz-pusto h2{ margin:0 0 10px;
  font:700 22px/1.2 var(--font-display); letter-spacing:-.02em }
.gz-pravilo p, .gz-pusto p{ margin:0 0 10px;
  font:400 15.5px/1.6 var(--font-body); color:var(--ink-2) }

.podshivka{ margin-top:26px; border-top:2px solid var(--ink) }
.pod-den{ display:grid; grid-template-columns:220px 1fr 1fr; gap:18px;
  align-items:center; padding:14px 0; border-bottom:1px solid var(--border) }
.pd-data{ font:600 15px/1.3 var(--font-body); color:var(--ink) }
.pod-vyp{ display:flex; align-items:baseline; justify-content:space-between;
  gap:12px; padding:10px 14px; border:1px solid var(--border);
  border-radius:8px; background:var(--surface); text-decoration:none }
.pod-vyp:hover{ background:var(--bg) }
.pv-imya{ font:500 14px/1 var(--font-body); color:var(--ink) }
.pv-nomer{ font:500 12px/1 var(--font-mono); color:var(--ink-3) }

/* ---------- конец выпуска ---------- */
/* У ленты конца нет. У газеты он есть — и это её обещание. */
.gz-konec{ margin-top:34px; padding:26px 0 8px;
  border-top:3px double var(--ink); text-align:center }
.gz-konec-h{ font:700 13px/1 var(--font-body); letter-spacing:.24em;
  text-transform:uppercase; color:var(--ink) }
.gz-konec p{ margin:12px auto 0; max-width:62ch;
  font:400 14.5px/1.6 var(--font-body); color:var(--ink-2) }
.gz-konec a{ color:var(--ink) }
.gz-pravilo-strochka{ font-size:13px !important; color:var(--ink-3) !important }

/* ---------- телефон: одна колонка, конец на месте ---------- */
@media (max-width: 1000px){
  .gz-setka-3{ grid-template-columns:repeat(2, minmax(0, 1fr)) }
  .gz-glavnoe{ grid-template-columns:1fr; gap:20px }
  .gz-glavnoe-foto{ max-width:560px }
}
@media (max-width: 640px){
  .gz-machta{ padding:20px 16px 16px }
  .gz-h1{ font-size:26px }
  .gz-podzag{ font-size:14px }
  .gz-liniya{ font-size:10.5px; letter-spacing:.1em; margin-top:14px }
  .gz-perekluchatel > .wrap{ padding:10px 16px; gap:8px }
  .gz-perekluchatel a{ padding:7px 13px; font-size:13px }
  .gz-list{ padding:0 16px 44px }
  .gz-cifry{ gap:14px; font-size:12.5px }
  .gz-cifry b{ font-size:16px }
  .gz-zag-1{ font-size:26px }
  .gz-glavnoe-foto{ max-width:none }
  .gz-setka-3{ grid-template-columns:1fr; gap:20px }
  .gz-zametka h3{ font-size:17px }
  .gz-stroka{ grid-template-columns:72px minmax(0,1fr); gap:12px }
  .gz-vrez{ font-size:15px }
  .gz-punkty{ font-size:15px }
  .gz-bukvica li:first-child::first-letter{ font-size:38px }
  .gz-polosa-h{ font-size:11.5px; letter-spacing:.14em }
  .pod-den{ grid-template-columns:1fr; gap:8px; padding:16px 0 }
  .gz-konec{ margin-top:26px }
}