:root {
/*--header-h: 72px;*/
--brand-color: #0b2140;
}

/* --- Header fixed --- */
.headerContainer {
position: absolute;
top: 0;
left: 0;
right: 0;
height: 72px;
padding-top:10px;
z-index: 1040;
/*background: #fff;
box-shadow: 0 2px 6px rgba(11,33,64,0.06);*/
display: flex;
align-items: center;
}
#activelogo.deactivelogo {
    opacity: 0;
    
  transition:  0.3s ease-in-out;
    
}
#activelogo.activelogo {
   opacity: 1;
     transition:  0.3s ease-in-out;
    
}

.headerContainer .container-fluid {
    z-index: 1035;
    padding-left:0;
    padding-right:0;
    height: 115px;
    padding-bottom: 0;
    padding-top: 25px;
}

/* make inner row take full height */
.headerRow { width:100%; align-items: center; }

/* space under header so page content isn't hidden */
/*body { padding-top: var(--header-h); }*/

/* Logo img */
.logo-img {
    height: 77px;
    display:block; 
    
}

/* Menu button (hamburger) inside header column */
.menu-btn {
        
width: 48px;
height: 48px;
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
border: none;
cursor: pointer;
padding: 0;
/*color: var(--brand-color);*/
}
.menu-btn .bar {
    margin-top: 30px;
display: block;
width: 28px;
height: 3px;
background: #fff;
border-radius: 2px;
position: absolute;
transition: transform .45s cubic-bezier(.2,.9,.3,1), opacity .25s ease;
}
.menu-btn .bar:nth-child(1) { top: 10px; width: 40px; }
.menu-btn .bar:nth-child(2) { top: 18px; width: 40px; }
.menu-btn .bar:nth-child(3) { top: 26px; width: 40px; }

.menu-btn.open .bar:nth-child(1) {
transform: translateY(8px) rotate(45deg);
background: #fff;
width: 25px;
}
.menu-btn.open .bar{
       margin-top: 30px;
}


.menu-btn.open .bar:nth-child(2) {
opacity: 0;
transform: scaleX(.2);
}
.menu-btn.open .bar:nth-child(3) {
transform: translateY(-8px) rotate(-45deg);
width: 25px;
background: #fff;
}
.menu-btn.open{
    margin-top: 15px;
   /* background-color:#fff;*/
    border-radius:1000px;
}


/* Search button */
.search-btn {
display: inline-flex;
align-items:center;
gap:8px;
background: transparent;
border: none;
color: var(--brand-color);
cursor: pointer;
padding: 6px 10px;
font-weight: 600;
}

/* --- Overlays (menu and search) --- */
.overlay {
position: fixed;
inset: 0;
width: 100%;
height: 100%;
z-index: 1000;
pointer-events: none;
overflow: hidden;
}
.overlay.open { pointer-events: auto; }

.menu-panel {
position: absolute;
height: 100%;
top: 0;
opacity: 0;
transition: transform .7s cubic-bezier(.2,.9,.25,1), opacity .55s ease;
will-change: transform, opacity;
}
.menu-panel.left {
left: 0;
width: 23.333vw;
background: #FAAC60!important;
transform: translateY(-100%);
}
.overlay.open .menu-panel.left {
transform: translateY(0);
opacity: 1;
}
.menu-panel.right {
right: 0;
width: 76.666vw;
background: #FA751A!important;
transform: translateY(100%);
}
.overlay.open .menu-panel.right {
transform: translateY(0);
opacity: 1;
}

.panel-content {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
opacity: 0;
transition: opacity .35s ease .05s;
padding: 24px;
box-sizing: border-box;
}
.overlay.show-content .panel-content {
opacity: 1;
}

.menu-links { list-style: none; padding: 0; margin: 0; text-align: center; }
.menu-links li { margin: 12px 0; }
.menu-links a {
color: #fff;
text-decoration: none;
font-size: 1.75rem;
font-weight: 600;
transition: opacity .18s ease, transform .18s ease;
}
.menu-links a:hover { opacity: .9; transform: translateY(-3px); }

/* --- Search top panel --- */
.search-panel {
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100%;
height: 220px; /* высота панели, можно менять */
background: #FEB119;
background: linear-gradient(324deg,rgba(254, 177, 25, 1) 27%, rgba(249, 121, 15, 1) 70%);
transform: translateY(-100%);
transition: transform .45s cubic-bezier(.2,.9,.25,1), opacity .25s ease;
z-index: 1120;
opacity: 0;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 18px rgba(11,33,64,0.12);
padding: 20px;
box-sizing: border-box;
pointer-events: none;
}
.search-panel.open {
transform: translateY(0);
opacity: 1;
pointer-events: auto;
}

.search-inner {
width: 100%;
max-width: 1200px;
display: flex;
justify-content: center;
align-items: center;
}
.search-box {
width: 66.666%;
min-width: 260px;
}
.search-input {
width: 100%;
padding: 14px 16px;
border-radius: 16px;
border: none;
font-size: 1.05rem;
/*box-shadow: 0 2px 10px rgba(11,33,64,0.04);*/
}

.search-close {
margin-left: 12px;
background: transparent;
border: none;
font-weight: 600;
cursor: pointer;
color: #fff;
}

/* overlay background to dim rest when search open */
.backdrop {
position: fixed;
inset: 0;
background: rgba(0,0,0,0.35);
z-index: 1115;
opacity: 0;
transition: opacity .28s ease;
pointer-events: none;
}
.backdrop.show {
opacity: 1;
pointer-events: auto;
}

@media (max-width: 768px) {
.search-panel { height: 180px; }
.search-box { width: 86.666%; }
.menu-links a { font-size: 1.4rem; }
}











