/* ===== Header (локальный) ===== */
.header{background:#fff;border-bottom:1px solid var(--stroke,#eef2f7);position:relative;z-index:50}
.header .header__container{width:min(1200px,100% - 32px);margin-inline:auto}
.header .header__row{display:flex;align-items:center;min-height:105px}
/* ЛОГО слева, всё остальное — вправо и выстраивается влево через gap:72 */
.header .header__stack{
margin-left:auto;
display:flex;align-items:center;gap:72px;
}
/* Меню (внутри меню свои 28px между пунктами) */
.header .header__menu{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.header .header__menu > li > a,
.header .header__acc{
position:relative;display:inline-flex;align-items:center;gap:8px;
font-size:16px;font-weight:400;color:var(--text-900,#4A4545);
padding:0;text-decoration:none;
}
/* жёлтая линия 10px ниже пункта */
.header .header__menu > li > a::before,
.header .header__acc::before{
content:"";position:absolute;left:0;bottom:-10px;width:0;height:3px;background:#EEC024;border-radius:3px;
transform-origin:left center;transition:width .18s ease;
}
.header .header__menu > li > a:hover::before,
.header .header__menu > li.current-menu-item > a::before,
.header .header__acc:hover::before{width:100%}
.header .header__menu > li.menu-item--live > a{
display:inline-flex;
align-items:center;
gap:10px;
}
.header__menu-link--live{
display:inline-flex;
align-items:center;
gap:10px;
}
.header__live-dot{
width:10px;
height:10px;
border-radius:50%;
background:#34d399;
box-shadow:0 0 0 0 rgba(52,211,153,.6);
animation:headerLivePulse 1.4s ease-in-out infinite;
}
.header__live-label{
display:inline-flex;
align-items:center;
gap:6px;
}
@keyframes headerLivePulse{
0%{box-shadow:0 0 0 0 rgba(52,211,153,.6);}
70%{box-shadow:0 0 0 12px rgba(52,211,153,0);}
100%{box-shadow:0 0 0 0 rgba(52,211,153,0);}
}
/* ЛК как пункт меню: иконка слева (16x18) */
.header .header__acc{padding-left:26px}
.header .header__acc::after{
content:"";
position:absolute;
left:0; top:50%;
transform:translateY(-50%);
width:19px; height:20px;
background:no-repeat center/contain url("data:image/svg+xml;utf8,");
opacity:.95;
}
/* Кнопка языка и флаги */
.header .header__langbox{position:relative}
.header .header__langbtn{
width:22.5px;height:22.5px;border-radius:50%;overflow:hidden;
display:inline-flex;align-items:center;justify-content:center;
background:transparent;border:0;padding:0;cursor:pointer
}
.header .header__flag{
display:block;width:22.5px;height:22.5px;border-radius:50%;
background-repeat:no-repeat;background-position:center;background-size:cover;
}
/* RU (ровно как прислал) */
.header .header__flag--ru{
background-image:url('data:image/svg+xml;utf8,');
}
/* EN (ровно как прислал) */
.header .header__flag--en{
background-image:url('data:image/svg+xml;utf8,');
}
/* выпадающий список */
.header .header__langlist{
position:absolute;right:0;top:calc(100% + 8px);
background:#fff;border:1px solid var(--stroke,#EEF2F7);border-radius:10px;
box-shadow:0 8px 30px rgba(0,0,0,.08);
padding:8px;display:none;min-width:44px
}
.header .header__langbox.is-open .header__langlist{display:block}
.header .header__langitem{width:28px;height:28px;border-radius:50%;overflow:hidden;display:block;margin:4px 0}
.header .header__langitem .header__flag{width:28px;height:28px}
/* Бургер кнопка - скрыта на десктопе */
.header__burger{
display:none;
}
/* Правая часть с ЛК и бургером (скрыто на десктопе) */
.header__right{
display:none;
}
/* Скрываем мобильные элементы на десктопе */
.header__acc-mobile{
display:none;
}
.header__nav-mobile{
display:none;
}
.header__mobile-wrapper{
display:none;
}
/* Показываем ЛК на десктопе */
.header__acc-desktop{
display:inline-flex;
}
/* Показываем меню на десктопе */
.header__nav{
display:block;
}
/* Мобайл */
@media (max-width:768px){
/* Показываем правую часть с ЛК и бургером */
.header__right{
display:flex;
align-items:center;
gap:8px;
margin-left:25%;
}
/* Показываем мобильный ЛК */
.header__acc-mobile{
display:inline-flex;
padding:0;
line-height:1.2;
gap:6px;
}
/* Скрываем десктопный ЛК */
.header__acc-desktop{
display:none;
}
/* Скрываем десктопное меню */
.header__nav{
display:none;
}
/* Показываем мобильное меню */
.header__nav-mobile{
display:block;
}
.header__mobile-wrapper{
display:block;
}
/* Фиксируем хедер */
.header{
position:relative;
z-index:50;
}
/* Бургер кнопка */
.header__burger{
display:flex;
flex-direction:column;
gap:6px;
background:transparent;
border:0;
padding:8px 4px;
cursor:pointer;
position:relative;
z-index:51;
}
.header__burger .burger-line{
width:28px;
height:3px;
background:#4A4545;
border-radius:2px;
display:block;
transition:transform .2s ease, opacity .2s ease;
}
.header__burger[aria-expanded="true"] .burger-line:nth-child(1){
transform:translateY(9px) rotate(45deg);
}
.header__burger[aria-expanded="true"] .burger-line:nth-child(2){
opacity:0;
}
.header__burger[aria-expanded="true"] .burger-line:nth-child(3){
transform:translateY(-9px) rotate(-45deg);
}
/* Языки скрыты вне бургера на мобильных */
.header__langbox{display:none}
/* Мобильное меню - слайд панель сверху */
.header__mobile-wrapper[data-menu]{
position:absolute;
top:100%;
left:0;
width:100%;
max-height:0;
background:transparent;
overflow:hidden;
transition:max-height .3s ease;
z-index:49;
}
/* Белый блок меню */
.header__mobile-wrapper[data-menu] > .header__nav-mobile{
background:#fff;
box-shadow:0 4px 24px rgba(0,0,0,.15);
border-radius:0 0 24px 24px;
position:relative;
padding-top:40px;
}
/* Жёлтая полоса с точками внутри блока */
.header__mobile-wrapper[data-menu] > .header__nav-mobile{
position:relative;
}
.header__mobile-wrapper[data-menu] > .header__nav-mobile::before{
content:"";
position:absolute;
top:24px;
left:24px;
right:24px;
height:3px;
background:#EEC024;
border-radius:0;
}
/* Точки по краям через псевдоэлементы */
.header__mobile-wrapper[data-menu] > .header__nav-mobile .header__menu::before,
.header__mobile-wrapper[data-menu] > .header__nav-mobile .header__menu::after{
content:"";
position:absolute;
top:22px;
width:8px;
height:8px;
background:#EEC024;
border-radius:50%;
}
.header__mobile-wrapper[data-menu] > .header__nav-mobile .header__menu::before{
left:24px;
}
.header__mobile-wrapper[data-menu] > .header__nav-mobile .header__menu::after{
right:24px;
}
.header__mobile-wrapper[data-menu].is-open{
max-height:calc(100vh - 130px);
overflow-y:auto;
}
/* Меню показывается вертикально */
.header__mobile-wrapper .header__menu{
display:flex;
flex-direction:column;
gap:0;
padding:8px 24px 20px;
}
/* Скрываем десктопный ЛК на мобильных */
.header__stack .header__acc-desktop{
display:none !important;
}
.header__mobile-wrapper .header__menu > li{
padding:16px 0;
font-size:18px;
border-bottom:1px solid var(--stroke,#eef2f7);
position:relative;
padding-right:60px;
}
.header__mobile-wrapper .header__menu > li > a{
display:block;
}
/* Языки в первом пункте справа - выше */
.header__mobile-wrapper .header__mobile-lang{
position:absolute;
right:24px;
top:60px;
display:block !important;
}
.header__mobile-wrapper .header__mobile-lang .header__langbox{
display:block !important;
}
/* Убираем padding-right у первого пункта */
.header__mobile-wrapper .header__menu > li:first-child{
padding-right:0;
}
}
/* ===== Sticky login (фон через background) ===== */
.stickylk{
position: fixed;
right: 24px;
top: 120px;
width: 57px;
height: 57px;
z-index: 1100;
display: inline-block;
background: no-repeat center/contain url("../icons/stickylk.svg");
cursor: pointer;
filter: drop-shadow(0 2px 8px rgba(0,0,0,.15));
transition: transform .15s ease, filter .15s ease;
}
.stickylk:hover{ transform: translateY(-1px); }
.stickylk:active{ transform: translateY(0); filter: drop-shadow(0 1px 4px rgba(0,0,0,.18)); }
@media (max-width:768px){
.stickylk{display:none}
}
/* Шапка остаётся над контентом */
.header{ z-index:50; }
/* Языковой переключатель — выше шапки и выше stickylk */
.header .header__langbox{ position:relative; z-index:60; } /* сама кнопка */
.header .header__langlist{ z-index:61; } /* выпадающее меню */
/* Пузырь ЛК — ниже шапки и ниже языков */
.stickylk{ z-index:45; } /* <= 49, как вы проверили, работает стабильно */
.menu-item-11548{display:none}