@import url('/fonts/faces.css');

/* =============================================================================
   v2raytun.yachts — тема «журнальная полоса».

   Сайт про компьютер, и читают его за компьютером: широкий экран, долгий текст,
   время рассмотреть. Отсюда вёрстка печатного журнала — широкая полоса, крупные
   заголовки, прижатые влево, буквица во вступлении, вступление в две колонки,
   линейки во всю ширину и поле справа, куда уходят короткие пояснения.

   Две краски, работающие в паре: глубокая синь (текст, заголовки, линейки) и
   кирпич (буквица, маркеры, кнопки, подсветка). Бумага тёплая, не белая.
   Ночью это не инверсия, а тот же разворот, напечатанный светлым по тёмному.
   ========================================================================== */

:root {
  --paper:  #F3EBDB;
  --paper2: #FBF7EE;
  --paper3: #EAE0CC;
  --ink:    #13253A;
  --ink2:   #55606E;
  --acc:    #A8341F;
  --acc2:   #85270F;
  --rule:   #C2B296;
  --rule2:  #DFD3BA;
  --ok:     #2C6B4B;
  --warn:   #8A5A11;

  --f-dsp: 'Vollkorn', Georgia, 'Times New Roman', serif;
  --f-txt: 'SofiaS', -apple-system, 'Segoe UI', Roboto, sans-serif;
  --f-mono: 'NSMono', ui-monospace, 'SF Mono', Consolas, monospace;

  --mrg: 15rem;          /* поле для врезок справа */
  --gap: 2.5rem;
  --max: 1280px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper:  #14181E;
    --paper2: #1C222B;
    --paper3: #232A34;
    --ink:    #ECE3D1;
    --ink2:   #A0998A;
    --acc:    #E07A54;
    --acc2:   #F0906B;
    --rule:   #3C4552;
    --rule2:  #2A313B;
    --ok:     #6BBE8E;
    --warn:   #D2A04A;
  }
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 400 17px/1.62 var(--f-txt);
  font-feature-settings: 'kern' 1;
  overflow-wrap: break-word;
}

img { max-width: 100%; height: auto; }

a { color: var(--acc); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--acc2); }

:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }

code, kbd, pre { font-family: var(--f-mono); font-size: .88em; }
code { background: var(--paper3); padding: .05em .3em; }
pre { background: var(--paper3); padding: 14px 16px; overflow-x: auto; border-left: 3px solid var(--acc); }

.skip {
  position: absolute; left: -9999px; top: 0; z-index: 99;
  background: var(--ink); color: var(--paper); padding: 10px 16px;
}
.skip:focus { left: 0; }

.page { min-height: 100vh; display: flex; flex-direction: column; }

/* --- ШАПКА: газетная марка ------------------------------------------------ */
.hdr { background: var(--paper); }

.hdr__top { border-top: 7px solid var(--ink); border-bottom: 1px solid var(--rule); }

.hdr__in {
  max-width: var(--max); margin: 0 auto; padding: 14px 24px;
  display: flex; align-items: center; gap: 20px;
}

.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.brand__logo { display: block; width: 40px; height: 40px; }
.brand__txt { display: flex; flex-direction: column; line-height: 1; }
.brand__mark {
  font: 700 27px/1 var(--f-dsp);
  letter-spacing: .03em;
}
.brand__tag {
  margin-top: 5px;
  font: 600 10px/1 var(--f-mono);
  letter-spacing: .22em; color: var(--acc);
}

.hdr__go { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.hdr__price {
  display: flex; flex-direction: column; text-align: right;
  font: 700 17px/1 var(--f-dsp); white-space: nowrap;
}
.hdr__price i {
  font: 500 10px/1 var(--f-mono); letter-spacing: .14em;
  color: var(--ink2); font-style: normal; margin-top: 4px;
}

.hdr__bot { border-bottom: 3px double var(--rule); background: var(--paper); }
.hdr__nav {
  max-width: var(--max); margin: 0 auto; padding: 0 24px;
  display: flex; align-items: stretch; gap: 0; flex-wrap: wrap;
}
.hdr__nav > a {
  padding: 11px 16px 10px;
  font: 600 12px/1 var(--f-mono); letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink); text-decoration: none;
  border-right: 1px solid var(--rule2);
}
.hdr__nav > a:first-child { padding-left: 0; }
.hdr__nav > a:hover { color: var(--acc); background: var(--paper2); }
.hdr__nav > a[aria-current] { color: var(--acc); box-shadow: inset 0 -3px 0 var(--acc); }

.searchbtn {
  margin-left: auto; display: flex; align-items: center; gap: 8px;
  background: none; border: 0; border-left: 1px solid var(--rule2);
  padding: 10px 0 10px 16px; cursor: pointer; color: var(--ink2);
  font: 600 12px/1 var(--f-mono); letter-spacing: .1em; text-transform: uppercase;
}
.searchbtn:hover { color: var(--acc); }
.searchbtn kbd {
  border: 1px solid var(--rule); padding: 1px 5px; font-size: 10px; color: var(--ink2);
}

.burger {
  display: none; background: var(--ink); color: var(--paper); border: 0;
  padding: 9px 14px; cursor: pointer;
  font: 600 11px/1 var(--f-mono); letter-spacing: .16em;
}

.mnav { display: none; border-bottom: 1px solid var(--rule); }
.mnav.is-on { display: block; }
.mnav ul { margin: 0; padding: 6px 20px 14px; list-style: none; }
.mnav li + li { border-top: 1px solid var(--rule2); }
.mnav a {
  display: block; padding: 11px 0; color: var(--ink); text-decoration: none;
  font: 600 15px/1 var(--f-txt);
}

/* --- РАЗВОРОТ ------------------------------------------------------------- */
.layout {
  flex: 1; width: 100%; max-width: var(--max); margin: 0 auto;
  padding: 0 24px 72px;
  display: grid; grid-template-columns: 15.5rem minmax(0, 1fr); gap: var(--gap);
  align-items: start;
}
main { min-width: 0; }
.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 24px 72px; }

