/* ==========================================================================
   ШАБЛОН atlas — банковский скелет сети (нейтральная палитра, плейсхолдеры)
   --------------------------------------------------------------------------
   ПАРАДИГМА
   Картографический лист. Страница — не набор карточек, а один топографический
   лист под координатной рамкой:
     · РЕЛЬЕФ      — .atlrelief, фиксированный слой горизонталей (замкнутые
                     изолинии из repeating-radial-gradient) под всем контентом,
                     плюс .atlgrat — километровая сетка листа;
     · РАМКА       — .atlsheet рисует координатную рамку с МИНУТНЫМИ делениями
                     по всем четырём краям (мелкий штрих — минута, длинный —
                     пять минут) фоновыми градиентами, без единого элемента;
     · ЗАРАМОЧНОЕ  — .atlmargin сверху (марка листа, номенклатура, навигация) и
                     .atlfoot снизу (выходные данные листа);
     · ПЛАНШЕТ     — .atlplate, первый экран: слева H1/лид/CTA/реперы .atlbench,
                     справа приборный блок .atlinstr (роза ветров .atlrose —
                     inline-SVG, масштабная линейка .atlbar, рамка координат);
     · ЛЕГЕНДА     — .atllegend вместо списка ссылок: сетка условных знаков
                     .atlsign, у каждого свой inline-SVG глиф .atlglyph и якорь
                     на секцию. Это единственная навигация по листу;
     · КВАДРАТ     — .atlquad, главная единица раскладки: слева узкая колонка
                     .atlquad__ref (номенклатура квадрата, номер, отметка
                     высоты), справа .atlquad__body с контентом;
     · ВРЕЗКА      — .atlnote, врезка составителя на бумаге. Единственный
                     СВЕТЛЫЙ блок листа (заметка автора, E-E-A-T).
   Горизонтали, рамка, роза и линейка нарисованы только градиентами и
   inline-SVG. Растровых картинок в шаблоне нет.

   NAMESPACE
   Все классы начинаются на .atl — .atlrelief, .atlgrat, .atlsheet, .atlin,
   .atlmargin, .atlmark, .atlnom, .atlnav, .atlplate, .atlkick, .atlh1,
   .atllead, .atlcta, .atlbtn, .atlbench, .atlrep, .atlinstr, .atlrose,
   .atlbar, .atlcoord, .atllegend, .atlsign, .atlglyph, .atlfield, .atlquad,
   .atlh2, .atlprose, .atlgrid, .atlcard, .atlscroll, .atltab, .atlsteps,
   .atlstep, .atlrevs, .atlrev, .atlfaq, .atlqa, .atlcall, .atlnote, .atlfoot,
   .atlmut, .atlem, .atlem2, .atlnum, .atlage.
   Вне .atl* объявляются только base-правила html/body/p/a/img/table —
   пересечений с другими шаблонами банка нет.

   ПОРЯДОК БЛОКОВ (см. atlas.sample.html)
   .atlrelief → .atlgrat → .atlsheet[ .atlin[ .atlmargin → .atlplate
   (.atlplate__txt + .atlinstr) → .atllegend (.atlsign × N) →
   main.atlfield (.atlquad × N) → .atlnote → .atlfoot ] ] → .atlrose--fix.
   Квадраты идут ПОДРЯД внутри .atlfield: отметки высоты и штриховка
   разделителя держатся на :nth-of-type, посторонний блок между квадратами
   сбивает счёт листа. Легенда обязана содержать по знаку на каждый квадрат —
   иначе на листе оказывается объект, которого нет в условных обозначениях.

   АДАПТИВ
   ≤1240px — снимается фиксированная роза .atlrose--fix; ≤980px — планшет и
   квадрат в одну колонку, .atlquad__ref ложится горизонтальной строкой;
   ≤620px — легенда в одну колонку, кнопки на всю ширину, деления рамки
   учащаются вдвое. Горизонтального скролла у страницы нет: широкие таблицы
   лежат в .atlscroll{overflow-x:auto}, у всех грид-колонок minmax(0,1fr), у
   ячеек min-width:0 — иначе min-width таблицы протекает в грид-трек и на
   390px возникает горизонтальный скролл.
   Тач-цели: в брейкпоинте ≤760px ВСЕ .atlsheet a / .atlsheet button получают
   min-height:44px + inline-flex. Поэтому в прозе шаблона ссылок нет вовсе —
   строчная ссылка внутри абзаца от inline-flex рвёт строку. Ссылки живут
   только в .atlnav, .atlcta, .atlsign и .atlfoot.

   ЛОВУШКИ ПЕРЕКРАСКИ
   1. Весь цвет собран из --atl-h / --atl-h2 в блоке @palette:start/end.
      Смена двух чисел перекрашивает лист целиком. Светлота подобрана под
      ТЁМНЫЙ лист; для светлой темы правьте руками --atl-tx/--atl-tx2 и
      inset-тени .atlquad__body (они рассчитаны на тёмное поле).
   2. .atlnote — единственный блок со СВЕТЛОЙ подложкой. Цвет текста,
      заголовка и подписи задан явно через --atl-paper-ink/--atl-paper-mut.
      Наследование от body даёт бумагу цвета бумаги. То же у .atlrev —
      это полевые карточки, у них своя пара цветов.
   3. .atlbtn--go несёт ТЁМНЫЙ текст на заливке первого акцента: --atl-ink
      обязан оставаться на 45–55 % светлоты ниже --atl-a1. Если поднимаете
      --atl-h в жёлто-зелёный коридор (60–150°), поднимайте и светлоту
      --atl-tx2 на 4–6 %, иначе подписи тонут в поле листа.
   4. ⚠️ Специфичность CTA. Правило .atlsheet a{color:…} (0-2-0) перебивает
      .atlbtn (0-1-0) и красит кнопку в цвет ссылки — текст сливается с
      заливкой. В шаблоне кнопки объявлены как .atlsheet a.atlbtn (0-3-0);
      при добавлении новых состояний держите ту же специфичность и НЕ
      лечите !important. Проверять контраст текста кнопок надо по пикселям
      скриншота, а не по CSS-предкам: под кнопкой лежит градиент.
   5. Горизонтали, километровая сетка, деления рамки и штриховка .atlbar
      несут цвет ВМЕСТЕ с alpha литеральным hsl(… / .06) вне :root — иначе
      alpha не варьируется через var(). При смене hue ищите «hsl(» вне блока
      :root и правьте эти места руками.
   6. Роза ветров и глифы легенды берут цвет из currentColor / stroke=
      "currentColor" в разметке. Не задавайте fill прямо в SVG — знак
      перестанет перекрашиваться вместе с листом.
   7. У шаблона НЕТ общего правила цвета для ссылок (.atlsheet a{color:…}) —
      цвет задан каждому виду ссылки отдельно. Поэтому любая новая ссылка без
      своего color берёт браузерный rgb(0,0,238) и на тёмном листе тонет.
      Проверено измерением: .atlsign без color отдавал синий по умолчанию.
   8. --atl-a2 (второй акцент) держит тональную дистанцию по схеме из набора
      параметров. Если сблизить его с --atl-a1, пропадает различие между
      «объектами» и «гидрографией» листа: рамка, роза, вторая CTA и
      акценты .atlem2 сливаются с основным акцентом.
   ========================================================================== */

