:root {
  --color-black: #000;
  --font-instrument: Instrument Sans, Tahoma, sans-serif;
}
body,
div,
dl,
dt,
dd,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset,
img,
abbr {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}
ul li {
  list-style: none;
}
caption,
th {
  text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
sup {
  vertical-align: text-top;
}
sub {
  vertical-align: text-bottom;
}
input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
legend {
  color: #212121;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
main {
  display: block;
}
img,
svg {
  width: 100%;
  display: block;
  height: auto;
}
mark {
  background: none;
  color: inherit;
}
html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}
body {
  font-family: var(--font-instrument);
  line-height: 1.3;
  font-size: 3.89vw;
  color: #fff;
  background: #000;
  font-weight: 400;
  font-style: normal;
}
@media (min-width: 1250px) {
  body {
    font-size: 0.83vw;
  }
}
* {
  box-sizing: border-box;
  max-height: 100000px;
}
a {
  color: inherit;
  outline: none;
  text-decoration: none;
  text-decoration-thickness: 1px;
  -webkit-text-decoration-skip-ink: none;
          text-decoration-skip-ink: none;
  text-underline-offset: 0.2em;
}
button,
[role="button"] {
  cursor: pointer;
  outline: none;
}
strong {
  font-weight: 700;
}
.main {
  min-height: 80vh;
  min-width: 320px;
}
.container {
  position: relative;
  z-index: 1;
  padding: 0 4.44vw;
}
@media (min-width: 760px) {
  .container {
    max-width: 83.33vw;
    padding: 0;
    margin: 0 auto;
  }
}
@media (min-width: 1250px) {
  .container {
    max-width: 88.63vw;
  }
}
.text-center {
  text-align: center;
}
.d-inline-block {
  display: inline-block;
}
[hidden],
.hidden {
  display: none !important;
}
.d-flex {
  display: flex;
  flex-wrap: wrap;
}
.flex-nowrap {
  flex-wrap: nowrap !important;
}
.direction-row {
  flex-direction: row;
}
.direction-column {
  flex-direction: column;
}
.d-grid {
  display: grid;
}
@media (max-width: 1249px) {
  .mobile-hidden {
    display: none;
  }
}
@media (min-width: 1250px) {
  .desktop-hidden {
    display: none;
  }
}
.svg-fill {
  fill: currentColor;
}
.svg-stroke {
  stroke: currentColor;
}
.logo {
  max-width: 200px;
}
.phone {
  white-space: nowrap;
}
.toggle {
  display: block;
  width: 34px;
  padding: 0;
  background: transparent;
  border: 0px;
  text-align: center;
  cursor: pointer;
  outline: none;
}
.toggle span {
  display: block;
  width: 100%;
  height: 3px;
  background: green;
}
.toggle span:nth-child(2) {
  margin: 5px 0;
}
.close {
  display: block;
  position: relative;
  padding: 5px;
  background: none;
  border: 0px;
  outline: none;
  cursor: pointer;
  transition: 0.3s color;
  color: green;
}
.close svg,
.close img {
  width: 1rem;
  height: 1rem;
  fill: currentColor;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: none;
}
.btn1 {
  display: inline-block;
  width: 100%;
  max-width: 200px;
  padding: 15px 15px 16px;
  border: none;
  cursor: pointer;
  outline: none;
  background: green;
  text-align: center;
  text-decoration: none;
  color: #fff;
  font-family: var(--font-gilroy);
  transition-duration: 0.4s;
  transition-property: background;
}
.btn1:hover {
  background: #004d00;
  text-decoration: none;
}
.top {
  letter-spacing: -0.04em;
  background: url(../img/bg_mobile.webp) center / cover no-repeat;
}
.top > .container {
  padding-top: 6.44vw;
  padding-bottom: 7.5vw;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100svh;
}
.top__logo {
  position: relative;
  display: block;
  width: 35.56vw;
}
.top__title {
  margin-top: 7.4vw;
  display: block;
  font-family: var(--font-instrument);
  font-weight: 700;
  line-height: 0.85;
  font-size: 13.89vw;
  letter-spacing: -0.04em;
}
.top__advants {
  margin-top: 6.7vw;
  margin-bottom: 10vw;
  display: flex;
  gap: 6vw;
  line-height: 1.1;
  font-size: 4.44vw;
}
.top__advants li {
  width: 40%;
}
.top__bottom {
  margin-top: auto;
}
.top__emails a {
  font-weight: 500;
  letter-spacing: -0.02em;
  font-size: 6.11vw;
  display: inline-block;
  position: relative;
}
.top__emails a::after {
  content: '';
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  height: 1px;
  background: currentColor;
  width: 100%;
  transition: 0.5s width ease-out;
}
.top__mess {
  display: flex;
  gap: 2vw;
}
.top__mess li {
  width: 10vw;
  color: #fff;
}
.top__mess li a {
  display: block;
  border-radius: 50%;
}
@media (min-width: 760px) and (orientation: portrait) {
  .top {
    background-image: url(../img/bg_tablet.webp);
  }
  .top > .container {
    padding-top: 7.8vw;
    padding-bottom: 7.8vw;
  }
  .top__logo {
    width: 84.375vw;
  }
  .top__title {
    position: absolute;
    left: -0.4vw;
    bottom: 7.2vw;
    font-size: 10.16vw;
    margin: 0;
  }
  .top__bottom {
    position: relative;
    z-index: 10;
    text-align: right;
  }
  .top__emails a {
    font-size: 2.86vw;
  }
  .top__mess {
    gap: 0.5vw;
    justify-content: flex-end;
    margin-bottom: -1vw;
  }
  .top__mess li {
    width: 4.6875vw;
  }
  .top__advants {
    margin-top: 5.6vw;
    margin-bottom: 0;
    font-size: 3.26vw;
    gap: 2.5vw;
  }
  .top__advants li {
    width: 32%;
  }
}
@media (min-width: 1250px), (min-width: 760px) and (orientation: landscape) {
  .top {
    background-image: url(../img/bg.webp);
  }
  .top > .container {
    padding-top: 3.6vw;
    padding-bottom: 3.6vw;
  }
  .top__logo {
    width: 52.34vw;
    margin-left: auto;
  }
  .top__title {
    position: absolute;
    left: 0;
    bottom: 3.6vw;
    font-size: 5.625vw;
    width: 60vw;
  }
  .top__advants {
    margin: 0;
    position: absolute;
    top: 4.55vw;
    left: 0;
    font-size: 1.3vw;
    gap: 0.73vw;
  }
  .top__advants li {
    width: 11vw;
  }
  .top__mess {
    gap: 0.5vw;
    justify-content: flex-end;
    margin-bottom: 0.5vw;
  }
  .top__mess li {
    width: 2.5vw;
  }
  .top__bottom {
    position: relative;
    z-index: 10;
    text-align: right;
  }
  .top__emails a {
    font-size: 1.56vw;
  }
}
@media (hover: hover) {
  .top__mess a {
    --color-curr: #fff;
    color: var(--color-curr);
    transition: 0.3s color, 0.3s background;
    background: transparent;
  }
  .top__mess a[data-mess="tg"]:hover {
    --color-curr: #29A9EA;
    background: #fff;
  }
  .top__mess a[data-mess="we"]:hover {
    --color-curr: #03E16E;
    background: #fff;
  }
  .top__emails a:hover::after {
    width: 0;
  }
}
.moda {
  z-index: 100;
  padding: 10vw 0 0;
  border: 0;
  background: none;
}
.moda::backdrop {
  background: #000000;
  opacity: 0.6;
}
.moda__wrap {
  width: 90vw;
  margin: auto;
}
.moda__close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
  width: 10vw;
  padding: 0;
  background: none;
  border: 0;
  outline: none;
  color: #fff;
  transition: 0.3s opacity;
}
.moda__close svg {
  pointer-events: none;
}
@media (orientation: landscape) {
  .moda {
    padding: 0.5vw 3.5vw;
  }
  .moda__wrap {
    width: auto;
  }
  .moda__wrap img {
    height: 90vh;
    width: auto;
  }
  .moda__close {
    width: 2.5vw;
  }
}
@media (hover: hover) {
  .moda__close {
    opacity: 0.6;
  }
  .moda__close:hover {
    opacity: 1;
  }
}
/*# sourceMappingURL=header.css.map */
/*# sourceMappingURL=header.css.map */
