/* REACH · обложка сборки v3, 28.09.2026.
   Слияние файлов варианта обложки 27.09 (cover-variant-2026-09-27*.css,
   v1→v9 без v4) в том порядке, в каком они подключались к v9: каждый
   следующий слой переписывает предыдущий. Ставится поверх cover.css и
   cover-magazine.css. Исходники слоёв — в 03-Макет-рыба/. */
/* ─────────────────────────────────────────────────────────────────────────
   REACH · вариант обложки на просмотр Роману, 27.09.2026.
   Лежит поверх cover.css и cover-magazine.css. Меняет только нижнюю
   полосу: ключевое сообщение слева, «кому и когда» справа, две кнопки
   одного вида на одной линии. Рамка, мастхед, стекло, ролик — прежние.
   Агент контента.
   ───────────────────────────────────────────────────────────────────────── */

/* рубрик «Главное» и «Актуальное» больше нет: полоса из двух строк сетки */
.mag-body{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:minmax(0,1.12fr) minmax(290px,.88fr)}
.mag-lead,.mag-toc{grid-row:2;display:flex;flex-direction:column}
/* кнопки прижаты к низу своих колонок и стоят на одной линии */
.mag-lead .cta,.mag-toc .cta{margin-top:auto}
.mag-lead .mag-title{margin-bottom:clamp(18px,2.6vh,30px)}
.mag-toc ul{margin-bottom:clamp(18px,2.6vh,30px)}

/* ключевое сообщение: тот же Playfair и то же голубое слово в ленте.
   Три фразы длиннее прежних трёх команд, поэтому кегль на ступень
   меньше, а между фразами воздух: каждая читается отдельной мыслью.
   Кегль зависит и от высоты окна: на низком экране фразы иначе
   сталкивали кнопку на колонтитул «REACH» внизу рамки. */
.mag-lead{max-width:700px}
.mag-title--say{font-size:clamp(22px,min(2.55vw,3.9vh),40px);font-weight:400;line-height:1.3;letter-spacing:-.012em;text-wrap:pretty}
/* слово ленты: заглавными, тем же тонким начертанием, с лёгкой разрядкой —
   выделяется цветом и регистром, а не жирностью */
.mag-title--say .roller-window{text-transform:uppercase;font-weight:400;letter-spacing:.035em}
.mag-title--say .mag-say{display:block}
.mag-title--say .mag-say+.mag-say{margin-top:.34em}
.mag-title--say .mag-line{white-space:normal}
/* «Повышаем» и слово ленты не разрываются, «вашего бизнеса» может уйти на строку ниже */
.mag-title--say .mag-line>span:first-child,.mag-title--say .roller-window{white-space:nowrap}

/* «кому и когда»: та же колонка с линейкой и номерами, что было содержание,
   только строки не ссылки */
.mag-toc .mag-row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;
  gap:clamp(12px,1.1vw,18px);padding:clamp(9px,1.25vh,14px) 0;color:#e4edf4;
  font:400 clamp(16px,min(1.32vw,2.3vh),21px)/1.3 'PT Sans',Arial,Helvetica,sans-serif}
.mag-toc .mag-row b{font:700 clamp(17px,min(1.4vw,2.5vh),23px)/1 'Playfair Display',Georgia,serif;
  color:var(--blue);font-variant-numeric:lining-nums}

/* кнопка к «Продуктам» — копия кнопки самодиагностики */
/* в колонке справа на ссылку ложились правила строк содержания — снимаем их */
.mag-toc a.cta{display:flex;align-items:center;justify-content:space-between;gap:18px;
  box-sizing:border-box;width:fit-content;height:48px;padding:4px 4px 4px 19px;text-decoration:none;
  color:#f7fbfc;font:700 13px/1 'PT Sans Narrow','Arial Narrow',Arial,sans-serif;
  letter-spacing:.12em;text-transform:uppercase}
