/* ================== ТЕМА «ПРОТОКОЛ» ==================
   Чернильная база, бумага, одна сигнальная краска печати.
   Радиус один на весь сайт (2px): документ, а не карточки.
*/
:root{
  --ink:#14243B; --ink-70:#41506A; --ink-45:#7A8598;
  --paper:#F3F4F1; --paper-2:#FFFFFF; --line:#D9DCD6;
  --seal:#A3242B; --seal-dark:#87191F; --ok:#1F6B4A;
  --radius:2px; --shell:1320px;
}
*{box-sizing:border-box}
body{margin:0; background:var(--paper); color:var(--ink);
  font-family:"Golos Text",-apple-system,"Segoe UI",Roboto,sans-serif; font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0; line-height:1.15; letter-spacing:-.01em}
p{margin:0}
a{color:inherit}
img{max-width:100%; display:block}
table{width:100%; border-collapse:collapse; font-size:14.5px}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace; font-variant-numeric:tabular-nums}
.wrap{max-width:var(--shell); margin:0 auto; padding:0 24px}
.muted{color:var(--ink-45); font-size:13px}
.hint{font-size:12.5px; color:var(--ink-45); margin-top:10px}

/* -------------------------------------------------------------- КНОПКИ */
.btn{display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:var(--radius);
  font-weight:600; font-size:14.5px; text-decoration:none; border:1px solid transparent; cursor:pointer;
  transition:background .18s ease, color .18s ease, border-color .18s ease; white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn-seal{background:var(--seal); color:#fff}
.btn-seal:hover{background:var(--seal-dark)}
.btn-ghost-light{border-color:rgba(255,255,255,.55); color:#fff}
.btn-ghost-light:hover{background:#fff; color:var(--ink)}

/* --------------------------------------------------------------- ШАПКА */
.topbar{background:var(--ink); color:#fff; font-size:13px}
.topbar .in{max-width:var(--shell); margin:0 auto; padding:9px 24px; display:flex; align-items:center; gap:26px}
.topbar .sp{margin-left:auto; display:flex; gap:20px}
.topbar a{text-decoration:none; opacity:.82}
.topbar a:hover{opacity:1}

.masthead{background:var(--paper-2); border-bottom:1px solid var(--line)}
.masthead .in{max-width:var(--shell); margin:0 auto; padding:16px 24px; display:flex; align-items:center; gap:28px}
.mark{display:flex; align-items:center; gap:12px; text-decoration:none}
.mark .glyph{width:46px; height:46px; background:var(--seal); color:#fff; display:grid; place-items:center;
  font-family:"JetBrains Mono",monospace; font-weight:500; font-size:19px}
.mark .name{font-weight:700; font-size:19px; letter-spacing:.02em}
.mark .sub{font-size:11.5px; color:var(--ink-45); letter-spacing:.04em; text-transform:uppercase}
.contacts{margin-left:auto; display:flex; align-items:center; gap:28px}
.contact .lbl{font-size:11px; color:var(--ink-45); text-transform:uppercase; letter-spacing:.08em}
.contact .val{font-weight:600; font-size:17px; text-decoration:none}

.nav{background:var(--seal)}
.nav .in{max-width:var(--shell); margin:0 auto; padding:0 24px; display:flex; overflow-x:auto}
.nav a{color:#fff; text-decoration:none; font-size:14px; padding:14px 15px; white-space:nowrap;
  border-right:1px solid rgba(255,255,255,.16)}
.nav a:first-child{border-left:1px solid rgba(255,255,255,.16)}
.nav a:hover,.nav a.on{background:var(--seal-dark)}
.mobile-nav{display:none}

/* ---------------------------------------------------------------- КАДР */
.shot{position:relative; overflow:hidden; background:var(--ink); isolation:isolate}
.shot img{width:100%; height:100%; object-fit:cover}
.shot.treat img{filter:grayscale(.42) contrast(1.07) brightness(.97) saturate(.82)}
.shot.treat .grade{position:absolute; inset:0; z-index:1; pointer-events:none; mix-blend-mode:multiply;
  background:linear-gradient(180deg, rgba(20,36,59,.34), rgba(20,36,59,.12) 55%, rgba(163,36,43,.14))}
.ratio-3x2{aspect-ratio:3/2} .ratio-hero{aspect-ratio:21/8}
.ov-wave{position:absolute; inset:0; z-index:2; pointer-events:none;
  background:
    repeating-linear-gradient(58deg, rgba(255,255,255,.16) 0 .5px, transparent .5px 5px),
    repeating-linear-gradient(-58deg, rgba(255,255,255,.10) 0 .5px, transparent .5px 6px),
    linear-gradient(115deg, rgba(163,36,43,.78) 0%, rgba(120,30,45,.74) 34%, rgba(20,36,59,.80) 70%, rgba(20,36,59,.9) 100%);
  -webkit-mask-image:linear-gradient(115deg, transparent 26%, rgba(0,0,0,.65) 40%, #000 56%);
  mask-image:linear-gradient(115deg, transparent 26%, rgba(0,0,0,.65) 40%, #000 56%)}
/* В узком кадре диагональ успевает накрыть весь снимок: на 3:2 запускаем волну позже и мягче */
.ratio-3x2 .ov-wave{opacity:.9;
  -webkit-mask-image:linear-gradient(115deg, transparent 46%, rgba(0,0,0,.5) 62%, #000 82%);
  mask-image:linear-gradient(115deg, transparent 46%, rgba(0,0,0,.5) 62%, #000 82%)}
.ov-plate{position:absolute; left:0; right:0; bottom:0; z-index:3; pointer-events:none; display:flex;
  gap:18px; flex-wrap:wrap; align-items:center; padding:11px 16px; color:rgba(255,255,255,.92);
  background:linear-gradient(180deg, rgba(20,36,59,0), rgba(20,36,59,.92));
  font-family:"JetBrains Mono",monospace; font-size:11.5px}
.ov-plate .sep{width:1px; height:12px; background:rgba(255,255,255,.3)}
.ov-plate .red{color:#F0B7B9}
.ov-stamp{position:absolute; right:22px; top:20px; z-index:3; pointer-events:none; width:104px; height:104px;
  border:2px solid rgba(255,255,255,.9); border-radius:50%; display:grid; place-items:center; text-align:center;
  transform:rotate(-9deg); color:#fff; background:rgba(163,36,43,.42);
  font-family:"JetBrains Mono",monospace; text-transform:uppercase; letter-spacing:.08em}
.ov-stamp b{font-size:11px; font-weight:500; line-height:1.25; display:block}
.ov-stamp span{font-size:9px; opacity:.9; display:block; margin-top:3px}

/* Баннер держим светлым: снимок без обесцвечивания, гильош уходит в правый угол
   узкой полосой, а затемняем только левую треть — ровно под белый заголовок */
.hero.shot.treat img{filter:contrast(1.02) saturate(1.02) brightness(1.03)}
.hero .ov-wave{opacity:.5;
  -webkit-mask-image:linear-gradient(115deg, transparent 62%, rgba(0,0,0,.35) 78%, rgba(0,0,0,.8) 100%);
  mask-image:linear-gradient(115deg, transparent 62%, rgba(0,0,0,.35) 78%, rgba(0,0,0,.8) 100%)}
.hero.shot.treat .grade{background:linear-gradient(90deg, rgba(20,36,59,.85), rgba(20,36,59,.78) 32%, rgba(20,36,59,.62) 48%, rgba(20,36,59,.28) 66%, rgba(20,36,59,.06) 82%, rgba(163,36,43,.05) 95%)}

/* ---------------------------------------------------------------- ГЕРОЙ */
.hero{position:relative}
.hero-copy{position:absolute; inset:0; z-index:4; display:flex; align-items:center; color:#fff}
/* .wrap здесь флекс-элемент: без width он сжимается по тексту и уезжает в центр кадра,
   а должен стоять в одном левом крае с логотипом и меню */
.hero-copy > .wrap{width:100%}
.hero h1{font-size:clamp(28px,3.4vw,46px); font-weight:700; max-width:17ch}
.hero .lead{margin-top:16px; max-width:52ch; color:rgba(255,255,255,.93); font-size:17px}
.hero .btns{margin-top:26px; display:flex; gap:12px; flex-wrap:wrap}
.hero .refs{margin-top:26px; display:flex; gap:26px; flex-wrap:wrap; font-size:13px; color:rgba(255,255,255,.86)}
.hero .refs i{color:#fff; margin-right:7px; font-size:16px; vertical-align:-2px}

/* ------------------------------------------------------------- СЕКЦИИ */
.band{padding:52px 0}
.band.alt{background:var(--paper-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.h-sec{font-size:26px; font-weight:700; margin-bottom:22px}
.cols2{display:grid; grid-template-columns:1.05fr .95fr; gap:44px; align-items:start}
.big{font-size:16.5px; color:var(--ink-70); margin-bottom:14px; max-width:62ch}
.big:last-child{margin-bottom:0}

/* Выключка по обоим краям — как на водной сети: длинная проза, не карточки.
   Заголовки и таблицы остаются по левому краю, переносы включаем только там, где строка длинная. */
.big,.section-intro,.table-note,.pagehead .lead,.note,.note-p,.qa p,.newscard p{
  text-align:justify; text-justify:inter-word; hyphens:auto; -webkit-hyphens:auto; -moz-hyphens:auto}
h1,h2,h3,h4,.h-sec{text-align:left; hyphens:manual}
@media (max-width:560px){
  /* На узкой колонке выключка рвёт строки пробелами — там оставляем левый край */
  .big,.section-intro,.table-note,.pagehead .lead,.note,.note-p,.qa p,.newscard p{text-align:left; hyphens:auto}
}
/* Продолжение текста раздела: две колонки, чтобы длинная проза не растягивалась на всю ширину */
.hub-rest{columns:2; column-gap:46px; margin-top:26px}
.hub-rest .big{max-width:none; break-inside:avoid; margin-bottom:16px}
.hub-rest .shot + .hub-rest{margin-top:0}
@media (max-width:860px){ .hub-rest{columns:1} }

.pagehead{padding:30px 24px 6px}
.pagehead h1{font-size:clamp(26px,3vw,38px); font-weight:700}
.pagehead .lead{margin-top:14px; max-width:70ch; color:var(--ink-70); font-size:17px}
.crumbs{font-size:13px; color:var(--ink-45); margin-bottom:14px}
.crumbs a{text-decoration:none}

.proof{background:var(--paper-2); border-bottom:1px solid var(--line)}
.proof .in4{display:grid; grid-template-columns:repeat(4,1fr); gap:26px; padding-top:22px; padding-bottom:22px}
.proof .it{display:flex; gap:12px}
.proof i{font-size:22px; color:var(--seal); margin-top:1px}
.proof .t{font-weight:600; font-size:14.5px}
.proof .dsc{font-size:13px; color:var(--ink-70)}

.facts{display:flex; gap:34px; flex-wrap:wrap; margin-top:22px; padding-top:18px; border-top:1px solid var(--line)}
.facts b{display:block; font-size:24px; color:var(--ink)}
.facts span{font-size:13px; color:var(--ink-45)}

.cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.card{display:block; text-decoration:none; border:1px solid var(--line); background:var(--paper-2); padding:24px;
  transition:border-color .18s ease}
.card:hover{border-color:var(--ink)}
.card i{font-size:26px; color:var(--seal)}
.card b{display:block; font-size:19px; margin:12px 0 8px}
.card p{color:var(--ink-70); font-size:14.5px}
.card .more{display:inline-flex; align-items:center; gap:7px; margin-top:14px; color:var(--seal);
  font-weight:600; font-size:14px}

.lines{border-top:1px solid var(--line)}
.line{display:grid; grid-template-columns:230px 1fr 24px; gap:24px; align-items:center; padding:20px 0;
  border-bottom:1px solid var(--line); text-decoration:none}
.line:hover{background:var(--paper-2)}
.line b{font-size:18px}
.line p{color:var(--ink-70); font-size:14.5px}
.line i{color:var(--seal)}

.steps{border-top:1px solid var(--line)}
.step{display:grid; grid-template-columns:44px 1fr; gap:16px; padding:16px 0; border-bottom:1px solid var(--line)}
.step .n{color:var(--seal); font-size:14px; padding-top:2px}
.step b{display:block; margin-bottom:3px}
.step p{font-size:14.5px; color:var(--ink-70)}

.children{display:grid; grid-template-columns:repeat(2,1fr); gap:0 34px}
.children a,.children .soon{display:flex; justify-content:space-between; gap:14px; align-items:center;
  padding:13px 0; border-bottom:1px solid var(--line); text-decoration:none; font-size:15px}
.children a:hover{color:var(--seal)}
.children a i{color:var(--seal); font-size:15px}
.children .soon{color:var(--ink-45)}
.children .soon i{font-size:15px}

.cta{background:var(--ink); color:#fff; padding:34px 0}
.cta .wrap{display:flex; align-items:center; gap:28px; flex-wrap:wrap}
.cta h2{font-size:24px; font-weight:700}
.cta p{color:rgba(255,255,255,.75); margin-top:6px; font-size:15px}
.cta .btn{margin-left:auto}

/* ------------------------------------------------------- ПРОТОКОЛ-ТАБЛИЦЫ */
.protocol{margin:26px 0; border:1px solid var(--line); background:var(--paper-2); overflow-x:auto}
.protocol .cap{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:14px 18px;
  background:var(--ink); color:#fff}
.protocol .cap b{font-weight:600; font-size:15px}
.protocol .cap .no{font-size:12px; color:rgba(255,255,255,.7)}
th{text-align:left; padding:11px 18px; font-weight:500; font-size:12px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--ink-45); background:#F7F8F5}
td{padding:13px 18px; border-top:1px solid var(--line)}
td.num, th.num{text-align:right}
.badge{display:inline-block; padding:2px 8px; font-size:12px; border-radius:var(--radius)}
.badge-ok{background:rgba(31,107,74,.1); color:var(--ok)}
.badge-no{background:rgba(163,36,43,.1); color:var(--seal)}

/* ------------------------------------------------------------ СТРАНИЦЫ */
.work{display:grid; grid-template-columns:250px 1fr; gap:44px; padding-top:26px; padding-bottom:48px}
.aside .ttl{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-45); margin-bottom:12px}
.aside a,.aside span{display:block; padding:10px 0; border-bottom:1px solid var(--line); font-size:14.5px;
  text-decoration:none}
.aside a:hover{color:var(--seal)}
.aside a.on{color:var(--seal); font-weight:600}
.aside span{color:var(--ink-45)}

.docgrid{display:grid; grid-template-columns:1.25fr .8fr; gap:40px; padding-top:26px; padding-bottom:48px}
.doccard{position:relative; border:1px solid var(--line); background:var(--paper-2); padding:30px 32px}
.doccard .meta{display:grid; grid-template-columns:repeat(2,1fr); gap:16px 28px; margin-bottom:22px}
.doccard .meta .k{font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--ink-45)}
.doccard .meta .v{font-weight:600; margin-top:2px}
.stampwrap{position:absolute; right:28px; top:26px}
.stamp{display:grid; place-items:center; width:104px; height:104px; border:2px solid var(--seal); color:var(--seal);
  border-radius:50%; text-align:center; transform:rotate(-8deg);
  font-family:"JetBrains Mono",monospace; text-transform:uppercase; letter-spacing:.08em}
.stamp b{font-size:11px; font-weight:500; line-height:1.25}
.stamp span{font-size:9px; opacity:.85; display:block; margin-top:3px}

.sidecard{border:1px solid var(--line); background:var(--paper-2)}
.sidecard .h{padding:16px 20px; background:#F7F8F5; border-bottom:1px solid var(--line); font-weight:600}
.sidecard .b{padding:20px}
.field{margin-top:8px}
.field label{display:block; font-size:12.5px; color:var(--ink-70); margin-bottom:6px}
.field input{width:100%; padding:12px 13px; border:1px solid #B9BEB6; border-radius:var(--radius);
  background:var(--paper-2); font:inherit; font-size:15px; color:var(--ink)}
.field input::placeholder{color:#7C8478}
.field input:focus{outline:2px solid var(--ink); outline-offset:1px; border-color:var(--ink)}

.contact-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:22px}
.cblock{border:1px solid var(--line); background:var(--paper-2); padding:20px}
.cblock .k{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-45)}
.cblock .v{font-size:20px; font-weight:600; margin:6px 0 8px}
.cblock p{font-size:13.5px; color:var(--ink-70)}

.faq{display:grid; grid-template-columns:repeat(2,1fr); gap:22px 34px}
.qa{border-bottom:1px solid var(--line); padding:0 0 14px}
.qa summary{font-size:16px; font-weight:600; cursor:pointer; list-style:none; position:relative; padding-right:28px}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+"; position:absolute; right:0; top:-2px; color:var(--seal); font:500 20px/1 "JetBrains Mono",monospace}
.qa[open] summary::after{content:"−"}
.qa b{display:block; font-size:16px; margin-bottom:6px}
.qa p{color:var(--ink-70); font-size:14.5px}
.qa[open] p{margin-top:9px}
.note{padding:16px 18px; border-left:3px solid var(--seal); background:var(--paper-2); font-size:14.5px;
  color:var(--ink-70)}

/* -------------------------------------- ЭКСПЕРТНЫЕ СТРАНИЦЫ УСЛУГ */
.service-head{padding-bottom:34px}
.service-hero{display:grid; grid-template-columns:1.05fr .95fr; gap:44px; align-items:center}
.service-hero>*,.editorial-split>*,.zone-layout>*,.final-grid>*{min-width:0}
.service-hero .shot,.editorial-split .shot,.zone-layout .shot{width:100%}
.service-hero h1{font-size:clamp(32px,4.2vw,54px); max-width:17ch; text-wrap:balance}
.service-hero .lead{max-width:62ch; text-wrap:pretty}
.service-hero .shot{min-height:380px}
.service-hero .btns{display:flex; flex-wrap:wrap; gap:12px; margin-top:22px}
.price-from{display:flex; align-items:baseline; gap:16px; margin-top:24px; padding-top:18px; border-top:1px solid var(--line)}
.price-from span{color:var(--ink-70); font-size:14px}
.price-from b{font-size:26px; color:var(--seal)}
.mini-proof{display:flex; flex-wrap:wrap; gap:8px 20px; margin-top:22px; font-size:12.5px; color:var(--ink-70)}
.mini-proof span::before{content:""; display:inline-block; width:6px; height:6px; margin-right:8px; background:var(--seal); vertical-align:1px}
.table-note,.section-intro{max-width:76ch; color:var(--ink-70); font-size:15px; line-height:1.65}
.price-table{max-width:920px}
.expert-cards{display:grid; grid-template-columns:repeat(4,1fr); gap:0; border-top:1px solid var(--line); border-left:1px solid var(--line)}
.expert-cards article{padding:22px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper-2)}
.expert-cards h3,.method-grid h3,.safety-list h3,.document-proof h3,.document-checks h3{font-size:16px; margin-bottom:7px}
.expert-cards p,.method-grid p,.safety-list p,.document-proof p,.document-checks p{color:var(--ink-70); font-size:14px; line-height:1.55}
.editorial-split,.zone-layout,.final-grid{display:grid; grid-template-columns:1fr 1fr; gap:52px; align-items:start}
.editorial-split .shot,.zone-layout .shot{min-height:390px}
.editorial-split.compact{align-items:stretch}
.method-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.method-grid article{padding:24px 0; border-top:2px solid var(--seal)}
.zone-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 22px; border-top:1px solid var(--line)}
.zone-grid span{padding:13px 0; border-bottom:1px solid var(--line); font-size:14.5px}
.prep-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px}
.prep-grid details{background:var(--paper-2); border:1px solid var(--line); padding:18px 20px}
.prep-grid summary{font-weight:600; cursor:pointer}
.prep-grid ul{margin:14px 0 0; padding-left:19px; color:var(--ink-70)}
.prep-grid li{margin:7px 0; padding-left:3px}
.safety-list{display:grid; grid-template-columns:repeat(5,1fr); margin-top:24px; border-top:1px solid var(--line)}
.safety-list article{padding:20px 18px 0 0}
.guarantee-box{background:var(--ink); color:#fff; padding:32px; min-height:100%}
.guarantee-box h2{font-size:28px; margin:10px 0 14px; max-width:19ch}
.guarantee-box p{color:rgba(255,255,255,.74); max-width:50ch}
.eyebrow{font:500 11px/1.3 "JetBrains Mono",monospace; text-transform:uppercase; letter-spacing:.09em; color:var(--seal)}
.guarantee-box .eyebrow{color:#F0B7B9}
.reason-list{display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line)}
.reason-list>div{padding:20px; border-right:1px solid var(--line); border-bottom:1px solid var(--line)}
.reason-list span{color:var(--seal); font-size:12px}
.reason-list p{margin-top:18px; font-size:14.5px; color:var(--ink-70)}
.document-proof,.document-checks{display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line)}
.document-proof article,.document-checks article{padding:22px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper-2)}
.honest-note{margin-top:24px; max-width:92ch}
.related{display:grid; grid-template-columns:230px repeat(3,1fr); margin-top:26px; border-top:1px solid var(--line)}
.related>*{padding:13px 12px 13px 0; border-bottom:1px solid var(--line)}
.related a{text-decoration:none; color:var(--ink-70); font-size:14px}
.related a:hover{color:var(--seal)}
.final-grid{align-items:center}
.final-grid>.sidecard{max-width:560px; width:100%; justify-self:end}
.phone-big{margin-top:22px; font:600 clamp(22px,3vw,34px)/1.2 "JetBrains Mono",monospace}
.phone-big a{text-decoration:none}
.form-status{min-height:20px; color:var(--ink-70); font-size:12.5px; margin-top:8px}
.doc-subhead{margin-top:34px}
.doc-note{margin-top:22px}
.crumbs{display:flex; flex-wrap:wrap; gap:7px}
.crumbs i{font-style:normal; color:var(--line)}

@media (max-width:1000px){
  .service-hero,.editorial-split,.zone-layout,.final-grid{grid-template-columns:1fr}
  .expert-cards{grid-template-columns:1fr 1fr}
  .safety-list,.reason-list{grid-template-columns:1fr 1fr}
  .document-proof,.document-checks{grid-template-columns:1fr 1fr}
  .related{grid-template-columns:1fr 1fr}
  .final-grid>.sidecard{justify-self:start}
}
@media (max-width:640px){
  .service-hero .shot,.editorial-split .shot,.zone-layout .shot{min-height:260px}
  .service-hero h1{font-size:32px}
  .expert-cards,.method-grid,.prep-grid,.safety-list,.reason-list,.document-proof,.document-checks,.related{grid-template-columns:1fr}
  .zone-grid{grid-template-columns:1fr}
  .price-from{align-items:flex-start; flex-direction:column; gap:4px}
  .service-hero .btn{width:100%; justify-content:center}
}

/* ---------------------------------------------------------------- ПОДВАЛ */
.foot{background:var(--ink); color:rgba(255,255,255,.72); font-size:14px}
.foot .in{max-width:var(--shell); margin:0 auto; padding:36px 24px; display:grid;
  grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px}
.foot h4{color:#fff; font-size:13px; letter-spacing:.08em; text-transform:uppercase; margin-bottom:12px}
.foot a{display:block; text-decoration:none; padding:4px 0; color:rgba(255,255,255,.72)}
.foot a:hover{color:#fff}

/* Шапка на узком экране: ничего не режется по краю и меню не ездит вбок —
   на это отдельно пожаловался клиент */
@media (max-width:900px){
  .masthead .in{flex-wrap:wrap; gap:14px 18px; padding:14px 16px}
  .contacts{margin-left:0; width:100%; gap:14px; flex-wrap:wrap}
  .contacts .btn{flex:1 1 200px; justify-content:center}
  .desktop-nav{display:none!important}
  .mobile-nav{display:block; color:#fff}
  .mobile-nav summary{cursor:pointer; list-style:none; padding:13px 16px; font-weight:600; position:relative}
  .mobile-nav summary::-webkit-details-marker{display:none}
  .mobile-nav summary::after{content:"+"; position:absolute; right:18px; font:500 20px/1 "JetBrains Mono",monospace}
  .mobile-nav[open] summary::after{content:"−"}
  .mobile-nav .in{overflow-x:visible; flex-wrap:wrap; padding:0 16px 12px}
  .nav a{padding:11px 12px; font-size:13.5px; border-left:0; border-right:1px solid rgba(255,255,255,.16)}
  .nav a:first-child{border-left:0}
  .topbar .in{flex-wrap:wrap; gap:6px 18px; padding:8px 16px}
  .wrap,.topbar .in,.masthead .in,.foot .in{padding-left:16px; padding-right:16px}
}
@media (max-width:1000px){
  .cols2,.docgrid,.work{grid-template-columns:1fr; gap:26px}
  .cards3,.proof .in4,.faq,.contact-grid,.children{grid-template-columns:1fr 1fr}
  .foot .in{grid-template-columns:1fr 1fr}
  .line{grid-template-columns:1fr 24px}
  .line p{grid-column:1 / -1}
  .ratio-hero{aspect-ratio:4/3}
}
@media (max-width:640px){
  .cards3,.proof .in4,.faq,.contact-grid,.children,.foot .in,.doccard .meta{grid-template-columns:1fr}
  .contacts .btn-ghost{display:none}
  .cta .btn{margin-left:0}
  .topbar .in span:nth-child(2){display:none}
  /* На телефоне текст в кадр не влезает и заголовок уезжает за край: снимок
     уходит в фон, а высоту героя задаёт сам блок с текстом */
  .hero.ratio-hero{aspect-ratio:auto}
  .hero > img,.hero .grade,.hero .ov-wave{position:absolute; inset:0}
  .hero > img{height:100%}
  .hero-copy{position:relative; inset:auto; padding:32px 0 40px}
  .hero h1,.hero .lead{max-width:none}
  .hero .btns .btn{flex:1 1 100%; justify-content:center}
  .hero .refs{gap:10px 18px}
  .hero.shot.treat .grade{background:linear-gradient(180deg, rgba(20,36,59,.66), rgba(20,36,59,.84))}
}

/* ------------------------------------------------- ПЛОТНАЯ ГЛАВНАЯ
   Задача блока: с главной можно провалиться на любую внутреннюю страницу.
   Поэтому каталог разделов идёт списками ссылок, а не карточками. */
.cat-block{padding:26px 0; border-top:1px solid var(--line)}
.cat-block:first-of-type{border-top:0; padding-top:6px}
.cat-head{display:grid; grid-template-columns:250px 1fr auto; gap:24px; align-items:baseline; margin-bottom:16px}
.cat-head h3{font-size:20px; font-weight:700}
.cat-head h3 a{text-decoration:none}
.cat-head h3 a:hover{color:var(--seal)}
.cat-head p{color:var(--ink-70); font-size:14.5px; max-width:62ch}
.cat-all{white-space:nowrap; text-decoration:none; color:var(--seal); font-weight:600; font-size:14px;
  display:inline-flex; align-items:center; gap:7px}
.linkgrid{display:grid; gap:0 30px}
.linkgrid.c1{grid-template-columns:1fr}
.linkgrid.c2{grid-template-columns:repeat(2,1fr)}
.linkgrid.c3{grid-template-columns:repeat(3,1fr)}
.linkgrid a,.linkgrid span{display:block; padding:9px 0; border-bottom:1px solid var(--line);
  text-decoration:none; font-size:14.5px; line-height:1.35}
.linkgrid a:hover{color:var(--seal)}
.linkgrid span{color:var(--ink-45)}

.under-table{display:flex; align-items:center; gap:22px; flex-wrap:wrap; margin-top:16px}
.under-table p{color:var(--ink-70); font-size:14.5px}
.under-table .btn{margin-left:auto}
.btn-ghost{border-color:var(--ink); color:var(--ink); background:transparent}
.btn-ghost:hover{background:var(--ink); color:#fff}

.workcards{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.workcard b{display:block; font-size:17px; margin:14px 0 6px}
.workcard p{color:var(--ink-70); font-size:14.5px}

@media (max-width:1000px){
  .cat-head{grid-template-columns:1fr; gap:8px}
  .linkgrid.c3{grid-template-columns:repeat(2,1fr)}
  .workcards{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .linkgrid.c2,.linkgrid.c3{grid-template-columns:1fr}
  .workcards{grid-template-columns:1fr}
  .under-table .btn{margin-left:0}
}

/* Группы внутри длинного каталога: сплошной список из 31 ссылки не читается */
.cat-group{margin-top:18px}
.cat-group:first-child{margin-top:0}
.cat-group h4{font-size:12px; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-45);
  margin-bottom:8px; font-weight:600}

/* ---------------------------------------------- БЛОКИ ГЛАВНОЙ (правки Сергея) */
/* Списки услуг с призывом: вид старого сайта, но в теме «Протокол» */
.svc-lists{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
.svc-list{border:1px solid var(--line); background:var(--paper-2); padding:24px; display:flex; flex-direction:column}
.svc-head{display:flex; align-items:center; gap:12px; margin-bottom:14px}
.svc-head i{font-size:24px; color:var(--seal)}
.svc-head h3{font-size:18px; font-weight:700}
.svc-head h3 a{text-decoration:none}
.svc-head h3 a:hover{color:var(--seal)}
.svc-list ul{list-style:none; margin:0 0 18px; padding:0; flex:1}
.svc-list li{padding:7px 0 7px 16px; position:relative; font-size:14.5px; border-bottom:1px solid var(--line)}
.svc-list li::before{content:''; position:absolute; left:0; top:15px; width:5px; height:5px; background:var(--seal)}
.svc-list li a{text-decoration:none}
.svc-list li a:hover{color:var(--seal)}
.svc-list .btn{justify-content:center}

/* Документы двумя группами: фото плюс список плюс две кнопки */
.docgroup{display:grid; grid-template-columns:.85fr 1.15fr; gap:32px; align-items:start; padding:26px 0;
  border-top:1px solid var(--line)}
.docgroup:first-of-type{border-top:0; padding-top:4px}
.docgroup h3{font-size:20px; font-weight:700; margin-bottom:8px}
.note-p{color:var(--ink-70); font-size:14.5px}
.docgroup .linkgrid{margin-top:14px}
.btns2{display:flex; gap:12px; flex-wrap:wrap; margin-top:18px}

/* Клиенты: типы объектов, пока без логотипов */
.clients{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
.client{display:flex; align-items:center; gap:12px; padding:16px; border:1px solid var(--line);
  background:var(--paper-2); font-size:14.5px}
.client i{font-size:22px; color:var(--seal); flex:none}

/* Новости */
.newscards{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.newscard{border:1px solid var(--line); background:var(--paper-2); padding:22px; display:flex; flex-direction:column}
.newscard .date{font-size:12px; color:var(--ink-45); margin-bottom:8px}
.newscard b{font-size:17px; line-height:1.25; margin-bottom:8px}
.newscard p{color:var(--ink-70); font-size:14.5px; flex:1}
.newscard .more{margin-top:14px; color:var(--seal); font-weight:600; font-size:14px; text-decoration:none;
  display:inline-flex; align-items:center; gap:7px}

@media (max-width:1000px){
  .svc-lists{grid-template-columns:1fr 1fr}
  .docgroup{grid-template-columns:1fr}
  .clients{grid-template-columns:repeat(2,1fr)}
  .newscards{grid-template-columns:1fr}
}
@media (max-width:640px){
  .svc-lists{grid-template-columns:1fr}
  .clients{grid-template-columns:1fr}
  .btns2 .btn{width:100%; justify-content:center}
}

/* ------------------------------------------------------------------ КАРТА */
/* Виджет Яндекса подставляется по клику: до этого на странице нет ни одного
   стороннего запроса, значит и чужих cookie до согласия посетителя тоже нет. */
.mapcard{margin-top:26px; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:#fff}
.mapcard-head{display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap; padding:16px 18px; border-bottom:1px solid var(--line)}
.mapcard-head .k{font:600 12px/1.2 var(--mono,inherit); letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.mapcard-head .v{font-weight:600; margin-top:4px}
.mapcard-stub{display:flex; align-items:center; gap:14px; width:100%; min-height:220px;
  padding:22px; border:0; cursor:pointer; text-align:left; color:inherit;
  background:
    repeating-linear-gradient(45deg, rgba(0,0,0,.028) 0 12px, transparent 12px 24px),
    var(--bg-soft,#f3f4f6)}
.mapcard-stub:hover{background:
    repeating-linear-gradient(45deg, rgba(0,0,0,.045) 0 12px, transparent 12px 24px),
    var(--bg-soft,#eef0f3)}
.mapcard-stub i{font-size:34px; color:var(--accent,#b3261e); flex:none}
.mapcard-stub b{display:block; font-size:16px}
.mapcard-stub small{display:block; margin-top:6px; max-width:52ch; color:var(--muted); font-size:13.5px; line-height:1.45}
.mapcard iframe{display:block; width:100%; height:380px; border:0}
.mapcard .note-p{margin:0; padding:14px 18px; border-top:1px solid var(--line); font-size:13.5px; color:var(--muted)}
@media (max-width:640px){
  .mapcard-stub{min-height:180px; padding:18px}
  .mapcard iframe{height:300px}
}

/* ------------------------------------------------- СОГЛАСИЕ И КУКИ-БАР */
.consent{display:flex; gap:10px; align-items:flex-start; margin-top:16px;
  font-size:12.5px; line-height:1.5; color:var(--muted); cursor:pointer}
.consent input{flex:none; width:16px; height:16px; margin-top:1px; accent-color:var(--accent,#b3261e)}
.consent a{color:inherit; text-decoration:underline; text-underline-offset:2px}
.consent a:hover{color:var(--accent,#b3261e)}

.cookie-bar{position:fixed; left:16px; right:16px; bottom:16px; z-index:60;
  display:flex; align-items:center; gap:16px; flex-wrap:wrap; justify-content:space-between;
  max-width:1120px; margin:0 auto; padding:14px 18px; border:1px solid var(--line);
  border-radius:var(--r); background:#fff; box-shadow:0 12px 34px rgba(16,20,28,.16);
  font-size:13.5px; line-height:1.5}
.cookie-bar[hidden]{display:none}
.cookie-bar a{color:inherit; text-decoration:underline; text-underline-offset:2px}
.cookie-bar .btn{flex:none}

/* ------------------------------------------------------- ЮРДОКУМЕНТЫ */
.legal{max-width:78ch; margin:0 auto 56px; font-size:15.5px; line-height:1.65}
.legal h2{margin:30px 0 10px; font-size:19px}
.legal p{margin:0 0 12px}
.legal ul{margin:0 0 14px; padding-left:20px}
.legal li{margin-bottom:6px}
.legal a{color:var(--accent,#b3261e)}
.foot-legal{display:flex; flex-direction:column; gap:6px; margin-top:14px; font-size:12.5px}
@media (max-width:640px){
  .cookie-bar{left:10px; right:10px; bottom:10px; padding:12px 14px}
  .cookie-bar .btn{width:100%; justify-content:center}
}
.cookie-actions{display:flex; gap:10px; flex:none}
@media (max-width:640px){
  .cookie-actions{width:100%}
  .cookie-actions .btn{flex:1; justify-content:center; width:auto}
}