/*
Theme Name: CashBox Ru
Theme URI: https://cashbox-ru.info/
Description: CashBox Ru — тема «Кассовая лента»: чек-прайс с зубчатым отрывом и отточием, контейнер 1170px с cashbox.ru.
Version: 1.0.5
Text Domain: cashbox-ru
*/

/* ── Токены ───────────────────────────────────────────────────
   Палитра снята кодом с cashbox_styles.css офсайта: тёмный #061E3C,
   тёмно-синий #2B446D, синий #1372CA, голубой #3CA2FF, фон #F4F5F8.
   Белый на #1372CA — 4,9:1; у #1481E6 белый не добирает 4,5:1,
   поэтому кнопки на #1372CA. Голубой — только графика, не текст. */
:root{
  --ground:#F4F5F8; --paper:#FFFFFF; --ink:#061E3C; --text:#2B3B52; --muted:#5E6A7C;
  --line:#E1E5EB; --cut:#C9D0DA; --dot:#AAB3C1; --navy:#2B446D;
  --btn:#1372CA; --btn-h:#0F5FA8; --sky:#3CA2FF; --pale:#E8F2FD;
  --mono:"Iosevka Aile",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --disp:"Dela Gothic One","Arial Black","Segoe UI Black",sans-serif;
  --head-h:68px;
  /* Зубчатый отрыв чека: вырез 90° с вершиной у края, шаг 18px. */
  --teeth-b:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50% / 18px 100%;
  --teeth-t:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) 50% / 18px 100%;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--text);font:400 16px/1.6 var(--mono);font-variant-numeric:lining-nums tabular-nums}
html.is-locked{overflow:hidden}
h1,h2,h3{margin:0;color:var(--ink);text-wrap:balance;overflow-wrap:break-word}
p{margin:0}
/* Текстовые ссылки темнее кнопок: #1372CA на фоне #F4F5F8 даёт 4,49:1 —
   ниже порога 4,5; #0F5FA8 даёт больше 6:1 и на белом, и на сером. */
a{color:var(--btn-h)}
a:hover{color:var(--ink)}
img,svg{max-width:100%}
:focus-visible{outline:2px solid var(--sky);outline-offset:2px}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--paper);color:var(--ink);padding:8px 14px}
.skip:focus{left:16px}
.wrap{max-width:1170px;margin:0 auto;padding-inline:15px}

/* ── Кнопки ───────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:4px;font:700 15px/1.2 var(--mono);text-decoration:none;white-space:nowrap;transition:background-color .15s,color .15s,box-shadow .15s}
.btn--main{background:var(--btn);color:#FFFFFF}
.btn--main:hover{background:var(--btn-h);color:#FFFFFF}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn--ghost:hover{background:var(--ink);color:#FFFFFF}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}

/* ── Шапка ────────────────────────────────────────────────── */
.head{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid var(--line)}
.head__row{display:flex;align-items:center;gap:24px;min-height:var(--head-h)}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;white-space:nowrap;flex:none}
.logo:hover{color:var(--ink)}
.logo__mark{flex:none}
.logo__word{font:400 19px/1 var(--disp);letter-spacing:.01em}
.logo__ru{color:var(--btn)}
.nav{display:flex;gap:22px;margin-left:auto}
.nav__a{color:var(--muted);text-decoration:none;font-size:15px;white-space:nowrap;padding-block:6px;border-bottom:1.5px dashed transparent}
.nav__a:hover{color:var(--ink)}
.nav__a.is-here{color:var(--ink);border-bottom-color:var(--dot)}
.head__cta{flex:none;min-height:42px}
.cta__short{display:none}
.burger{display:none;flex:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;padding:0;border:1.5px solid var(--line);border-radius:4px;background:var(--paper);cursor:pointer}
.burger span{display:block;width:20px;height:2px;background:var(--ink)}
.burger[aria-expanded="true"]{border-color:var(--ink)}
.menu{position:absolute;left:0;right:0;top:100%;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 18px 30px -20px rgb(6 30 60/.35);max-height:calc(100dvh - var(--head-h));overflow-y:auto;overscroll-behavior:contain}
.menu__in{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;padding-block:6px 18px}
.menu__a{display:block;padding:13px 0;border-bottom:1.5px dashed var(--line);color:var(--ink);text-decoration:none}
.menu__a:hover,.menu__a.is-here{color:var(--btn)}