/* --- БОКОВОЙ УКАЗАТЕЛЬ ---------------------------------------------------- */
.side {
  position: sticky; top: 16px; padding: 22px 0 0;
  border-right: 1px solid var(--rule2); padding-right: 22px;
}
.side__grp + .side__grp { margin-top: 26px; }
.side__ttl {
  display: block; margin-bottom: 10px; padding-bottom: 7px;
  border-bottom: 2px solid var(--ink);
  font: 700 19px/1.1 var(--f-dsp);
}
.side__ttl a { color: inherit; text-decoration: none; }
.side__ttl a:hover { color: var(--acc); }
.side__list, .side__flat { margin: 0; padding: 0; list-style: none; }
.side__list a {
  display: grid; grid-template-columns: 2.6rem 1fr; gap: 4px;
  padding: 7px 0; color: var(--ink); text-decoration: none;
  font-size: 14.5px; line-height: 1.34; border-bottom: 1px solid var(--rule2);
}
.side__list a:hover { color: var(--acc); }
.side__i { font: 600 10px/1.7 var(--f-mono); letter-spacing: .08em; color: var(--ink2); }
.side__list a[aria-current] { color: var(--acc); font-weight: 700; }
.side__list a[aria-current] .side__i { color: var(--acc); }
.side__flat li { display: inline; }
.side__flat a {
  display: inline-block; margin: 0 8px 6px 0; padding-bottom: 1px;
  font-size: 13.5px; color: var(--ink2); text-decoration: none;
  border-bottom: 1px solid var(--rule);
}
.side__flat a:hover { color: var(--acc); border-color: var(--acc); }

.side__cta {
  margin-top: 26px; padding: 16px 16px 18px;
  background: var(--paper2); border-top: 4px solid var(--acc);
}
.side__cta-tag { font: 600 10px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.side__cta-ttl { margin: 10px 0 6px; font: 700 18px/1.15 var(--f-dsp); }
.side__cta-txt { margin: 0 0 14px; font-size: 13.5px; line-height: 1.5; color: var(--ink2); }

/* --- КРОШКИ И ЗАГОЛОВОК СТАТЬИ -------------------------------------------- */
.crumbs {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  padding: 18px 0 0; font: 500 11px/1.6 var(--f-mono);
  letter-spacing: .1em; text-transform: uppercase;
}
.crumbs a { color: var(--ink2); text-decoration: none; }
.crumbs a:hover { color: var(--acc); }
.crumbs i { color: var(--rule); font-style: normal; }
.crumbs span { color: var(--ink); }

.art { padding: 0 0 8px; }

@media (min-width: 1160px) {
  .art { padding-right: calc(var(--mrg) + var(--gap)); }
}

/* Главная и страница оплаты идут во всю ширину: поля для врезок там нет,
   и уводить в него врезки и проверку нельзя — они вывалятся за полосу. */
.art--home, .art--pay { padding-right: 0; }
.art--home .note, .art--pay .note,
.art--home .chk, .art--pay .chk { float: none; width: auto; margin-left: 0; margin-right: 0; }

.art > h1 {
  margin: 14px 0 0; padding-top: 16px;
  border-top: 5px solid var(--ink);
  font: 700 clamp(2.05rem, 4.6vw, 3.4rem)/1.02 var(--f-dsp);
  letter-spacing: -.015em; hyphens: none;
}
.art__meta {
  display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center;
  margin: 14px 0 18px; padding-bottom: 12px;
  border-bottom: 1px solid var(--rule);
  font: 500 11px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink2);
}
.art__rt { color: var(--acc); }
.art__lead {
  margin: 0 0 22px;
  font: 400 clamp(1.08rem, 1.6vw, 1.3rem)/1.5 var(--f-dsp);
  color: var(--ink);
}

/* --- ВСТУПЛЕНИЕ В ДВЕ КОЛОНКИ С БУКВИЦЕЙ ---------------------------------- */
.deck {
  margin: 0 0 26px; padding-bottom: 22px;
  border-bottom: 3px double var(--rule);
}
.deck p { margin: 0 0 .85em; }
.deck p:last-child { margin-bottom: 0; }
.deck > p:first-child::first-letter {
  float: left; margin: .06em .1em 0 0;
  font: 700 3.9em/.78 var(--f-dsp); color: var(--acc);
}
@media (min-width: 900px) {
  .deck { columns: 2; column-gap: var(--gap); column-rule: 1px solid var(--rule2); }
  .deck p { break-inside: avoid-column; }
}

/* --- ТЕКСТ СТАТЬИ --------------------------------------------------------- */
.art h2 {
  clear: both;
  margin: 2.1em 0 .6em; padding-top: .5em;
  border-top: 2px solid var(--ink);
  font: 700 clamp(1.42rem, 2.5vw, 1.95rem)/1.12 var(--f-dsp);
  letter-spacing: -.01em;
}
.art h3 {
  clear: both;
  margin: 1.7em 0 .35em;
  font: 600 1.18rem/1.25 var(--f-dsp);
}
.art p { margin: 0 0 1.05em; }
.art strong { font-weight: 700; }

.art ul:not([class]), .art ol:not([class]) { margin: 0 0 1.15em; padding: 0; list-style: none; }
.art ul:not([class]) > li,
.art ol:not([class]) > li { position: relative; padding-left: 1.7rem; margin-bottom: .5em; }
.art ul:not([class]) > li::before {
  content: '—'; position: absolute; left: 0; top: 0;
  color: var(--acc); font-weight: 700;
}
.art ol:not([class]) { counter-reset: n; }
.art ol:not([class]) > li { counter-increment: n; }
.art ol:not([class]) > li::before {
  content: counter(n, decimal-leading-zero);
  position: absolute; left: 0; top: .18em;
  font: 600 11px/1 var(--f-mono); color: var(--acc); letter-spacing: .05em;
}

