/* ============ tokens ============ */
:root{
  --kraft:#d8c6a4;          /* картон */
  --kraft-dk:#c2ac86;
  --kraft-lt:#e6d9bf;
  --paper:#f4efe4;          /* этикетка */
  --ink:#1a1613;            /* маркер */
  --ink-60:#5d554b;
  --ink-30:#9a9084;
  --signal:#1741c8;         /* транспортная наклейка */
  --signal-dk:#0f2f96;
  --stamp:#c0281f;          /* штамп */

  --disp:"Oswald",Impact,system-ui,sans-serif;
  --txt:"Golos Text",ui-sans-serif,system-ui,sans-serif;

  --gut:clamp(1.15rem,4vw,3.5rem);
  --pad:clamp(3.5rem,2rem + 4vw,6rem);   /* воздух между секциями */
  --cell:clamp(1.8rem,1.1rem + 2.2vw,2.9rem); /* воздух внутри плиток, по вертикали */
  --cell-x:clamp(1.35rem,.9rem + 1.7vw,2.15rem);
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--kraft);color:var(--ink);
  font:400 clamp(1rem,.96rem + .2vw,1.09rem)/1.62 var(--txt);
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.30),transparent 34%),
    radial-gradient(circle at 82% 78%,rgba(120,95,60,.14),transparent 40%);
}
/* каждый display-элемент получает line-height:1 явно — это и был баг */
.d{font-family:var(--disp);font-weight:700;line-height:1;
   letter-spacing:-.012em;text-transform:uppercase}
h1,h2,h3{font-family:var(--disp);font-weight:700;line-height:1.02;
   letter-spacing:-.015em;text-transform:uppercase}
a{color:inherit}
img,svg{display:block;max-width:100%}
.wrap{width:min(1140px,100% - var(--gut)*2);margin-inline:auto}
.block{padding-block:var(--pad)}          /* только класс, никаких section{} */
:where(a,button,select,input):focus-visible{
  outline:3px solid var(--signal);outline-offset:3px}

/* ============ header ============ */
.hdr{position:sticky;top:0;z-index:60;background:rgba(216,198,164,.93);
  backdrop-filter:blur(10px);border-bottom:2px solid var(--ink)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding-block:1.05rem}
.mark{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.mark-box{width:30px;height:30px;border:2.5px solid var(--ink);border-radius:2px;
  position:relative;flex:none}
.mark-box::after{content:"";position:absolute;left:-2.5px;right:-2.5px;top:9px;
  height:5px;background:var(--signal)}
.mark-t{font-family:var(--disp);font-size:1.2rem;line-height:1;letter-spacing:.01em}
.mark-t i{font-style:normal;color:var(--signal)}
.hdr-r{display:flex;align-items:center;gap:.8rem}
.hdr-tel{font-family:var(--disp);font-size:1.1rem;line-height:1;
  letter-spacing:.02em;white-space:nowrap;text-decoration:none;
  border-bottom:2px solid transparent;transition:border-color .2s}
.hdr-tel:hover{border-color:var(--signal)}
.lang{font-family:var(--disp);font-weight:600;font-size:.9rem;line-height:1;
  letter-spacing:.08em;text-decoration:none;border:2px solid var(--ink);
  border-radius:2px;padding:.6rem .7rem;transition:background .18s,color .18s}
.lang:hover{background:var(--ink);color:var(--kraft)}
.only-wide{display:none}
@media(min-width:760px){.only-wide{display:inline-flex}}

/* ============ buttons ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--disp);font-weight:600;font-size:1rem;line-height:1;
  letter-spacing:.035em;text-transform:uppercase;text-decoration:none;
  padding:1rem 1.5rem;border:2.5px solid var(--ink);border-radius:2px;
  cursor:pointer;background:var(--paper);color:var(--ink);
  box-shadow:4px 4px 0 var(--ink);
  transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink)}
.btn:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--ink)}
.btn-wa{background:#25d366}
.btn-wa:hover{background:#3ce27b}
.btn-sig{background:var(--signal);color:#fff;border-color:var(--ink)}
.btn-sig:hover{background:var(--signal-dk)}

/* ============ hero + калькулятор ============ */
.hero{display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:start}
@media(min-width:960px){.hero{grid-template-columns:1fr .92fr}}
.kicker{display:inline-block;font-family:var(--disp);font-size:.8rem;
  letter-spacing:.18em;text-transform:uppercase;line-height:1;
  background:var(--ink);color:var(--kraft);padding:.5rem .8rem;
  transform:rotate(-1.2deg);margin-bottom:1.5rem}
h1{font-size:clamp(2.7rem,1.4rem + 5.6vw,5.4rem);max-width:12ch}
h1 i{font-style:normal;color:var(--signal)}
.lede{font-size:clamp(1.05rem,1rem + .4vw,1.28rem);color:var(--ink-60);
  max-width:40ch;margin-top:1.4rem}
.trust{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.8rem}
.trust li{list-style:none;font-family:var(--disp);font-weight:400;font-size:.85rem;
  line-height:1;letter-spacing:.06em;text-transform:uppercase;
  border:2px solid var(--ink);border-radius:99px;padding:.5rem .85rem}

/* карточка-накладная */
.calc{background:var(--paper);border:2.5px solid var(--ink);border-radius:3px;
  box-shadow:9px 9px 0 var(--ink);overflow:hidden}
.calc-top{display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  background:var(--ink);color:var(--paper);padding:1rem 1.25rem}
.calc-top .d{font-size:.92rem;letter-spacing:.11em}
.calc-top small{font-family:var(--disp);font-weight:400;font-size:.72rem;
  letter-spacing:.12em;color:var(--kraft-dk);line-height:1}
.calc-body{padding:clamp(1.55rem,1rem + 1.9vw,2.3rem) clamp(1.25rem,.9rem + 1.5vw,1.9rem)}
.f{display:block;margin-bottom:1.05rem}
.f > span{display:block;font-family:var(--disp);font-weight:600;font-size:.78rem;
  line-height:1;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-60);margin-bottom:.5rem}
