/* header */

.nav-evm {
  display: none;
}

.header-evm {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9;
  width: 100%;
  background: var(--deep-blue);
}

.header-container-evm {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
  width: 100%;
  position: relative;
  height: 80px;
  width: 375px;
}

.header-logo-evm {
  width: 74px;
  height: 42px;
}

.menu-btn-evm {
  display: flex;
  justify-content: center;
  align-items: center;

  width: 64px;
  height: 64px;
  transition: all 0.3s ease;
}

.menu-btn-evm:hover {
  transform: scale(1.1);
}

.menu-svg-evm {
  width: 26px;
  height: 18px;
  stroke: var(--l-blue);
}

.nav-list-evm {
  display: flex;
  align-items: center;
  gap: 40px;
}

.nav-item-evm {
  position: relative;
  transition: all 0.3s ease-in-out;
}

.nav-link-evm {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;

  line-height: 150%;
  color: var(--white);
  transition: all 0.3s ease-in-out;
}

.nav-item-evm::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 0;
  height: 1px;
  background: var(--white);
  transition: all 0.3s ease-in-out;
}

.item-active-evm::after {
  width: 100%;
}

.link-active-evm {
  font-weight: 500;
}

.nav-link-evm:hover {
  font-weight: 500;
}

@media screen and (min-width: 1440px) {
  .header-container-evm {
    margin: 0 auto;
    padding: 9.5px 160px 12.5px;
    height: 64px;
    width: 1440px;
  }

  .nav-evm {
    display: block;
  }

  .menu-btn-evm {
    display: none;
  }
}

/* modal  */

.modal-evm {
  position: fixed;
  top: 96px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;

  padding: 16px;
  border-radius: 8px;
  background: var(--deep-blue);
  width: 343px;
}

.menu-nav-list-evm {
  flex-direction: column;
  gap: 0;
}

.menu-nav-link-evm {
  font-weight: 500;
  font-size: 22px;
  line-height: 130%;
  color: var(--l-blue);

  width: 343px;
  height: 56px;
}

/* popup */

.popup-evm {
  position: fixed;
  z-index: 11;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 32px;
  padding: 32px;
  width: 343px;
  background: var(--deep-blue);
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 40px;
}

.popup-text-evm {
  font-family: var(--third-family);
  font-size: 18px;
  line-height: 150%;
  text-align: center;
  color: var(--l-blue);
}

.popup-btn-wrap-evm {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 16px;
}

.popup-btn-evm {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 28px;
  width: 256px;
  height: 55px;

  font-family: var(--second-family);
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;

  transition: all 0.3s ease;
}

.popup-btn-accept-evm {
  background: var(--white);
  color: var(--deep-blue);
}

.popup-btn-decline-evm {
  border: 1px solid var(--white);
  color: var(--white);
}

.popup-btn-evm:hover {
  transform: scaleY(1.2);
}

@media screen and (min-width: 1440px) {
  .popup-evm {
    width: 1262px;
    flex-direction: row;
    gap: 32px;
  }

  .popup-text-evm {
    font-family: var(--second-family);
    text-align: left;
  }

  .popup-btn-wrap-evm {
    flex-direction: row;
    width: fit-content;
    gap: 32px;
  }
}

/* hero  */

#home {
  background: var(--deep-blue);
}

.hero-container-evm {
  padding: 150px 16px 185px;

  display: flex;
  flex-direction: column;
  align-items: center;
}

.hero-title-evm {
  font-weight: 600;
  font-size: 48px;
  line-height: 120%;
  color: var(--mid-blue);

  span {
    color: var(--white);
  }
}

.hero-text-evm {
  line-height: 150%;
  color: var(--white);

  margin-top: 24px;
  margin-bottom: 40px;
}

.hero-link-evm {
  width: 343px;
}