/* --- ВРЕЗКА НА ПОЛЕ ------------------------------------------------------- */
.note {
  margin: 0 0 1.3em; padding: 2px 0 2px 14px;
  border-left: 3px solid var(--acc);
  font-size: 14.5px; line-height: 1.52; color: var(--ink2);
}
.note p { margin: 0 0 .6em; }
.note p:last-child { margin-bottom: 0; }
.note ul { margin: .2em 0 0; padding-left: 1.1rem; }
.note__ttl {
  display: block; margin-bottom: .35em;
  font: 600 11px/1.3 var(--f-mono); letter-spacing: .1em; text-transform: uppercase;
  color: var(--ink);
}
.note--warn { border-color: var(--warn); }
.note--warn .note__ttl { color: var(--warn); }
.note--ok { border-color: var(--ok); }
.note--ok .note__ttl { color: var(--ok); }
.note--down { border-color: var(--ink2); }

@media (min-width: 1160px) {
  .art:not(.art--home):not(.art--pay) .note {
    float: right; clear: right;
    width: var(--mrg); margin: .3em calc(-1 * (var(--mrg) + var(--gap))) 1.2em var(--gap);
    padding-left: 12px;
  }
}

/* --- ВЫНОСНАЯ МЫСЛЬ ------------------------------------------------------- */
.pull {
  clear: both; margin: 1.8em 0; padding: .9em 0;
  border-top: 2px solid var(--acc); border-bottom: 2px solid var(--acc);
}
.pull p {
  margin: 0; font: 600 clamp(1.25rem, 2.2vw, 1.65rem)/1.28 var(--f-dsp);
  letter-spacing: -.01em;
}
.pull__src {
  display: block; margin-top: .6em;
  font: 500 11px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink2);
}

/* --- ТАБЛИЦЫ -------------------------------------------------------------- */
.tw { clear: both; margin: 0 0 1.5em; overflow-x: auto; }
.tw table, .ptab table { width: 100%; border-collapse: collapse; font-size: 15px; }
.tw th, .ptab th { text-align: left; }
.tw thead th, .ptab thead th {
  padding: 0 12px 8px 0; border-bottom: 2px solid var(--ink);
  font: 600 10.5px/1.4 var(--f-mono); letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink);
}
.tw td, .tw tbody th, .ptab td, .ptab tbody th {
  padding: 11px 12px 11px 0; border-bottom: 1px solid var(--rule2);
  vertical-align: top;
}
.tw tbody th { font-weight: 700; }
.tw tr:last-child td, .tw tr:last-child th { border-bottom: 1px solid var(--rule); }

/* --- ШАГИ ----------------------------------------------------------------- */
.steps { clear: both; margin: 0 0 1.6em; padding: 0; list-style: none; counter-reset: s; }
.steps > li {
  counter-increment: s; position: relative;
  padding: 0 0 1.1em 3.4rem; margin-bottom: 1.1em;
  border-bottom: 1px solid var(--rule2);
}
.steps > li:last-child { border-bottom: 0; margin-bottom: 0; }
.steps > li::before {
  content: counter(s, decimal-leading-zero);
  position: absolute; left: 0; top: -.05em;
  font: 700 1.5rem/1 var(--f-dsp); color: var(--acc);
}
.step__ttl { display: block; margin-bottom: .3em; font: 700 1.1rem/1.3 var(--f-dsp); }
.steps p { margin: 0 0 .6em; }
.steps ul { margin: .1em 0 .6em; padding-left: 1.1rem; }

/* --- ВОПРОСЫ -------------------------------------------------------------- */
.faq { clear: both; margin: 0 0 1.6em; }
.faq h3 {
  margin: 1.2em 0 .3em; padding-top: .6em; border-top: 1px solid var(--rule2);
  font: 700 1.08rem/1.3 var(--f-dsp);
}
.faq h3:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.faq p { margin: 0 0 .5em; font-size: 16px; }

/* --- ДВЕ КОЛОНКИ СРАВНЕНИЯ ------------------------------------------------ */
.duo {
  clear: both; display: grid; grid-template-columns: 1fr 1fr; gap: 0;
  margin: 0 0 1.6em; border-top: 2px solid var(--ink);
}
.duo__col { padding: 14px 18px 16px 0; }
.duo__col--b { padding-left: 18px; padding-right: 0; border-left: 1px solid var(--rule); }
.duo__cap { display: block; font: 700 12px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.duo__col--b .duo__cap { color: var(--ink2); }
.duo__sub { display: block; margin-top: 6px; font-size: 13.5px; color: var(--ink2); }
.duo ul { margin: 12px 0 0; padding: 0; list-style: none; }
.duo li { padding-left: 1.1rem; position: relative; margin-bottom: .5em; font-size: 15px; line-height: 1.45; }
.duo li::before { content: '·'; position: absolute; left: .25rem; color: var(--acc); font-weight: 700; }
.duo__foot { margin: 10px 0 0; font-size: 13.5px; color: var(--ink2); }

/* --- ПРИЗНАКИ ------------------------------------------------------------- */
.signs { clear: both; margin: 0 0 1.6em; }
.signs__cap, .bill__cap, .inc__cap, .strip__cap, .ptab__cap, .usetool__tag {
  display: block; margin-bottom: 10px;
  font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase;
  color: var(--acc);
}
.signs__list { margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--ink); }
.signs__list li {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 18px;
  padding: 10px 0; border-bottom: 1px solid var(--rule2);
}
.signs__s { font-weight: 700; font-size: 15px; }
.signs__v { font-size: 15px; color: var(--ink2); }

