/* ============================================================
   Шапка «матовое стекло» — Центр Содействие
   Состояния (JS пишет data-state на .hd):
     top       — страница вверху: стекло почти прозрачное, без тени
     scrolled  — стекло плотнее, высота 72 → 60, мягкая тень
     hidden    — прокрутка вниз: шапка уезжает; вверх — возвращается
   ============================================================ */
.hd{--hd-ease:cubic-bezier(.22,1,.36,1);--hd-h:72px;--hd-r:24px;
    --hd-glass:rgba(255,255,255,.55);--hd-blur:14px;
    --hd-edge:inset 0 1px 0 rgba(255,255,255,.6);
    --hd-shadow:0 0 0 0 transparent;
    display:contents;font-family:var(--font-onest)}
.hd-in{position:relative}
.hd[data-state="scrolled"],.hd[data-state="hidden"],.hd.is-menu{--hd-h:60px;--hd-glass:rgba(255,255,255,.72);--hd-blur:22px;
    --hd-edge:inset 0 1px 0 rgba(255,255,255,.75),inset 0 0 0 1px rgba(255,255,255,.28);
    --hd-shadow:0 1px 1px rgba(39,49,74,.04),0 12px 32px -14px rgba(39,49,74,.22)}

/* ---------- верхняя строка: уезжает вместе со страницей ---------- */
.hd-top{display:flex;align-items:center;gap:18px;height:44px;white-space:nowrap;font-size:13px;color:var(--gray-dark)}
.hd-top a{transition:color .15s}
.hd-top a:hover{color:var(--blue-dark)}
.hd-top .sp{flex:1}
.hd-geo{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--blue-dark)}
.hd-geo svg{width:14px;height:14px;color:var(--pink)}
.hd-top .addr{color:var(--gray-dark)}
.hd-top .pro{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:var(--pink-soft);color:var(--pink-dark);font-weight:600}
.hd-top .pro:hover{color:var(--pink-dark);background:#f8dbe4}
.hd-top .ic{display:inline-flex;align-items:center;gap:6px}
.hd-top .ic svg{width:16px;height:16px}
.hd-top .cart b{min-width:18px;height:18px;border-radius:9px;background:var(--blue-dark);color:#fff;font-size:11px;display:inline-grid;place-items:center;padding:0 5px}
.hd-top .div{width:1px;height:14px;background:var(--line)}

/* ---------- липкая «капсула» ---------- */
.hd-stick{position:sticky;top:0;z-index:41;padding-top:10px;transition:transform .45s var(--hd-ease)}
.hd[data-state="hidden"] .hd-stick{transform:translateY(calc(-100% - 12px))}
.hd-bar{position:relative;display:flex;align-items:center;gap:4px;height:var(--hd-h);padding:0 8px 0 18px;border-radius:var(--hd-r);
  background:var(--hd-glass);-webkit-backdrop-filter:blur(var(--hd-blur)) saturate(180%);backdrop-filter:blur(var(--hd-blur)) saturate(180%);
  box-shadow:var(--hd-edge),var(--hd-shadow);min-width:0;
  transition:height .4s var(--hd-ease),background-color .3s linear,box-shadow .4s var(--hd-ease),border-radius .4s var(--hd-ease)}
.hd.is-menu .hd-bar{border-bottom-left-radius:10px;border-bottom-right-radius:10px}
.hd-logo{display:block;flex:none;transition:transform .4s var(--hd-ease);transform-origin:left center}
.hd-logo img{display:block;width:147px;height:48px}
.hd[data-state="scrolled"] .hd-logo,.hd.is-menu .hd-logo{transform:scale(.86)}

/* навигация со «скользящей» подложкой */
.hd-nav{position:relative;display:flex;align-items:center;gap:0;margin:0 0 0 4px;padding:0;list-style:none;flex:0 1 auto;min-width:0}
.hd-ind{position:absolute;left:0;top:50%;height:40px;width:0;border-radius:12px;background:rgba(39,49,74,.06);transform:translate(var(--x,0),-50%);opacity:0;
  transition:transform .35s var(--hd-ease),width .35s var(--hd-ease),opacity .2s linear;pointer-events:none}
.hd-nav.has-ind .hd-ind{opacity:1}
.hd-link{all:unset;box-sizing:border-box;position:relative;z-index:1;cursor:pointer;display:inline-flex;align-items:center;gap:5px;height:40px;padding:0 10px;border-radius:12px;font-size:15px;font-weight:500;color:var(--blue-dark);white-space:nowrap}
.hd-link:focus-visible{outline:2px solid var(--pink);outline-offset:2px}
.hd-link.is-active{font-weight:600}
.hd-link.is-active::after{content:"";position:absolute;left:50%;bottom:4px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--pink)}
.hd-link .chev{width:12px;height:12px;transition:transform .3s var(--hd-ease);opacity:.6}
.hd.is-menu .hd-link[aria-expanded="true"] .chev{transform:rotate(180deg)}
.hd-bar .sp{flex:1}

/* -------- поиск: кнопка → разворот на место меню -------- */
.hd-search-slot{position:relative;display:flex;align-items:center;flex:none;min-width:0;transition:flex .45s var(--hd-ease)}
.hd-search{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 6px 0 12px;border-radius:12px;color:var(--gray-dark);font-size:14px;transition:background-color .2s,opacity .25s,transform .35s var(--hd-ease)}
.hd-search:hover{background:rgba(39,49,74,.06);color:var(--blue-dark)}
.hd-search svg{flex:none;width:17px;height:17px}
.hd-search kbd{white-space:nowrap;font:600 11px var(--font-onest);color:var(--gray-dark);background:rgba(255,255,255,.8);box-shadow:inset 0 0 0 1px var(--line);border-radius:7px;padding:3px 6px}
.hd-search-panel{display:none;align-items:center;gap:10px;flex:1;min-width:0;height:44px;padding:0 8px 0 14px;border-radius:14px;background:rgba(39,49,74,.06);box-shadow:inset 0 0 0 1px rgba(39,49,74,.08);opacity:0;transform:translateX(12px) scale(.98);pointer-events:none}
.hd-search-panel__ico{flex:none;width:18px;height:18px;color:var(--gray-dark)}
.hd-search-panel__input{all:unset;box-sizing:border-box;flex:1;min-width:0;height:100%;font:500 15px/1.2 var(--font-onest);color:var(--blue-dark)}
.hd-search-panel__input::placeholder{color:var(--gray-dark);opacity:.85}
.hd-search-panel__close{all:unset;box-sizing:border-box;cursor:pointer;flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--blue-dark)}
.hd-search-panel__close:hover{background:rgba(39,49,74,.08)}
.hd-search-panel__kbd{flex:none;font:600 11px var(--font-onest);color:var(--gray-dark);background:rgba(255,255,255,.85);box-shadow:inset 0 0 0 1px var(--line);border-radius:7px;padding:3px 6px}
.hd.is-search .hd-search-slot{flex:1 1 auto}
.hd.is-search .hd-search{opacity:0;transform:scale(.92);pointer-events:none;position:absolute;visibility:hidden}
.hd.is-search .hd-search-panel{display:flex;opacity:1;transform:none;pointer-events:auto;transition:opacity .28s linear,transform .45s var(--hd-ease)}
.hd.is-search .hd-nav{flex:0 0 0;width:0;min-width:0;margin:0;opacity:0;overflow:hidden;pointer-events:none;transition:opacity .2s linear,flex .45s var(--hd-ease),width .45s var(--hd-ease),margin .45s var(--hd-ease)}
.hd.is-search .hd-bar .sp{flex:0 0 8px}
.hd-tel{display:grid;padding:0 12px;line-height:1.15;white-space:nowrap}
.hd-tel b{font-size:15px;font-weight:700;color:var(--blue-dark)}
.hd-tel span{font-size:12px;color:var(--gray-dark);display:flex;align-items:center;gap:5px}
.hd-tel span::before{content:"";width:6px;height:6px;border-radius:50%;background:#3fbf7f}
.hd-cta,.hd a.hd-cta{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:14px;background:var(--pink);color:#fff !important;font-weight:700;font-size:15px;white-space:nowrap;text-decoration:none;transition:background-color .2s,height .4s var(--hd-ease)}
.hd-cta:hover,.hd a.hd-cta:hover{background:var(--pink-dark);color:#fff !important}
.hd-cta svg,.hd a.hd-cta svg{flex:none;width:16px;height:16px;color:#fff;transition:transform .3s var(--hd-ease)}
.hd-cta:hover svg,.hd a.hd-cta:hover svg{transform:translateX(3px)}
.hd-cta:focus-visible,.hd a.hd-cta:focus-visible{outline:2px solid var(--pink);outline-offset:3px}

/* прогресс чтения — тонкая линия по нижней кромке стекла */
.hd-prog{position:absolute;left:18px;right:18px;bottom:0;height:2px;border-radius:2px;overflow:hidden;opacity:0;transition:opacity .3s}
.hd[data-state="scrolled"] .hd-prog{opacity:1}
.hd-prog i{display:block;height:100%;width:100%;background:var(--pink);transform-origin:left;transform:scaleX(var(--p,0))}

/* ---------- мега-меню «Услуги» / «О нас» ---------- */
.hd-mega{
  position:absolute;left:var(--hd-pad,32px);right:var(--hd-pad,32px);top:calc(100% + 6px);z-index:42;
  display:none;grid-template-columns:1.25fr 1fr .9fr;gap:8px;padding:8px;border-radius:10px 10px var(--hd-r) var(--hd-r);
  background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 24px 60px -20px rgba(39,49,74,.3);
  opacity:0;transform:translateY(-6px);transform-origin:top center;
  transition:opacity .2s linear,transform .35s var(--hd-ease)
}
.hd-mega--about{grid-template-columns:1.35fr .9fr}
.hd.is-menu .hd-mega.is-open{
  display:grid;opacity:1;transform:none;
  animation:hd-mega-in .35s var(--hd-ease) both
}
@keyframes hd-mega-in{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:none}
}
.hd-col{border-radius:18px;padding:16px}
.hd-col h4{margin:0 0 10px 8px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gray-dark)}
.hd-fmt{display:flex;gap:14px;align-items:flex-start;padding:10px 8px;border-radius:14px;transition:background-color .2s}
.hd-fmt:hover{background:rgba(39,49,74,.05)}
.hd-fmt .i{flex:none;width:40px;height:40px;border-radius:12px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;color:var(--pink-dark);transition:background-color .2s,color .2s}
.hd-fmt:hover .i{background:var(--pink);color:#fff;box-shadow:none}
.hd-fmt .i svg{width:20px;height:20px}
.hd-fmt b{display:block;font-size:15px;font-weight:600;line-height:20px}
.hd-fmt small{display:block;font-size:13px;line-height:18px;color:var(--gray-dark);margin-top:2px}
.hd-sit{display:grid;gap:2px}
.hd-sit a{display:flex;align-items:center;justify-content:space-between;height:40px;padding:0 10px;border-radius:12px;font-size:15px;font-weight:500;transition:background-color .2s,color .2s}
.hd-sit a svg{width:16px;height:16px;opacity:0;transform:translateX(-4px);transition:.25s var(--hd-ease);color:var(--pink-dark)}
.hd-sit a:hover{background:rgba(39,49,74,.05);color:var(--pink-dark)}
.hd-sit a:hover svg{opacity:1;transform:none}
.hd-promo{position:relative;overflow:hidden;background:var(--blush);display:flex;flex-direction:column;gap:6px}
.hd-promo svg.h{position:absolute;right:-30px;bottom:-40px;width:180px;fill:#fff}
.hd-promo b{position:relative;font-family:var(--font-montserrat);font-weight:700;font-size:22px;line-height:26px;letter-spacing:-.02em}
.hd-promo p{position:relative;margin:0;font-size:14px;line-height:20px;color:var(--gray-dark)}
.hd-promo .facts{position:relative;display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 auto}
.hd-promo .facts span{height:28px;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.8);font-size:12px;font-weight:600;display:inline-flex;align-items:center}
.hd-promo .hd-cta{position:relative;align-self:flex-start;margin-top:16px}
.hd-mega a{color:inherit;text-decoration:none}

/* стеклянная подложка под мега-меню: затемнение страницы */
.hd-scrim{position:fixed;inset:0;z-index:39;background:rgba(39,49,74,.18);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s}
.hd.is-menu~.hd-scrim,.hd.is-sheet~.hd-scrim{opacity:1;visibility:visible;transition:opacity .3s}

/* ---------- бургер и мобильный лист ---------- */
.hd-burger{
  all:unset;box-sizing:border-box;cursor:pointer;display:none;
  flex:none;align-items:center;justify-content:center;
  width:44px;height:44px;min-width:44px;margin-left:2px;padding:0;border-radius:14px;
  background:rgba(255,255,255,.55);
  box-shadow:inset 0 0 0 1px rgba(39,49,74,.08),0 1px 2px rgba(39,49,74,.04);
  color:var(--blue-dark);
  transition:background-color .25s var(--hd-ease),box-shadow .25s var(--hd-ease),color .25s var(--hd-ease),transform .2s var(--hd-ease);
  -webkit-tap-highlight-color:transparent
}
.hd-burger:hover{
  background:rgba(255,255,255,.85);
  box-shadow:inset 0 0 0 1px rgba(39,49,74,.12),0 2px 8px rgba(39,49,74,.08)
}
.hd-burger:active{transform:scale(.96)}
.hd-burger:focus-visible{outline:2px solid var(--pink);outline-offset:2px}
.hd-burger__box{
  position:relative;display:block;width:18px;height:12px;pointer-events:none
}
.hd-burger__line{
  position:absolute;left:0;height:2px;border-radius:999px;
  background:currentColor;transform-origin:center;
  transition:transform .45s var(--hd-ease),opacity .2s linear,width .35s var(--hd-ease),top .45s var(--hd-ease),left .35s var(--hd-ease),right .35s var(--hd-ease)
}
.hd-burger__line:nth-child(1){top:0;width:18px}
.hd-burger__line:nth-child(2){top:5px;width:12px;right:0;left:auto}
.hd-burger__line:nth-child(3){top:10px;width:18px}
.hd-burger:hover .hd-burger__line:nth-child(2){width:18px}
.hd.is-sheet .hd-burger{
  background:rgba(209,67,109,.12);
  box-shadow:inset 0 0 0 1px rgba(209,67,109,.22),0 1px 2px rgba(209,67,109,.08);
  color:var(--pink-dark)
}
.hd.is-sheet .hd-burger__line:nth-child(1){top:5px;width:18px;transform:rotate(45deg)}
.hd.is-sheet .hd-burger__line:nth-child(2){opacity:0;width:18px;transform:scaleX(.4)}
.hd.is-sheet .hd-burger__line:nth-child(3){top:5px;width:18px;transform:rotate(-45deg)}

.hd-sheet{display:none}
@media (max-width:1360px){
  .hd-top .addr{display:none}
  .hd-nav .hd-link--articles{display:none}
}
@media (max-width:1280px){
  .hd-link{padding:0 8px;font-size:14px}
  .hd-tel{padding:0 8px}
  .hd-tel b{font-size:14px}
  .hd-cta,.hd a.hd-cta{padding:0 14px;font-size:14px}
}
@media (max-width:1180px){
  .hd-top .div.a{display:none}
  .hd-search .t{display:none}
  .hd-tel{display:none}
}
@media (max-width:960px){
  .hd{--hd-pad:20px}
  .hd-top{display:none}
  .hd-nav,.hd-search-slot,.hd-search-form{display:none}
  /* важно: .hd a.hd-cta выше по specificity, чем .hd-bar > .hd-cta */
  .hd .hd-bar > a.hd-cta{display:none !important}
  .hd-burger{display:inline-flex}
  .hd-mega,.hd.is-menu .hd-mega.is-open{display:none !important}
  .hd.is-search .hd-nav{display:none}
  .hd-sheet{display:block;position:absolute;left:var(--hd-pad,20px);right:var(--hd-pad,20px);top:calc(100% + 6px);max-height:calc(100dvh - 100px);overflow:auto;border-radius:10px 10px var(--hd-r) var(--hd-r);padding:8px;
    background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(24px) saturate(180%);backdrop-filter:blur(24px) saturate(180%);
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.7),0 24px 60px -20px rgba(39,49,74,.3);
    opacity:0;visibility:hidden;clip-path:inset(0 0 100% 0 round 24px);transition:opacity .2s,clip-path .45s var(--hd-ease),visibility 0s .45s}
  .hd.is-sheet .hd-sheet{opacity:1;visibility:visible;clip-path:inset(0 0 0 0 round 24px);transition:opacity .2s,clip-path .45s var(--hd-ease)}
  .hd.is-sheet .hd-bar{border-bottom-left-radius:10px;border-bottom-right-radius:10px;--hd-glass:rgba(255,255,255,.86)}
  .hd-sheet .grp{padding:8px 8px 12px}
  .hd-sheet .grp+.grp{border-top:1px solid rgba(39,49,74,.07)}
  .hd-sheet h4{margin:6px 8px 6px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gray-dark)}
  .hd-sheet .big a{display:flex;align-items:center;justify-content:space-between;height:52px;padding:0 10px;border-radius:14px;font-family:var(--font-montserrat);font-weight:700;font-size:20px;letter-spacing:-.02em;color:var(--blue-dark);text-decoration:none}
  .hd-sheet .big a svg{width:18px;height:18px;color:var(--pink-dark)}
  .hd-sheet .fmts{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .hd-sheet .fmts a{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;background:rgba(255,255,255,.7);box-shadow:inset 0 0 0 1px var(--line);font-size:14px;font-weight:600;color:var(--blue-dark);text-decoration:none}
  .hd-sheet .fmts svg{width:18px;height:18px;color:var(--pink-dark);flex:none}
  .hd-sheet .small{display:flex;flex-wrap:wrap;gap:6px}
  .hd-sheet .small a{height:36px;padding:0 12px;border-radius:999px;background:rgba(39,49,74,.05);display:inline-flex;align-items:center;font-size:14px;color:var(--blue-dark);text-decoration:none}
  .hd-sheet .small a.pro{background:var(--pink-soft);color:var(--pink-dark);font-weight:600}
  .hd-sheet .small button{all:unset;cursor:pointer;height:36px;padding:0 12px;border-radius:999px;background:rgba(39,49,74,.05);display:inline-flex;align-items:center;font-size:14px;color:var(--blue-dark)}
  .hd-sheet .contact{display:flex;gap:8px;padding:8px}
  .hd-sheet .contact a{flex:1;justify-content:center}
  .hd-sheet .tel2{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;height:48px;border-radius:14px;background:rgba(39,49,74,.06);font-weight:700;font-size:15px;color:var(--blue-dark)}
  .hd-sheet .contact .hd-cta{height:48px}
}
@media (max-width:640px){
  .hd{--hd-h:60px;--hd-r:20px;--hd-pad:16px}
  .hd[data-state="scrolled"],.hd[data-state="hidden"]{--hd-h:56px}
  .hd-stick{padding-top:8px}
  .hd-bar{padding:0 6px 0 12px}
  .hd-logo img{width:122px;height:40px}
  .hd-burger{width:42px;height:42px;min-width:42px;border-radius:13px}
  .hd-sheet .fmts{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.hd *,.hd-stick,.hd-bar{transition:none!important}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .hd{--hd-glass:rgba(255,255,255,.96)}
}

/* якоря не прячутся под шапкой */
section[id],div[id="situations"],div[id="sd-proc"],div[id="sd-app"],#podbor,#app,#sd-app,#formats,#news,#reviews{scroll-margin-top:96px}

/* пока открыт лист или мега-меню — плавающий помощник уходит */
html:has(.hd.is-sheet) .sa,html:has(.hd.is-menu) .sa{opacity:0;pointer-events:none;transition:opacity .2s}

/* --- site-wide Bitrix hooks --- */
.hd-top .cart { position: relative; }
.hd-top .cart .header__cart-badge,
.hd-top .cart [data-header-basket-badge] {
  position: absolute;
  top: -6px;
  right: -10px;
  min-width: 18px;
  height: 18px;
  border-radius: 9px;
  background: var(--blue-dark);
  color: #fff;
  font-size: 11px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  font-weight: 700;
  line-height: 1;
}
.hd-top .cart [data-header-basket-badge][hidden] { display: none !important; }

.hd-login-wrap { position: relative; display: inline-flex; }
.hd-login-drop {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  min-width: 160px;
  padding: 8px;
  border-radius: 14px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 12px 32px -10px rgba(39,49,74,.25);
  z-index: 50;
}
.hd-login-wrap:hover .hd-login-drop,
.hd-login-wrap:focus-within .hd-login-drop { display: block; }
.hd-login-drop a {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--blue-dark);
  text-decoration: none;
}
.hd-login-drop a:hover { background: rgba(39,49,74,.06); }

/* Поиск в зоне каталога — форма вместо кнопки */
.hd-search-form {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  background: rgba(39,49,74,.06);
  margin: 0;
}
.hd-search-form input {
  border: 0;
  background: transparent;
  outline: none;
  width: 140px;
  font: 500 14px var(--font-onest);
  color: var(--blue-dark);
}
.hd-search-form input::placeholder { color: var(--gray-dark); }
@media (max-width: 1180px) {
  .hd-search-form input { width: 100px; }
}
@media (max-width: 960px) {
  .hd-search-form { display: none; }
}

.hd a:not(.hd-cta) { color: inherit; text-decoration: none; }
.hd button.hd-geo,
.hd button.hd-link,
.hd button.hd-search,
.hd button.hd-burger,
.hd a.hd-cta { font-family: inherit; }

/* sticky: Bitrix .wrapper { overflow-y: hidden } ломает position:sticky */
body:has(header.hd) .wrapper {
  overflow-x: clip;
  overflow-y: visible;
}
.hd-stick {
  --hd-pad: 32px;
  position: sticky;
  top: 0;
  z-index: 41;
}
@media (max-width: 960px) { .hd-stick { --hd-pad: 20px; } }
@media (max-width: 640px) { .hd-stick { --hd-pad: 16px; } }

.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}