@media screen and (min-width: 1440px) {
  .hero-container-evm {
    padding: 105px 160px 80px 736px;
    align-items: start;
  }

  .hero-title-evm {
    font-size: 64px;
  }

  .hero-text-evm {
    font-size: 18px;
    margin-top: 40px;
  }

  .hero-link-evm {
    width: 288px;
  }

  .hero-line-diag-evm {
    background: url(/images/hero-line-diagram.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    width: 225px;
    height: 282px;

    position: absolute;
    top: 116px;
    left: 164px;
  }

  .hero-circle-diag-evm {
    background: url(/images/hero-circle-diagram.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    width: 280px;
    height: 308px;

    position: absolute;
    left: 376px;
    bottom: 80px;
  }
}

/* story */

.story-text-wrap-evm {
  border-radius: 8px;
  padding: 16px;
  background: var(--l-blue);

  display: flex;
  flex-direction: column;
  gap: 16px;

  p {
    line-height: 150%;
  }
}

@media screen and (min-width: 1440px) {
  .story-text-wrap-evm {
    border-radius: 16px;
    padding: 24px;
    gap: 24px;

    p {
      font-size: 18px;
    }
  }
}

/* services */

.services-container-evm {
  padding-left: 8px;
  padding-right: 8px;
}

.services-list-evm {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 40px;
}

.services-item-evm {
  border-radius: 8px;
  padding: 16px;
  background: var(--l-blue);
  display: flex;
  flex-direction: column;
  gap: 16px;

  div {
    display: flex;
    align-items: center;
    gap: 16px;

    svg {
      width: 32px;
      height: 32px;
      fill: var(--blue);
    }

    h4 {
      font-weight: 500;
      font-size: 18px;
      line-height: 150%;
    }
  }

  p {
    line-height: 150%;
  }
}

@media screen and (min-width: 1440px) {
  .services-title-evm,
  .services-subtitle-evm {
    width: 100%;
  }

  .services-container-evm {
    padding-left: 160px;
    padding-right: 160px;
    display: flex;
    flex-direction: column;
    align-items: end;
  }

  .services-list-evm {
    flex-wrap: wrap;
    flex-direction: row;
    gap: 32px;
  }

  .services-item-evm {
    border-radius: 16px;
    padding: 24px;
    width: 352px;
    height: 150px;

    div {
      h4 {
        font-size: 20px;
      }
    }

    p {
      font-size: 18px;
    }
  }

  .services-link-evm {
    width: 352px;
  }
}

/* partners */

.partners-title-evm,
.partners-subtitle-evm {
  width: 100%;
  text-align: center;
}

.partners-item-evm {
  width: 160px;
  height: 73px;

  img {
    width: 100%;
    height: 100%;
  }
}

@media screen and (min-width: 1440px) {
  .partners-wrapper-evm {
    display: flex;
    gap: 32px;
  }
}

/* video */

#video {
  background: var(--deep-blue);
}

.video-container-evm {
  background: var(--deep-blue);
}

.video-title-evm {
  color: var(--mid-blue);
  width: 100%;
  text-align: center;
}

.video-subtitle-evm {
  color: var(--l-blue);
  width: 100%;
  text-align: center;
}

.video-evm {
  width: 344px;
  height: 193px;
  border-radius: 8px;
}

.video-text-evm {
  line-height: 150%;
  color: var(--l-blue);
  margin-top: 40px;
}

@media screen and (min-width: 1440px) {
  .video-container-evm {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .video-evm {
    border-radius: 16px;
    width: 928px;
    height: 464px;
  }

  .video-text-evm {
    font-size: 18px;
    margin-top: 32px;
    width: 928px;
  }
}

/* testimonials */

.testimonials-item-evm {
  border-radius: 8px;
  padding: 16px;
  width: 256px;
  height: 197px;
  background: var(--l-blue);

  display: flex;
  flex-direction: column;
  align-items: end;
  justify-content: space-between;

  p {
    font-style: italic;
    font-weight: 500;
    font-size: 18px;
    line-height: 150%;
    color: var(--deep-blue);
  }

  div {
    display: flex;
    flex-direction: column;
    align-items: end;

    h4 {
      line-height: 150%;
    }

    span {
      font-size: 11px;
      line-height: 150%;
      color: var(--gray);
    }
  }
}

@media screen and (min-width: 1440px) {
  .testimonials-wrapper-evm {
    display: flex;
    gap: 32px;
  }

  .testimonials-item-evm {
    border-radius: 16px;
    height: 213px;

    p {
      font-size: 20px;
    }

    div {
      h4 {
        font-size: 18px;
      }

      span {
        font-size: 12px;
      }
    }
  }
}

/* faq */

.faq-title-wrap-evm {
  margin-bottom: 40px;
}

.faq-subtitle-evm {
  margin-bottom: 0;
}

.faq-list-evm {
  border-radius: 16px;
  padding: 16px;
  background: var(--l-blue);

  display: flex;
  flex-direction: column;
  gap: 32px;
}

.faq-item-evm {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;

  h4 {
    font-weight: 500;
    font-size: 18px;
    line-height: 150%;
    color: var(--deep-blue);
  }

  p {
    line-height: 150%;
  }
}

.faq-item-evm:not(:last-child)::before {
  content: "";
  width: 100%;
  height: 1px;
  background: var(--blue);
  position: absolute;
  left: 0;
  bottom: -16px;
}

@media screen and (min-width: 1440px) {
  .faq-container-evm {
    display: flex;
    gap: 55px;
  }

  .faq-title-wrap-evm {
    margin-bottom: 0;
  }

  .faq-list-evm {
    padding: 16px 24px;
    width: 832px;
  }

  .faq-item-evm {
    width: 100%;

    h4 {
      font-size: 20px;
    }

    p {
      font-size: 18px;
    }
  }
}

/* contact */

.contact-container-evm {
  padding: 0 16px;
}

.contact-content-evm {
  border-radius: 8px;
  padding: 24px 16px;
  background: var(--deep-blue);
}

.contact-title-evm {
  color: var(--mid-blue);
}

.contact-subtitle-evm {
  color: var(--l-blue);
}

.contact-text-evm {
  font-weight: 500;
  font-size: 18px;
  line-height: 150%;
  color: var(--l-blue);
  margin-bottom: 24px;
}

.contact-list-title-evm {
  font-weight: 500;
  font-size: 18px;
  line-height: 150%;
  color: var(--l-blue);
}

.contact-list-wrap-evm {
  margin-bottom: 40px;
}

.contact-list-evm {
  display: flex;
  flex-direction: column;
}

.contact-item-evm {
  p {
    font-style: normal;
    line-height: 150%;
    color: var(--l-blue);
  }

  a {
    font-style: normal;
    line-height: 150%;
    color: var(--l-blue);
  }
}

.contact-link-evm {
  width: 311px;
}

@media screen and (min-width: 1440px) {
  .contact-container-evm {
    padding: 0 160px;
  }

  .contact-content-evm {
    border-radius: 16px;
    padding: 32px;
    position: relative;
  }

  .contact-text-evm {
    font-size: 20px;
  }

  .contact-list-title-evm {
    font-size: 20px;
  }

  .contact-list-wrap-evm {
    margin-bottom: 0;
  }

  .contact-item-evm {
    p {
      font-size: 20px;
    }

    a {
      font-size: 20px;
    }
  }

  .contact-link-evm {
    width: 256px;

    position: absolute;
    right: 32px;
    bottom: 32px;
  }
}

/* footer */

.footer-container-evm {
  padding: 8px 16px;
  width: 375px;
}

.footer-content-evm {
  border-radius: 8px;
  padding: 8px 16px;
  background: var(--deep-blue);
  color: var(--blue);

  display: flex;
  flex-direction: column;
  gap: 40px;
}

.footer-text-evm {
  line-height: 150%;
}

.footer-links-list-evm {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-links-item-evm {
  p {
    line-height: 150%;
  }
}

.footer-text-author-evm {
  font-size: 11px;
}

@media screen and (min-width: 1440px) {
  .footer-container-evm {
    padding: 16px 160px;
    width: 1440px;
  }

  .footer-content-evm {
    border-radius: 16px;
    padding: 24px 32px 8px;

    gap: 126px;
    position: relative;
  }

  .footer-website-evm {
    font-size: 18px;
  }

  .footer-links-list-evm {
    position: absolute;
    top: 24px;
    right: 32px;
    align-items: end;
  }

  .footer-links-item-evm {
    p {
      font-size: 18px;
      text-align: right;
    }
  }

  .footer-text-author-evm {
    font-size: 12px;
  }
}

/* ********************* */

.hidden-evm {
  display: none;
}