/* --- СЧЁТ ----------------------------------------------------------------- */
.bill { clear: both; margin: 0 0 1.6em; padding: 16px 18px 18px; background: var(--paper2); }
.bill__list { margin: 0; padding: 0; list-style: none; }
.bill__list li { display: flex; align-items: baseline; gap: 8px; padding: 7px 0; }
.bill__l i { display: block; font-style: normal; font-size: 13px; color: var(--ink2); }
.bill__dots { flex: 1; border-bottom: 1px dotted var(--rule); transform: translateY(-3px); }
.bill__v { font: 600 16px/1 var(--f-mono); white-space: nowrap; }
.bill__total {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  margin: 12px 0 0; padding-top: 12px; border-top: 2px solid var(--ink);
  font-size: 15px;
}
.bill__total b { font: 700 1.5rem/1 var(--f-dsp); color: var(--acc); }
.bill__note { margin: 10px 0 0; font-size: 13.5px; color: var(--ink2); }

/* --- SIGNATURE: ПРОВЕРКА КОМПЬЮТЕРА --------------------------------------- */
.chk {
  clear: both; margin: 0 0 1.8em; padding: 0;
  background: var(--paper2);
  border-top: 6px solid var(--ink); border-bottom: 1px solid var(--rule);
}
@media (min-width: 1160px) {
  .art:not(.art--home):not(.art--pay) .chk { margin-right: calc(-1 * (var(--mrg) + var(--gap))); }
}
.chk__hd {
  display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline;
  padding: 12px 20px; border-bottom: 1px solid var(--rule);
}
.chk__cap { font: 700 13px/1 var(--f-mono); letter-spacing: .16em; }
.chk__tag { font: 500 10.5px/1 var(--f-mono); letter-spacing: .12em; color: var(--ink2); }

.chk__rows { display: grid; grid-template-columns: repeat(3, 1fr); }
.chk__row { margin: 0; padding: 14px 20px 16px; border: 0; border-right: 1px solid var(--rule2); }
.chk__row:last-child { border-right: 0; }
.chk__lg { padding: 0; display: flex; align-items: baseline; gap: 8px;
  font: 600 10.5px/1 var(--f-mono); letter-spacing: .13em; color: var(--ink2); }
.chk__lg i { font-style: normal; color: var(--acc); font-weight: 700; }
.chk__opts { display: flex; flex-direction: column; gap: 2px; margin-top: 10px; }
.chk__o { display: flex; align-items: center; gap: 9px; padding: 5px 0; cursor: pointer; font-size: 15px; }
.chk__o input { accent-color: var(--acc); width: 16px; height: 16px; margin: 0; flex: none; }
.chk__o:hover span { color: var(--acc); }
.chk__o input:checked + span { font-weight: 700; }

.chk__out {
  display: grid; grid-template-columns: repeat(3, 1fr);
  border-top: 3px double var(--rule);
}
.chk__card { padding: 16px 20px 18px; border-right: 1px solid var(--rule2); }
.chk__card:last-child { border-right: 0; }
.chk__n { font: 700 1.6rem/1 var(--f-dsp); color: var(--acc); }
.chk__ct {
  display: block; margin: 6px 0 8px;
  font: 600 10.5px/1.3 var(--f-mono); letter-spacing: .12em; text-transform: uppercase;
}
.chk__tx { margin: 0 0 10px; font-size: 14.5px; line-height: 1.5; color: var(--ink2); }
.chk__go { font: 600 12px/1 var(--f-mono); letter-spacing: .06em; text-decoration: none; }
.chk__go:hover { text-decoration: underline; }

.chk__act {
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px;
  padding: 14px 20px 16px; border-top: 1px solid var(--rule);
}
.chk__price { display: flex; flex-direction: column; }
.chk__price b { font: 700 1.5rem/1 var(--f-dsp); }
.chk__price i { font-style: normal; font-size: 13px; color: var(--ink2); margin-top: 4px; }
.chk__act .btn { margin-left: auto; }

/* --- ПОЛОСА ОТВЕТА -------------------------------------------------------- */
.abar { clear: both; margin: 0 0 1.6em; padding: 0; border-top: 2px solid var(--ink); }
.abar__hd {
  display: flex; justify-content: space-between; gap: 12px; padding: 8px 0 0;
  font: 600 10.5px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase;
}
.abar__link { color: var(--acc); }
.abar__link i { font-style: normal; margin-right: 7px; }
.abar__cap { color: var(--ink2); }
.abar__body {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px;
  padding: 10px 0 14px; border-bottom: 1px solid var(--rule);
}
.abar__price b { font: 700 1.55rem/1 var(--f-dsp); }
.abar__price i { display: block; font-style: normal; font-size: 13px; color: var(--ink2); margin-top: 3px; }
.abar__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font: 500 11.5px/1.5 var(--f-mono); color: var(--ink2); }
.abar__body .btn { margin-left: auto; }
.abar__hint { margin: 8px 0 0; font-size: 13.5px; color: var(--ink2); }

