/* ==== FAB-гамбургер как в примере (красная круглая) ==== */
.menu-button.menu-button--fab{
  /* размеры/позиция */
  width: 60px;
  height: 60px;
  right: 14px;
  top: 14px;

  /* фон и форма */
  background: #C82647 !important;          /* красный как в примере */
  background-image: none !important;        /* убираем старые 3 линии-фоны */
  border: 0;
  border-radius: 50% !important;
  box-shadow: 0 6px 18px rgba(200,38,71,.35);

  /* центрируем «бургер» внутри */
  display: flex;
  align-items: center;
  justify-content: center;

  /* плавность */
  transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease;
  -webkit-tap-highlight-color: transparent;
}
.menu-button.menu-button--fab:hover{ filter: brightness(1.05); }
.menu-button.menu-button--fab:active{ transform: scale(.98); }
.menu-button.menu-button--fab:focus-visible{
  outline: 2px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(200,38,71,.45);
}

/* рисуем три полоски — одна span + две псевдо */
.menu-button--fab .menu-button__bars{
  position: relative;
  width: 26px;
  height: 2px;
  background:#fff;
  border-radius: 2px;
  transition: transform .25s ease, opacity .25s ease, background-color .25s ease;
}
.menu-button--fab .menu-button__bars::before,
.menu-button--fab .menu-button__bars::after{
  content:"";
  position:absolute;
  left:0;
  width:100%;
  height:2px;
  background:#fff;
  border-radius:2px;
  transition: transform .25s ease, top .25s ease, bottom .25s ease;
}
.menu-button--fab .menu-button__bars::before{ top:-8px; }
.menu-button--fab .menu-button__bars::after { bottom:-8px; }