/* ── Чек ──────────────────────────────────────────────────────
   Тень на обёртке: маска зубцов срезала бы box-shadow самого чека. */
.slip{filter:drop-shadow(0 12px 16px rgb(6 30 60/.16));min-width:0}
.receipt{position:relative;background:var(--paper);padding:26px 26px 44px;-webkit-mask:var(--teeth-b);mask:var(--teeth-b)}
.receipt__head{text-align:center;padding-bottom:12px;border-bottom:1.5px dashed var(--dot)}
.receipt__name{margin:0;font:400 19px/1.25 var(--disp);letter-spacing:.06em;color:var(--ink);text-transform:uppercase}
.receipt__sub{margin-top:4px;font-size:13px;color:var(--muted)}
.rgroup{margin:14px 0 4px;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.lines{list-style:none;margin:0;padding:0}
.ln{display:flex;align-items:baseline;gap:8px;padding:4px 6px;margin-inline:-6px;border-radius:2px;font-size:15px;transition:background-color .12s}
.ln__t{min-width:0;overflow-wrap:break-word}
.ln__dots{flex:1 1 16px;min-width:16px;border-bottom:1.5px dotted var(--dot);transform:translateY(-4px)}
.ln__v{font-weight:700;color:var(--ink);white-space:nowrap}
.ln:hover{background:var(--pale)}
.receipt__total{margin-top:14px;padding-top:10px;border-top:1.5px dashed var(--dot)}
.receipt__foot{margin-top:12px;text-align:center;font-size:12.5px;color:var(--muted)}
.receipts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:start}

/* ── Первый экран ─────────────────────────────────────────── */
.hero{padding-block:44px 64px}
/* Фон первого экрана и шапки внутренних страниц — images/bg.jpg владельца
   (14.09.2026), пережат в hero-bg.webp/jpg 1270×646 и узкий hero-bg-m 628×646;
   пунктирная рамка исходника срезана. Вуаль слева держит приглушённый текст
   над фоном: на главной 4,65–4,86:1 (было 5,03), на .ph белая — 5,20–5,35
   (было 5,49). Позиция: справа, где полосы уходят под чек. */
.hero,.ph{background-color:var(--ground);background-repeat:no-repeat;background-size:100% 100%,cover;background-position:0 0,right center;
  background-image:url(images/hero-bg.jpg?v=1.0.4);
  background-image:image-set(url(images/hero-bg.webp?v=1.0.4) type("image/webp"),url(images/hero-bg.jpg?v=1.0.4) type("image/jpeg")); filter: brightness(1.07);}
.ph{background-color:var(--paper);background-position:0 0,right 75%;
  background-image:linear-gradient(90deg,rgb(255 255 255/.92) 0,rgb(255 255 255/.9) 56%,rgb(255 255 255/.3) 80%,rgb(255 255 255/0) 94%),url(images/hero-bg.jpg?v=1.0.4);
  background-image:linear-gradient(90deg,rgb(255 255 255/.72) 0,rgb(255 255 255/.6) 56%,rgb(255 255 255/.2) 80%,rgb(255 255 255/0) 84%),image-set(url(images/hero-bg.webp?v=1.0.4) type("image/webp"),url(images/hero-bg.jpg?v=1.0.4) type("image/jpeg"))}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:48px;align-items:start}
.hero__h1{font:400 clamp(30px,4.2vw,52px)/1.06 var(--disp);letter-spacing:.005em}
.hero__h1 span{color:var(--btn)}
.hero__lead{margin-top:18px;max-width:56ch;font-size:17px;color:var(--text)}
.nums{display:flex;flex-wrap:wrap;gap:14px 32px;margin-top:28px}
.nums div{display:grid;gap:2px}
.nums b{font-weight:700;font-size:24px;line-height:1.1;color:var(--ink)}
.nums small{font-size:13px;color:var(--muted)}