/* @palette:start — перекраска листа = правка двух чисел ниже (нейтральный банк) */
:root{
  --atl-h:210;         /* поле листа, рельеф, рамка: базовый hue сайта */
  --atl-h2:30;         /* гидрография, роза, вторая CTA: второй акцент */
}
/* @palette:end */

:root{
  --atl-bg:hsl(var(--atl-h) 16% 7%);
  --atl-bg2:hsl(var(--atl-h) 15% 10%);
  --atl-panel:hsl(var(--atl-h) 14% 12%);
  --atl-panel2:hsl(var(--atl-h) 13% 15%);
  --atl-line:hsl(var(--atl-h) 14% 26%);
  --atl-line2:hsl(var(--atl-h) 12% 20%);
  --atl-tx:hsl(var(--atl-h) 20% 94%);
  --atl-tx2:hsl(var(--atl-h) 11% 73%);
  --atl-a1:hsl(var(--atl-h) 86% 58%);
  --atl-a1d:hsl(var(--atl-h) 60% 30%);
  --atl-a2:hsl(var(--atl-h2) 68% 56%);
  --atl-a2d:hsl(var(--atl-h2) 46% 26%);
  --atl-ink:hsl(var(--atl-h) 46% 8%);          /* текст на заливке акцента */

  /* бумага: врезка составителя и полевые карточки отзывов */
  --atl-paper:hsl(var(--atl-h2) 26% 91%);
  --atl-paper2:hsl(var(--atl-h2) 22% 84%);
  --atl-paper-ink:hsl(var(--atl-h) 30% 13%);
  --atl-paper-mut:hsl(var(--atl-h) 16% 26%);

  --atl-w:1200px;
  --atl-r:3px;
  --atl-tick:12px;      /* шаг минутного деления рамки */
  --atl-pad:clamp(14px,2.2vw,30px);
  --atl-fd:"{{FONT_DISPLAY}}",system-ui,"Segoe UI",Arial,sans-serif;
  --atl-fb:"{{FONT_BODY}}",Georgia,"Times New Roman",serif;
}