/* --- ПУЛЬТ СРОКА ---------------------------------------------------------- */
.card { clear: both; margin: 0 0 1.6em; background: var(--paper2); border-top: 6px solid var(--acc); }
.card__hd {
  display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline;
  padding: 12px 18px; border-bottom: 1px solid var(--rule);
}
.card__cap { font: 700 12.5px/1 var(--f-mono); letter-spacing: .14em; }
.card__tag { font: 500 10.5px/1 var(--f-mono); letter-spacing: .1em; color: var(--acc); }
.card__keys { display: grid; grid-template-columns: repeat(3, 1fr); }
.dkey {
  display: flex; flex-direction: column; gap: 5px; align-items: flex-start;
  padding: 13px 16px 15px; background: none; cursor: pointer;
  border: 0; border-right: 1px solid var(--rule2); border-bottom: 1px solid var(--rule);
  text-align: left; color: var(--ink); font-family: inherit;
}
.dkey:last-child { border-right: 0; }
.dkey__k { font: 600 10.5px/1 var(--f-mono); letter-spacing: .12em; color: var(--ink2); }
.dkey__p { font: 700 1.3rem/1 var(--f-dsp); }
.dkey__p i { font: 500 11px/1 var(--f-mono); font-style: normal; color: var(--ink2); }
.dkey__s { font: 600 11px/1 var(--f-mono); color: var(--acc); }
.dkey__s--base { color: var(--ink2); font-weight: 500; }
.dkey.is-on { background: var(--ink); }
.dkey.is-on .dkey__k, .dkey.is-on .dkey__p, .dkey.is-on .dkey__p i { color: var(--paper); }
.dkey.is-on .dkey__s { color: var(--paper); }
.card__out { display: grid; grid-template-columns: repeat(3, 1fr); }
.card__out > div { padding: 14px 16px 16px; border-right: 1px solid var(--rule2); }
.card__out > div:last-child { border-right: 0; }
.card__lbl { display: block; font: 600 10px/1 var(--f-mono); letter-spacing: .13em; color: var(--ink2); }
.card__val { display: block; margin: 8px 0 5px; font: 700 1.7rem/1 var(--f-dsp); }
.card__val--acc { color: var(--acc); }
.card__sub { font-size: 13px; color: var(--ink2); }
.card__note { margin: 0; padding: 12px 18px; font-size: 14px; color: var(--ink2); border-top: 1px solid var(--rule2); }
.card__act {
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px;
  padding: 0 18px 18px;
}
.card__link { font-size: 14px; }

/* --- ТАБЛИЦА СРОКОВ ------------------------------------------------------- */
.ptab { clear: both; margin: 0 0 1.6em; }
.ptab tr.is-best th, .ptab tr.is-best td { background: var(--paper2); }
.ptab tr.is-best i { font-style: normal; font: 600 10px/1 var(--f-mono); color: var(--acc); letter-spacing: .1em; }
.ptab__note { margin: 12px 0 14px; font-size: 14px; color: var(--ink2); }

/* --- ЧТО ВХОДИТ ----------------------------------------------------------- */
.inc { clear: both; margin: 0 0 1.6em; }
.inc__list { margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--ink); }
.inc__list li { padding: 11px 0; border-bottom: 1px solid var(--rule2); }
.inc__list b { display: block; font-size: 15.5px; }
.inc__list span { font-size: 14.5px; color: var(--ink2); }