/* ── Шапка внутренней страницы ────────────────────────────── */
.ph{padding-block:34px 44px;border-bottom:1.5px dashed var(--cut)} /* фон — выше, в блоке «Первый экран»: шорткат background здесь сбрасывал картинку */
.crumbs{display:flex;flex-wrap:wrap;gap:0 8px;font-size:13px;color:var(--muted);margin-bottom:14px}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{color:var(--btn)}
.ph__h1{font:400 clamp(28px,3.8vw,46px)/1.08 var(--disp);letter-spacing:.005em;max-width:24ch}
.ph__lead{margin-top:14px;max-width:64ch;font-size:17px}

/* ── Секции ───────────────────────────────────────────────── */
.band{padding-block:60px;border-top:1.5px dashed var(--cut)}
.hero + .band,.ph + .band{border-top:0}
.band--paper{background:var(--paper)}
.band__head{margin-bottom:26px}
.t2{font:400 clamp(24px,2.6vw,32px)/1.15 var(--disp);letter-spacing:.005em}
.t3{font:700 19px/1.3 var(--mono);color:var(--ink)}
.lead{margin-top:12px;max-width:64ch}
.prose p{margin:0 0 14px;max-width:70ch}
.prose p:last-child{margin-bottom:0}
.prose ul,.prose ol{margin:0 0 14px;padding-left:22px;max-width:70ch}
.prose li{margin:6px 0}
.split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px;align-items:start}
.cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;align-items:start}
.more{margin-top:22px}

/* Строки-реестр: типы задач, способы входа, контакты. */
.types{border-top:1.5px dashed var(--cut)}
.type{display:grid;grid-template-columns:minmax(0,15rem) minmax(0,1fr) auto;gap:6px 24px;align-items:baseline;padding:18px 0;border-bottom:1.5px dashed var(--cut)}
.type__n{font-weight:700;color:var(--ink)}
.type__p{font-weight:700;color:var(--ink);white-space:nowrap}
.type__d{color:var(--text)}

.nets{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:18px;list-style:none;padding:0}
.nets li{padding:5px 11px;border:1.5px dashed var(--dot);border-radius:2px;font-size:14px;color:var(--ink);background:var(--paper)}

.side{background:var(--paper);padding:24px 26px 28px;border-top:3px solid var(--ink)}
.side--adv{border-top-color:var(--btn)}
.side ul{margin:14px 0 0;padding-left:20px}
.side li{margin:7px 0}
.side .btns{margin-top:20px}

/* Нумерованные шаги — только там, где порядок действий важен. */
.steps{list-style:none;margin:0;padding:0;counter-reset:s;border-top:1.5px dashed var(--cut)}
.steps li{counter-increment:s;display:grid;grid-template-columns:3.2rem minmax(0,1fr);gap:12px;padding:16px 0;border-bottom:1.5px dashed var(--cut)}
.steps li::before{content:counter(s,decimal-leading-zero);font:400 20px/1.35 var(--disp);color:var(--btn)}
.steps b{color:var(--ink)}