/* ---------- base ---------- */
*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:hidden}
body{
  background:var(--atl-bg);
  color:var(--atl-tx);
  font-family:var(--atl-fb);
  font-size:18px;
  line-height:1.62;
  -webkit-text-size-adjust:100%;
}
p{margin:0 0 .85em}
img{max-width:100%;height:auto}
table{border-collapse:collapse;width:100%}

/* ---------- 1. рельеф + километровая сетка ---------- */
.atlrelief,.atlgrat{position:fixed;inset:0;pointer-events:none;z-index:0}
.atlrelief{
  background:
    repeating-radial-gradient(circle at 14% 22%, hsl(var(--atl-h) 60% 60% / .075) 0 1px, transparent 1px 27px),
    repeating-radial-gradient(circle at 78% 12%, hsl(var(--atl-h) 55% 58% / .06) 0 1px, transparent 1px 34px),
    repeating-radial-gradient(circle at 62% 74%, hsl(var(--atl-h2) 55% 58% / .055) 0 1px, transparent 1px 31px),
    repeating-radial-gradient(circle at 8% 88%, hsl(var(--atl-h) 50% 58% / .05) 0 1px, transparent 1px 38px),
    radial-gradient(120% 80% at 50% -10%, hsl(var(--atl-h) 30% 16%) 0%, transparent 62%),
    var(--atl-bg);
}
.atlgrat{
  background:
    repeating-linear-gradient(90deg, hsl(var(--atl-h) 40% 70% / .045) 0 1px, transparent 1px 104px),
    repeating-linear-gradient(0deg,  hsl(var(--atl-h) 40% 70% / .045) 0 1px, transparent 1px 104px);
}

/* ---------- 2. лист + координатная рамка с минутными делениями ---------- */
.atlsheet{
  position:relative;z-index:1;
  max-width:var(--atl-w);
  margin:22px auto;
  padding:13px;
  border:1px solid var(--atl-line);
  background-color:hsl(var(--atl-h) 16% 8% / .82);
  background-image:
    /* длинные деления — пять минут */
    repeating-linear-gradient(90deg, var(--atl-line) 0 1px, transparent 1px calc(var(--atl-tick) * 5)),
    repeating-linear-gradient(90deg, var(--atl-line) 0 1px, transparent 1px calc(var(--atl-tick) * 5)),
    repeating-linear-gradient(0deg,  var(--atl-line) 0 1px, transparent 1px calc(var(--atl-tick) * 5)),
    repeating-linear-gradient(0deg,  var(--atl-line) 0 1px, transparent 1px calc(var(--atl-tick) * 5)),
    /* минутные деления */
    repeating-linear-gradient(90deg, hsl(var(--atl-h) 14% 40% / .85) 0 1px, transparent 1px var(--atl-tick)),
    repeating-linear-gradient(90deg, hsl(var(--atl-h) 14% 40% / .85) 0 1px, transparent 1px var(--atl-tick)),
    repeating-linear-gradient(0deg,  hsl(var(--atl-h) 14% 40% / .85) 0 1px, transparent 1px var(--atl-tick)),
    repeating-linear-gradient(0deg,  hsl(var(--atl-h) 14% 40% / .85) 0 1px, transparent 1px var(--atl-tick));
  background-size:
    100% 11px, 100% 11px, 11px 100%, 11px 100%,
    100% 5px,  100% 5px,  5px 100%,  5px 100%;
  background-position:
    0 0, 0 100%, 0 0, 100% 0,
    0 0, 0 100%, 0 0, 100% 0;
  background-repeat:no-repeat;
}
.atlin{
  border:1px solid var(--atl-line2);
  background:linear-gradient(hsl(var(--atl-h) 15% 9% / .9), hsl(var(--atl-h) 15% 7% / .9));
  padding:0;
}

