/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/shared/ui/Layout/Section/Section.module.scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/

/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/sections/HeroSecondarySection/HeroSecondarySection.module.scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.HeroSecondarySection_Hero__ojKEG {
  background-color: var(--color-bg);
  width: 100%;
  min-height: calc(100vh - 90px);
  height: 100%;
  display: flex;
  align-items: center;
  gap: 4rem;
}
@media only screen and (max-width: 56.25rem) {
  .HeroSecondarySection_Hero__ojKEG {
    flex-direction: column;
  }
}
.HeroSecondarySection_Touch__1DaUs {
  width: 50%;
  height: 100%;
  padding-left: 7rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
@media only screen and (max-width: 56.25rem) {
  .HeroSecondarySection_Touch__1DaUs {
    width: 100%;
    align-items: center;
    padding: 0 7rem;
    margin-top: 10rem;
  }
  .HeroSecondarySection_Touch__1DaUs > h1, .HeroSecondarySection_Touch__1DaUs > h2 {
    text-align: center;
  }
}
@media only screen and (max-width: 37.5rem) {
  .HeroSecondarySection_Touch__1DaUs {
    width: 100%;
    align-items: center;
    padding: 0 3rem;
    margin-top: 10rem;
  }
  .HeroSecondarySection_Touch__1DaUs > h1, .HeroSecondarySection_Touch__1DaUs > h2 {
    text-align: center;
  }
}

.HeroSecondarySection_ImageContainer__AahLH {
  width: 50%;
  height: 100%;
  position: relative;
}
.HeroSecondarySection_ImageContainer__AahLH > img {
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 56.25rem) {
  .HeroSecondarySection_ImageContainer__AahLH {
    width: 80%;
    min-height: 50%;
  }
}

.HeroSecondarySection_Heading__X5GvX {
  font-size: 5.6rem;
  font-weight: 700;
  color: var(--color-black);
  line-height: 1.15;
  text-align: left;
  margin-bottom: 2.5rem;
  position: relative;
}
@media only screen and (max-width: 37.5rem) {
  .HeroSecondarySection_Heading__X5GvX {
    font-size: 4.2rem;
  }
}
@media only screen and (max-width: 23.75rem) {
  .HeroSecondarySection_Heading__X5GvX {
    font-size: 12vw;
  }
}

.HeroSecondarySection_Subheading__41uF3 {
  width: 100%;
  font-size: 2rem;
  font-weight: 500;
  color: var(--color-black);
  text-align: left;
}

.HeroSecondarySection_ButtonContainer__Tgrpl {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2rem;
  margin-top: 4rem;
  margin-bottom: 4rem;
}
@media only screen and (max-width: 56.25rem) {
  .HeroSecondarySection_ButtonContainer__Tgrpl {
    align-items: center;
  }
}

.HeroSecondarySection_TelegramLink__qXOh1 {
  background-color: var(--color-secondary);
  color: #fff;
  display: inline-flex;
  align-items: center;
  text-align: center;
  gap: 1rem;
  font-size: 1.6rem;
  font-weight: 500;
  min-width: 280px;
  height: 55px;
  padding: 3rem 4rem;
  border-radius: 10rem;
  border: none;
  cursor: pointer;
  position: relative;
  z-index: 1;
  transition: transform 0.3s ease-out;
  animation: HeroSecondarySection_moveInBottom__JJ2oo 0.5s ease-out 0.75s;
  animation-fill-mode: backwards;
}
.HeroSecondarySection_TelegramLink__qXOh1:hover {
  transform: translateY(-3px);
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.2);
}
@media only screen and (max-width: 56.25rem) {
  .HeroSecondarySection_TelegramLink__qXOh1 {
    padding: 2rem;
  }
}
@media only screen and (max-width: 20rem) {
  .HeroSecondarySection_TelegramLink__qXOh1 {
    min-width: 236px;
  }
}