/* состояние «открыто» — крестик */
.menu-button.menu-button--fab.active{ background:#ad1f3e; }
.menu-button--fab.active .menu-button__bars{ background:transparent; }
.menu-button--fab.active .menu-button__bars::before{
  top:0; transform: rotate(45deg);
}
.menu-button--fab.active .menu-button__bars::after{
  bottom:0; transform: rotate(-45deg);
}

/* выключаем старую внутреннюю разметку бургер-иконки, если она есть */
.menu-button--fab .icon-menu-burger{ display:none !important; }

/* чутка меньше на узких экранах */
@media (max-width: 991px){
  .menu-button.menu-button--fab{ width:56px; height:56px; right:12px; top:12px; }
  .menu-button--fab .menu-button__bars{ width:24px; }
}

/* уважение к reduced motion */
@media (prefers-reduced-motion: reduce){
  .menu-button--fab,
  .menu-button--fab .menu-button__bars,
  .menu-button--fab .menu-button__bars::before,
  .menu-button--fab .menu-button__bars::after{ transition:none !important; }
}

/* === БРЕНД-ЗЕЛЕНЫЙ как у .nav-pill === */
:root{
  --brand-green1: #42c95a; /* верх градиента */
  --brand-green2: #2ea94a; /* низ градиента */
}

/* Кнопка-бургер: цвет, позиция, поведение */
.menu-button.menu-button--fab{
  position: fixed;           /* фиксируем, чтобы не "уезжала" */
  right: 14px;
  top: 14px;
  z-index: 10050;
  width: 60px;
  height: 60px;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(180deg,var(--brand-green1),var(--brand-green2)) !important;
  box-shadow: 0 6px 18px rgba(46,169,74,.35);
  display: flex; align-items: center; justify-content: center;
  -webkit-tap-highlight-color: transparent;
  transition: background-color .25s ease, box-shadow .25s ease;
}

/* НЕ превращаемся в крест — полоски всегда бургер */
.menu-button--fab .menu-button__bars{
  position: relative;
  width: 26px; height: 2px;
  background:#fff; border-radius:2px;
  transition: none;
}
.menu-button--fab .menu-button__bars::before,
.menu-button--fab .menu-button__bars::after{
  content:""; position:absolute; left:0; width:100%; height:2px;
  background:#fff; border-radius:2px; transition: none;
}
.menu-button--fab .menu-button__bars::before{ top:-8px; }
.menu-button--fab .menu-button__bars::after { bottom:-8px; }

/* При активном состоянии — НИЧЕГО не меняем (иконка не крестик) */
.menu-button.menu-button--fab.active{
  background: linear-gradient(180deg,var(--brand-green1),var(--brand-green2)) !important;
  right: 14px !important; left: auto !important; transform: none !important;
}
.menu-button--fab.active .menu-button__bars{ background:#fff; }
.menu-button--fab.active .menu-button__bars::before{ top:-8px; transform:none; }
.menu-button--fab.active .menu-button__bars::after { bottom:-8px; transform:none; }

/* Чуть меньше на узких экранах */
@media (max-width: 991px){
  .menu-button.menu-button--fab{ width:56px; height:56px; right:12px; top:12px; }
  .menu-button--fab .menu-button__bars{ width:24px; }
}


/* Ссылки в мобильном меню — белые для контраста */
.mobile-menu .kids-menu a{ color:#fff !important; }
.mobile-menu .kids-menu li.here > a{ opacity: .9; }

/* На всякий: глушим старые эффекты из бандла, которые могли двигать кнопку */
.menu-button.menu-button--fab,
.menu-button.menu-button--fab.active{
  animation: none !important;
}

.search_btn .icon-search{ width:20px; height:20px; display:block; }
.search_btn{ color:#1f1f1f; }
.search_btn:hover{ color:#31c409; } /* зелёный при ховере */

/* Ленивая отрисовка секций ниже первого экрана (мобильный LCP) */
.section-inner ~ *{
  content-visibility: auto;
  contain-intrinsic-size: 800px; /* резервное место — без дёрганий */
}

@media (max-width: 991px){
  .header-img.visible-xs{ display:block !important; }
  .header-img.visible-xs img{ display:block; width:100%; height:auto; }
}

.yt-lite{position:relative;background:#000;cursor:pointer;display:block;contain:content}
.yt-lite::before{content:"";display:block;padding-top:56.25%}
.yt-lite>.thumb{position:absolute;inset:0;background-position:center;background-size:cover}
.yt-lite>.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:68px;height:48px;border:0;border-radius:14px;background:#f00;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 1px rgba(0,0,0,.3),0 0 0 1px rgba(255,255,255,.1) inset}
.yt-lite>.play::before{content:"";border-style:solid;border-width:10px 0 10px 16px;border-color:transparent transparent transparent #fff;margin-left:3px}
.yt-lite:hover>.play{filter:brightness(1.1)}

.contacts-template .header-type-1{ position:relative; z-index:10010; }
.contacts-template .mobile-menu-wrapper{ position:fixed; inset:0; z-index:10005; }
.contacts-template .overlay{ position:fixed; inset:0; z-index:10000; }
body.contacts-template.menu-open .map-inner,
body.contacts-template.menu-open .map-inner iframe{ pointer-events:none; }

/* отключить случайные stacking-context над шапкой на странице контактов */
body.contacts-template .header-type-1 { transform: none !important; filter: none !important; }

/* Поиск: скрыт по умолчанию, показывается при .active */
.header-search{ 
  display: none !important;
  visibility: hidden; opacity: 0; pointer-events: none;
  transition: opacity .2s ease;
  z-index: 10060; /* над шапкой/оверлеями */
}
.header-search.active{
  display: block !important;
  visibility: visible; opacity: 1; pointer-events: auto;
}

/* iOS: зелёный фокус у поля поиска */
.header-search input[type="search"]{
  -webkit-appearance: none; appearance: none;
  border:1px solid rgba(0,0,0,.15); border-radius:12px; box-shadow:none;
  caret-color:#27ae60;
}
.header-search input[type="search"]:focus{
  outline:none; border-color:#27ae60; box-shadow:0 0 0 3px rgba(39,174,96,.25);
}
.header-search input[type="search"]::-webkit-search-decoration,
.header-search input[type="search"]::-webkit-search-cancel-button{
  -webkit-appearance:none; appearance:none;
}

/* Убираем «линии» между пунктами мобильного меню (без ломания трансформаций) */
.mobile-menu .kids-menu{ margin:0; padding:0; }
.mobile-menu .kids-menu > li{
  border:0 !important;
  box-shadow:none !important;
  background:none !important;   /* если светлую полосу рисовал фон li */
  position:relative;
}
.mobile-menu .kids-menu > li + li{ margin-top:14px; }

/* если разделители рисовались псевдоэлементами — выключаем */
.mobile-menu .kids-menu > li::before,
.mobile-menu .kids-menu > li::after,
.mobile-menu .nav-pill::before,
.mobile-menu .nav-pill::after{
  content:none !important;
  display:none !important;
}

/* сама «пилюля» без лишних теней/обводок */
.mobile-menu .nav-pill{
  box-shadow:none !important;
  outline:none !important;
  background-clip:padding-box;
}

/* ВАЖНО: не трогаем transform у wrapper'а, чтобы не ломать open/close */
.mobile-menu-wrapper{
  /* можно подсказать браузеру, что блок будет анимироваться, без перезаписи transform */
  will-change: transform;
  -webkit-font-smoothing: antialiased;
}

/* Поиск: зеленая кнопка вместо синей (iOS/мобайл и десктоп) */
form[role="search"] button,
form[role="search"] input[type="submit"]{
  -webkit-appearance: none; /* убрать системный синий стиль iOS */
  appearance: none;
  background: linear-gradient(180deg,#42c95a,#2ea94a); /* бренд-зелёный */
  color:#fff;
  border:0;
  border-radius:12px;
  padding:10px 16px;
  font-weight:600;
  line-height:1.2;
  cursor:pointer;
}

form[role="search"] button:hover,
form[role="search"] input[type="submit"]:hover{ filter:brightness(0.95); }

form[role="search"] button:active,
form[role="search"] input[type="submit"]:active{ filter:brightness(0.9); }

form[role="search"] button:focus,
form[role="search"] input[type="submit"]:focus{
  outline:none;
  box-shadow:0 0 0 3px rgba(46,169,74,.25);
}

/* Чтобы и обводка поля была зелёной, а не синей */
form[role="search"] input[type="search"]:focus{
  border-color:#2ea94a;
  box-shadow:0 0 0 3px rgba(46,169,74,.25);
  outline:none;
}

