/* Резатон — статичный сайт. Светлая палитра, красный только акцентом. */

html{scroll-padding-top:88px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
:root{
  --ink:#1a1c20;
  --ink-2:#22252a;
  --red:#e2111a;
  --red-2:#bc0e16;
  --red-txt:#c60d15;      /* мелкий красный текст: 6.05:1 на белом, 5.59:1 на бумаге */
  --red-on-dark:#ff6b73;  /* мелкий красный на тёмной секции: 6.18:1 */
  --paper:#f5f6f7;
  --paper-2:#eceef0;
  --line:#e2e4e7;
  --tx:#1a1c20;
  --tx-m:#6a6f78;
  --on-dark:#f2f3f5;
  --on-dark-m:#a4a9b2;
  --sans:"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  --chamfer:14px;
  --max:1140px;
  --pad:20px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  color:var(--tx);
  background:#fff;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{margin:0;line-height:1.06;font-weight:800;letter-spacing:-.02em}
p{margin:0}
ul{margin:0;padding:0;list-style:none}

.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--pad)}

/* ---------- кнопки ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:14px 24px;
  font:inherit;font-weight:700;font-size:16px;text-decoration:none;
  border:0;cursor:pointer;
  clip-path:polygon(0 0,calc(100% - var(--chamfer)) 0,100% var(--chamfer),100% 100%,0 100%);
  transition:transform .12s ease,background .2s ease,border-color .2s ease;
}
.btn:active{transform:translateY(1px)}
.btn--red{background:var(--red);color:#fff}
.btn--red:hover{background:var(--red-2)}
.btn--outline{background:#fff;color:var(--tx);box-shadow:inset 0 0 0 1px #cfd2d7}
.btn--outline:hover{box-shadow:inset 0 0 0 1px var(--tx)}
.btn--wide{width:100%}

/* ---------- ШАПКА И МЕНЮ ---------- */
.hdr{
  position:sticky;top:0;z-index:60;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.hdr__in{
  max-width:var(--max);margin:0 auto;padding:10px var(--pad);
  display:flex;align-items:center;gap:10px;justify-content:space-between;min-height:56px;
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-width:0}
.brand img{width:112px;height:auto}
.brand__txt{display:none;color:var(--tx);min-width:0}
.brand__txt b{display:block;font-size:13px;font-weight:700;white-space:nowrap}
.brand__txt span{display:block;font-size:11px;color:var(--tx-m);white-space:nowrap}
.hdr__nav{display:none}
.hdr__tel{
  display:none;align-items:center;gap:9px;white-space:nowrap;
  background:var(--red);color:#fff;text-decoration:none;
  font-weight:800;font-size:16px;letter-spacing:.01em;
  min-height:46px;padding:0 16px;
  clip-path:polygon(0 0,calc(100% - 11px) 0,100% 11px,100% 100%,0 100%);
}
.hdr__tel svg{width:16px;height:16px;flex:0 0 auto}
.nav-more{position:relative;flex:0 0 auto}
.nav-more summary{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;min-width:52px;padding:0 14px;
  background:#fff;color:var(--tx);border:1.5px solid var(--line);
  font-weight:700;font-size:14.5px;cursor:pointer;list-style:none;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);
  box-shadow:0 2px 6px rgba(12,14,18,.06);
  transition:border-color .15s ease,color .15s ease,background .15s ease;
}
.nav-more summary::-webkit-details-marker{display:none}
.nav-more summary:hover{border-color:var(--red);color:var(--red)}
.nav-more[open] summary{background:var(--red);border-color:var(--red);color:#fff}
.nav-burger{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;color:var(--red)}
.nav-burger svg{width:26px;height:26px}
.nav-more[open] .nav-burger{color:#fff}
.ico-close{display:none}
.nav-more[open] .ico-burger{display:none}
.nav-more[open] .ico-close{display:block}
.nav-more__label{display:none}
.nav-panel{
  position:absolute;right:0;top:calc(100% + 6px);z-index:80;
  min-width:236px;padding:6px;background:#fff;
  border:1px solid var(--line);
  box-shadow:0 16px 34px rgba(12,14,18,.14);
}
.nav-panel a{
  display:flex;align-items:center;min-height:48px;padding:0 12px;
  font-size:15px;font-weight:600;color:var(--tx);text-decoration:none;
}
.nav-panel a:hover,.nav-panel a:focus-visible{background:var(--paper-2);color:var(--red)}
.nav-panel a[aria-current="page"]{color:var(--red)}
a:focus-visible,summary:focus-visible{outline:2px solid var(--red);outline-offset:2px}


@media (min-width:760px){
  .hdr__tel{display:inline-flex}
  .nav-more__label{display:inline}
  .nav-panel{min-width:262px}
}
/* до полного меню телефон держится рядом с кнопкой «Разделы», а не болтается в центре */
@media (min-width:760px) and (max-width:1099.98px){
  .hdr__tel{margin-left:auto}
}
@media (min-width:1100px){
  .hdr__in{gap:16px}
  .hdr__nav{display:flex;align-items:center;gap:13px;margin-left:auto;white-space:nowrap}
  .hdr__nav a{
    display:inline-flex;align-items:center;min-height:44px;
    font-size:14.5px;font-weight:600;color:var(--tx);text-decoration:none;
    white-space:nowrap;border-bottom:2px solid transparent;
  }
  .hdr__nav a:hover{color:var(--red)}
  .hdr__nav a[aria-current="page"]{color:var(--red);border-bottom-color:var(--red)}
  .nav-more{display:none}
}

/* ---------- ГЛАВНЫЙ ЭКРАН ---------- */
.hero{background:var(--paper);position:relative;overflow:hidden}
.hero__in{
  position:relative;z-index:1;
  max-width:var(--max);margin:0 auto;padding:30px var(--pad) 34px;
  display:grid;gap:24px;
}
.hero__kick{
  font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--red-txt);
}
.hero__h1{font-size:min(2.3rem,6vw);text-transform:uppercase;text-wrap:balance}
.hero__h1 em{font-style:normal;color:var(--red);display:block}
.hero__lead{color:var(--tx-m);font-size:17px;max-width:46ch}
.hero__lead b{color:var(--tx);font-weight:700}
.hero__cta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.hero__cta .btn{width:100%;min-width:0;padding-left:12px;padding-right:12px}
.hero__proof{font-size:15px;color:var(--tx-m);max-width:48ch}
.hero__proof b{color:var(--tx);font-weight:700}

.hero__pic{margin:0;position:relative}
.hero__pic img{
  width:100%;
  clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,20px 100%,0 calc(100% - 20px));
}
.hero__pic figcaption{
  position:absolute;left:0;bottom:0;
  background:#fff;color:var(--tx);
  font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  padding:9px 14px;
  box-shadow:inset 0 0 0 1px var(--line);
  clip-path:polygon(0 0,100% 0,calc(100% - 11px) 100%,0 100%);
}