/* ── Оценка и отзывы ──────────────────────────────────────── */
.score{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.score__v{font:400 46px/1 var(--disp);color:var(--ink)}
.score__of{font-size:14px;color:var(--muted)}
.stars{position:relative;display:inline-block;line-height:0;vertical-align:middle}
.stars__bg,.stars__fg{display:flex;gap:3px}
.stars__fg{position:absolute;inset:0 auto 0 0;overflow:hidden}
.star{width:18px;height:18px;flex:none;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.stars__bg .star{background:#D3D9E2}
.stars__fg .star{background:var(--btn)}
.tbl-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:15px}
.tbl caption{text-align:left;font-weight:700;color:var(--ink);padding-bottom:10px}
.tbl th,.tbl td{padding:12px 10px 12px 0;border-bottom:1.5px dashed var(--cut);text-align:left;vertical-align:top}
.tbl th{font-size:13px;font-weight:400;color:var(--muted)}
.tbl .r{text-align:right;white-space:nowrap;font-weight:700;color:var(--ink)}
.revs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.rev{background:var(--paper);padding:22px 24px 24px;border-top:3px solid var(--ink)}
.rev--adv{border-top-color:var(--btn)}
.rev__top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.rev__who{font-weight:700;color:var(--ink)}
.rev__meta{margin-top:2px;font-size:13px;color:var(--muted)}
.rev__text{margin-top:12px}

/* ── Вопросы ──────────────────────────────────────────────── */
.qa{border-top:1.5px dashed var(--cut)}
.qa__item{border-bottom:1.5px dashed var(--cut)}
.qa__h{margin:0;font:inherit}
.qa__q{display:flex;justify-content:space-between;align-items:baseline;gap:16px;width:100%;padding:16px 0;margin:0;border:0;background:none;cursor:pointer;text-align:left;font:700 16px/1.45 var(--mono);color:var(--ink)}
.qa__q::after{content:"+";flex:none;font-weight:700;color:var(--btn)}
.qa__q[aria-expanded="true"]::after{content:"−"}
.qa__q:hover{color:var(--btn)}
.qa__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .2s ease}
.qa__a.is-shown{grid-template-rows:1fr}
.qa__in{overflow:hidden}
.qa__in p{margin:0 0 18px;max-width:72ch}

/* ── Смежные разделы ──────────────────────────────────────── */
.near{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.near__a{display:grid;gap:4px;padding:16px 18px;background:var(--paper);border:1.5px dashed var(--cut);text-decoration:none;color:var(--text);transition:border-color .15s,background-color .15s}
.near__a:hover{border-color:var(--btn);background:var(--pale);color:var(--text)}
.near__t{font-weight:700;color:var(--ink)}
.near__d{font-size:14px;color:var(--muted)}
.band--near .t2{margin-bottom:22px}

/* ── Подвал — корешок чека ────────────────────────────────── */
.foot{position:relative;background:var(--paper);padding-block:46px 30px;-webkit-mask:var(--teeth-t);mask:var(--teeth-t)}
.foot__top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:0 40px}
.foot__brand{max-width:60ch}
.foot__about{margin-top:14px;color:var(--text)}
.foot__cta{padding-top:28px}
.foot__nav{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:28px;padding-top:20px;border-top:1.5px dashed var(--cut)}
.foot a:not(.btn){color:var(--text);text-decoration:none}
.foot a:not(.btn):hover{color:var(--btn)}
.foot a.logo{color:var(--ink)}
.foot__legal{margin-top:20px;font-size:13px;color:var(--muted)}
.foot__legal p{margin:4px 0}

/* ── 404 ──────────────────────────────────────────────────── */
.nf__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin-top:22px;list-style:none;padding:0}
.nf__list a{display:block;padding:10px 0;border-bottom:1.5px dashed var(--cut);text-decoration:none;color:var(--ink)}
.nf__list a:hover{color:var(--btn)}

