/* v7 «Ноль» — кассовый чек / счёт к оплате.
   Бумага чека, чёрные чернила, пунктирные лидеры, перфорация, один красный акцент. */

:root{
  --paper:#fffdf6;        /* бумага чека */
  --bg:#efe9dc;           /* стол, на котором лежит чек */
  --ink:#1c1a16;          /* чернила */
  --ink-soft:#5a554b;
  --faint:#b9b2a2;
  --red:#c0272d;          /* «к оплате» */
  --green:#1d7a3a;        /* возврат / минус-строки */
  --dash:#a49c8b;
  --mono:'PT Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;
  --sans:'Golos Text','PT Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:16px/1.6 var(--sans);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--red);text-underline-offset:3px}
a:hover{color:#8f1b20}
.num, .sum, .big, .zero{font-family:var(--mono);font-variant-numeric:tabular-nums}

.skip{
  position:absolute;left:-9999px;top:0;z-index:10000;
  background:var(--ink);color:var(--paper);padding:10px 16px;
  font:600 14px var(--sans);text-decoration:none;
}
.skip:focus{left:12px;top:12px}

a:focus-visible,button:focus-visible{
  outline:3px solid var(--red);outline-offset:3px;border-radius:2px;
}

.wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* ── верхняя полоса ─────────────────────────────── */
.top{background:var(--ink);color:var(--paper)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:12px;padding-bottom:12px}
.logo{font:700 18px var(--mono);letter-spacing:.08em}
.logo span{color:#e0b13e}
.top a{color:var(--paper);font:500 14px var(--sans);text-decoration:none;border-bottom:1px dashed var(--faint)}
.top a:hover{color:#e0b13e;border-color:#e0b13e}

/* ── герой ──────────────────────────────────────── */
.hero{padding:56px 0 40px;text-align:center}
.eyebrow{
  display:inline-block;font:700 12px var(--mono);letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-soft);
  border:1px dashed var(--dash);padding:6px 14px;margin-bottom:28px;
}
.zero{
  font-size:clamp(96px,22vw,220px);font-weight:700;line-height:.95;
  letter-spacing:-.02em;margin:0;
}
.zero small{font-size:.32em;vertical-align:.55em;letter-spacing:0}
.hero h1{
  font:700 clamp(20px,3.4vw,32px)/1.3 var(--sans);
  margin:18px auto 0;max-width:720px;
}
.lead{
  max-width:640px;margin:18px auto 0;color:var(--ink-soft);font-size:17px;
}
.btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:32px}
.btn{
  display:inline-block;font:700 16px var(--sans);text-decoration:none;
  padding:14px 28px;border:2px solid var(--ink);
  background:var(--ink);color:var(--paper);
}
.btn:hover{background:#000;color:#fff}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}

/* ── секции ─────────────────────────────────────── */
section{padding:44px 0}
.kicker{
  font:700 12px var(--mono);letter-spacing:.18em;text-transform:uppercase;
  color:var(--red);margin:0 0 8px;
}
h2{font:700 clamp(24px,3.6vw,36px)/1.2 var(--sans);margin:0 0 12px;max-width:760px}
.sub{color:var(--ink-soft);max-width:680px;margin:0 0 28px}

/* ── чек / счёт ─────────────────────────────────── */
.receipt{
  position:relative;background:var(--paper);
  max-width:720px;margin:0 auto;
  padding:34px clamp(20px,5vw,44px) 44px;
  border-left:1px dashed var(--dash);border-right:1px dashed var(--dash);
  box-shadow:0 18px 40px rgba(28,26,22,.18);
}
/* зубцы сверху и снизу */
.receipt::before,.receipt::after{
  content:"";position:absolute;left:0;right:0;height:12px;
  background:
    linear-gradient(45deg,transparent 33.333%,var(--paper) 33.333%,var(--paper) 66.667%,transparent 66.667%),
    linear-gradient(-45deg,transparent 33.333%,var(--paper) 33.333%,var(--paper) 66.667%,transparent 66.667%);
  background-size:24px 48px;background-repeat:repeat-x;
}
.receipt::before{bottom:100%;background-position:0 -12px;transform:scaleY(-1)}
.receipt::after{top:100%;background-position:0 -12px}
.r-head{text-align:center;margin-bottom:26px}
.r-head .r-title{font:700 15px var(--mono);letter-spacing:.14em;text-transform:uppercase}
.r-head .r-sub{font:400 12.5px var(--mono);color:var(--ink-soft);margin-top:4px}
.r-rule{border:none;border-top:2px dashed var(--dash);margin:18px 0}

.line{display:flex;align-items:baseline;gap:10px;padding:7px 0;font-size:15.5px}
.line .fill{flex:1;min-width:24px;border-bottom:2px dotted var(--dash);transform:translateY(-5px)}
.line .sum{white-space:nowrap;font-weight:700}
.line .what small{display:block;color:var(--ink-soft);font-size:13px;font-weight:400}
.line.minus .sum{color:var(--green)}
.line.cond .sum{color:var(--ink-soft);font-weight:400}
.line.cond .what{color:var(--ink-soft)}

.total{
  display:flex;align-items:baseline;gap:10px;padding:14px 0 4px;
  font:700 18px var(--sans);
}
.total .fill{flex:1;min-width:24px;border-bottom:2px dotted var(--ink);transform:translateY(-6px)}
.total .sum{font:700 clamp(34px,7vw,52px) var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.total .sum s{color:var(--red);font-size:.55em;font-weight:400;margin-right:12px;text-decoration-thickness:3px}
.total-note{
  text-align:right;font:400 13px var(--mono);color:var(--ink-soft);margin-top:2px;
}
.total-cond{
  text-align:right;font:400 13px/1.6 var(--sans);color:var(--ink-soft);
  margin:10px 0 0;max-width:560px;margin-left:auto;
}
.stamp{
  margin-top:26px;text-align:center;font:700 13px var(--mono);
  letter-spacing:.12em;text-transform:uppercase;color:var(--red);
  border:2px solid var(--red);border-radius:4px;
  display:inline-block;padding:8px 18px;transform:rotate(-2deg);
}
.stamp-wrap{text-align:center}

/* строки со звёздочкой */
.asterisk{
  max-width:720px;margin:34px auto 0;
  border:2px dashed var(--dash);padding:20px 24px;background:transparent;
}
.asterisk h3{margin:0 0 10px;font:700 15px var(--sans)}
.asterisk .line{font-size:14.5px;padding:5px 0}
.asterisk .note{font-size:13.5px;color:var(--ink-soft);margin:12px 0 0}

/* ── карточки / сетки ───────────────────────────── */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.card{
  background:var(--paper);border:1px solid var(--faint);
  border-top:3px solid var(--ink);padding:20px 22px;
}
.card h3{margin:0 0 8px;font-size:17px}
.card .mut{color:var(--ink-soft);font-size:14.5px;margin:0}
.card .v{font:700 26px var(--mono);font-variant-numeric:tabular-nums;margin-top:12px;color:var(--green)}
.card.red-top{border-top-color:var(--red)}

/* ── документы ──────────────────────────────────── */
.docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
figure.doc{
  margin:0;background:var(--paper);border:1px solid var(--faint);padding:10px 10px 14px;
}
figure.doc img{border:1px solid #e4ddcc;width:100%}
figcaption{font-size:13.5px;color:var(--ink-soft);margin-top:10px;line-height:1.45}
figcaption b{display:block;color:var(--ink);font-size:14.5px;margin-bottom:2px}
.foot{font-size:14.5px;color:var(--ink-soft);margin-top:22px;max-width:760px}
.foot b{color:var(--ink)}

/* ── шаги ───────────────────────────────────────── */
.steps{list-style:none;margin:0;padding:0;counter-reset:st;max-width:760px}
.steps li{
  counter-increment:st;position:relative;padding:18px 0 18px 64px;
  border-bottom:1px dashed var(--dash);
}
.steps li:last-child{border-bottom:none}
.steps li::before{
  content:counter(st,decimal-leading-zero);
  position:absolute;left:0;top:16px;
  font:700 22px var(--mono);color:var(--red);
}
.steps b{display:block;font-size:17px;margin-bottom:4px}
.steps span{color:var(--ink-soft);font-size:15px}

/* ── E57 split ──────────────────────────────────── */
.split{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.split>div{background:var(--paper);border:1px solid var(--faint);padding:22px 24px}
.split h3{margin:0 0 10px;font-size:16px}
.split ul{margin:0;padding-left:20px;color:var(--ink-soft);font-size:14.5px}
.split li{margin-bottom:6px}
.split .them{border-style:dashed}
@media(max-width:680px){.split{grid-template-columns:1fr}}

/* ── цены ───────────────────────────────────────── */
.prices{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.price{
  background:var(--paper);border:1px dashed var(--dash);padding:22px 24px;
}
.price h3{margin:0 0 6px;font-size:16px}
.price .p{font:700 30px var(--mono);font-variant-numeric:tabular-nums;margin:8px 0}
.price p{margin:0;color:var(--ink-soft);font-size:14px}

/* ── подвал ─────────────────────────────────────── */
footer{background:var(--ink);color:#d8d2c4;margin-top:56px}
footer .wrap{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:28px;padding-top:44px;padding-bottom:44px;
}
footer .lbl{font:700 12px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#8b8574;margin-bottom:10px}
footer a{color:var(--paper);text-decoration:none;border-bottom:1px dashed #6b6557}
footer a:hover{color:#e0b13e;border-color:#e0b13e}
footer .phone{font:700 24px var(--mono);font-variant-numeric:tabular-nums;border:none}
footer{font-size:14.5px;line-height:1.9}

/* ── адаптив / доступность ──────────────────────── */
@media(max-width:640px){
  .hero{padding:40px 0 28px}
  section{padding:32px 0}
  .line{font-size:14.5px}
  .receipt{padding-left:18px;padding-right:18px}
  /* итоговая сумма с зачёркнутой ценой не влезает в строку на телефоне */
  .total{flex-wrap:wrap}
  .total .fill{display:none}
  .total .sum{width:100%;text-align:right;font-size:clamp(28px,9vw,40px)}
  .total-note{text-align:right}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .stamp{transform:none}
}

/* ══ финальная сборка: блоки, которых не было в чеке ══════════════ */

/* призыв в конце каждой секции */
.cta{
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  margin:26px 0 0;padding:18px 24px;background:var(--paper);
  border:1px dashed var(--dash);border-radius:2px;
}
.cta p{margin:0;font-size:15px;color:var(--ink-soft);max-width:560px}
.cta .btn{margin:0;white-space:nowrap}

/* калькулятор */
.calc{background:var(--paper);border:2px solid var(--ink);padding:26px clamp(18px,4vw,34px)}
.calc .inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.calc .lbl{display:block;font:700 13px var(--sans);letter-spacing:.04em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:7px}
.calc input[type=number]{
  width:100%;padding:11px 13px;font:700 22px var(--mono);color:var(--ink);
  background:#fff;border:1px solid var(--dash);border-radius:2px;
}
.calc input[type=number]:focus-visible{outline:2px solid var(--red);outline-offset:1px}
.seg{display:flex;gap:0;border:1px solid var(--dash);border-radius:2px;overflow:hidden}
.seg label{flex:1;padding:11px 10px;text-align:center;font-size:14px;cursor:pointer;background:#fff}
.seg label:first-child{border-right:1px solid var(--dash)}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label:has(input:checked){background:var(--ink);color:var(--paper);font-weight:700}
.seg label:has(input:focus-visible){outline:2px solid var(--red);outline-offset:-2px}
.chk{display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-size:14.5px;padding-top:22px}
.chk input{width:18px;height:18px;margin-top:2px;accent-color:var(--ink)}
.chk small{display:block;color:var(--ink-soft);font-size:13px;margin-top:2px}
.calc .result{margin-top:24px;padding-top:20px;border-top:2px dashed var(--dash)}
.res-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.res-item .k{font:700 12px var(--sans);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.res-item .v{font:700 clamp(30px,6vw,44px) var(--mono);font-variant-numeric:tabular-nums;line-height:1.1}
.res-item .v.gain{color:var(--green)}
.verdict{margin-top:12px;font:700 16px var(--sans);color:var(--red)}
.getlist{margin-top:16px;font-size:14.5px;color:var(--ink-soft);line-height:1.7}
details.how{margin-top:18px;font-size:14.5px}
details.how summary{cursor:pointer;font-weight:700;padding:8px 0}
details.how table{width:100%;border-collapse:collapse;margin-top:10px}
details.how th,details.how td{padding:8px 10px;border-bottom:1px solid var(--dash);text-align:left;font-size:14px}
details.how th{font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft)}
details.how .n{font-family:var(--mono);font-weight:700;white-space:nowrap}
.caveat{font-size:13.5px;color:var(--ink-soft);margin-top:10px}

/* маркеры честности */
.marks{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:6px}
.mk{background:var(--paper);border:1px solid var(--faint);padding:16px 18px}
.tag{display:inline-block;font:700 12px var(--mono);letter-spacing:.04em;
  padding:4px 9px;border-radius:2px;margin-bottom:8px}
.tag.ok{background:#e3f2e8;color:#14602c}
.tag.calc{background:#e6e9f5;color:#2d3a75}
.tag.est{background:#f7edd8;color:#7a5200}
.mk p{margin:0;font-size:14.5px;color:var(--ink-soft)}

/* вызов: утверждение и способ его опровергнуть */
.ch{background:var(--paper);border:1px solid var(--faint);padding:22px 24px;margin-top:14px}
.ch .head{display:flex;gap:12px;align-items:baseline;flex-wrap:wrap;margin-bottom:10px}
.ch h3{margin:0;font:700 19px var(--sans);flex:1;min-width:240px}
.ch .claim{margin:0;font-size:15.5px}
.ch .disprove{margin-top:14px;padding-top:14px;border-top:1px dashed var(--dash)}
.ch .disprove b{display:block;font:700 12px var(--sans);letter-spacing:.06em;
  text-transform:uppercase;color:var(--red);margin-bottom:5px}
.ch .disprove p{margin:0;font-size:14.5px;color:var(--ink-soft)}

/* кейс объекта: измерено -> что это значит */
.case{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-top:8px}
.fact{background:var(--paper);border-left:3px solid var(--red);padding:16px 18px}
.fact .num{font:700 clamp(24px,4vw,32px) var(--mono);font-variant-numeric:tabular-nums;line-height:1.15}
.fact .what{font:700 14.5px var(--sans);margin:4px 0 6px}
.fact p{margin:0;font-size:14px;color:var(--ink-soft)}

/* нормативное основание */
.norm{background:var(--paper);border:1px solid var(--faint);border-left:3px solid var(--ink);
  padding:16px 20px;margin:16px 0;font-size:14.5px;color:var(--ink-soft)}
.norm b{display:block;color:var(--ink);font-size:13px;letter-spacing:.05em;
  text-transform:uppercase;margin-bottom:5px}

/* таблица протокола */
.reg{width:100%;border-collapse:collapse;margin-top:12px;background:var(--paper)}
.reg th,.reg td{padding:11px 14px;border-bottom:1px solid var(--dash);text-align:left;font-size:14.5px}
.reg th{font:700 12px var(--sans);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft)}
.reg .n{font-family:var(--mono);font-weight:700;white-space:nowrap}
.reg .good{color:var(--green);font-weight:700}
.reg .bad{color:var(--red);font-weight:700}
.tw{overflow-x:auto}
.tw .reg{min-width:560px}

@media(max-width:640px){
  .cta{flex-direction:column;align-items:stretch}
  .cta .btn{text-align:center}
  .chk{padding-top:0}
}

/* ══ форма заявки ═════════════════════════════════════════════════ */
.order{background:var(--paper);border:2px solid var(--ink);padding:28px clamp(18px,4vw,36px);margin-top:8px}
.order .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.order label.f{display:block}
.order .f span{display:block;font:700 12.5px var(--sans);letter-spacing:.05em;
  text-transform:uppercase;color:var(--ink-soft);margin-bottom:6px}
.order input[type=text],.order input[type=tel],.order input[type=email],
.order input[type=number],.order select,.order textarea{
  width:100%;padding:11px 13px;font:400 16px var(--sans);color:var(--ink);
  background:#fff;border:1px solid var(--dash);border-radius:2px;
}
.order textarea{min-height:88px;resize:vertical}
.order input:focus-visible,.order select:focus-visible,.order textarea:focus-visible{
  outline:2px solid var(--red);outline-offset:1px}
.order .wide{grid-column:1/-1}
.order .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.order .agree{display:flex;gap:10px;align-items:flex-start;margin-top:18px;font-size:14px;color:var(--ink-soft)}
.order .agree input{width:18px;height:18px;margin-top:2px;accent-color:var(--ink);flex:none}
.order .send{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:20px}
.order button{
  font:700 16px var(--sans);padding:14px 26px;border:none;border-radius:2px;cursor:pointer;
  background:var(--ink);color:var(--paper);
}
.order button:hover{background:#000}
.order button:disabled{opacity:.55;cursor:default}
.order .alt{font-size:14.5px;color:var(--ink-soft)}
.lead-msg{margin-top:14px;font-size:15px;min-height:1.2em}
.lead-msg.ok{color:var(--green);font-weight:700}
.lead-msg.err{color:var(--red);font-weight:700}

/* ══ встроенная 3D-смотрелка ══════════════════════════════════════ */
.v3d{border:2px solid var(--ink);background:#12151a;position:relative}
.v3d iframe{display:block;width:100%;height:540px;border:0}
@media(max-width:640px){.v3d iframe{height:400px}}

/* превью-окно: клик открывает полноэкранную модалку */
.vwrap{cursor:pointer}
.vwrap iframe{pointer-events:none}
.vwrap::after{content:'⤢ на весь экран';position:absolute;right:10px;bottom:10px;
  font:12.5px 'PT Mono',monospace;color:#fffdf6;background:rgba(18,21,26,.78);
  padding:6px 12px;border:1px solid #3a4756;border-radius:3px}
.vwrap:hover::after{background:#2ED573;color:#0d1116;border-color:#2ED573;font-weight:700}

/* полноэкранная модалка со смотрелкой */
.fsm{position:fixed;inset:0;z-index:999;background:#12151a;display:none}
.fsm.on{display:block}
.fsm iframe{display:block;width:100%;height:100%;border:0}
.fsm .fsx{position:absolute;top:56px;right:14px;z-index:2;cursor:pointer;
  font:700 13px 'PT Mono',monospace;color:#fffdf6;background:rgba(18,21,26,.85);
  border:1px solid #3a4756;border-radius:3px;padding:8px 14px}
.fsm .fsx:hover{background:#2ED573;color:#0d1116;border-color:#2ED573}