/* ---------- 3. зарамочное оформление сверху ---------- */
.atlmargin{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;
  padding:14px var(--atl-pad);
  border-bottom:1px solid var(--atl-line2);
  background:linear-gradient(hsl(var(--atl-h) 18% 12%), hsl(var(--atl-h) 18% 9%));
}
.atlmark{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--atl-fd);font-weight:700;font-size:21px;letter-spacing:.02em;
  color:var(--atl-tx);text-decoration:none;
  padding:6px 4px;min-height:44px;
}
.atlmark svg{width:28px;height:28px;flex:none;color:var(--atl-a1)}
.atlnom{
  font-family:var(--atl-fd);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--atl-tx2);border-left:1px solid var(--atl-line);padding-left:16px;
}
.atlnav{display:flex;flex-wrap:wrap;gap:6px 4px;margin-left:auto}
.atlsheet .atlnav a{
  display:inline-flex;align-items:center;min-height:44px;padding:0 12px;
  font-family:var(--atl-fd);font-size:14px;letter-spacing:.05em;
  color:var(--atl-tx2);text-decoration:none;border:1px solid transparent;border-radius:var(--atl-r);
}
.atlsheet .atlnav a:hover{color:var(--atl-a1);border-color:var(--atl-line)}

/* ---------- 4. планшет (первый экран) ---------- */
.atlplate{
  display:grid;grid-template-columns:minmax(0,1.42fr) minmax(0,1fr);
  gap:clamp(18px,3vw,42px);
  padding:clamp(22px,3.4vw,44px) var(--atl-pad) clamp(20px,3vw,36px);
  border-bottom:1px solid var(--atl-line2);
}
.atlplate__txt{min-width:0}
.atlkick{
  display:inline-block;font-family:var(--atl-fd);font-size:12px;
  letter-spacing:.2em;text-transform:uppercase;color:var(--atl-a2);
  border:1px solid var(--atl-a2d);border-radius:var(--atl-r);
  padding:4px 11px;margin-bottom:16px;
}
.atlh1{
  font-family:var(--atl-fd);font-weight:700;
  font-size:clamp(30px,4.4vw,52px);line-height:1.08;letter-spacing:-.005em;
  margin:0 0 16px;color:var(--atl-tx);
}
.atllead{font-size:clamp(17px,1.35vw,20px);color:var(--atl-tx2);margin:0 0 22px;max-width:60ch}
.atlcta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:24px}

/* ⚠️ ловушка 4: специфичность 0-3-0 — держать выше, чем у .atlsheet a */
.atlsheet a.atlbtn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:52px;padding:0 24px;border-radius:var(--atl-r);
  font-family:var(--atl-fd);font-weight:700;font-size:17px;letter-spacing:.02em;
  text-decoration:none;border:1px solid transparent;
}
.atlsheet a.atlbtn--go{
  background:linear-gradient(150deg,
    hsl(var(--atl-h) 92% 66%), hsl(var(--atl-h) 84% 52%));
  color:var(--atl-ink);
  border-color:hsl(var(--atl-h) 70% 40%);
  box-shadow:0 0 0 1px hsl(var(--atl-h) 90% 62% / .28), 0 10px 26px hsl(var(--atl-h) 80% 20% / .5);
}
.atlsheet a.atlbtn--go:hover{background:linear-gradient(150deg,
    hsl(var(--atl-h) 94% 72%), hsl(var(--atl-h) 88% 58%))}
.atlsheet a.atlbtn--alt{
  background:hsl(var(--atl-h2) 40% 14%);
  color:hsl(var(--atl-h2) 78% 74%);
  border-color:var(--atl-a2d);
}
.atlsheet a.atlbtn--alt:hover{border-color:var(--atl-a2);color:hsl(var(--atl-h2) 80% 82%)}

/* реперы — KPI первого экрана */
.atlbench{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(148px,100%),1fr));
  gap:10px;
}
.atlrep{
  min-width:0;padding:12px 14px;border:1px solid var(--atl-line2);border-radius:var(--atl-r);
  background:linear-gradient(hsl(var(--atl-h) 16% 13%), hsl(var(--atl-h) 16% 10%));
  position:relative;
}
.atlrep::before{
  content:"";position:absolute;left:14px;top:-1px;width:22px;height:2px;background:var(--atl-a1);
}
.atlrep b,.atlrep .atlnum{
  display:block;font-family:var(--atl-fd);font-weight:700;font-size:26px;line-height:1.15;
  color:var(--atl-a1);
}
.atlrep span{display:block;font-size:14px;color:var(--atl-tx2);line-height:1.35;margin-top:3px}

