/* v3 · шапка (из header.js шаблонов) */
.sh { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 40; background: #000; border-bottom: 1px solid #24281f; font-family: "Roboto", Arial, sans-serif; }
.sh.is-open { background: #000; }
.sh__in { display: flex; align-items: center; gap: 24px; height: 72px; padding-inline: clamp(16px, 3vw, 48px); }
.sh__logo img { display: block; height: 40px; width: auto; }
.sh__nav { margin-left: auto; }
.sh__nav > ul { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
.sh__top { display: inline-flex; align-items: center; gap: 6px; height: 72px; padding: 0 10px; font: 400 15px/1 "Roboto", Arial, sans-serif; color: #e4e6e1; text-decoration: none; background: none; border: 0; cursor: pointer; white-space: nowrap; }
.sh__top:hover, .sh__item.is-active > .sh__top, .sh__top[aria-current] { color: #80d207; }
.sh__top svg { width: 10px; height: 10px; transition: transform .2s; }
.sh__item.is-active > .sh__top svg { transform: rotate(180deg); }
.sh__panel { position: fixed; left: 0; right: 0; top: calc(72px + env(safe-area-inset-top, 0px)); display: none; background: #000; border-top: 1px solid #24281f; border-bottom: 1px solid #24281f; box-shadow: 0 24px 48px rgba(0,0,0,.6); padding: 48px clamp(16px, 3vw, 48px) 40px; }
.sh__item.is-active > .sh__panel { display: block; }
.sh__panel-in { position: relative; max-width: 1600px; margin: 0 auto; min-height: 180px; padding-right: 220px; }
.sh__cols { column-width: 260px; column-gap: 56px; }
.sh__group { break-inside: avoid; margin-bottom: 18px; }
.sh__gt { display: inline-block; font: 500 18px/1.3 "Oswald", Arial, sans-serif; text-transform: uppercase; color: #fff; text-decoration: none; }
.sh__gt:hover { color: #80d207; }
.sh__group ul { list-style: none; margin: 10px 0 6px; padding: 0; display: grid; gap: 8px; }
.sh__group li a { font-size: 15px; line-height: 1.35; color: #9a9f94; text-decoration: none; }
.sh__group li a:hover { color: #80d207; }
.sh__cta-round { position: absolute; right: 0; bottom: 0; display: grid; place-items: center; width: 160px; height: 160px; border-radius: 50%; background: #80d207; color: #0a0d05; text-align: center; text-decoration: none; font: 500 22px/1.1 "Oswald", Arial, sans-serif; text-transform: uppercase; padding: 0 28px; transition: transform .3s; }
.sh__cta-round:hover { transform: scale(1.06); }
.sh__right { display: flex; align-items: center; gap: 18px; }
.sh__socials { display: flex; gap: 10px; }
.sh__socials img { display: block; width: 24px; height: 24px; }
.sh__phone { font: 500 16px/1 "Roboto", Arial, sans-serif; color: #fff; text-decoration: none; white-space: nowrap; }
.sh__phone span { color: #80d207; }
.sh__btn { font: 500 13px/1 "Oswald", Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #0a0d05; background: #80d207; border-radius: 40px; padding: 12px 20px; text-decoration: none; white-space: nowrap; }
.sh__btn:hover { background: #95e81c; }
.sh__lang { font: 500 14px/1 "Oswald", Arial, sans-serif; letter-spacing: .06em; color: #e4e6e1; text-decoration: none; }
.sh__lang:hover { color: #80d207; }
.sh__burger { display: none; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; position: relative; }
.sh__burger span, .sh__burger span::before, .sh__burger span::after { position: absolute; left: 10px; width: 24px; height: 2px; background: #80d207; transition: transform .25s, top .25s, opacity .2s; content: ""; }
.sh__burger span { top: 21px; }
.sh__burger span::before { left: 0; top: -7px; }
.sh__burger span::after { left: 0; top: 7px; }
.sh.is-open .sh__burger span { background: transparent; }
.sh.is-open .sh__burger span::before { top: 0; transform: rotate(45deg); }
.sh.is-open .sh__burger span::after { top: 0; transform: rotate(-45deg); }
.sh a:focus-visible, .sh button:focus-visible { outline: 2px solid #80d207; outline-offset: 3px; }

/* Меню-«бургер» */
.sh__drop { display: none; position: fixed; left: 0; right: 0; top: calc(72px + env(safe-area-inset-top, 0px)); bottom: 0; overflow-y: auto; background: #000; border-top: 1px solid #24281f; padding: 16px clamp(16px, 3vw, 48px) calc(32px + env(safe-area-inset-bottom, 0px)); }
.sh.is-open .sh__drop { display: block; }
.sh__dlist { list-style: none; margin: 0; padding: 0; max-width: 1100px; }
.sh__dlist > li { border-bottom: 1px solid #24281f; }
.sh__dtop { display: flex; width: 100%; align-items: center; justify-content: space-between; padding: 18px 0; font: 500 24px/1.1 "Oswald", Arial, sans-serif; text-transform: uppercase; color: #fff; text-decoration: none; background: none; border: 0; cursor: pointer; text-align: left; }
.sh__dtop:hover { color: #80d207; }
.sh__dtop svg { width: 14px; height: 14px; transition: transform .25s; flex: none; }
.sh__dtop[aria-expanded="true"] svg { transform: rotate(180deg); }
.sh__dtop[aria-expanded="true"] { color: #80d207; }
.sh__dsub { display: none; padding: 0 0 20px; columns: 3 240px; column-gap: 40px; }
.sh__dsub.is-open { display: block; }
.sh__dsub .sh__group { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.sh__dsub .sh__gt { font: 400 17px/1.35 "Roboto", Arial, sans-serif; text-transform: none; color: #e4e6e1; padding: 4px 0; }
.sh__dsub .sh__group ul { grid-column: 1 / -1; margin: 6px 0 4px 14px; }
.sh__gtoggle { display: none; width: 36px; height: 36px; border: 0; background: none; cursor: pointer; color: #80d207; }
.sh__gtoggle svg { width: 12px; height: 12px; transition: transform .25s; }
.sh__gtoggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.sh__dfoot { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; padding-top: 24px; }
.sh__dfoot .sh__phone { font-size: 20px; }

@media (max-width: 1679px) { .sh__nav { display: none; } .sh__burger { display: block; } .sh__right { margin-left: auto; } }
@media (max-width: 900px) { .sh__socials, .sh__lang, .sh__right .sh__btn { display: none; } }
@media (max-width: 560px) { .sh__right .sh__phone { display: none; } .sh__in { height: 64px; } .sh__logo img { height: 34px; } .sh__drop { top: calc(64px + env(safe-area-inset-top, 0px)); } }
@media (max-width: 768px) {
  .sh__dsub { columns: 1; }
  .sh__gtoggle { display: grid; place-items: center; }
  .sh__dsub .sh__group > ul { display: none; }
  .sh__dsub .sh__group.is-open > ul { display: grid; }
}
@media (min-width: 769px) { .sh__dsub .sh__group > ul { display: grid; } }
@media (prefers-reduced-motion: reduce) { .sh * { transition: none !important; } }
body.sh-lock { overflow: hidden; }

/* Иконки соцсетей — инлайн-SVG с currentColor, чтобы при наведении красились в акцент
   (в шаблоне это были img, их цвет из CSS не поменять). */
.sh__socials a { display: block; color: #fff; transition: color .2s; }
.sh__socials a:hover, .sh__socials a:focus-visible { color: #80d207; }
.sh__socials svg { display: block; width: 24px; height: 24px; }
/* Выше .sh__socials прячутся до 900px — в мобильном меню иконки должны остаться. */
@media (max-width: 900px) { .sh__dfoot .sh__socials { display: flex; } }
@media (prefers-reduced-motion: reduce) { .sh__socials a { transition: none; } }

/* Шапка подключается и на страницы старого дизайна — без base.css v3. Всё, что ей нужно, — здесь:
   рамки по border-box и отступ под липкую шапку при переходе к якорю. */
.sh, .sh *, .sf, .sf * { box-sizing: border-box; }
html { scroll-padding-top: 96px; }
/* Старая шапка была position: fixed, и страницы старого дизайна держат под неё отступ сверху.
   Липкая шапка заняла бы место в потоке и удвоила его. */
body:not(.v3) .sh { position: fixed; left: 0; right: 0; top: 0; }