/********ПОИСК********/


.search-wrapper { display: inline-block; }

.search-btn{
  --panel-inset: 6px;   /* отступ панели от правого края кнопки */
  --panel-w: 0px;       /* ширина выезжающей панели (анимируется) */
  --hole-x: 0px;        /* центр "дырки" внутри панели (px от её левого края) */
  --hole-r: 0px;        /* радиус дырки в px */
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 50px;
  padding: 6px 20px;
  border-radius: 999px;
  background: transparent;
  color: #1e90ff;
  border: none;
  cursor: pointer;
  overflow: visible;
}

/* Панель теперь привязана к правому краю и растёт влево */
.search-btn::before{
  content: '';
  position: absolute;
  top: 4px;
  bottom: 4px;
  right: var(--panel-inset);
  width: var(--panel-w);
  border-radius: 999px;
  background: #fff;
  z-index: 1;
  transition: width .28s cubic-bezier(.2,.9,.3,1);
  -webkit-mask: radial-gradient(circle var(--hole-r) at var(--hole-x) 50%, transparent calc(var(--hole-r) - 0.5px), black calc(var(--hole-r) + 0.5px));
  mask: radial-gradient(circle var(--hole-r) at var(--hole-x) 50%, transparent calc(var(--hole-r) - 0.5px), black calc(var(--hole-r) + 0.5px));
  pointer-events: none;
}

.search-label { order: -1; position: relative; z-index: 2; }

/* Контент выше панели */
.search-btn > * { position: relative; z-index: 2; }

/* Текст (метка) — изначально скрыт и сдвинут немного влево */
.search-label {
  display: inline-block;
  color: #505050;
  opacity: 0;
  font-size:12px;
  transform: translateX(-6px);
  transition: opacity .22s ease, transform .22s ease;
  white-space: nowrap;
  margin-right: 12px;
}

/* Показать метку при открытии */
.search-btn.open-label .search-label,
.search-btn:hover .search-label,
.search-btn:focus .search-label {
  opacity: 0.8;
  transform: translateX(0);
  transition-delay: .07s;
}
.search-btn:hover .search-icon{
    width: 22px;
  height: 22px; 
  transition: transform .18s ease;
 
}
.search-icon {
  width: 22px;
  height: 22px;
  display: block;
  color: #fff;
 
  transition: transform .18s ease;
}









/***********************СТИЛИ МЕНю***************/
.botposstl{
    bottom: 66px;
    position: absolute;
    
}
.menu-panel.right .row{
    /*max-width: 980px;*/
    width: 100%;
}

ul.menu-links1, ul.menu-links2{ 
    list-style-type: none; 
    padding-left:0px;
    
}

.menu-links1 a,.menu-links2 a{
    color:#fff;
    
}
.menu-links1 a{
    font-size:55px;
    font-weight:600;
    line-height:0.98;
    letter-spacing: -.03em;
    text-decoration:none;
    
}
.menu-links1 li{
    padding-bottom:6px;
}
.menu-links1
{
    position: absolute;
    bottom: 36px;
}
.menu-links2 a{
    font-size:2.3529411765vw;
    font-weight:600;
    line-height:1.08;
    letter-spacing: -.02em;
    text-decoration:none;
    
}
.topPolitLink a{
   font-size:18px;
   color:#fff;
    font-weight:600;
    line-height:1.39;
    letter-spacing: -.02em;
    text-decoration:none; 
    opacity:0.54;
}

.menulink2pad{
    position: absolute;
    bottom: 36px;
}





.menu-links1 a,.menu-links2 a {
  display: inline-flex;        /* позволяет выровнять полоску и текст по центру вертикали */
  align-items: center;
  text-decoration: none;
 
  padding: 6px 0;
  transition: color .18s;
}

/* псевдоэлемент слева от текста */
.menu-links1 a::before,.menu-links2 a::before {
  content: "";
  display: block;              /* становится флекс-элементом внутри a */
  width: 0;                    /* изначально невидимая (толкать не будет) */
  height: 4px;                 /* толщина полоски */
  background: #fff;         /* цвет полоски */
  margin-right: 0;             /* расстояние до текста */
  transition: width .22s ease, margin-right .22s ease;
  border-radius: 2px;
  /* выровнять по центру вертикали уже делает align-items: center у a */
}

/* при наведении / фокусе "вырастает" до 10px и подталкивает текст */
.menu-links1 a:hover::before,
.menu-links1 a:focus-visible::before,.menu-links2 a:hover::before,
.menu-links2 a:focus-visible::before {
  width: 20px;                 /* длина "дефиса" */
  margin-right: 8px;           /* отступ до текста */
}

/* (опционально) визуальный эффект текста при наведении */
.menu-links1 a:hover,
.menu-links1 a:focus-visible,.menu-links2 a:hover,
.menu-links2 a:focus-visible {
  color: #fff;
}



/*.menu-links2 a:hover{
   
    text-decoration:underline;
    
}*/

.topPolitLink a:hover{
 
    text-decoration:underline; 
    opacity:1;
}


/**********прокрутка меню***********/


#scrolledTopMenu{
     transition: background-color .2s; 
}


#scrolledTopMenu.scrolledTopMenuSTL{
     background: rgba(89, 151, 232, 0.72);
    
     
}

/****КРОШКИ****/
.breadcrumbsStl a{
    color:#fff;
    text-decoration:none;
    opacity:0.8;
    transition: 0.5s;
}
.breadcrumbsStl a:hover{
    color:#fff;
    text-decoration:underline;
    opacity:1;
}
.breadcrumbsStlSep{
    color:#fff;
}
.breadcrumbsStllast{
    color:#fff;
}