/* приборный блок: роза ветров + масштабная линейка */
.atlinstr{
  min-width:0;display:flex;flex-direction:column;gap:16px;justify-content:center;
  padding:18px;border:1px solid var(--atl-line2);border-radius:var(--atl-r);
  background:
    repeating-linear-gradient(90deg, hsl(var(--atl-h) 40% 70% / .05) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(0deg,  hsl(var(--atl-h) 40% 70% / .05) 0 1px, transparent 1px 26px),
    linear-gradient(hsl(var(--atl-h) 16% 11%), hsl(var(--atl-h) 16% 9%));
}
.atlrose{display:block;width:min(210px,86%);margin:0 auto;color:var(--atl-a2)}
.atlrose .n{fill:currentColor}
.atlrose--fix{
  position:fixed;right:18px;bottom:18px;width:96px;z-index:2;opacity:.5;pointer-events:none;
}
.atlbar{display:flex;flex-direction:column;gap:5px}
.atlbar__seg{display:flex;height:12px;border:1px solid var(--atl-line)}
.atlbar__seg i{flex:1}
.atlbar__seg i:nth-child(odd){background:var(--atl-a1)}
.atlbar__seg i:nth-child(even){background:hsl(var(--atl-h) 16% 16%)}
.atlbar__lbl{display:flex;justify-content:space-between;font-family:var(--atl-fd);
  font-size:11px;letter-spacing:.12em;color:var(--atl-tx2)}
.atlcoord{
  font-family:var(--atl-fd);font-size:12px;letter-spacing:.13em;color:var(--atl-tx2);
  text-align:center;border-top:1px dashed var(--atl-line);padding-top:11px;
}

/* ---------- 5. легенда условных знаков (вместо списка ссылок) ---------- */
.atllegend{
  padding:clamp(18px,2.6vw,30px) var(--atl-pad);
  border-bottom:1px solid var(--atl-line2);
  background:hsl(var(--atl-h) 16% 9% / .6);
}
.atllegend__t{
  font-family:var(--atl-fd);font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--atl-tx2);margin:0 0 14px;
}
.atlsigns{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(232px,100%),1fr));gap:8px}
.atlsheet a.atlsign{
  display:flex;align-items:center;gap:12px;min-width:0;min-height:56px;
  padding:9px 12px;border:1px solid var(--atl-line2);border-radius:var(--atl-r);
  text-decoration:none;background:hsl(var(--atl-h) 16% 12% / .7);
  color:var(--atl-tx);   /* без этого знак наследует синий цвет ссылки по умолчанию */
}
.atlsheet a.atlsign:hover{border-color:var(--atl-a1);background:hsl(var(--atl-h) 20% 15% / .8)}
.atlglyph{flex:none;width:34px;height:34px;color:var(--atl-a1)}
.atlsign__t{min-width:0;font-family:var(--atl-fd);font-size:15px;color:var(--atl-tx);line-height:1.25}
.atlsign__t i{display:block;font-style:normal;font-size:12px;letter-spacing:.12em;color:var(--atl-tx2)}

/* ---------- 6. поле листа: квадраты ---------- */
.atlfield{display:block;padding:0}
.atlquad{
  display:grid;grid-template-columns:132px minmax(0,1fr);
  gap:0;border-bottom:1px solid var(--atl-line2);
}
.atlquad:last-of-type{border-bottom:0}
.atlquad__ref{
  min-width:0;padding:clamp(20px,2.6vw,30px) 12px;
  border-right:1px solid var(--atl-line2);
  background:
    repeating-linear-gradient(0deg, hsl(var(--atl-h) 40% 70% / .05) 0 1px, transparent 1px 26px),
    hsl(var(--atl-h) 16% 10% / .55);
  text-align:center;
}
.atlquad__no{
  font-family:var(--atl-fd);font-weight:700;font-size:30px;line-height:1;color:var(--atl-a1);
}
.atlquad__nom{
  display:block;margin-top:8px;font-family:var(--atl-fd);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--atl-tx2);
}
.atlquad__alt{
  display:inline-block;margin-top:12px;padding:3px 8px;border:1px solid var(--atl-line);
  border-radius:var(--atl-r);font-family:var(--atl-fd);font-size:11px;letter-spacing:.1em;
  color:var(--atl-a2);
}
.atlquad__body{
  min-width:0;padding:clamp(20px,2.8vw,34px) var(--atl-pad);
  box-shadow:inset 0 1px 0 hsl(var(--atl-h) 30% 40% / .07);
}
.atlquad:nth-of-type(2n) .atlquad__body{background:hsl(var(--atl-h) 16% 9% / .45)}
.atlh2{
  font-family:var(--atl-fd);font-weight:700;font-size:clamp(23px,2.5vw,31px);
  line-height:1.16;margin:0 0 14px;color:var(--atl-tx);
}
.atlh3{
  font-family:var(--atl-fd);font-weight:700;font-size:18px;line-height:1.25;
  margin:0 0 7px;color:var(--atl-a1);
}
.atlprose{max-width:74ch}
.atlmut{color:var(--atl-tx2)}
.atlem{color:var(--atl-a1);font-weight:700;font-style:normal}
.atlem2{color:var(--atl-a2);font-weight:700;font-style:normal}