@keyframes HeroSecondarySection_moveInBotton__dmMZd {
  0% {
    opacity: 0;
    transform: translateY(3rem);
  }
  100% {
    opacity: 1;
    transform: translate(0);
  }
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/shared/ui/Layout/Container/Container.module.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Container_Container__ap_bo {
  padding: 9.6rem 7rem;
}
@media only screen and (max-width: 37.5rem) {
  .Container_Container__ap_bo {
    padding: 4.8rem 3rem;
  }
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/widgets/Footer/ui/Footer.module.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Footer_Footer__zLUut {
  background-color: var(--color-bg);
  position: relative;
}

.Footer_Wrapper__byI7r {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  justify-items: start;
  grid-gap: 0rem;
  gap: 0rem;
  position: relative;
  z-index: 5;
}
@media only screen and (max-width: 47rem) {
  .Footer_Wrapper__byI7r {
    grid-template-columns: repeat(1fr);
    grid-template-rows: auto;
  }
}

.Footer_Contact___IN7t {
  grid-column: 1/end;
  grid-row: 1/2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  border-top: 1px solid var(--color-border-white);
  border-bottom: 1px solid var(--color-border-white);
  padding: 4rem 0;
}
@media only screen and (max-width: 47rem) {
  .Footer_Contact___IN7t {
    flex-direction: column;
    align-items: flex-start;
    gap: 4rem;
  }
}

.Footer_Office__BTqrq {
  grid-column: 1/end;
  grid-row: 2/3;
  width: 100%;
  border-bottom: 1px solid var(--color-border-white);
  padding-top: 4rem;
}

.Footer_Requisites__V06I0 {
  grid-column: 1/end;
  grid-row: 3/end;
  width: 100%;
  border-bottom: 1px solid var(--color-border-white);
  padding: 4rem 0;
}

.Footer_Title__RKVid {
  font-size: var(--font-size-text);
  color: var(--color-text-grey);
  margin-bottom: 1rem;
}

.Footer_Messanger__FlsVi {
  font-size: var(--font-size-l);
  color: var(--color-black);
  transition: all 0.3s;
}
.Footer_Messanger__FlsVi:not(:last-child) {
  margin-right: 2.5rem;
}
.Footer_Messanger__FlsVi:hover {
  color: var(--color-primary);
}

.Footer_Address__VL1_o {
  font-size: var(--font-size-l);
  color: var(--color-black);
}

.Footer_Business__FmNNM {
  display: block;
  font-size: var(--font-size-l);
  color: var(--color-black);
}

.Footer_Email__9zUrr, .Footer_Email__9zUrr:link, .Footer_Email__9zUrr:visited {
  font-size: var(--font-size-l);
  color: var(--color-black);
  transition: all 0.3s;
}
.Footer_Email__9zUrr:hover {
  color: var(--color-primary);
}

.Footer_Copyright__QHQmf {
  font-size: var(--font-size-small);
  color: var(--color-text-grey);
  text-align: center;
  padding-bottom: 1rem;
}

.Footer_Entity_1__yGyvD {
  grid-area: entity-1;
}

.Footer_Entity_2__H4Fd_ {
  grid-area: entity-2;
}

.Footer_Entity_3__f6Ewo {
  grid-area: entity-3;
}

.Footer_Entity_4__G_wlJ {
  grid-area: entity-4;
}

.Footer_Entity_5__dGDer {
  grid-area: entity-5;
}
/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/shared/ui/Icons/Logo/Logo.module.scss ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Logo_Icon__BPPtQ {
  width: 220px;
  height: 70px;
}
@media only screen and (max-width: 30rem) {
  .Logo_Icon__BPPtQ {
    width: 175px;
    height: 65px;
  }
}
@media only screen and (max-width: 20rem) {
  .Logo_Icon__BPPtQ {
    width: 140px;
    height: auto;
  }
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/shared/ui/Icons/TelegramIcon/TelegramIcon.module.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.TelegramIcon_Icon__0jen_ {
  width: 4.5rem;
  height: 4.5rem;
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/shared/ui/Icons/WhatsAppIcon/WhatsAppIcon.module.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.WhatsAppIcon_Icon__y_vzP {
  width: 4.5rem;
  height: 4.5rem;
}
/*!****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/widgets/Communicate/ui/HeaderCommunicate.module.scss ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.HeaderCommunicate_Button__kHzo6 {
  border: 3px solid var(--color-primary);
  border-radius: 50px;
  display: flex;
  align-items: center;
  gap: 5rem;
  padding: 1.5rem 3rem;
  position: relative;
  transition: all 0.3s ease-out;
  z-index: 99;
  background-color: transparent;
  cursor: pointer;
}

.HeaderCommunicate_Title__3__rQ {
  font-size: 1.8rem;
  font-weight: 500;
  color: var(--color-black);
  text-transform: uppercase;
}

.HeaderCommunicate_button__Xv0K9 {
  position: absolute;
  top: -25px;
  right: 0;
  width: 220px;
  height: 50px;
  cursor: pointer;
  border-radius: 25px;
  overflow: hidden;
  z-index: 7;
  border: 3px solid var(--color-primary);
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi {
  position: relative;
  width: 100%;
  height: 100%;
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi .HeaderCommunicate_el__IjkMh {
  display: flex;
  justify-content: center;
  gap: 1rem;
  height: 100%;
  background-color: transparent;
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi .HeaderCommunicate_el__IjkMh p {
  margin: 0px;
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi .HeaderCommunicate_el__IjkMh:nth-of-type(2) {
  background-color: transparent;
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi .HeaderCommunicate_el__IjkMh:nth-of-type(2) p {
  color: var(--color-primary);
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi .HeaderCommunicate_el__IjkMh:hover .HeaderCommunicate_perspectiveText__wsa73 {
  transform: rotateX(90deg);
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi .HeaderCommunicate_el__IjkMh:hover .HeaderCommunicate_perspectiveText__wsa73 p:nth-of-type(1) {
  transform: translateY(-100%);
  opacity: 0;
}
.HeaderCommunicate_button__Xv0K9 .HeaderCommunicate_slider__mqHvi .HeaderCommunicate_el__IjkMh:hover .HeaderCommunicate_perspectiveText__wsa73 p:nth-of-type(2) {
  opacity: 1;
}

.HeaderCommunicate_perspectiveText__wsa73 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.75s cubic-bezier(0.76, 0, 0.24, 1);
}
.HeaderCommunicate_perspectiveText__wsa73 p {
  font-size: 1.8rem;
  font-weight: 500;
  color: var(--color-black);
  text-transform: uppercase;
  transition: all 0.75s cubic-bezier(0.76, 0, 0.24, 1);
  pointer-events: none;
  text-transform: uppercase;
}
.HeaderCommunicate_perspectiveText__wsa73 p:nth-of-type(2) {
  position: absolute;
  transform-origin: bottom center;
  transform: rotateX(-90deg) translateY(9px);
  opacity: 0;
}

.HeaderCommunicate_menu__TIS6F {
  width: 480px;
  height: 650px;
  background-color: var(--color-secondary);
  border-radius: 25px;
  position: absolute;
  z-index: 7;
}

.HeaderCommunicate_header__W11Lo {
  position: relative;
}
@media only screen and (max-width: 52.5rem) {
  .HeaderCommunicate_header__W11Lo {
    display: none;
  }
}

.HeaderCommunicate_nav__jrPwX {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 100px 40px 50px 40px;
  height: 100%;
  box-sizing: border-box;
}
.HeaderCommunicate_nav__jrPwX .HeaderCommunicate_body__Ze7b8 {
  display: flex;
  gap: 10px;
  flex-direction: column;
}
.HeaderCommunicate_nav__jrPwX .HeaderCommunicate_body__Ze7b8 .HeaderCommunicate_linkContainer__OjpIG {
  perspective: 120px;
  perspective-origin: bottom;
}
.HeaderCommunicate_nav__jrPwX .HeaderCommunicate_body__Ze7b8 a {
  text-decoration: none;
  color: #fff;
  font-size: 3.2rem;
}

.HeaderCommunicate_Icons__aP7fI {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
}

.HeaderCommunicate_Icon__JuZRJ {
  width: 16px;
  height: 16px;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/shared/ui/Link/MessangerLink/MessangerLink.module.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.MessangerLink_MessangerLink__2hdI2 {
  transition: transform 0.3s ease-out;
}
@media (hover: hover) and (pointer: fine) {
  .MessangerLink_MessangerLink__2hdI2:hover {
    transform: scale(1.25);
  }
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[13].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[13].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[13].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[13].use[5]!./src/widgets/Menu/ui/Menu.scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.nav-but-wrap {
  border: 3px solid var(--color-black);
  border-radius: 50px;
  display: flex;
  align-items: center;
  gap: 5rem;
  padding: 1.5rem 3rem;
  position: relative;
  transition: all 0.3s ease-out;
  z-index: 99;
  background-color: transparent;
  cursor: pointer;
  height: 50px;
}

.nav-but-title {
  font-size: 1.8rem;
  font-weight: 500;
  color: var(--color-black);
  text-transform: uppercase;
}
@media only screen and (max-width: 25rem) {
  .nav-but-title {
    display: none;
  }
}

.menu-icon {
  height: 20px;
  width: 60px;
  position: relative;
  z-index: 2;
  cursor: pointer;
  display: block;
}
@media only screen and (max-width: 30rem) {
  .menu-icon {
    width: 30px;
  }
}

.menu-icon__line {
  height: 2px;
  width: 60px;
  display: block;
  background-color: var(--color-black);
  cursor: pointer;
  transition: transform 0.2s ease, background-color 0.5s ease;
}
.menu-icon__line:not(:last-child) {
  margin-bottom: 7px;
}
@media only screen and (max-width: 30rem) {
  .menu-icon__line {
    width: 30px;
  }
}

.menu-icon__line-left {
  background-color: var(--color-black);
  width: 33px;
  transition: all 200ms linear;
}
@media only screen and (max-width: 30rem) {
  .menu-icon__line-left {
    width: 17px;
  }
}

.menu-icon__line-right {
  background-color: var(--color-black);
  width: 33px;
  float: right;
  transition: all 200ms linear;
}
@media only screen and (max-width: 30rem) {
  .menu-icon__line-right {
    width: 17px;
  }
}

@media (hover: hover) and (pointer: fine) {
  .nav-but-wrap:hover .menu-icon__line-left,
  .nav-but-wrap:hover .menu-icon__line-right {
    width: 60px;
  }
}
@media only screen and (hover: hover) and (pointer: fine) and (max-width: 30rem) {
  .nav-but-wrap:hover .menu-icon__line-left,
  .nav-but-wrap:hover .menu-icon__line-right {
    width: 30px;
  }
}
@media (hover: hover) and (pointer: fine) {
  .nav-but-wrap:hover .menu-icon__line {
    background-color: var(--color-black);
  }
}
.nav {
  position: fixed;
  z-index: 98;
}

.nav:before,
.nav:after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(49, 55, 64, 0.6);
  border-bottom-left-radius: 200%;
  z-index: -1;
  transition: transform cubic-bezier(0.77, 0, 0.175, 1) 0.6s, border-radius linear 0.8s;
  transform: translateX(100%) translateY(-100%);
}

.nav:after {
  background: var(--color-secondary);
  transition-delay: 0s;
}

.nav:before {
  transition-delay: 0.2s;
}

.nav__content {
  position: fixed;
  visibility: hidden;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  text-align: center;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
@media only screen and (max-width: 37.5rem) {
  .nav__content {
    justify-content: center;
  }
}

.nav__list {
  position: relative;
  padding: 0;
  margin: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}

.nav__list-item {
  padding: 0 7rem;
  opacity: 0;
  width: 100%;
  text-align: left;
  color: #fff;
  overflow: visible;
  transition: opacity 0.2s ease-out;
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 1.5rem;
}
@media (hover: hover) and (pointer: fine) {
  .nav__list-item:hover .submenu {
    opacity: 1;
    visibility: visible;
  }
}
.nav__list-item--messangers {
  display: flex;
  gap: 1.5rem;
}
@media only screen and (max-width: 37.5rem) {
  .nav__list-item {
    padding: 0 3rem;
  }
  .nav__list-item:not(:last-child) {
    margin-bottom: 1rem;
  }
}

.nav__list-item a,
.nav__list-item button {
  position: relative;
  font-family: var(--font-family-text);
  font-size: 3.6rem;
  font-weight: 500;
  line-height: 1.15;
  overflow: hidden;
  cursor: pointer;
  z-index: 2;
  transition: all 300ms linear;
}
@media only screen and (max-width: 25.875rem) {
  .nav__list-item a,
  .nav__list-item button {
    font-size: 3.2rem;
  }
}
@media only screen and (max-width: 19.5rem) {
  .nav__list-item a,
  .nav__list-item button {
    font-size: 2.4rem;
  }
}

.nav__list-icon {
  width: 4.8rem;
  height: 4.8rem;
}

.nav__list-link > span {
  display: inline-block;
  padding-right: 15px;
}

.nav__list-item a:after {
  position: absolute;
  content: "";
  bottom: -5px;
  left: 50%;
  width: 0;
  height: 0;
  opacity: 0;
  background-color: var(--color-primary);
  z-index: 1;
  transition: all 300ms linear;
}

@media (hover: hover) and (pointer: fine) {
  .nav__list-item a:hover:after {
    height: 4px;
    opacity: 1;
    left: 0;
    width: 100%;
  }
  .nav__list-item a:hover {
    color: rgb(255, 255, 255);
  }
}
.nav__list-item.active-nav a {
  color: rgb(255, 255, 255);
}

.nav__list-item.active-nav a:after {
  height: 4px;
  opacity: 1;
  left: 0;
  width: 100%;
}

.navigation.nav-active .nav__content {
  visibility: visible;
}

.navigation.nav-active .menu-icon__line {
  width: 30px;
  background-color: #fff;
  transform: translate(0px, 0px) rotate(-45deg);
}

.navigation.nav-active .menu-icon__line-left {
  width: 15px;
  transform: translate(2px, 4px) rotate(45deg);
}

.navigation.nav-active .nav-but-wrap {
  border-color: #fff;
}
.navigation.nav-active .nav-but-wrap > span {
  color: #fff;
}

.navigation.nav-active .menu-icon__line-right {
  width: 15px;
  float: right;
  transform: translate(-31px, -3px) rotate(45deg);
}
@media only screen and (max-width: 30rem) {
  .navigation.nav-active .menu-icon__line-right {
    transform: translate(-2px, -3px) rotate(45deg);
  }
}

.nav__list-item--messangers {
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease-out;
}

.navigation.nav-active .nav__list-item--messangers {
  opacity: 1;
  visibility: visible;
}

@media (hover: hover) and (pointer: fine) {
  .navigation.nav-active .menu-icon:hover .menu-icon__line-left,
  .navigation.nav-active .menu-icon:hover .menu-icon__line-right {
    width: 15px;
  }
}
.navigation.nav-active .nav {
  visibility: visible;
}

.navigation.nav-active .nav:before,
.navigation.nav-active .nav:after {
  transform: translateX(0%) translateY(0%);
  border-radius: 0;
}

.navigation.nav-active .nav:after {
  transition-delay: 0.1s;
}

.navigation.nav-active .nav:before {
  transition-delay: 0s;
}

.navigation.nav-active .nav__list-item {
  opacity: 1;
}

.navigation.nav-active .nav__list-item:nth-child(0) {
  transition-delay: 0.7s;
}

.navigation.nav-active .nav__list-item:nth-child(1) {
  transition-delay: 0.8s;
}

.navigation.nav-active .nav__list-item:nth-child(2) {
  transition-delay: 0.9s;
}

.navigation.nav-active .nav__list-item:nth-child(3) {
  transition-delay: 1s;
}

.navigation.nav-active .nav__list-item:nth-child(4) {
  transition-delay: 1.1s;
}

.navigation.nav-active .nav__list-item:nth-child(5) {
  transition-delay: 1.2s;
}

.navigation.nav-active .nav__list-item:nth-child(6) {
  transition-delay: 1.3s;
}

.navigation.nav-active .nav__list-item:nth-child(7) {
  transition-delay: 1.4s;
}

.navigation.nav-active .nav__list-item:nth-child(8) {
  transition-delay: 1.5s;
}

.navigation.nav-active .nav__list-item:nth-child(9) {
  transition-delay: 1.6s;
}

.navigation.nav-active .nav__list-item:nth-child(10) {
  transition-delay: 1.7s;
}

.submenu {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  left: 100%;
  top: 50%;
  width: 100vw;
  transform: translateY(-50%);
  transition: all 0.3s ease-out;
}
.submenu--mobile {
  padding-left: 7rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  opacity: 1;
  visibility: visible;
  position: absolute;
  top: 50%;
  bottom: 0;
  left: 0;
  z-index: 15;
  height: 100vh;
}
@media only screen and (max-width: 37.5rem) {
  .submenu--mobile {
    padding-left: 1rem;
  }
}
@media only screen and (max-width: 30rem) {
  .submenu--mobile > .submenu-item > button {
    font-size: 2.4rem;
    text-align: left;
  }
}

.submenu-item {
  text-align: left;
  padding: 1rem 0;
  border-top: 1px solid #fff;
  transition: padding 0.3s ease-out;
}
.submenu-item:last-child {
  border-bottom: 1px solid #fff;
}
@media (hover: hover) and (pointer: fine) {
  .submenu-item:hover {
    padding-left: 1rem;
  }
  .submenu-item:hover .submenu-icon {
    opacity: 1;
    visibility: visible;
    width: 1.8rem;
    height: 1.8rem;
  }
}
.submenu-item > a, .submenu-item > button {
  font-family: var(--font-family-text);
  font-size: 2.8rem;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 1.5rem;
  color: #fff;
}
.submenu-item > a::after, .submenu-item > button::after {
  content: none;
}

.submenu-icon {
  width: 0;
  height: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-out;
}

.arrow-back {
  width: 3.6rem;
  height: 2.4rem;
  transform: rotate(180deg);
}

.button-back {
  display: none;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
}
@media only screen and (hover: none) and (pointer: coarse) {
  .button-back {
    display: flex;
  }
}

.ArrowIcon {
  width: 1.5rem;
  height: 2.4rem;
  margin-left: 1.5rem;
}
@media only screen and (max-width: 25.875rem) {
  .ArrowIcon {
    width: 11px;
    height: 17.6px;
  }
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[9].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[13].oneOf[9].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[13].oneOf[9].use[5]!./src/widgets/Header/ui/Header.module.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.Header_Header__fSwpX {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 7rem;
  z-index: 2;
  height: 90px;
  background-color: var(--color-bg);
}
@media only screen and (max-width: 37.5rem) {
  .Header_Header__fSwpX {
    padding: 0 3rem;
    height: 70px;
  }
}

.Header_LogoBox__1pwUo {
  display: flex;
  align-items: center;
  position: relative;
  width: 220px;
  height: 70px;
}
@media only screen and (max-width: 30rem) {
  .Header_LogoBox__1pwUo {
    width: 175px;
    height: 65px;
  }
}

.Header_Nav__list__vOjcD {
  display: flex;
  align-items: center;
  gap: 2rem;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 24px;
  color: #cfcfcf;
}
.Header_Nav__item__VltrW {
  position: relative;
}
.Header_Nav__item__VltrW::after {
  position: absolute;
  content: "";
  bottom: -5px;
  left: 50%;
  width: 0;
  height: 0;
  opacity: 0;
  background-color: var(--color-primary);
  z-index: 1;
  transition: all 300ms linear;
}
@media (hover: hover) and (pointer: fine) {
  .Header_Nav__item__VltrW:hover::after {
    height: 4px;
    opacity: 1;
    left: 0;
    width: 100%;
  }
}
@media only screen and (max-width: 90rem) {
  .Header_Nav__m050M {
    display: none;
  }
}

.Header_Communicate__yaq3c {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0;
}

.Header_Social__uMGfl {
  display: flex;
  gap: 1.5rem;
  position: relative;
}
@media only screen and (max-width: 53rem) {
  .Header_Social__uMGfl {
    display: none;
  }
}

.Header_Icon__gLO8m {
  width: 30px;
  height: 30px;
}

.Header_More__PMO7D {
  font-size: 12px;
  position: absolute;
  bottom: -18px;
  left: 50%;
  color: #cfcfcf;
  width: max-content;
  transform: translateX(-50%);
}

.Header_Hamburger__wYl0K {
  display: block;
  margin-left: 3rem;
}