/* ---------- СЕКЦИИ ---------- */
.sec{padding:42px 0}
.sec--white{background:#fff}
.sec--paper{background:var(--paper)}
.sec--paper2{background:var(--paper-2)}
.sec--dark{background:var(--ink);color:var(--on-dark)}
.sec--dark .sec__lead{color:var(--on-dark-m)}
.sec__head{margin-bottom:20px}
.sec__kick{
  font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--red-txt);
  margin-bottom:8px;
}
.sec--dark .sec__kick{color:var(--red-on-dark)}
.sec__h2{font-size:clamp(1.55rem,5.2vw,2.4rem);text-transform:uppercase}
.sec--dark .sec__h2{color:#fff}
.sec__lead{margin-top:10px;color:var(--tx-m);font-size:16px;max-width:62ch}
.sec__lead a{color:var(--red);font-weight:700}

/* ---------- УСЛУГИ ---------- */
.srv{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.srv li{
  background:#fff;padding:16px 15px;border:1px solid var(--line);
  display:flex;flex-direction:column;gap:9px;
}
.srv svg{width:30px;height:30px;color:var(--red);flex:0 0 auto}
.srv b{font-size:15px;font-weight:700;line-height:1.25}
.srv span{font-size:13px;color:var(--tx-m);line-height:1.4}
.srv__links{margin-top:14px;font-size:15px;color:var(--tx-m)}
.srv__links a{color:var(--red-txt);font-weight:700}

/* ---------- ТАБЛИЦЫ ЦЕН ---------- */
.tscroll{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.ptable{width:100%;border-collapse:collapse;background:#fff;font-size:14px;border:1px solid var(--line)}
.ptable caption{text-align:left;font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.08em;padding:0 0 10px;color:var(--tx)}
.ptable th,.ptable td{padding:11px 13px;border-bottom:1px solid var(--line);text-align:left}
.ptable th{background:var(--paper-2);color:var(--tx);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.ptable td:last-child,.ptable th:last-child{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.ptable td:last-child{font-weight:800;color:var(--red)}
.ptable tr:last-child td{border-bottom:0}
.ptable__note{margin-top:12px;font-size:13px;color:var(--tx-m);max-width:72ch}

details.more{margin-top:14px;background:#fff;border:1px solid var(--line)}
details.more>summary{
  list-style:none;cursor:pointer;
  padding:16px 18px;font-weight:800;text-transform:uppercase;font-size:13px;letter-spacing:.08em;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::after{content:"+";font-size:22px;font-weight:700;color:var(--red);line-height:1}
details.more[open]>summary::after{content:"–"}
details.more>summary:hover{color:var(--red)}

/* ---------- ГАЛЕРЕЯ (единственный тёмный блок) ---------- */
.ba{display:grid;gap:14px;margin-bottom:12px}
.ba__p{margin:0}
.ba__row{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--ink-2)}
.ba__i{position:relative;overflow:hidden}
.ba__i img{width:100%;height:100%;object-fit:cover;aspect-ratio:5/4}
.ba__i i{
  position:absolute;left:0;top:0;font-style:normal;
  background:var(--ink);color:var(--on-dark);
  font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;
}
.ba__i--ok{background:var(--red);color:#fff}
.ba__p figcaption{margin-top:9px;font-size:13px;color:var(--on-dark-m)}
.gal{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.gal figure{margin:0;position:relative;overflow:hidden;background:var(--ink-2)}
.gal img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.gal__cta{
  display:flex;flex-direction:column;justify-content:center;gap:8px;
  background:var(--ink-2);border:1px solid #2c3037;padding:18px;text-decoration:none;
}
.gal__cta b{color:#fff;font-size:15px;font-weight:800;line-height:1.25}
.gal__cta span{color:var(--on-dark-m);font-size:13px;line-height:1.4}
.gal__cta:hover{border-color:var(--red)}
.gal__cta:hover b{color:var(--red-on-dark)}
.gal figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:22px 12px 9px;font-size:12px;font-weight:700;color:#fff;
  background:linear-gradient(to top,rgba(0,0,0,.82),transparent);
}

/* ---------- КАЛЬКУЛЯТОР (включается только при работающем JS) ---------- */
#calc{display:none}
html.js #calc{display:block}
.calc{display:grid;gap:12px;background:#fff;border:1px solid var(--line);border-left:3px solid var(--red);padding:18px}
.calc__f{display:grid;gap:6px}
.calc__f label{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--tx-m)}
.calc select{
  font:inherit;font-size:16px;font-weight:600;color:var(--tx);background:#fff;
  border:1px solid #cfd2d7;border-radius:0;padding:13px 12px;min-height:52px;width:100%;
}
.calc__out{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:14px}
.calc__sum{font-size:34px;font-weight:800;color:var(--red);letter-spacing:-.02em;line-height:1}
.calc__note{font-size:14px;color:var(--tx-m)}

/* ---------- ПОЧЕМУ МЫ ---------- */
.why{display:grid;gap:10px}
.why li{background:#fff;border:1px solid var(--line);padding:15px 17px;display:flex;gap:13px;align-items:flex-start}
.why b{color:var(--tx);font-weight:700}
.why p{margin:0;font-size:14px;color:var(--tx-m)}
.why i{
  font-style:normal;flex:0 0 auto;width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;
  background:var(--red);color:#fff;font-weight:800;font-size:14px;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%);
}

/* ---------- КАК ДОБРАТЬСЯ / КОНТАКТЫ ---------- */
.shot{margin:0 0 14px;position:relative}
.shot--gap{margin-top:20px;max-width:780px}
.shot img{width:100%;clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%)}
.shot figcaption{
  position:absolute;left:0;bottom:0;background:#fff;color:var(--tx);
  font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
  padding:8px 14px;
  box-shadow:inset 0 0 0 1px var(--line);
  clip-path:polygon(0 0,100% 0,calc(100% - 11px) 100%,0 100%);
}
.visit{display:grid;gap:14px}
.visit__card{background:#fff;border:1px solid var(--line);border-left:3px solid var(--red);padding:19px}
.visit__card h3{font-size:17px;text-transform:uppercase;margin-bottom:8px}
.visit__card p{font-size:15px;color:var(--tx-m)}
.visit__card p+p{margin-top:6px}
.visit__tel{display:block;font-size:23px;font-weight:800;margin:9px 0;text-decoration:none;color:var(--tx)}
.visit__tel:hover{color:var(--red)}
.visit__row{display:flex;flex-wrap:wrap;gap:10px;margin-top:13px}
.link-red{color:var(--red);font-weight:700}

/* ---------- ОТЗЫВЫ ---------- */
.rate{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:18px}
.rate__num{display:flex;align-items:baseline;gap:10px}
.rate__num b{font-size:30px;font-weight:800;color:var(--red);letter-spacing:-.03em;line-height:1}
.rate__num span{color:var(--tx-m);font-size:14px}

/* ---------- ПОДВАЛ ---------- */
.foot{background:var(--ink);color:var(--on-dark-m);font-size:14px;padding:26px 0 86px}
.foot__in{max-width:var(--max);margin:0 auto;padding:0 var(--pad);display:grid;gap:16px}
.foot img{width:132px;height:auto;margin-bottom:10px}
.foot b{color:#fff}
.foot a{color:var(--on-dark);text-decoration:none;border-bottom:1px solid #3a3e45}
.foot a:hover{color:#fff;border-color:var(--red)}
.foot ul{display:grid;gap:7px}
.foot__docs{display:flex;flex-wrap:wrap;gap:6px 18px}
.foot__h{color:#fff;font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.1em;margin:2px 0 10px}
.foot__soc{margin-top:12px}
.foot__soc a{display:inline-flex;align-items:center;gap:9px;color:var(--on-dark);text-decoration:none;
  border-bottom:0;font-weight:700;font-size:15px}
.foot__soc a:hover{color:#fff}
.foot__soc .ico-vk{width:20px;height:20px;fill:currentColor;flex:0 0 auto}

/* ---------- ЮР-СТРАНИЦЫ ---------- */
.doc{background:#fff;padding:26px 0 46px}
.doc__in{max-width:800px;margin:0 auto;padding:0 var(--pad)}
.doc h1{font-size:clamp(1.55rem,5vw,2.2rem);text-transform:uppercase;margin-bottom:18px}
.doc h2{font-size:16px;margin:26px 0 8px;text-transform:uppercase}
.doc p,.doc li{font-size:15px;color:#3b4048;margin:0 0 10px}
.doc ul{list-style:disc;padding-left:22px}
.doc table{width:100%;border-collapse:collapse;margin:12px 0;font-size:14px;border:1px solid var(--line)}
.doc th,.doc td{border:1px solid var(--line);padding:9px 11px;text-align:left}
.doc th{background:var(--paper);font-size:12px;text-transform:uppercase;letter-spacing:.06em;width:34%}
.doc__back{display:inline-flex;align-items:center;gap:8px;font-weight:700;text-decoration:none;color:var(--red);margin-bottom:18px}

/* ---------- 404 ---------- */
.err{padding:66px 0;text-align:center}
.err b{display:block;font-size:68px;font-weight:800;color:var(--red);line-height:1;letter-spacing:-.04em}
.err p{color:var(--tx-m);margin:12px 0 22px}

/* ---------- ПОДСТАНОВКИ ---------- */
.ph{background:#fff3b0;border-bottom:1px dashed var(--red);padding:0 3px}

/* ---------- МОБИЛЬНАЯ ПАНЕЛЬ ДЕЙСТВИЙ ---------- */
.callbar{
  position:fixed;left:0;right:0;bottom:0;z-index:70;
  display:flex;gap:10px;
  padding:9px 14px calc(9px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(8px);
  border-top:1px solid var(--line);
}
.callbar__btn{
  flex:1 1 0;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-height:50px;padding:0 12px;white-space:nowrap;
  font-size:15.5px;font-weight:800;letter-spacing:.01em;
  text-decoration:none;color:var(--tx);background:#fff;
  border:1px solid var(--line);
}
.callbar__btn svg{width:20px;height:20px;flex:0 0 auto}
.callbar__btn--call{
  background:var(--red);border-color:var(--red);color:#fff;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);
}
.callbar__btn--route{color:var(--tx)}
.callbar__btn--route svg{color:var(--red)}

/* ---------- АДАПТИВ ---------- */
@media (min-width:560px){
  .packs,.srv{grid-template-columns:repeat(2,1fr)}
  .ba{grid-template-columns:1fr 1fr}
}
@media (min-width:760px){
  .brand__txt{display:block}
  .brand img{width:142px}
  .hero__in{padding:46px var(--pad) 50px}
  .srv{grid-template-columns:repeat(3,1fr)}
  .gal{grid-template-columns:repeat(3,1fr)}
  .calc{grid-template-columns:1fr 1fr;align-items:end}
  .calc__out{grid-column:1/-1}
  .why{grid-template-columns:1fr 1fr}
  .visit{grid-template-columns:1fr 1fr}
  .sec{padding:60px 0}
  .foot__in{grid-template-columns:1.4fr 1fr 1fr}
  .doc{padding:38px 0 58px}
  .callbar{display:none}
  .foot{padding-bottom:32px}
}
@media (min-width:1100px){
  .hero__in{grid-template-columns:1.05fr .95fr;align-items:center;gap:36px}
  .hero__pic{order:2}
}
@media (min-width:980px){
  .srv{grid-template-columns:repeat(3,1fr)}
  .hero__in{padding-top:58px;padding-bottom:62px}
}
@media (max-width:400px){
  :root{--pad:15px}
  .brand img{width:104px}
  .hdr__tel{font-size:15px;padding:11px 12px}
}

/* Мобильные версии картинок и подписи под ними (29.09.2026): на узком экране
   подпись раньше ложилась поверх снимка и закрывала детали. */
.only-mob{display:none}
@media (max-width:700px){
  .only-desk{display:none}
  .only-mob{display:block}
  .shot figcaption,.hero__pic figcaption{
    position:static;left:auto;bottom:auto;display:inline-block;
    box-shadow:inset 0 0 0 1px var(--line);clip-path:none;
    padding:9px 14px;margin:8px 0 0;
  }
}

/* Кнопки в первом экране — всегда 50/50 (29.09.2026) */
@media (max-width:560px){
  .hero__cta .btn{font-size:14px;padding:12px 8px;min-height:48px;gap:6px}
}

/* ---------- ПЛАШКА COOKIE (29.09.2026) ---------- */
.cbar{position:fixed;left:0;right:0;bottom:0;z-index:200;background:var(--ink);color:var(--on-dark);border-top:1px solid #2b2f36;box-shadow:0 -8px 28px rgba(0,0,0,.28);padding:14px var(--pad)}
.cbar[hidden]{display:none}
.cbar__in{max-width:var(--max);margin:0 auto;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cbar__tx{margin:0;flex:1 1 420px;font-size:14px;line-height:1.45}
.cbar__tx a{color:var(--red-on-dark)}
.cbar__btns{display:flex;gap:10px}
.cbar__btn{font:inherit;font-size:14px;font-weight:700;padding:11px 20px;min-height:46px;cursor:pointer;border:0;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);transition:background .2s ease,box-shadow .2s ease}
.cbar__btn--no{background:transparent;color:var(--on-dark);box-shadow:inset 0 0 0 1px #6a6f78}
.cbar__btn--no:hover{box-shadow:inset 0 0 0 1px var(--on-dark)}
.cbar__btn--yes{background:var(--red);color:#fff}
.cbar__btn--yes:hover{background:var(--red-2)}
@media (max-width:640px){.cbar{padding:12px var(--pad)}.cbar__in{flex-direction:column;align-items:stretch}.cbar__tx{flex:0 0 auto}.cbar__btns{justify-content:flex-end}}