select,input[type=number]{width:100%;font:500 1rem/1.3 var(--txt);color:var(--ink);
  background:#fff;border:2px solid var(--ink);border-radius:2px;
  padding:.7rem .8rem;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='%231a1613'%3E%3Cpath d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .8rem center}
input[type=number]{background-image:none}
.chips{display:flex;flex-wrap:wrap;gap:.45rem}
.chip{position:relative}
.chip input{position:absolute;opacity:0;width:0;height:0}
.chip span{display:inline-block;font-family:var(--disp);font-weight:400;
  font-size:.85rem;line-height:1;letter-spacing:.04em;text-transform:uppercase;
  border:2px solid var(--ink);border-radius:99px;padding:.55rem .85rem;
  cursor:pointer;background:#fff;transition:background .16s,color .16s}
.chip input:checked + span{background:var(--signal);color:#fff}
.chip input:focus-visible + span{outline:3px solid var(--signal);outline-offset:3px}
/* результат — типографический момент страницы */
.out{border-top:2.5px dashed var(--ink);margin-top:1.3rem;padding-top:1.15rem;
  display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;
  flex-wrap:wrap}
.out-l{font-family:var(--disp);font-weight:600;font-size:.8rem;line-height:1;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink-60)}
.out-v{font-family:var(--disp);font-weight:700;line-height:.86;
  font-size:clamp(3rem,2rem + 4.6vw,4.6rem);letter-spacing:-.03em;
  font-variant-numeric:tabular-nums}
.out-v s{text-decoration:none;color:var(--signal)}
.calc .btn{width:100%;margin-top:1.15rem}
.fine{font-size:.83rem;color:var(--ink-60);margin-top:.8rem;line-height:1.5}

/* ============ услуги ============ */
.band-ink{background:var(--ink);color:var(--kraft-lt)}
.head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:.9rem;margin-bottom:clamp(1.9rem,1.2rem + 1.9vw,2.9rem)}
.head h2{font-size:clamp(1.85rem,1.2rem + 2.3vw,3.2rem);max-width:17ch}
.head p{color:var(--ink-30);max-width:32ch;font-size:.98rem}
.band-ink .head p{color:var(--kraft-dk)}
.svc{display:grid;gap:2px;background:rgba(216,198,164,.28)}
@media(min-width:760px){.svc{grid-template-columns:repeat(3,1fr)}
  .svc li:first-child{grid-column:span 2}
  .svc li:last-child{grid-column:1 / -1}   /* на всю ширину, иначе дыра в 3-й колонке */
  .svc li:last-child p{max-width:62ch}}