/* --- ЛЕНТА РАЗДЕЛОВ ------------------------------------------------------- */
.track { clear: both; margin: 0 0 1.5em; }
.track__row {
  display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; list-style: none;
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
.track__c a {
  display: flex; align-items: baseline; gap: 7px; padding: 9px 14px 9px 0;
  margin-right: 14px; text-decoration: none; color: var(--ink2);
  font-size: 14px; border-right: 1px solid var(--rule2);
}
.track__c:last-child a { border-right: 0; }
.track__i { font: 700 11px/1 var(--f-mono); color: var(--acc); }
.track__c.is-here a { color: var(--ink); font-weight: 700; }

/* --- КАТАЛОГ РАЗДЕЛОВ ----------------------------------------------------- */
.cat { clear: both; margin: 0 0 1.6em; border-top: 2px solid var(--ink); }
.cat__i {
  display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; gap: 16px; align-items: center;
  padding: 14px 0; border-bottom: 1px solid var(--rule2);
  text-decoration: none; color: var(--ink);
}
.cat__i:hover { background: var(--paper2); }
.cat__code { font: 700 1.5rem/1 var(--f-dsp); color: var(--acc); text-align: center; }
.cat__ttl { display: block; font: 700 1.15rem/1.2 var(--f-dsp); }
.cat__sub { display: block; margin-top: 3px; font-size: 14px; color: var(--ink2); }
.cat__n { font: 600 15px/1 var(--f-mono); color: var(--ink2); white-space: nowrap; }
.cat__n small { font-size: 10px; letter-spacing: .1em; margin-left: 4px; }

/* --- РЯД СТРАНИЦ РАЗДЕЛА -------------------------------------------------- */
.strip { clear: both; margin: 0 0 1.6em; }
.strip__row { display: flex; flex-wrap: wrap; gap: 8px; }
.strip__i {
  display: flex; align-items: baseline; gap: 7px;
  padding: 7px 12px 7px 10px; border: 1px solid var(--rule);
  text-decoration: none; color: var(--ink); font-size: 14px; background: var(--paper2);
}
.strip__i i { font: 600 10px/1 var(--f-mono); color: var(--acc); font-style: normal; }
.strip__i:hover { border-color: var(--acc); color: var(--acc); }
.strip__i.is-here { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.strip__i.is-here i { color: var(--paper); }

/* --- СТРОКИ-ССЫЛКИ -------------------------------------------------------- */
.rows { clear: both; margin: 0 0 1.6em; padding: 0; list-style: none; border-top: 2px solid var(--ink); }
.row {
  display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; gap: 14px; align-items: baseline;
  padding: 13px 0; border-bottom: 1px solid var(--rule2);
  text-decoration: none; color: var(--ink);
}
.row:hover { background: var(--paper2); }
.row__idx { font: 700 12px/1.4 var(--f-mono); color: var(--acc); letter-spacing: .06em; }
.row__ttl { display: block; font: 700 1.08rem/1.25 var(--f-dsp); }
.row__sub { display: block; margin-top: 3px; font-size: 14px; color: var(--ink2); }
.row__go { font: 600 11px/1 var(--f-mono); letter-spacing: .08em; color: var(--ink2); white-space: nowrap; }
.row:hover .row__go { color: var(--acc); }

/* --- КНОПКИ --------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 20px; border: 2px solid var(--acc); background: var(--acc); color: var(--paper2);
  font: 700 15px/1 var(--f-txt); text-decoration: none; cursor: pointer; border-radius: 2px;
}
.btn:hover { background: var(--acc2); border-color: var(--acc2); color: var(--paper2); }
.btn:active { transform: translateY(1px); }
.btn--sm { padding: 9px 15px; font-size: 14px; }
.btn--hdr { padding: 10px 16px; font-size: 14px; }
.btn--ghost { background: none; color: var(--ink); border-color: var(--ink); }
.btn--ghost:hover { background: var(--ink); color: var(--paper); }
.btn--do { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.btn--do:hover { background: var(--acc); border-color: var(--acc); color: var(--paper2); }
.btn__s { display: none; }

/* --- ПРИЗЫВЫ -------------------------------------------------------------- */
.spark {
  clear: both; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px;
  margin: 0 0 1.7em; padding: 14px 0 16px;
  border-top: 2px solid var(--acc); border-bottom: 1px solid var(--rule);
}
.spark__tag {
  font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc);
  width: 100%;
}
.spark__txt { margin: 0; flex: 1 1 22rem; font-size: 15.5px; line-height: 1.5; }
.spark .btn { flex: none; }

.cta {
  clear: both; margin: 1.9em 0; padding: 20px 22px 22px;
  background: var(--paper2); border-left: 5px solid var(--acc);
}
.cta--diag { border-left-color: var(--ink); }
.cta__tag { font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.cta--diag .cta__tag { color: var(--ink2); }
.cta__ttl { margin: 10px 0 8px; font: 700 clamp(1.2rem, 2vw, 1.5rem)/1.2 var(--f-dsp); }
.cta__txt { margin: 0 0 12px; font-size: 15.5px; line-height: 1.55; }
.cta__pts { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 16px; padding: 0; list-style: none; }
.cta__pts li { position: relative; padding-left: 1rem; font: 500 12.5px/1.4 var(--f-mono); color: var(--ink2); }
.cta__pts li::before { content: '+'; position: absolute; left: 0; color: var(--acc); }
.cta__row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; }
.cta__fine { font-size: 13px; color: var(--ink2); }

.usetool {
  clear: both; margin: 1.7em 0; padding: 16px 18px;
  border: 1px solid var(--rule); background: var(--paper2);
}
.usetool__txt { margin: 8px 0 14px; font-size: 15px; }

.foot-go {
  clear: both; margin: 2.2em 0 0; padding: 20px 0 0; border-top: 5px solid var(--ink);
}
.foot-go__tag { font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.foot-go__txt { margin: 10px 0 16px; font-size: 16px; line-height: 1.55; }

/* --- ИНСТРУМЕНТЫ ---------------------------------------------------------- */
.tool { clear: both; margin: 0 0 1.7em; background: var(--paper2); border-top: 4px solid var(--ink); }
.tool__hd { padding: 14px 18px 12px; border-bottom: 1px solid var(--rule); }
.tool__tag { font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.tool__ttl { margin: 9px 0 6px; font: 700 1.3rem/1.2 var(--f-dsp); }
.tool__sub { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--ink2); }
.tool__in { padding: 6px 18px 16px; }
.q { border: 0; margin: 0; padding: 12px 0 4px; border-bottom: 1px solid var(--rule2); }
.q legend { padding: 0; font-size: 15px; font-weight: 700; display: flex; align-items: baseline; gap: 8px; }
.q__n { font: 600 10.5px/1 var(--f-mono); color: var(--acc); }
.q__o { display: flex; align-items: center; gap: 9px; padding: 5px 0; cursor: pointer; font-size: 14.5px; }
.q__o input { accent-color: var(--acc); width: 16px; height: 16px; margin: 0; flex: none; }
.q__o:hover span { color: var(--acc); }
.tool__btns { padding-top: 14px; }
.tool__out { padding: 0 18px; }
.tool__fine { margin: 0; padding: 12px 18px 16px; font-size: 13px; line-height: 1.5; color: var(--ink2); }

.out { padding: 16px 0 4px; border-top: 3px double var(--rule); }
.out__cap { display: block; font: 700 12px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.out__lead { margin: 10px 0 12px; font: 400 17px/1.5 var(--f-dsp); }
.out__list { margin: 0 0 12px; padding: 0; list-style: none; }
.out__list li { position: relative; padding-left: 1.2rem; margin-bottom: .45em; font-size: 15px; }
.out__list li::before { content: '—'; position: absolute; left: 0; color: var(--acc); }
.out__verdict { margin: 0 0 14px; font-size: 15px; }
.out__row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 8px; }
.out__hint { font-size: 13px; color: var(--ink2); }

/* --- СКРИНШОТЫ ------------------------------------------------------------ */
.shot { clear: both; margin: 0 0 1.6em; }
.shot__frame {
  display: flex; align-items: center; justify-content: center;
  min-height: 130px; border: 1px dashed var(--rule); background: var(--paper2);
}
.shot__code { font: 600 12px/1 var(--f-mono); letter-spacing: .14em; color: var(--ink2); }
.shot__cap { margin-top: 8px; font-size: 13.5px; color: var(--ink2); }
.shot__link { display: block; position: relative; }
.shot img { display: block; border: 1px solid var(--rule); max-height: 520px; width: auto; }
.shot__zoom { display: block; margin-top: 6px; font: 500 11px/1 var(--f-mono); color: var(--ink2); }
.shot__pair { display: flex; flex-wrap: wrap; gap: 16px; }
.shot__part { flex: 1 1 240px; }
.shot__part img { max-height: 400px; }
.shot__mark { font: 700 12px/1 var(--f-mono); color: var(--acc); }
.shot__partcap { display: block; margin-top: 5px; font-size: 13px; color: var(--ink2); }

/* --- КАССА ---------------------------------------------------------------- */
.pay { clear: both; margin: 0 0 1.8em; background: var(--paper2); border-top: 6px solid var(--acc); }
.pay__hd {
  display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline;
  padding: 13px 18px; border-bottom: 1px solid var(--rule);
}
.pay__cap { font: 700 12.5px/1 var(--f-mono); letter-spacing: .14em; }
.pay__tag { font: 500 10.5px/1 var(--f-mono); letter-spacing: .1em; color: var(--acc); }
.pay__box { position: relative; padding: 4px; }
.pay__fb {
  margin: 0; padding: 18px; font-size: 14.5px; color: var(--ink2);
  opacity: 0; animation: payfb 0s linear 7s forwards;
}
.pay__box.is-on .pay__fb { display: none; }
@keyframes payfb { to { opacity: 1; } }
.pay__marks {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rule);
}
.pay__marks li { padding: 12px 16px; border-right: 1px solid var(--rule2); }
.pay__marks li:last-child { border-right: 0; }
.pay__marks b { display: block; font-size: 14.5px; }
.pay__marks span { font-size: 13px; color: var(--ink2); }

/* --- ГЛАВНАЯ -------------------------------------------------------------- */
.hero { padding: 26px 0 0; }
.hero__tag {
  display: inline-block; margin-bottom: 14px; padding-bottom: 5px;
  border-bottom: 2px solid var(--acc);
  font: 600 11px/1 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--acc);
}
.hero h1 {
  margin: 0 0 16px;
  font: 700 clamp(2.4rem, 6vw, 4.6rem)/.98 var(--f-dsp); letter-spacing: -.02em;
}
.hero__lead p { margin: 0 0 .8em; }
.hero__lead p:last-child { margin-bottom: 0; }
.hero__lead {
  margin: 0 0 26px; max-width: 46rem;
  font: 400 clamp(1.1rem, 1.7vw, 1.38rem)/1.45 var(--f-dsp);
}
@media (min-width: 1000px) {
  .hero__lead { columns: 2; column-gap: var(--gap); column-rule: 1px solid var(--rule2); max-width: none; }
}

