.main-menu{
    display: flex;
    align-items: center;
  
    list-style-type: none;
    margin-bottom: 0;
  }
  .main-menu li{
    margin-bottom: 0;
  }
  .lang p{
    margin-bottom: 0;
  }
  .main-menu__item{
    margin-left: 24px;
  
    transition: opacity .2s ease-out;
  }
  .main-menu__item:first-child{
    margin-left: 0;
  }
  .main-menu__item:hover{
    opacity: .8;
  
    background: #f2f2f2;
    border-radius: 24px;
  }
  .header.white .main-menu__item:hover .main-menu__link{
    color: #000
  }
  .main-menu__item:active{
    opacity: 1;
  }
  .main-menu__link{
    display: block;
  
    padding: 8px 12px;
  
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 16px;
    line-height: 125%;
    color: #000
  
    text-decoration: none;
  
    transition: color .2s ease-out;
  }
  .main-menu__button{
    padding: 8px 32px 8px 12px;
  
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 16px;
    line-height: 125%;
    color: #000
  
    border: none;
    border-radius: 24px;
  
    background: var(--gradient-turquoise);
  
    position: relative;
  }
  .main-menu__button::before{
    content: '';
  
    position: absolute;
    top: 14px;
    right: 14px;
  
    width: 13px;
    height: 8px;
  
    background-image: url(../img/arrow-black.svg);
    background-repeat: no-repeat;
    background-size: contain;
  }

  /* lang*/
.lang{
    position: relative;
  }
  .lang__open{
    padding: 12px 15px;
  
    width: 74px;
  
    background: none;
    border: none;
  
    display: flex;
    align-items: center;
  
    transition: opacity .2s ease-out;
  }
  .lang__open:hover{
    opacity: .8;
  }
  .lang-open p{
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 16px;
    line-height: 125%;
  
    text-align: start;
    
    color: #000
  }
  .lang-open__arrow{
    margin-left: 7.25px;
  
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .lang-open__black{
  
  }
  .lang-open__white{
    display: none;
  }
  .lang__content{
    position: absolute;
    top: 33px;
    left: -13px;
  
    height: 0;
  
    border-radius: 6px;
  
    transition: height .2s ease-out;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.2);
    overflow: hidden;
  
    background-color: #fff;
  
    z-index: 100;
  }
  .lang__list{
    width: 104px;
  
    padding: 8px;
  
    list-style-type: none;
  }
  .lang-item{
    margin-top: 8px;
  }
  .lang-item:first-child{
    margin-top: 0;
  }
  .lang-item a{
    display: block;
  
    width: 100%;
    text-transform: uppercase;
    padding: 4px;
  
    border-radius: 6px;
  
    font-family: var(--font-family);
    font-weight: 400;
    font-size: 20px;
    line-height: 120%;
    color: var(--text-dark);
  
    text-decoration: none;
  
    position: relative;
  
    transition: background-color .2s ease-out;
  }
  .lang-item a:hover,
  .lang-item.current-lang a{
    background-color: var(--background-grey);
  }
  .lang-item.current-lang a::before{
    content: '';
  
    position: absolute;
    top: 10px;
    right: 8px;
  
    width: 16px;
    height: 12px;
  
    background-image: url(../img/arrow-selected.svg);
  }
  /* lang */
  /* mini-profile */
  .mini-profile{
    display: flex;
    align-items: center;    
  }
  .mini-profile__item{
    margin-left: 8px;
  }
  .mini-profile__item:first-child{
    margin-left: 0;
  }
  .mini-profile__button{
    display: block;
  
    padding: 8px;
  
    display: flex;
    justify-content: center;
    align-items: center;
  
    background: none;
    border: none;
  
    transition: opacity .2s ease-out;
  }
  .mini-profile__button:hover{
    opacity: .8;
  }
  .mini-profile__icon{
    width: 24px;
    aspect-ratio: 1;
  }
  .mini-profile__icon.white{
    display: none;
  }
  /* mini-profile */


  /* header start */

.header{
  position: relative;

  background-color: #fff;

  position: fixed;
  left: 0;
  top: 0;
  right: 0;

  z-index: 200;
}
.header::after{
  content: '';

  position: absolute;
  left: auto;
  right: auto;
  bottom: 0;
  
  width: 100%;
  height: 1px;

  background:  var(--text-3);

}

.header__content{
  height: 72px;

  padding: 14px 24px;

  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 101;
}