.mag-toc a.cta:hover{color:#f7fbfc}
.cta-products{align-self:flex-start}

@media(max-width:1100px){
  .mag-body{grid-template-rows:auto auto;grid-template-columns:1fr}
  .mag-lead{grid-row:1}.mag-toc{grid-row:2;margin-top:clamp(22px,3.4vh,34px)}
  .mag-lead .cta{margin-top:0}
}
@media(max-width:520px){
  .mag-title--say{font-size:clamp(25px,6.6vw,32px)}
  .cta-products{width:100%}
}

/* низкое окно ноутбука: полоса ужимается по высоте, чтобы кнопки
   не наезжали на колонтитул «REACH · КИЕВ · ЛОНДОН» внизу рамки */
@media(max-height:760px) and (min-width:1101px){
  .mag-body{padding-top:clamp(12px,2.2vh,22px)}
  .mag-toc .mag-row{padding:6px 0;line-height:1.26}
  .mag-lead .mag-title,.mag-toc ul{margin-bottom:14px}
}
/* совсем низкое окно: колонтитул уступает место кнопкам */
@media(max-height:680px) and (min-width:1101px){
  .mag-mode .folio{display:none}
}

/* ── две пробы для левого блока, 27.09 ─────────────────────────────────
   Роман: с засечками фразы смотрятся плотно. Проба А — всё заглавными,
   проба Б — строчные, но с разрядкой больше на 0,05 em. Кегль у А меньше:
   заглавные шире, иначе фразы не помещаются по высоте. */
.mag-title--caps{text-transform:uppercase;letter-spacing:.03em;
  font-size:clamp(19px,min(2.05vw,3.2vh),32px);line-height:1.3}
.mag-title--caps .mag-say+.mag-say{margin-top:.5em}
.mag-title--air{letter-spacing:.038em;word-spacing:.06em}
/* ─────────────────────────────────────────────────────────────────────────
   REACH · вариант обложки v2, 27.09.2026. Поверх cover-variant-2026-09-27.css.
   Решения Романа: фразы слева заглавными и по высоте вровень с колонкой
   справа (кегль подбирает cover-fit-2026-09-27.js); колонтитула «REACH»
   внизу нет; кнопки опущены на линию «Киев · Лондон», подпись крупнее;
   марка в углу — как на внутренних страницах; BUSINESS MODEL под мастхедом
   крупнее, тем же тонким шрифтом. Бренд — Reach Business Model, без «s».
   ───────────────────────────────────────────────────────────────────────── */

/* марка в левом верхнем углу: та же пара, что в шапке внутренних страниц
   (journal.css, .brand), только светлая */
.topbar .brand-mark{display:flex;flex-direction:column;align-items:flex-start;
  padding:0;border:0;background:none;color:#eef4f8;text-transform:none;
  font:700 22px/1 'Playfair Display',Georgia,serif;letter-spacing:-.03em}
.topbar .brand-mark small{display:block;margin-top:4px;color:#9fb3c2;
  font:700 10px/1 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.3em}

/* BUSINESS MODEL под мастхедом: тот же тонкий PT Sans Narrow, крупнее,
   чтобы читался вместе с REACH как одно имя */
.mag-rule{font-size:clamp(18px,min(2.35vw,3.9vh),36px);letter-spacing:.34em;color:#e6eef4}
.mag-rule span{padding-left:.34em}

/* заглавные: кегль задаёт скрипт подгонки, здесь только запасное значение */
.mag-title--caps{font-size:var(--fit,clamp(19px,min(2.05vw,3.2vh),32px))}

/* кнопки на линии подписи «Киев · Лондон»: полоса опущена ниже */
.mag-in{padding-bottom:clamp(40px,6.2vh,60px)}
.mag-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:auto}
.mag-toc .mag-foot .cta{margin-top:0}
.mag-city{color:#a9bbc7;white-space:nowrap;
  font:400 clamp(13px,1.05vw,16px)/1 'PT Sans Narrow','Arial Narrow',Arial,sans-serif;letter-spacing:.24em}
@media(max-height:680px) and (min-width:1101px){.mag-mode .folio{display:none}}
@media(max-width:1100px){.mag-foot{flex-wrap:wrap}}
@media(max-width:520px){.mag-city{display:none}}
/* REACH · вариант обложки v3, 27.09.2026. Поверх v2.
   «Сайт о бизнес-моделях» снят; на его место над мастхедом встала строка
   HIGH BUSINESS TECHNOLOGY, крупнее прежней. Проба без засечек — класс
   .mag-title--sans на фразах слева. */
.mag-head .overline--tech{font-size:clamp(13px,min(1.25vw,2.1vh),19px);letter-spacing:.3em;
  padding-left:.3em;margin-bottom:clamp(12px,1.8vh,20px)}
.mag-title--sans{font-family:'PT Sans',Arial,Helvetica,sans-serif;font-weight:400;letter-spacing:.045em}
.mag-title--sans .roller-window{letter-spacing:.06em}
/* REACH · вариант обложки v5, 27.09.2026. Поверх v3 (v4 с буквицами снят).
   Справа две группы с нумерацией заново: 1–3 «каким компаниям»,
   1–4 «в каких ситуациях», между ними просвет.
   Слева фразы узким шрифтом без засечек, заглавными, плотно: Роману
   с засечками читать тяжело, а обычный PT Sans простоват и не совпадает
   с узким BUSINESS MODEL под мастхедом. Две пробы:
   .mag-title--narrow    — PT Sans Narrow 700, тот же, что BUSINESS MODEL;
   .mag-title--condensed — Roboto Condensed 500, ближе к Pragati Narrow
                           с сайта-референса (у того нет кириллицы). */
.mag-toc .num-list li.group-start{margin-top:clamp(12px,2vh,24px);border-top:1px solid rgba(220,238,249,.20)}
.mag-toc .num-list li.group-start{box-shadow:0 -1px 0 rgba(220,238,249,.20) inset}
.mag-toc .num-list li:nth-child(3){border-bottom:1px solid rgba(220,238,249,.20)}
.mag-toc .num-list .mag-row b{min-width:.7em}

.mag-title--narrow{font-family:'PT Sans Narrow','Arial Narrow',Arial,sans-serif;font-weight:700;letter-spacing:.012em}
.mag-title--narrow .roller-window{letter-spacing:.02em;font-weight:700}
.mag-title--condensed{font-family:'Roboto Condensed','Arial Narrow',Arial,sans-serif;font-weight:500;letter-spacing:.004em}
.mag-title--condensed .roller-window{letter-spacing:.01em;font-weight:500}
/* узкие буквы плотнее по высоте: чуть больше просвета между фразами */
.mag-title--narrow .mag-say+.mag-say,.mag-title--condensed .mag-say+.mag-say{margin-top:.42em}

@media(max-height:720px) and (min-width:1101px){
  .mag-toc .mag-row{padding:5px 0}
  .mag-toc .num-list li.group-start{margin-top:10px}
}
/* REACH · вариант обложки v6, 27.09.2026. Поверх v5.
   Фраза «Устраняем напряжения внутренних связей» снята; обе оставшиеся
   фразы нежирные, кегль крупнее (его подбирает cover-fit-…-v6.js по высоте
   списка справа, потолок 72 px). */
.mag-title--narrow,.mag-title--narrow .roller-window{font-weight:400}
.mag-title--condensed,.mag-title--condensed .roller-window{font-weight:400}
.mag-title--narrow{letter-spacing:.01em}
.mag-title--narrow .mag-say+.mag-say,.mag-title--condensed .mag-say+.mag-say{margin-top:.5em}
.mag-title--say{line-height:1.3}
/* REACH · вариант обложки v7, 27.09.2026. Поверх v6 (narrow).
   Новый текст Романа. Слева два утверждения: крупное с лентой слов и под
   ним второе, мельче, через короткую голубую черту. Справа вместо списка
   две фразы с авторской разбивкой строк: «Для компаний…» и «В ситуации…»;
   первые слова каждой фразы — голубая рубрика узким шрифтом. Весь блок
   на одном узком PT Sans Narrow, как BUSINESS MODEL под мастхедом. */

/* ── слева ─────────────────────────────────────────────────────────── */
.mag-title--say .mag-say--sub{font-size:.58em;line-height:1.32;letter-spacing:.02em;color:#d3dfe8;
  max-width:26em;text-wrap:pretty}
.mag-title--say .mag-say--sub::before{content:'';display:block;width:2.4em;height:1px;
  background:var(--blue);margin:0 0 .8em}
.mag-title--say .mag-say+.mag-say--sub{margin-top:.95em}

/* ── справа ────────────────────────────────────────────────────────── */
.mag-for .for-body{display:flex;flex-direction:column;gap:clamp(20px,3.8vh,42px)}
.mag-for .for-block{margin:0;padding-top:clamp(12px,1.8vh,18px);border-top:1px solid rgba(220,238,249,.24)}
.mag-for .for-lead{display:block;margin-bottom:clamp(6px,1vh,11px);color:var(--blue);
  font:700 clamp(12px,min(.95vw,1.7vh),15px)/1 'PT Sans Narrow','Arial Narrow',Arial,sans-serif;
  letter-spacing:.24em;text-transform:uppercase}
.mag-for .for-line{display:block;color:#e8f0f5;
  font:400 clamp(17px,min(1.72vw,2.95vh),25px)/1.3 'PT Sans Narrow','Arial Narrow',Arial,sans-serif;
  letter-spacing:.01em;text-wrap:balance}
.mag-for .mag-foot{margin-top:auto;padding-top:clamp(18px,2.6vh,30px)}

@media(max-height:720px) and (min-width:1101px){
  .mag-for .for-line{font-size:17px}
  .mag-for .for-body{gap:16px}
}
@media(max-width:1100px){
  .mag-for .for-line{font-size:19px}
}
/* REACH · вариант обложки v8, 27.09.2026. Поверх v7.
   Справа каждая фраза — сплошной абзац: рубрика «ДЛЯ КОМПАНИЙ» /
   «В СИТУАЦИИ» заглавными голубым, дальше обычный текст с прописной.
   Рубрика не мельче текста: это отбор целевой аудитории, он главный.
   Слева — заглавные крупным кеглем, справа — строчные: два сообщения
   читаются по-разному. Возвращено «товаров или услуг». */
.mag-for .for-lead{display:block;margin-bottom:clamp(8px,1.2vh,14px);color:var(--blue);
  font:700 clamp(18px,min(1.75vw,3vh),27px)/1.1 'PT Sans Narrow','Arial Narrow',Arial,sans-serif;
  letter-spacing:.12em;text-transform:uppercase}
.mag-for .for-text{display:block;color:#e8f0f5;max-width:24em;
  font:400 clamp(18px,min(1.65vw,2.85vh),26px)/1.34 'PT Sans Narrow','Arial Narrow',Arial,sans-serif;
  letter-spacing:.01em;text-wrap:pretty}
.mag-for .for-block{padding-top:clamp(14px,2.2vh,22px)}
@media(max-height:720px) and (min-width:1101px){
  .mag-for .for-lead{font-size:17px}.mag-for .for-text{font-size:17px}
}
@media(max-width:1100px){.mag-for .for-lead{font-size:19px}.mag-for .for-text{font-size:19px}}
/* REACH · вариант обложки v9, 27.09.2026. Поверх v8.
   Разбивка строк по Роману: вторая фраза слева переносится после запятой,
   «когда» уходит на новую строку вместе с продолжением; справа «или»
   остаётся на строке с «кризиса», «потери…» начинает следующую. */
.mag-title--say .mag-say--sub .sub-line{display:block;white-space:nowrap}

/* ── сборка v3, 28.09: ТЗ 2.1 и И-4 ─────────────────────────────────── */
/* h1 для поиска и экранного диктора: на экране его нет, в разметке есть */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.mag-title p.mag-say{margin:0}
.mag-title--say p.mag-say--sub{margin-top:.95em}
/* кернинг узкого шрифта: на телефонах вокруг «Т» появлялись разрывы */
.mag-title,.mag-for,.mag-for *{font-kerning:normal;font-feature-settings:"kern" 1}
@media(max-width:520px){.mag-for .for-lead,.mag-title--narrow{letter-spacing:.02em}}
/* кнопка «На связи» в шапке обложки — копия кнопок обложки, меньше */
.topbar .talk-cover{display:inline-flex;align-items:center;gap:12px;margin:0;
  padding:3px 3px 3px 15px;height:auto;min-width:0;border:1px solid rgba(224,241,251,.52);
  border-radius:30px;color:#f7fbfc;background:rgba(5,16,29,.48);text-decoration:none;
  font:700 12px/1 'PT Sans Narrow','Arial Narrow',Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
.topbar .talk-cover .cta-arrow{width:28px;height:28px;font-size:16px}
.topbar .talk-cover:hover{background:rgba(54,98,126,.28);border-color:var(--blue)}
@media(max-width:780px){.topbar .talk-cover{padding-left:11px;font-size:11px;letter-spacing:.12em;gap:8px}}

/* ── телефон: шапка и левый блок (сборка v3) ─────────────────────────── */
@media(max-width:1100px){
  .mag-title--caps{font-size:clamp(26px,5.2vw,40px)}
  .mag-title--say .mag-say--sub{font-size:.66em}
}
@media(max-width:620px){
  .topbar{gap:10px}
  .topbar .brand-mark small{display:none}
  .topbar .top-actions{gap:12px}
  .topbar .language button{font-size:12px;padding:2px}
  .topbar .talk-cover{white-space:nowrap}
  .mag-head{padding-top:6px}
  .mag-title--say .mag-say--sub .sub-line{display:inline;white-space:normal}
  .mag-title--say .mag-say--sub .sub-line::after{content:' '}
  .mag-title--caps,.mag-title--say .mag-say--sub,.mag-for .for-text,.mag-for .for-lead{letter-spacing:0}
}

/* 28.09 (замечание Романа): оба текстовых блока подняты над кнопками —
   между текстом и линией кнопок «Киев · Лондон» появился воздух. */
.mag-lead .mag-title{margin-bottom:clamp(40px,7vh,76px)!important}
.mag-for .mag-foot{padding-top:clamp(40px,7vh,76px)!important}
@media(max-width:1100px){.mag-lead .mag-title{margin-bottom:clamp(22px,4vh,40px)!important}.mag-for .mag-foot{padding-top:clamp(22px,4vh,40px)!important}}