/* Некритический CSS: всё, что ниже первого экрана. Критический — инлайн в index.html. */

.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.muted{color:var(--ink-soft)}

.block{padding:34px 0 6px}
.block-title{margin:0 0 14px;font-size:21px;font-weight:800;letter-spacing:-.02em}
.block-lead{margin:0 0 14px;font-size:15px;color:var(--ink-soft)}

.card{background:var(--surface);border-radius:22px;padding:6px 18px 8px;box-shadow:0 2px 10px rgba(34,48,42,.06)}

/* Цены */
.prices{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}
.prices th,.prices td{padding:14px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--edge)}
.prices tbody tr:last-child td{border-bottom:0}
.prices thead th{padding:14px 0 8px;font-size:12px;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-soft)}
.prices td:last-child,.prices th:last-child{text-align:right;white-space:nowrap;padding-left:14px}
.prices .price-value{font-weight:800;font-size:17px;letter-spacing:-.02em}
.prices .price-note{display:block;margin-top:4px;font-size:13px;line-height:1.4;color:var(--ink-soft)}

.honest{margin:14px 0 0;padding-left:14px;border-left:3px solid var(--accent);
  font-size:14px;line-height:1.45;color:var(--ink-soft)}

.sub-title{margin:24px 0 12px;font-size:17px;font-weight:700;letter-spacing:-.01em}

/* Цены по типу кузова */
.prices.types td:nth-child(2),.prices.types th:nth-child(2){text-align:right;white-space:nowrap;padding-left:12px}
.prices.types .price-value{font-size:16px}
.prices.types td:first-child{font-size:15px}

/* Калькулятор */
.calc{padding:18px}
.calc-types{margin:0 0 18px;padding:0;border:0;display:flex;gap:8px;flex-wrap:wrap}
.calc-radio{position:absolute;opacity:0;width:1px;height:1px}
.calc-chip{padding:10px 16px;border:1px solid var(--edge);border-radius:999px;font-size:15px;
  color:var(--ink-soft);cursor:pointer;user-select:none}
.calc-radio:checked + .calc-chip{background:var(--accent);border-color:var(--accent);color:var(--surface);font-weight:600}
.calc-radio:focus-visible + .calc-chip{outline:3px solid var(--accent);outline-offset:2px}

.calc-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px}
.calc-label{font-size:15px;color:var(--ink-soft)}
.calc-km{font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}

.calc-range{-webkit-appearance:none;appearance:none;width:100%;height:36px;background:transparent;cursor:pointer}
.calc-range::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:var(--edge)}
.calc-range::-moz-range-track{height:6px;border-radius:999px;background:var(--edge)}
.calc-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:28px;height:28px;margin-top:-11px;
  border-radius:50%;background:var(--accent);border:3px solid var(--surface);box-shadow:0 2px 8px rgba(34,48,42,.24)}
.calc-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--accent);
  border:3px solid var(--surface);box-shadow:0 2px 8px rgba(34,48,42,.24)}
.calc-range:focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:999px}

.calc-sum{margin:14px 0 0;font-size:30px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.calc-break{margin:6px 0 0;font-size:14px;line-height:1.45;color:var(--ink-soft);font-variant-numeric:tabular-nums}


.more{margin-top:16px;background:var(--surface);border-radius:22px;box-shadow:0 2px 10px rgba(34,48,42,.06)}
.more summary{padding:16px 18px;font-size:15px;font-weight:600;cursor:pointer;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"";width:9px;height:9px;flex:none;border-right:2px solid var(--ink-soft);
  border-bottom:2px solid var(--ink-soft);transform:rotate(45deg) translate(-2px,-2px)}
.more[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.more-list{margin:0;padding:0 18px 8px;list-style:none;font-size:15px;font-variant-numeric:tabular-nums}
.more-list li{display:flex;justify-content:space-between;gap:14px;padding:13px 0;border-top:1px solid var(--edge)}
.more-list li span:last-child{white-space:nowrap;font-weight:700}

.long-note{margin:12px 0 0;font-size:14px;line-height:1.45;color:var(--ink-soft)}

/* Ночной чекбокс */
.calc-night{display:flex;align-items:center;gap:12px;margin-top:18px}
.calc-check{position:absolute;opacity:0;width:1px;height:1px}
.calc-check-label{position:relative;padding-left:40px;font-size:15px;line-height:1.35;cursor:pointer;user-select:none}
.calc-check-label::before{content:"";position:absolute;left:0;top:-1px;width:28px;height:28px;
  border:2px solid var(--edge);border-radius:9px;background:var(--surface)}
.calc-check:checked + .calc-check-label::before{background:var(--accent);border-color:var(--accent)}
.calc-check:checked + .calc-check-label::after{content:"";position:absolute;left:10px;top:5px;
  width:7px;height:13px;border:solid var(--surface);border-width:0 3px 3px 0;transform:rotate(45deg)}
.calc-check:focus-visible + .calc-check-label::before{outline:3px solid var(--accent);outline-offset:3px}

/* Как это проходит */
.steps{margin:0;padding:0;list-style:none;counter-reset:step}
.steps li{position:relative;counter-increment:step;padding:0 0 20px 46px}
.steps li:last-child{padding-bottom:0}
.steps li::before{content:counter(step);position:absolute;left:0;top:-2px;width:30px;height:30px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:var(--accent-soft);color:var(--accent-deep);font-weight:800;font-size:14px}
.steps b{display:block;font-size:16px;font-weight:700;margin-bottom:2px}
.steps span{color:var(--ink-soft);font-size:14px;line-height:1.45}

/* Форма обратного звонка — запасной путь, тише кнопки звонка */
.callback{margin:0}
.callback input{width:100%;min-height:58px;padding:14px 18px;background:var(--surface);color:var(--ink);
  border:1px solid var(--edge);border-radius:16px;font-size:17px;font-variant-numeric:tabular-nums;
  box-shadow:0 2px 8px rgba(34,48,42,.05)}
.callback input::placeholder{color:#A9B3AB}
.callback input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(28,92,69,.15)}
.callback input[aria-invalid="true"]{border-color:var(--accent-deep)}
.callback button{width:100%;min-height:58px;margin-top:10px;background:var(--surface);color:var(--ink);
  border:1px solid var(--ink);border-radius:16px;font-size:16px;font-weight:700;cursor:pointer}
.callback button:active{background:var(--ink);color:var(--surface)}
.callback button[disabled]{opacity:.5;cursor:default}
.form-msg{margin:12px 0 0;font-size:14px;line-height:1.45;min-height:20px;color:var(--ink-soft)}
.form-msg.ok{color:var(--ink);font-weight:600}
.form-msg.err{color:var(--accent-deep)}

/* Футер */
.footer{margin-top:34px;padding:22px 0 32px;border-top:1px solid var(--edge);font-size:14px;color:var(--ink-soft)}
.footer-brand{margin:0 0 10px;font-size:15px;font-weight:700;color:var(--ink)}
.footer p{margin:0 0 7px}
.footer p:last-child{margin-bottom:0}

@media (min-width:520px){
  .hero-title{font-size:34px}
}