.header__open-menu{
  display: none;

  width: 24px;
  aspect-ratio: 1;

  position: relative;

  border: none;
  background: none;
}
.header__open-menu::before{
  content: '';
  
  position: absolute;
  top: 8px;
  left: 4px;

  width: 16px;
  height: 2px;

  background: #000;
  border-radius: 1px;

}
.header__open-menu::after{
  content: '';

  position: absolute;
  left: 4px;
  bottom: 8px;

  width: 16px;
  height: 2px;

  background: #000;
  border-radius: 1px;
}

.header__logo{
  width: 182px;
  height: 40px;
}
.header__logo-black,
.header__logo-white{
  width: 100%;
  height: 100%;
}
.header__logo-white{
display: none;
}

.header__menu-block{
  position: absolute;
  top: 56px;
  left: 0;

  width: 100%;
  height: 0;

  overflow: hidden;
  transition: height .2s ease-out;

  background-color: #fff;

  z-index: 100;
}

.header__pc-menu{
  padding: 40px 46px;

  display: flex;
  justify-content: center;

  position: relative;

}
.header__pc-menu::before{
  content: '';

  position: absolute;
  bottom: 0;
  left: 46px;

  width: 330px;
  height: 248px;

  background-image: url(../img/cat.png);
  background-repeat: no-repeat;
}
.header__pc-menu::after{
  content: '';

  position: absolute;
  bottom: 0;
  right: 46px;

  width: 330px;
  height: 248px;

  background-image: url(../img/dog.png);
  background-repeat: no-repeat;
}
.header-pc-menu__content{
  width: 600px;

  display: flex;
  justify-content: space-between;
}
.header-pc-menu__item{

}
.header-pc-menu__title{
  font-family: var(--font-family);
  font-weight: 700;
  font-size: 26px;
  line-height: 123%;
  text-transform: uppercase;
  color: #000

  text-decoration: none;
}
.header-pc-menu__list{
  margin-top: 16px;

  list-style-type: none;   
  padding-left: 0; 
}
.header-pc-menu__list-li{
  margin-top: 25px;
  margin-bottom: 0;
}
.header-pc-menu__list-li:first-child{
  margin-top: 0;
}
.header-pc-menu__list-li a{
  font-family: var(--font-family);
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  color: var(--text-0);

  text-decoration: none;
}
.header__phone-menu{
  display: none;

  padding: 24px 16px;

  height: calc(100vh - 56px);

  overflow-x: auto;
}
.header-phone-menu__item{
  padding: 16px 0;

  border-top: 1px solid #f4f1f0;
  border-bottom: 1px solid #f4f1f0;

  display: flex;
  flex-direction: column;
}
.header-phone-menu__item:first-child{
  border-top: 0;
}
.header-phone-menu__item:last-child{
  border-bottom: 0;
}
.header-phone-menu__title{
  font-family: var(--font-family);
  font-weight: 700;
  font-size: 20px;
  line-height: 120%;
  color: #000

  text-decoration: none;
}
.header-phone-menu__title--gradient{
  background: var(--gradient-blue);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.header-phone-menu__category{
  margin-top: 16px;

  font-family: var(--font-family);
  font-weight: 500;
  font-size: 18px;
  line-height: 133%;
  color: #000

  text-decoration: none;
}
.header-phone-menu__list{
  margin-top: 24px;

  padding-left: 32px;

  list-style-type: none;
}
.header-phone-menu__list-item{
  margin-top: 16px;
}
.header-phone-menu__list-item:first-child{
  margin-top: 0;
}
.header-phone-menu__list-item a{
  font-family: var(--font-family);
  font-weight: 500;
  font-size: 16px;
  line-height: 125%;
  color: #121212;
  color: #000

  text-decoration: none;
}
.header.white{
background: none;
}
.header.white .header__logo-black{
display: none;
}
.header.white .header__logo-white{
display: block;
}
.header.white .main-menu__link{
color: #fff;
}
.header.white .main-menu__button{
background: #fff;
}
.header.white .lang__open{
color: #fff;
}
.header.white::after{
background: #fff;
}
.header.white .lang-open__black{
display: none;
}
.header.white .lang-open__white{
display: block;
}
.header.white .mini-profile__icon.white{
display: block;
}
.header.white .mini-profile__icon.black{
display: none;
}
.header.white .header__open-menu::before,
.header.white .header__open-menu::after{
background: #fff;
}
.header__phone-menu::-webkit-scrollbar {
width: 0px;
}

.modal__login {
    width: 412px;
}
.login_back {
    position: absolute;
    top: 24px;
    left: 24px;
    cursor: pointer;
}
.login_wrap {
    height: 100%;
}
.login_wrap.hide {
    display: none;
}
.login_inner {
    display: none;
    margin-top: 128px;
}
.login_inner.active {
    display: block;
}
.login_title {
    color: #121212;
    font-size: 24px;
    line-height: 28px;
    text-transform: uppercase;
}
.login_subtitle {
    color: #575775;
    font-size: 20px;
    line-height: 24px;
    margin-top: 16px;
}
.login_subtitle span {
    display: block;
    margin-top: 8px;
}
.login_input {
       margin-top: 40px; 
}
.login_input.error input {
    border-color: #FA0505;
}
.login_error {
    font-size: 12px;
    line-height: 16px;
    color: #FA0505;
    display: none;
}
.login_input.error .login_error {
    display: block;
}
.login_input input {
    border: 1px solid #999999;
    color: #999999;
    border-radius: 20px;
    padding: 12px 16px;
    width: 100%;
    font-size: 20px;
    line-height: 24px;
}
.login_btn {
    padding: 12px 24px;
    border-radius: 20px;
    display: block;
    width: 100%;
    height: 54px;
    text-transform: none;
    font-size: 20px;
    line-height: 24px;
    text-align: center;
}
.login_btn.btn_gradient {
    margin-top: 24px;
    background: radial-gradient(100% 174.56% at 100% 0%, #7AD9E7 0%, #7EE7E1 25%, #B5E4B4 80%, #D7EEAA 100%);
}
.login_btn.account_link {
    background: #121212;
    color: #fff;
}
.login_privacy {
    font-size: 12px;
    line-height: 16px;
    color: #333333;
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
}
.login_privacy a {
    color: #333333;
    text-decoration: underline;
}
.login_inner.step_2 .login_subtitle,
.login_success .login_subtitle,
.login_auth  .login_subtitle {
    color: #121212;
}
.login_timer {
    font-size: 20px;
    line-height: 24px;
    margin-top: 24px;
    color: #121212;
}
.js-repeat-code {
    display: none;
}
.login_success img {
    margin: 40px 0;
}
/*
.wptelegram-login-output-wrap.container {
    position: relative;
}
.wptelegram-login-output-wrap.container:after {
    content: 'Войти через Telegram';
    position: absolute;
    left: 0;
    background: radial-gradient(100% 174.56% at 100% 0%, #7AD9E7 0%, #7EE7E1 25%, #B5E4B4 80%, #D7EEAA 100%);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 54px;
    top: 0;
    border-radius: 20px;
    font-weight: var(--btn-font-weight);
    font-family: var(--btn-font-family);
    font-style: var(--btn-font-style);
    font-size: 20px;
    line-height: 24px;
    cursor: pointer;
}
*/
.wptelegram-login-output-wrap {
    display: flex;
    margin-top: 15px;
    justify-content: center;
}
@media(max-width: 480px) {
    .modal__login {
        width: 100%;
    }
    .login_title {
        font-size: 19px;
        line-height: 24px;
    }
}
/* header end */


/* Стили для планшетов  */
@media only screen and (max-width: 1200px) {
    /* header */
    .main-menu{
        display: none;
    }
    .header__open-menu{
        display: block;
    }
    .lang{
        display: none;
    }
    .header__logo{
        width: 136px;
        height: 29px;
    }
    .header__content{
        height: auto;
    
        padding: 8px 16px;
    }
    .mini-profile__item:nth-child(2){
        margin-left: 0;
    }
    .header::after{
        left: 0;
    
        width: 100%;
    }
    .header__pc-menu{
        display: none;
    }
    .header__phone-menu{
        display: block;
    }
    .header__menu-block{
        top: 36px;
    }
    .header__content::after{
        left: 0;
        right: 0;
        width: 100%;
    }
    /* header */

    }


    @media only screen and (max-width: 720px) {

}
        


.mini-profile__button--counter {
    display: flex
;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 2px;
    position: absolute;
    background: var(--gradient-turquoise);
    border-radius: 10px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    right: 3px;
    bottom: 2px;
    font-style: normal;
    font-weight: 700;
    font-size: 9px;
    line-height: 16px;
    color: #121212;
}

.mini-profile__button--counter.disabled{
  display: none;
}

.mini-profile__button{
  position: relative;
}

#telegram-widget-container {
  text-align: center;
}

@media (max-width: 1200px) {
    .header-navs {
        gap: 12px;
    }
    .header-navs__link {
        font-size: 14px;
    }
    .header-right {
        gap: 4px;
    }
}

@media only screen and (max-width: 992px) {
    .header-navs {
        display: none;
    }

    .header-container {
        height: 56px;
        padding: 0;
    }

    .header-bars {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .header-logo {
        font-size: 16px;
        line-height: 20px;
        gap: 8px;
    }

    .header-logo img {
        width: 31px;
        flex-shrink: 0;
    }

    .header-lang {
        display: none;
    }
}