/* карточки-объекты */
.atlgrid{display:grid;gap:10px;margin:18px 0}
.atlgrid--2{grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr))}
.atlgrid--3{grid-template-columns:repeat(auto-fit,minmax(min(212px,100%),1fr))}
.atlcard{
  min-width:0;padding:14px 16px;border:1px solid var(--atl-line2);border-radius:var(--atl-r);
  background:linear-gradient(hsl(var(--atl-h) 16% 13%), hsl(var(--atl-h) 16% 10%));
}
.atlcard p{margin:0;font-size:16px;color:var(--atl-tx2)}
.atlcard .atlh3{font-size:16px}

/* таблицы */
.atlscroll{overflow-x:auto;margin:18px 0;border:1px solid var(--atl-line2);border-radius:var(--atl-r)}
.atltab{min-width:520px;font-size:16px}
.atltab th,.atltab td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--atl-line2)}
.atltab th{
  font-family:var(--atl-fd);font-size:12px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--atl-tx2);background:hsl(var(--atl-h) 18% 13%);font-weight:600;
}
.atltab tr:last-child td{border-bottom:0}
.atltab td:first-child{color:var(--atl-tx)}
.atltab td{color:var(--atl-tx2)}

/* ступени — отметки высоты */
.atlsteps{display:grid;gap:7px;margin:18px 0}
.atlstep{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;
  padding:11px 14px;border:1px solid var(--atl-line2);border-radius:var(--atl-r);
  background:linear-gradient(90deg, hsl(var(--atl-h) 30% 16% / .85) 0%,
    hsl(var(--atl-h) 16% 11% / .85) var(--atl-f,40%), hsl(var(--atl-h) 16% 10% / .85) 100%);
}
.atlstep__n{font-family:var(--atl-fd);font-weight:700;font-size:17px;color:var(--atl-tx);min-width:0}
.atlstep__n i{display:block;font-style:normal;font-size:14px;font-weight:400;color:var(--atl-tx2);
  font-family:var(--atl-fb)}
.atlstep__v{font-family:var(--atl-fd);font-weight:700;font-size:19px;color:var(--atl-a1);white-space:nowrap}

/* полевые карточки отзывов — бумага */
.atlrevs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(258px,100%),1fr));gap:10px;margin:18px 0}
.atlrev{
  min-width:0;padding:14px 16px;border-radius:var(--atl-r);
  background:linear-gradient(var(--atl-paper), var(--atl-paper2));
  color:var(--atl-paper-ink);
  box-shadow:0 8px 20px hsl(var(--atl-h) 30% 4% / .45);
}
.atlrev p{font-size:16px;margin:0}
.atlrev .atlh3{color:var(--atl-paper-ink);font-size:16px}
.atlrev__c{
  display:block;font-family:var(--atl-fd);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--atl-paper-mut);margin-top:9px;
}

/* вопросы */
.atlfaq{display:grid;gap:9px;margin:18px 0}
.atlqa{
  padding:13px 16px;border:1px solid var(--atl-line2);border-radius:var(--atl-r);
  background:hsl(var(--atl-h) 16% 11% / .8);border-left:2px solid var(--atl-a2d);
}
.atlqa p{margin:0;font-size:16px;color:var(--atl-tx2)}