.finder { margin: 2.2em 0; padding: 18px 0 0; border-top: 3px double var(--rule); }
.finder__cap { display: block; font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.finder input[type="search"] {
  width: 100%; margin: 12px 0 10px; padding: 12px 14px;
  border: 1px solid var(--rule); background: var(--paper2); color: var(--ink);
  font: 400 17px/1.3 var(--f-txt); border-radius: 2px;
}
.finder input::placeholder { color: var(--ink2); }
.finder__tries { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.finder__tries button {
  padding: 6px 12px; background: none; border: 1px solid var(--rule); color: var(--ink2);
  font: 500 13px/1 var(--f-txt); cursor: pointer; border-radius: 2px;
}
.finder__tries button:hover { border-color: var(--acc); color: var(--acc); }
.finder__idle { margin: 0; font-size: 14.5px; color: var(--ink2); }
.fres__cap { display: block; margin-bottom: 8px; font: 600 10.5px/1 var(--f-mono); letter-spacing: .12em; color: var(--ink2); }
.fres__list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
.fres__list a {
  display: block; padding: 10px 0; border-bottom: 1px solid var(--rule2);
  text-decoration: none; color: var(--ink);
}
.fres__list a:hover { color: var(--acc); }
.fres__grp { display: block; font: 600 10px/1 var(--f-mono); letter-spacing: .12em; color: var(--ink2); }
.fres__t { display: block; margin-top: 4px; font: 700 16px/1.3 var(--f-dsp); }
.fres__none-t { margin: 0 0 6px; font-weight: 700; }
.fres__none-s { margin: 0; font-size: 14.5px; color: var(--ink2); }
mark { background: transparent; color: var(--acc); font-weight: 700; }

/* --- ХВОСТ СТАТЬИ --------------------------------------------------------- */
.also { clear: both; margin: 2em 0 0; }
.also__cap { display: block; margin-bottom: 10px; font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; color: var(--acc); }
.also__list { margin: 0; padding: 0; list-style: none; border-top: 2px solid var(--ink); }
.also__list li {
  display: flex; align-items: baseline; gap: 10px; justify-content: space-between;
  padding: 10px 0; border-bottom: 1px solid var(--rule2);
}
.also__list a { color: var(--ink); text-decoration: none; font: 600 16px/1.3 var(--f-dsp); }
.also__list a:hover { color: var(--acc); }
.also__step, .also__site { font: 600 10.5px/1 var(--f-mono); color: var(--ink2); font-style: normal; }

.helpful {
  clear: both; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
  margin: 2em 0 0; padding-top: 16px; border-top: 1px solid var(--rule);
  font-size: 14px; color: var(--ink2);
}
.helpful__q { font: 600 11px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; }
.helpful__btns button {
  padding: 7px 16px; margin-right: 8px; background: none; cursor: pointer;
  border: 1px solid var(--rule); color: var(--ink);
  font: 600 11px/1 var(--f-mono); letter-spacing: .1em; border-radius: 2px;
}
.helpful__btns button:hover { border-color: var(--acc); color: var(--acc); }
.helpful[data-done] .helpful__btns { display: none; }
.helpful__thanks { color: var(--ok); }

/* --- ПОДВАЛ --------------------------------------------------------------- */
.ftr { margin-top: auto; border-top: 7px solid var(--ink); background: var(--paper); }
.ftr__in { max-width: var(--max); margin: 0 auto; padding: 28px 24px 40px; }
.ftr__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 26px; }
.ftr__ttl {
  display: block; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--rule);
  font: 600 10.5px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--acc);
}
.ftr__grid ul { margin: 0; padding: 0; list-style: none; }
.ftr__grid li { margin-bottom: 7px; }
.ftr__grid a { color: var(--ink); text-decoration: none; font-size: 14.5px; }
.ftr__grid a:hover { color: var(--acc); text-decoration: underline; }
.ftr__disc {
  margin: 28px 0 0; padding-top: 18px; border-top: 1px solid var(--rule2);
  font-size: 13px; line-height: 1.55; color: var(--ink2);
}
.ftr__bar {
  display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center;
  margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--rule2);
  font: 600 10.5px/1 var(--f-mono); letter-spacing: .12em;
}
.ftr__bar a { color: var(--ink2); text-decoration: none; }
.ftr__bar a:hover { color: var(--acc); }
.ftr__cp { margin-left: auto; color: var(--ink2); }