.svc li{list-style:none;background:var(--ink);padding:var(--cell) var(--cell-x);
  transition:background .2s}
.svc li:hover{background:#241f1a}
.svc h3{font-size:1.22rem;margin-bottom:.5rem;color:var(--paper)}
.svc p{font-size:.96rem;color:var(--kraft-dk)}
.svc .tag{display:inline-block;font-family:var(--disp);font-weight:400;
  font-size:.72rem;line-height:1;letter-spacing:.14em;color:var(--signal);
  text-transform:uppercase;margin-bottom:.85rem;
  filter:brightness(1.9)}

/* ============ порядок работы ============ */
.flow{display:grid;gap:2px;background:var(--ink)}
@media(min-width:820px){.flow{grid-template-columns:repeat(3,1fr)}}
.flow li{list-style:none;background:var(--kraft-lt);
  padding:var(--cell) var(--cell-x)}
.flow .step{display:flex;align-items:center;gap:.6rem;margin-bottom:.9rem}
.flow .dot{width:26px;height:26px;flex:none;border:2.5px solid var(--ink);
  border-radius:50%;background:var(--signal);color:#fff;
  font-family:var(--disp);font-weight:700;font-size:.85rem;line-height:1;
  display:flex;align-items:center;justify-content:center}
.flow .when{font-family:var(--disp);font-weight:400;font-size:.75rem;line-height:1;
  letter-spacing:.13em;text-transform:uppercase;color:var(--ink-60)}
.flow h3{font-size:1.15rem;margin-bottom:.4rem}
.flow p{font-size:.95rem;color:var(--ink-60)}

/* ============ прайс ============ */
.rate{width:100%;border-collapse:collapse}
.rate th,.rate td{text-align:left;padding:1.25rem .45rem;
  border-bottom:2px solid var(--kraft-dk)}
.rate th{font-family:var(--disp);font-weight:600;font-size:.76rem;line-height:1;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-60)}
.rate tr:last-child td{border-bottom:0}
.rate td:last-child{text-align:right;font-family:var(--disp);font-weight:700;
  font-size:1.18rem;line-height:1;white-space:nowrap}
.rate td small{display:block;font-family:var(--txt);font-weight:400;
  font-size:.84rem;line-height:1.4;color:var(--ink-60);margin-top:.25rem}

/* ============ финальный CTA ============ */
.cta{background:var(--signal);color:#fff;border-block:2.5px solid var(--ink)}
.cta-in{padding-block:clamp(3rem,2rem + 3vw,4.75rem);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:1.4rem}
.cta h2{font-size:clamp(1.6rem,1.1rem + 1.9vw,2.7rem);max-width:16ch}
.cta .btn{border-color:#fff;box-shadow:4px 4px 0 rgba(0,0,0,.45)}

/* ============ зоны + подвал ============ */
.zones{display:flex;flex-wrap:wrap;gap:.45rem}
.zones li{list-style:none;font-size:.9rem;border:2px solid var(--kraft-dk);
  border-radius:99px;padding:.4rem .85rem}
.zones li.hl{background:var(--ink);color:var(--kraft);border-color:var(--ink)}
.foot{border-top:2.5px solid var(--ink);padding-block:var(--pad) 6.5rem;
  font-size:.93rem}
.foot-g{display:grid;gap:1.9rem}
@media(min-width:760px){.foot-g{grid-template-columns:1.25fr 1fr 1.15fr}}
.foot h4{font-family:var(--disp);font-weight:600;font-size:.78rem;line-height:1;
  letter-spacing:.15em;text-transform:uppercase;margin-bottom:.75rem}
.foot a{text-decoration:none;border-bottom:1.5px solid var(--kraft-dk)}
.foot a:hover{border-color:var(--signal);color:var(--signal)}
.foot p{color:var(--ink-60)}

/* ============ мобильная панель ============ */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;gap:2px;
  background:var(--ink);border-top:2.5px solid var(--ink)}
.dock a{flex:1;text-align:center;padding:1.05rem .5rem;text-decoration:none;
  font-family:var(--disp);font-weight:600;font-size:.95rem;line-height:1;
  letter-spacing:.05em;text-transform:uppercase;background:var(--paper)}
.dock a.w{background:#25d366}
.dock a.s{background:var(--signal);color:#fff}
@media(min-width:760px){.dock{display:none}.foot{padding-bottom:var(--pad)}}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  html{scroll-behavior:auto}
}