/* врезка-предупреждение */
.atlcall{
  margin:18px 0;padding:13px 16px;border:1px dashed var(--atl-a2d);border-radius:var(--atl-r);
  background:hsl(var(--atl-h2) 40% 12% / .5);
}
.atlcall p{margin:0;font-size:16px;color:var(--atl-tx2)}

/* ---------- 7. врезка составителя (единственный светлый блок) ---------- */
.atlnote{
  margin:0;padding:clamp(20px,2.8vw,32px) var(--atl-pad);
  border-top:1px solid var(--atl-line2);
  background:
    repeating-linear-gradient(0deg, hsl(var(--atl-h) 20% 40% / .09) 0 1px, transparent 1px 30px),
    linear-gradient(var(--atl-paper), var(--atl-paper2));
  color:var(--atl-paper-ink);
}
.atlnote .atlh3{color:var(--atl-paper-ink);font-size:21px}
.atlnote p{color:var(--atl-paper-ink);max-width:76ch}
.atlnote__by{
  display:block;margin-top:12px;font-family:var(--atl-fd);font-size:13px;letter-spacing:.09em;
  color:var(--atl-paper-mut);border-top:1px solid hsl(var(--atl-h) 16% 40% / .35);padding-top:11px;
}

/* ---------- 8. выходные данные листа ---------- */
.atlfoot{
  padding:clamp(20px,2.8vw,30px) var(--atl-pad);
  border-top:1px solid var(--atl-line2);
  background:linear-gradient(hsl(var(--atl-h) 18% 9%), hsl(var(--atl-h) 18% 7%));
  font-size:15px;color:var(--atl-tx2);
}
.atlfoot__row{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;margin-bottom:14px}
.atlsheet .atlfoot a{
  display:inline-flex;align-items:center;min-height:44px;padding:0 2px;
  color:var(--atl-a2);text-decoration:none;font-size:15px;
}
.atlsheet .atlfoot a:hover{color:var(--atl-a1);text-decoration:underline}
.atlfoot__imp{
  font-family:var(--atl-fd);font-size:12px;letter-spacing:.13em;text-transform:uppercase;
  color:hsl(var(--atl-h) 10% 52%);border-top:1px dashed var(--atl-line2);padding-top:12px;margin-top:6px;
}
.atlage{
  display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:30px;
  padding:0 10px;border:1px solid var(--atl-a1d);border-radius:var(--atl-r);
  font-family:var(--atl-fd);font-weight:700;font-size:14px;color:var(--atl-a1);
}

/* ---------- 9. адаптив ---------- */
@media (max-width:1240px){
  .atlrose--fix{display:none}
}
@media (max-width:980px){
  .atlplate{grid-template-columns:minmax(0,1fr)}
  .atlinstr{order:-1}
  .atlquad{grid-template-columns:minmax(0,1fr)}
  .atlquad__ref{
    display:flex;align-items:center;gap:14px;justify-content:flex-start;text-align:left;
    border-right:0;border-bottom:1px solid var(--atl-line2);padding:12px var(--atl-pad);
  }
  .atlquad__no{font-size:23px}
  .atlquad__nom{margin-top:0}
  .atlquad__alt{margin-top:0;margin-left:auto}
}
@media (max-width:760px){
  body{font-size:17px}
  .atlsheet{padding:9px;margin:10px auto;--atl-tick:8px}
  .atlmargin{gap:8px 14px}
  .atlnom{border-left:0;padding-left:0;width:100%;order:3}
  .atlnav{margin-left:0;width:100%}
  /* тач-цели: ВСЕ интерактивные элементы листа не ниже 44px */
  .atlsheet a,.atlsheet button{
    display:inline-flex;align-items:center;min-height:44px;
  }
  .atlsheet a.atlbtn{width:100%;min-height:54px}
  .atlsheet .atlnav a{padding:0 10px;font-size:13px}
}
@media (max-width:620px){
  .atlsigns{grid-template-columns:minmax(0,1fr)}
  .atlh1{font-size:clamp(26px,7.6vw,34px)}
  .atlrep b,.atlrep .atlnum{font-size:23px}
  .atlinstr{padding:14px}
  .atlrose{width:min(168px,72%)}
}

.entities{display:flex;flex-wrap:wrap;gap:8px}.entities span{padding:6px 9px;border:1px solid currentColor}a[href="/goto/"]{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px}blockquote{padding:14px;border-left:3px solid currentColor}@media(max-width:650px){h1{overflow-wrap:anywhere}}