/* --- ДИАЛОГ ПОИСКА -------------------------------------------------------- */
.sdlg { display: none; position: fixed; inset: 0; z-index: 60; }
.sdlg.is-on { display: block; }
.sdlg__bd { position: absolute; inset: 0; background: rgba(19, 37, 58, .55); }
.sdlg__box {
  position: relative; max-width: 620px; margin: 8vh auto 0;
  background: var(--paper); border-top: 6px solid var(--acc);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
}
.sdlg input {
  width: 100%; padding: 16px 18px; border: 0; border-bottom: 1px solid var(--rule);
  background: none; color: var(--ink); font: 400 18px/1.3 var(--f-txt);
}
.sres { margin: 0; padding: 0; list-style: none; max-height: 52vh; overflow-y: auto; }
.sres a {
  display: flex; align-items: baseline; gap: 10px; padding: 11px 18px;
  text-decoration: none; color: var(--ink); border-bottom: 1px solid var(--rule2);
}
.sres a.is-sel, .sres a:hover { background: var(--paper2); }
.sres__step { font: 600 10px/1 var(--f-mono); color: var(--acc); font-style: normal; }
.sres__t { flex: 1; font: 600 15.5px/1.3 var(--f-dsp); }
.sres__p { font: 500 10px/1 var(--f-mono); letter-spacing: .1em; color: var(--ink2); }
.sdlg__foot { padding: 10px 18px; font: 500 10.5px/1 var(--f-mono); letter-spacing: .08em; color: var(--ink2); }

/* --- НИЖНЯЯ ПАНЕЛЬ (ТЕЛЕФОН) ---------------------------------------------- */
.gobar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
  transform: translateY(110%); transition: transform .2s ease;
  background: var(--ink); color: var(--paper);
}
.gobar.is-on { transform: none; }
.gobar__in { display: flex; align-items: center; gap: 12px; padding: 10px 14px; }
.gobar__txt { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.gobar__txt b { font: 700 15px/1.2 var(--f-dsp); }
.gobar__txt span { font-size: 11.5px; opacity: .8; }
.gobar .btn { border-color: var(--acc); }
.gobar__x { background: none; border: 0; color: var(--paper); font-size: 22px; cursor: pointer; padding: 0 4px; }
body.has-gobar { padding-bottom: 78px; }

/* --- АДАПТАЦИЯ ------------------------------------------------------------ */
@media (max-width: 1159px) {
  .layout { grid-template-columns: 13.5rem minmax(0, 1fr); gap: 2rem; }
}

@media (max-width: 900px) {
  body { font-size: 16.5px; }
  .layout { grid-template-columns: minmax(0, 1fr); padding-bottom: 48px; }
  .side {
    position: static; display: none; order: 2; margin-top: 30px;
    border-right: 0; border-top: 3px double var(--rule); padding-right: 0; padding-top: 20px;
  }
  .side.is-on { display: block; }
  .burger { display: block; margin-left: auto; }
  .hdr__go { margin-left: 0; order: 3; width: 100%; justify-content: space-between; }
  .hdr__in { flex-wrap: wrap; gap: 12px; padding: 12px 16px; }
  .hdr__bot { display: none; }
  .wrap { padding: 0 16px 48px; }
  .layout { padding: 0 16px 48px; }
  .chk__rows, .chk__out, .card__out, .card__keys { grid-template-columns: 1fr; }
  /* На телефоне переключатели встают в строку: три вертикальных списка подряд
     уводили бы первый ответ на второй экран. */
  .chk__opts { flex-direction: row; flex-wrap: wrap; gap: 2px 18px; }
  .chk__row { padding-top: 12px; padding-bottom: 12px; }
  .chk__card { padding-top: 14px; padding-bottom: 14px; }
  .hero__lead { font-size: 1.04rem; line-height: 1.5; }
  .hero { padding-top: 18px; }
  .chk__row, .chk__card, .card__out > div { border-right: 0; border-bottom: 1px solid var(--rule2); }
  .chk__row:last-child, .chk__card:last-child, .card__out > div:last-child { border-bottom: 0; }
  .dkey { border-right: 0; }
  .duo { grid-template-columns: 1fr; }
  .duo__col { padding: 14px 0 16px; }
  .duo__col--b { padding-left: 0; border-left: 0; border-top: 1px solid var(--rule); }
  .signs__list li { grid-template-columns: 1fr; gap: 4px; }
  .cat__i { grid-template-columns: 2rem minmax(0, 1fr) auto; gap: 12px; }
  .row { grid-template-columns: 2.4rem minmax(0, 1fr); }
  .row__go { display: none; }
  .btn--hdr .btn__l { display: none; }
  .btn--hdr .btn__s { display: inline; }
  .shot img { max-height: none; }
  .pay__marks li { border-right: 0; border-bottom: 1px solid var(--rule2); }
}

@media (max-width: 560px) {
  body { font-size: 16px; }
  .art > h1 { border-top-width: 4px; }
  .brand__mark { font-size: 23px; }
  .brand__logo { width: 34px; height: 34px; }
  .hdr__price { font-size: 15px; }
  .cta { padding: 16px 14px 18px; }
  .chk__hd, .chk__row, .chk__card, .chk__act { padding-left: 14px; padding-right: 14px; }
  .card__hd, .card__note, .card__act { padding-left: 14px; padding-right: 14px; }
  .dkey, .card__out > div { padding-left: 14px; padding-right: 14px; }
  .tool__hd, .tool__in, .tool__out, .tool__fine { padding-left: 14px; padding-right: 14px; }
  .pay__hd { padding-left: 14px; padding-right: 14px; }
  .also__list li { flex-wrap: wrap; }
  .deck > p:first-child::first-letter { font-size: 3.2em; }
}

@media print {
  .hdr__go, .side, .gobar, .sdlg, .btn, .cta, .spark, .foot-go { display: none !important; }
}