/* ── Брейкпоинты: 1100 / 900 / 640 / 430 / 400 / 345 ───────── */
@media (max-width:1100px){
  .nav{display:none}
  .head__cta{margin-left:auto}
  .burger{display:inline-flex}
  .receipts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .hero__grid,.split{grid-template-columns:minmax(0,1fr);gap:32px}
  .cols3,.revs{grid-template-columns:minmax(0,1fr)}
  .near{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* В одну колонку чек непрозрачен и закрывает низ: фон — полосой внизу
     (высота кадра 51vw), выше плавно уходит в полотно, текст — на чистом. */
  .hero{background-size:100% 100%,100% auto;background-position:0 0,right bottom;
    background-image:linear-gradient(180deg,var(--ground) 0,var(--ground) calc(100% - 51vw),rgb(244 245 248/.6) calc(100% - 38vw),rgb(244 245 248/.15) calc(100% - 20vw),rgb(244 245 248/.1) 100%),url(images/hero-bg.jpg?v=1.0.4);
    background-image:linear-gradient(180deg,var(--ground) 0,var(--ground) calc(100% - 51vw),rgb(244 245 248/.6) calc(100% - 38vw),rgb(244 245 248/.15) calc(100% - 20vw),rgb(244 245 248/.1) 100%),image-set(url(images/hero-bg.webp?v=1.0.4) type("image/webp"),url(images/hero-bg.jpg?v=1.0.4) type("image/jpeg"))}
  .ph{background-image:linear-gradient(rgb(255 255 255/.9),rgb(255 255 255/.9)),url(images/hero-bg.jpg?v=1.0.4);
    background-image:linear-gradient(rgb(255 255 255/.9),rgb(255 255 255/.9)),image-set(url(images/hero-bg.webp?v=1.0.4) type("image/webp"),url(images/hero-bg.jpg?v=1.0.4) type("image/jpeg"))}
}
@media (max-width:640px){
  .wrap{padding-inline:16px}
  .hero{padding-block:32px 48px;
    background-image:linear-gradient(180deg,var(--ground) 0,var(--ground) calc(100% - 103vw),rgb(244 245 248/.6) calc(100% - 76vw),rgb(244 245 248/.15) calc(100% - 40vw),rgb(244 245 248/.1) 100%),url(images/hero-bg-m.jpg?v=1.0.4);
    background-image:linear-gradient(180deg,var(--ground) 0,var(--ground) calc(100% - 103vw),rgb(244 245 248/.6) calc(100% - 76vw),rgb(244 245 248/.15) calc(100% - 40vw),rgb(244 245 248/.1) 100%),image-set(url(images/hero-bg-m.webp?v=1.0.4) type("image/webp"),url(images/hero-bg-m.jpg?v=1.0.4) type("image/jpeg"))}
  .band{padding-block:44px}
  .receipts,.near,.nf__list,.menu__in{grid-template-columns:minmax(0,1fr)}
  .type{grid-template-columns:minmax(0,1fr) auto}
  .type__p{grid-row:1;grid-column:2}
  .type__d{grid-column:1 / -1;grid-row:2}
  .tbl--stack thead{display:none}
  .tbl--stack tr{display:block;padding:12px 0;border-bottom:1.5px dashed var(--cut)}
  .tbl--stack td{display:block;border:0;padding:3px 0}
  .tbl--stack td.r{text-align:left}
  .tbl--stack td[data-label]::before{content:attr(data-label) ": ";font-weight:400;color:var(--muted)}
  .foot__cta{width:100%}
}
/* Подпись реф-кнопки сокращается раньше остального: строка шапки с полной
   подписью «Регистрация в CashBox» требует около 536px, и на 431px бургер
   уходил за экран на 78px (замер 11.09.2026). */
@media (max-width:560px){
  .cta__full{display:none}
  .cta__short{display:inline}
}
@media (max-width:430px){
  .head__row{gap:10px}
  .receipt{padding:22px 16px 42px}
  .ln{font-size:14px}
  .hero__lead,.ph__lead{font-size:16px}
}
@media (max-width:400px){
  .logo{gap:8px}
  .logo__word{font-size:15px}
  .head__cta{padding-inline:12px;font-size:13px}
  .burger{width:40px;height:40px}
  .btns .btn{width:100%}
}
/* Полоса 346–360: строка шапки заходила в поле контейнера на 5px,
   на 320 — на 4px. Сначала ужимаются зазоры и поля кнопки, подпись
   « Ru» у знака гаснет последней — только на ≤345. */
@media (max-width:360px){
  .head__row{gap:8px}
  .head__cta{padding-inline:10px}
}
@media (max-width:345px){
  .head .logo__ru{display:none}
}
/* «Приложение»: кнопки платформ одной ширины и на одной линии внизу карточек. */
.cols3--apps{align-items:stretch}
.cols3--apps .side{display:flex;flex-direction:column}
.cols3--apps .side .btns{margin-top:auto;padding-top:20px}
.cols3--apps .btn{width:100%}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
