@charset "UTF-8";
/*=================================Fonts======================================*/
@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Black.ttf") format("truetype");
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Black.woff2") format("woff2");
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Inter";
  src: url("../assets/fonts/Inter-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/Montserrat-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/Montserrat-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/Montserrat-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("../assets/fonts/Montserrat-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

/*=================================Colors=====================================*/
:root {
  --theme-main: #FFFFFF;
  --theme-accent-blue: #24B7E6;
  --theme-accent-green: #24E6B5;
  --theme-gray: #383838;
}

/*===================================Null=====================================*/
*, *:before, *:after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
}

:focus {
  outline: none !important;
}

::-moz-focus-outer, ::-moz-focus-inner {
  border: 0px !important;
  padding: 0;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  -webkit-tap-highlight-color: transparent;
}

a:focus, a:active, button:focus {
  outline: 0 !important;
  outline-color: transparent !important;
  outline-width: 0 !important;
  outline-style: none !important;
  box-shadow: 0 0 0 0 rgba(0, 123, 255, 0) !important;
}

input, textarea, input:active, textarea:active {
  outline: none;
}

html, body {
  min-height: 100vh;
}

.wrapper {
  width: 100%;
  overflow: hidden;
  position: relative;
  background: white;
}

body {
  font-family: 'Inter', sans-serif;
  color: var(--theme-main);
  max-width: 100vw;
  height: 100%;
  min-width: 320px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.lock {
  overflow: hidden;
}

.container {
  max-width: 1200px;
  padding-right: 40px;
  padding-left: 40px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .container {
    padding-right: 20px;
    padding-left: 20px;
  }
}

section {
  padding: 50px 0;
}

/*===================================Text=====================================*/
h1, h2, h3, h4 {
  font-weight: 400;
  line-height: 130%;
}

h1 {
  font-size: 36px;
  font-weight: 900;
}

h2 {
  font-size: 24px;
}

h3 {
  font-size: 18px;
}

h4 {
  font-size: 12px;
}

a {
  text-decoration: none;
}

ul {
  list-style: none;
}

address {
  font-style: normal;
}

/*==============================TextTemplate==================================*/
.font-weight-700 {
  font-weight: 700;
}

.font-weight-600 {
  font-weight: 600;
}

.font-weight-500 {
  font-weight: 500;
}

.font-weight-400 {
  font-weight: 400;
}

.text-accent-blue {
  color: var(--theme-accent-blue);
}

.text-accent-green {
  color: var(--theme-accent-green);
}

.old-price, .purchase__wrapper__options .purchase__cart_item > div .purchase__cart_item_old-price {
  font-weight: 700;
  font-size: 16px;
  color: rgba(56, 56, 56, 0.5);
  text-decoration: line-through;
}

/*================================Template====================================*/
.flex-c-b, .header__wrapper, .footer__wrapper__top-nav, .footer__wrapper__bottom-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.flex-c, .main__wrapper .main__content__info, .main__wrapper .main__content__info_item, .main__wrapper .main__content__buttons, .footer__wrapper__top-nav ul, .footer__wrapper__social, .footer__wrapper__bottom-nav .designer-logo {
  display: flex;
  align-items: center;
}

.flex-c-c, .header__wrapper_left, .header__wrapper_left .header__geo-selector, .header__wrapper_right, .header__wrapper_right .header__menu, .header__wrapper_right .header__contact, .bikes__wrapper__cards_item.new::before, .scooters__wrapper__cards_item.new::before, .sale__wrapper__cards_item.new::before, .products__wrapper__cards_item.new::before, .faq__wrapper .faq__content__card_more, .details-popup .details__close-btn, .login__wrapper, .login__wrapper form {
  display: flex;
  align-items: center;
  justify-content: center;
}

.main-field, .subscribe-popup__wrapper_bottom form .new-select {
  padding: 10px 18px;
  background: var(--theme-gray);
  margin-bottom: 18px;
  border: 1px solid var(--theme-accent-blue);
  border-radius: 10px;
  font-family: 'Inter';
  font-size: 21px;
  line-height: 130%;
  color: var(--theme-main);
}

.transparent-field {
  width: 100%;
  border: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  font-family: 'Inter';
  font-weight: 500;
  font-size: 24px;
  line-height: 130%;
  color: var(--theme-gray);
  padding-bottom: 6px;
  padding-left: 2px;
}

.transparent-field::placeholder {
  font-family: 'Inter';
  font-weight: 500;
  opacity: 0.5;
  color: var(--theme-gray);
}

/*================================Buttons=====================================*/
.main-btn, .white-btn, .gray-btn, .blue-btn, .blue-white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .white-btn {
  outline: none;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  outline: none;
  cursor: pointer;
  border-radius: 110px;
  color: var(--theme-main);
  text-align: center;
  text-transform: uppercase;
  font-family: 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 700;
  padding: 1rem 1.5rem;
  transition: all .5s ease-in-out;
}

.main-btn:hover, .white-btn:hover, .gray-btn:hover, .blue-btn:hover, .blue-white-btn:hover, .subscribe__wrapper__details_shipping > div:first-of-type .white-btn:hover {
  transition: all .5s ease-in-out;
}

.main-btn.scale-animation, .scale-animation.white-btn, .scale-animation.gray-btn, .scale-animation.blue-btn, .scale-animation.blue-white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .scale-animation.white-btn {
  transform: scale(1);
}

.main-btn.scale-animation:hover, .scale-animation.white-btn:hover, .scale-animation.gray-btn:hover, .scale-animation.blue-btn:hover, .scale-animation.blue-white-btn:hover, .subscribe__wrapper__details_shipping > div:first-of-type .scale-animation.white-btn:hover {
  transform: scale(1.03);
}

.main-btn.disabled, .disabled.white-btn, .disabled.gray-btn, .disabled.blue-btn, .disabled.blue-white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .disabled.white-btn {
  filter: grayscale(60%);
  cursor: default;
}

.main-btn.disabled:hover, .disabled.white-btn:hover, .disabled.gray-btn:hover, .disabled.blue-btn:hover, .disabled.blue-white-btn:hover, .subscribe__wrapper__details_shipping > div:first-of-type .disabled.white-btn:hover {
  transform: scale(1);
}

.white-btn {
  color: var(--theme-gray);
  background-color: white;
  border: 1px solid var(--theme-gray);
}

.gray-btn {
  background-color: var(--theme-gray);
  border: 1px solid var(--theme-gray);
}

.blue-btn, .blue-white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .white-btn {
  background-color: var(--theme-accent-blue);
  color: var(--theme-gray);
  font-size: 16px;
  border-radius: 10px;
  padding: 0.625rem 1.688rem;
  font-weight: 700;
  min-height: 44px;
}

.blue-white-btn {
  border-radius: 110px;
  width: 100%;
  max-width: 346px;
  color: white;
  padding: 18px 90px;
}

/*=================================Header=====================================*/
.header {
  background: var(--theme-accent-blue);
}

.header__wrapper {
  padding-top: 32px;
  padding-bottom: 32px;
}

.header__wrapper_left .header__logo a {
  display: block;
}

@media (max-width: 820px) {
  .header__wrapper_left .header__logo img {
    width: 250px;
  }
}

@media (max-width: 420px) {
  .header__wrapper_left .header__logo img {
    width: 200px;
  }
}

.header__wrapper_left .header__geo-selector {
  position: relative;
  cursor: pointer;
  margin-left: 20px;
  border: 1px solid #FFFFFF;
  border-radius: 92px;
  padding: 4px 12px 4px 4px;
  z-index: 2;
}

@media (max-width: 600px) {
  .header__wrapper_left .header__geo-selector {
    display: none;
  }
}

.header__wrapper_left .header__geo-selector span {
  color: var(--theme-gray);
  font-weight: 500;
  font-size: 12px;
  line-height: 130%;
}

@media (max-width: 960px) {
  .header__wrapper_left .header__geo-selector span {
    font-size: 16px;
  }
}

.header__wrapper_left .header__geo-selector.show:before {
  opacity: 1;
}

.header__wrapper_left .header__geo-selector.show:after {
  opacity: 1;
}

.header__wrapper_left .header__geo-selector.show svg {
  fill: var(--theme-gray);
}

.header__wrapper_left .header__geo-selector.show .header__geo-selector__wrapper {
  opacity: 1;
  visibility: visible;
}

.header__wrapper_left .header__geo-selector:before {
  content: '';
  position: absolute;
  z-index: -1;
  opacity: 0;
  top: -6px;
  left: -6px;
  width: calc(100% + 6px * 2);
  height: calc(100% + 6px);
  background-color: white;
  border-radius: 14px 14px 0 0;
  transition: all .3s ease-in-out;
  box-shadow: 5px 0px 4px rgba(0, 0, 0, 0.25);
}

.header__wrapper_left .header__geo-selector:after {
  content: '';
  position: absolute;
  z-index: 10;
  opacity: 0;
  top: -1px;
  left: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border-radius: 14px;
  border: 2px solid var(--theme-gray);
  transition: all .3s ease-in-out;
}

.header__wrapper_left .header__geo-selector svg {
  margin-right: 6px;
  fill: white;
  transition: all .3s ease-in-out;
}

@media (max-width: 960px) {
  .header__wrapper_left .header__geo-selector svg {
    width: 22px;
    height: 22px;
  }
}

.header__wrapper_left .header__geo-selector__wrapper {
  position: absolute;
  opacity: 0;
  visibility: hidden;
  z-index: 10;
  top: 24px;
  left: -6px;
  width: 290px;
  height: max-content;
  padding: 14px;
  background-color: var(--theme-main);
  box-shadow: 13px 16px 12px rgba(0, 0, 0, 0.25);
  border-radius: 0 10px 10px 10px;
  cursor: default;
  transition: all .3s ease-in-out;
}

@media (max-width: 960px) {
  .header__wrapper_left .header__geo-selector__wrapper {
    top: 30px;
  }
}

.header__wrapper_left .header__geo-selector__wrapper span {
  font-weight: 700;
  font-size: 12px;
  color: var(--theme-accent-blue);
  margin-bottom: 8px;
  max-width: 160px;
  display: block;
  text-transform: uppercase;
}

.header__wrapper_left .header__geo-selector__wrapper ul li {
  font-size: 12px;
  margin-right: 8px;
  color: var(--theme-gray);
  transition: all .3s ease-in-out;
  cursor: pointer;
  display: inline-flex;
}

.header__wrapper_left .header__geo-selector__wrapper ul li:hover {
  transition: all .3s ease-in-out;
  color: var(--theme-accent-blue);
  text-shadow: 0 0 0.4px var(--theme-accent-blue), 0 0 0.4px var(--theme-accent-blue);
}

.header__wrapper_left .header__geo-selector__wrapper ul li.active {
  font-weight: 600;
  color: var(--theme-gray) !important;
  text-shadow: none !important;
}

@media (max-width: 1000px) {
  .header__wrapper_right .header__menu {
    display: none;
  }
}

.header__wrapper_right .header__menu > li:not(:last-child) {
  margin-right: 26px;
}

.header__wrapper_right .header__menu li ul ~ a {
  cursor: pointer;
}

.header__wrapper_right .header__menu li:hover ul {
  opacity: 1;
  visibility: visible;
}

.header__wrapper_right .header__menu li:hover ul ~ a {
  color: var(--theme-gray);
  text-shadow: 0 0 0.4px var(--theme-gray), 0 0 0.4px var(--theme-gray);
  transition: all .3s ease-in-out;
}

.header__wrapper_right .header__menu li:hover ul ~ a:after {
  opacity: 1;
  transition: all .3s ease-in-out;
}

.header__wrapper_right .header__menu li > ul {
  opacity: 0;
  visibility: hidden;
  position: absolute;
  top: 100%;
  left: -12px;
  z-index: 10;
  background: white;
  padding: 12px;
  border-radius: 0 10px 10px 10px;
  width: max-content;
  transition: all .3s ease-in-out;
  box-shadow: 6px 6px 5px rgba(0, 0, 0, 0.25);
}

.header__wrapper_right .header__menu li > ul li {
  margin-left: 12px;
}

.header__wrapper_right .header__menu li > ul li:before {
  content: '';
  position: absolute;
  top: 60%;
  transform: translateY(-50%);
  left: -10px;
  width: 4px;
  height: 4px;
  background: var(--theme-gray);
  border-radius: 50%;
  transition: all .3s ease;
}

.header__wrapper_right .header__menu li > ul li:hover:before {
  background: var(--theme-accent-blue);
}

.header__wrapper_right .header__menu li > ul a {
  color: var(--theme-gray);
  text-transform: lowercase;
  transition: all .5s ease;
}

.header__wrapper_right .header__menu li > ul a:hover {
  color: var(--theme-accent-blue);
  text-shadow: 0 0 0.5px var(--theme-accent-blue), 0 0 0.5px var(--theme-accent-blue);
  transition: all .5s ease;
}

.header__wrapper_right .header__menu li > ul ~ a {
  position: relative;
  z-index: 2;
}

.header__wrapper_right .header__menu li > ul ~ a:after {
  content: '';
  position: absolute;
  z-index: -1;
  top: -11px;
  left: -12px;
  width: calc(100% + 12px * 2);
  height: calc(100% + 12px);
  background-color: white;
  border-radius: 10px 10px 0 0;
  opacity: 0;
  transition: all .3s ease-in-out;
  box-shadow: 5px 0px 4px rgba(0, 0, 0, 0.25);
}

.header__wrapper_right .header__menu li {
  position: relative;
}

.header__wrapper_right .header__menu li a {
  color: var(--theme-main);
  text-transform: uppercase;
  font-weight: 500;
  font-size: 12px;
  line-height: 130%;
  transition: all .5s ease;
}

.header__wrapper_right .header__menu li a:hover {
  color: var(--theme-gray);
  transition: all .5s ease;
}

.header__wrapper_right .header__menu-mobile {
  display: none;
  cursor: pointer;
}

@media (max-width: 1000px) {
  .header__wrapper_right .header__menu-mobile {
    display: block;
  }
}

.header__wrapper_right .header__menu-mobile__wrapper {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: fixed;
  z-index: 30;
  top: 0;
  right: -100%;
  width: 320px;
  height: 100%;
  min-height: 100%;
  overflow-y: auto;
  background-color: var(--theme-accent-green);
  padding: 40px;
  border-radius: 40px 0px 0px 40px;
  transition: all .3s ease-in-out;
}

@media (max-width: 350px) {
  .header__wrapper_right .header__menu-mobile__wrapper {
    width: 100%;
    border-radius: 0;
    padding: 20px;
  }
}

.header__wrapper_right .header__menu-mobile__wrapper.show {
  right: 0;
}

.header__wrapper_right .header__menu-mobile__wrapper > svg {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 45px;
  right: 20px;
}

@media (max-width: 350px) {
  .header__wrapper_right .header__menu-mobile__wrapper > svg {
    top: 25px;
  }
}

.header__wrapper_right .header__menu-mobile__wrapper_top > a {
  display: block;
  margin-bottom: 48px;
  width: max-content;
}

.header__wrapper_right .header__menu-mobile__wrapper_top > a img {
  width: 185px;
}

.header__wrapper_right .header__menu-mobile__wrapper_top ul li {
  position: relative;
  text-transform: uppercase;
  margin-bottom: 16px;
  padding-left: 18px;
  font-size: 20px;
  font-weight: 700;
  line-height: 26px;
}

.header__wrapper_right .header__menu-mobile__wrapper_top ul li:before {
  content: '';
  position: absolute;
  width: 8px;
  height: 8px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  border-radius: 50%;
  background-color: white;
}

.header__wrapper_right .header__menu-mobile__wrapper_top ul li a {
  color: var(--theme-gray);
}

.header__wrapper_right .header__menu-mobile__wrapper_bottom .gray-btn {
  font-size: 18px;
  padding: 18px 30px;
  margin-bottom: 28px;
}

.header__wrapper_right .header__menu-mobile__wrapper_bottom h1 {
  font-weight: 900;
  font-size: 26px;
  line-height: 120%;
}

.header__wrapper_right .header__menu-mobile__wrapper_bottom h1 a {
  color: var(--theme-gray);
}

.header__wrapper_right .header__menu-mobile__wrapper_bottom h2 {
  font-weight: 500;
  font-size: 14px;
  line-height: 130%;
  color: var(--theme-gray);
  margin-top: 12px;
  margin-bottom: 24px;
}

.header__wrapper_right .header__menu-mobile__wrapper_bottom .header__menu-mobile__social {
  display: flex;
}

.header__wrapper_right .header__menu-mobile__wrapper_bottom .header__menu-mobile__social svg {
  display: block;
  width: 25.5px;
  height: 25.5px;
}

.header__wrapper_right .header__menu-mobile__wrapper_bottom .header__menu-mobile__social a:not(:last-child) {
  margin-right: 12px;
}

.header__wrapper_right .header__contact {
  margin-left: 32px;
}

@media (max-width: 1160px) {
  .header__wrapper_right .header__contact {
    margin-left: 16px;
  }
}

.header__wrapper_right .header__contact .white-btn {
  padding: 5px 10px;
  color: var(--theme-accent-blue);
  border-right: 92px;
  font-size: 12px;
  border: none;
}

.header__wrapper_right .header__contact a {
  margin-left: 6px;
}

@media (max-width: 1160px) {
  .header__wrapper_right .header__contact a:first-child {
    display: none;
  }
}

.header__wrapper_right .header__contact svg {
  display: block;
}

@media (max-width: 1000px) {
  .header__wrapper_right .header__contact svg {
    display: none;
  }
}

/*==================================Main======================================*/
.main {
  padding: 0;
}

.main__wrapper {
  background: var(--theme-accent-blue);
}

.main__wrapper .main__content {
  position: relative;
  padding-bottom: 60px;
  padding-top: 32px;
}

.main__wrapper .main__content:before {
  content: '';
  position: absolute;
  z-index: 1;
  left: 450px;
  top: 60px;
  height: 620px;
  width: 100%;
  background: url("../assets/images/green-bike.png") center no-repeat;
}

@media (max-width: 1200px) {
  .main__wrapper .main__content:before {
    left: calc(550px + (450 - 550) * ((100vw - 1000px) / (1200 - 1000)));
  }
}

@media (max-width: 960px) {
  .main__wrapper .main__content:before {
    right: calc(-80px + (0 - -80) * ((100vw - 768px) / (960 - 768)));
    width: 450px;
    left: initial;
    background-position-x: left;
  }
}

@media (max-width: 920px) {
  .main__wrapper .main__content:before {
    top: 100px;
  }
}

@media (max-width: 600px) {
  .main__wrapper .main__content:before {
    top: 36vw;
    right: -20px;
    height: 540px;
    width: 380px;
    background-size: cover;
  }
}

@media (max-width: 480px) {
  .main__wrapper .main__content:before {
    top: 180px;
    left: 30%;
  }
}

@media (max-width: 340px) {
  .main__wrapper .main__content:before {
    top: 100px;
    left: 160px;
  }
}

.main__wrapper .main__content h1 {
  max-width: 800px;
  text-transform: uppercase;
  font-weight: 800;
  font-size: 92px;
  line-height: 105%;
  letter-spacing: 0.005em;
  color: var(--theme-gray);
}

.main__wrapper .main__content h1 span {
  color: white;
}

@media (max-width: 960px) {
  .main__wrapper .main__content h1 {
    font-size: 76px;
    max-width: 650px;
  }
}

@media (max-width: 680px) {
  .main__wrapper .main__content h1 {
    font-size: 64px;
    max-width: 500px;
  }
}

@media (max-width: 600px) {
  .main__wrapper .main__content h1 {
    font-size: 11vw;
    max-width: 510px;
  }
}

@media (max-width: 480px) {
  .main__wrapper .main__content h1 {
    font-size: 10.769vw;
    max-width: initial;
  }
}

.main__wrapper .main__content__info {
  padding-top: 24px;
  padding-bottom: 60px;
}

@media (max-width: 920px) {
  .main__wrapper .main__content__info {
    flex-direction: column-reverse;
    align-items: flex-start;
  }
}

.main__wrapper .main__content__info_item:not(:last-child) {
  margin-right: 24px;
}

@media (max-width: 480px) {
  .main__wrapper .main__content__info_item:not(:last-child) {
    margin-right: 0;
  }
}

@media (max-width: 920px) {
  .main__wrapper .main__content__info_item:last-child {
    margin-bottom: 24px;
  }
}

.main__wrapper .main__content__info_item h4 {
  max-width: 160px;
}

@media (max-width: 920px) {
  .main__wrapper .main__content__info_item h4 {
    font-size: 16px;
    max-width: 220px;
  }
}

.main__wrapper .main__content__info_item svg {
  margin-right: 12px;
}

.main__wrapper .main__content__buttons {
  position: relative;
  z-index: 3;
}

@media (max-width: 600px) {
  .main__wrapper .main__content__buttons {
    flex-direction: column-reverse;
    align-items: flex-start;
  }
}

.main__wrapper .main__content__buttons a {
  min-width: 260px;
}

.main__wrapper .main__content__buttons a:not(:last-child) {
  margin-right: 30px;
}

@media (max-width: 600px) {
  .main__wrapper .main__content__buttons a:last-child {
    margin-bottom: 30px;
  }
}

.main__wrapper .main__bg {
  height: 120px;
  background: white;
}

/*=================================About======================================*/
.about__wrapper, .faq__wrapper {
  position: relative;
}

.about__wrapper .about__content, .about__wrapper .faq__content, .faq__wrapper .about__content, .faq__wrapper .faq__content {
  display: flex;
  justify-content: space-between;
  position: relative;
  z-index: 2;
  padding-top: 40px;
  min-height: 470px;
}

@media (max-width: 1000px) {
  .about__wrapper .about__content, .about__wrapper .faq__content, .faq__wrapper .about__content, .faq__wrapper .faq__content {
    padding-top: 60px;
  }
}

@media (max-width: 680px) {
  .about__wrapper .about__content, .about__wrapper .faq__content, .faq__wrapper .about__content, .faq__wrapper .faq__content {
    flex-direction: column;
  }
}

.about__wrapper .about__content:before, .about__wrapper .faq__content:before, .faq__wrapper .about__content:before, .faq__wrapper .faq__content:before {
  content: '';
  position: absolute;
  z-index: 1;
  left: 88px;
  top: 60px;
  height: 388px;
  width: 350px;
  background: url("../assets/images/black-bike.png") center no-repeat;
}

@media (max-width: 1000px) {
  .about__wrapper .about__content:before, .about__wrapper .faq__content:before, .faq__wrapper .about__content:before, .faq__wrapper .faq__content:before {
    left: -70px;
    top: 180px;
    height: 500px;
    width: 420px;
    background: url("../assets/images/black-bike.png") center/cover no-repeat;
    transform: rotateY(180deg);
  }
}

.about__wrapper .about__content__title h1, .about__wrapper .faq__content__title h1, .faq__wrapper .about__content__title h1, .faq__wrapper .faq__content__title h1 {
  color: var(--theme-gray);
  text-transform: uppercase;
  font-weight: 900;
  max-width: 200px;
}

.about__wrapper .about__content__title h2, .about__wrapper .faq__content__title h2, .faq__wrapper .about__content__title h2, .faq__wrapper .faq__content__title h2 {
  color: var(--theme-main);
  font-weight: 400;
}

.about__wrapper .about__content__cards, .about__wrapper .faq__content__cards, .faq__wrapper .about__content__cards, .faq__wrapper .faq__content__cards {
  display: flex;
  padding-top: 100px;
  counter-reset: cards;
  justify-content: flex-end;
}

@media (max-width: 1000px) {
  .about__wrapper .about__content__cards, .about__wrapper .faq__content__cards, .faq__wrapper .about__content__cards, .faq__wrapper .faq__content__cards {
    flex-direction: column;
  }
}

@media (max-width: 680px) {
  .about__wrapper .about__content__cards, .about__wrapper .faq__content__cards, .faq__wrapper .about__content__cards, .faq__wrapper .faq__content__cards {
    margin-top: 32px;
    margin-left: auto;
    margin-right: -32px;
  }
}

@media (max-width: 520px) {
  .about__wrapper .about__content__cards, .about__wrapper .faq__content__cards, .faq__wrapper .about__content__cards, .faq__wrapper .faq__content__cards {
    margin-left: 24px;
  }
}

.about__wrapper .about__content__cards_item, .about__wrapper .faq__content__cards_item, .faq__wrapper .about__content__cards_item, .faq__wrapper .faq__content__cards_item {
  position: relative;
  min-width: 280px;
  width: 38%;
}

@media (max-width: 1000px) {
  .about__wrapper .about__content__cards_item, .about__wrapper .faq__content__cards_item, .faq__wrapper .about__content__cards_item, .faq__wrapper .faq__content__cards_item {
    width: 100%;
    max-width: 470px;
  }
}

.about__wrapper .about__content__cards_item-content, .about__wrapper .faq__content__cards_item-content, .faq__wrapper .about__content__cards_item-content, .faq__wrapper .faq__content__cards_item-content {
  position: relative;
  z-index: 2;
  padding: 32px;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  background-color: var(--theme-gray);
  transition: all .3s ease;
}

.about__wrapper .about__content__cards_item-content:hover, .about__wrapper .faq__content__cards_item-content:hover, .faq__wrapper .about__content__cards_item-content:hover, .faq__wrapper .faq__content__cards_item-content:hover {
  box-shadow: 13px 16px 12px rgba(0, 0, 0, 0.25);
  transition: all .3s ease;
}

.about__wrapper .about__content__cards_item:before, .about__wrapper .faq__content__cards_item:before, .faq__wrapper .about__content__cards_item:before, .faq__wrapper .faq__content__cards_item:before {
  content: "0" counter(cards);
  counter-increment: cards;
  position: absolute;
  top: -132px;
  left: 32px;
  font-size: 140px;
  font-weight: 700;
  letter-spacing: -0.04em;
}

@media (max-width: 1000px) {
  .about__wrapper .about__content__cards_item:before, .about__wrapper .faq__content__cards_item:before, .faq__wrapper .about__content__cards_item:before, .faq__wrapper .faq__content__cards_item:before {
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (max-width: 680px) {
  .about__wrapper .about__content__cards_item:before, .about__wrapper .faq__content__cards_item:before, .faq__wrapper .about__content__cards_item:before, .faq__wrapper .faq__content__cards_item:before {
    transform: initial;
    left: initial;
    right: 64px;
  }
}

.about__wrapper .about__content__cards_item:not(:last-child), .about__wrapper .faq__content__cards_item:not(:last-child), .faq__wrapper .about__content__cards_item:not(:last-child), .faq__wrapper .faq__content__cards_item:not(:last-child) {
  margin-right: 32px;
}

@media (max-width: 680px) {
  .about__wrapper .about__content__cards_item:not(:last-child), .about__wrapper .faq__content__cards_item:not(:last-child), .faq__wrapper .about__content__cards_item:not(:last-child), .faq__wrapper .faq__content__cards_item:not(:last-child) {
    margin-right: 0;
  }
}

.about__wrapper .about__content__cards_item:last-child h2, .about__wrapper .faq__content__cards_item:last-child h2, .faq__wrapper .about__content__cards_item:last-child h2, .faq__wrapper .faq__content__cards_item:last-child h2 {
  margin-right: 28%;
}

@media (max-width: 1000px) {
  .about__wrapper .about__content__cards_item:last-child, .about__wrapper .faq__content__cards_item:last-child, .faq__wrapper .about__content__cards_item:last-child, .faq__wrapper .faq__content__cards_item:last-child {
    margin-top: 140px;
  }
}

.about__wrapper .about__content__cards_item h2, .about__wrapper .faq__content__cards_item h2, .faq__wrapper .about__content__cards_item h2, .faq__wrapper .faq__content__cards_item h2 {
  color: var(--theme-accent-green);
  padding-bottom: 24px;
}

.about__wrapper .about__content__cards_item ul, .about__wrapper .faq__content__cards_item ul, .faq__wrapper .about__content__cards_item ul, .faq__wrapper .faq__content__cards_item ul {
  padding-left: 18px;
}

.about__wrapper .about__content__cards_item ul li:not(:last-child), .about__wrapper .faq__content__cards_item ul li:not(:last-child), .faq__wrapper .about__content__cards_item ul li:not(:last-child), .faq__wrapper .faq__content__cards_item ul li:not(:last-child) {
  margin-bottom: 12px;
}

.about__wrapper .about__content__cards_item ul li, .about__wrapper .faq__content__cards_item ul li, .faq__wrapper .about__content__cards_item ul li, .faq__wrapper .faq__content__cards_item ul li {
  position: relative;
}

.about__wrapper .about__content__cards_item ul li:before, .about__wrapper .faq__content__cards_item ul li:before, .faq__wrapper .about__content__cards_item ul li:before, .faq__wrapper .faq__content__cards_item ul li:before {
  content: '';
  position: absolute;
  top: 5.5px;
  left: -16px;
  width: 8px;
  height: 8px;
  background: var(--theme-accent-green);
  border-radius: 50%;
}

@media (max-width: 1000px) {
  .about__wrapper .about__content__cards_item ul li, .about__wrapper .faq__content__cards_item ul li, .faq__wrapper .about__content__cards_item ul li, .faq__wrapper .faq__content__cards_item ul li {
    font-size: 18px;
  }
}

.about__wrapper:before, .faq__wrapper:before {
  content: '';
  position: absolute;
  top: 0;
  right: 24%;
  z-index: 1;
  background-color: var(--theme-accent-green);
  width: 100%;
  min-height: 364px;
  border-radius: 0px 40px 40px 0px;
}

@media (max-width: 1920px) {
  .about__wrapper:before, .faq__wrapper:before {
    right: calc(80px + (450 - 80) * ((100vw - 1000px) / (1920 - 1000)));
  }
}

@media (max-width: 1000px) {
  .about__wrapper:before, .faq__wrapper:before {
    height: calc(100% - 60px);
    right: 80px;
  }
}

@media (max-width: 680px) {
  .about__wrapper:before, .faq__wrapper:before {
    right: 20px;
  }
}

@media (max-width: 580px) {
  .about__content:before {
    display: none;
  }
}

/*==================================Bikes=====================================*/
.bikes__wrapper, .scooters__wrapper, .sale__wrapper, .products__wrapper {
  position: relative;
  overflow-x: hidden;
}

@media (max-width: 380px) {
  .bikes__wrapper, .scooters__wrapper, .sale__wrapper, .products__wrapper {
    padding-top: 10px;
  }
}

.bikes__wrapper h1, .scooters__wrapper h1, .sale__wrapper h1, .products__wrapper h1 {
  color: var(--theme-gray);
  text-transform: uppercase;
}

.bikes__wrapper h2, .scooters__wrapper h2, .sale__wrapper h2, .products__wrapper h2 {
  color: var(--theme-accent-blue);
}

.bikes__wrapper__slider, .scooters__wrapper__slider, .sale__wrapper__slider, .products__wrapper__slider {
  display: flex;
  width: 100%;
  width: calc(100% + 1px);
  padding-bottom: 24px;
}

.bikes__wrapper__slider__navigation, .scooters__wrapper__slider__navigation, .sale__wrapper__slider__navigation, .products__wrapper__slider__navigation {
  position: absolute;
  top: 38px;
  right: 40px;
  display: flex;
  align-items: center;
}

@media (max-width: 768px) {
  .bikes__wrapper__slider__navigation, .scooters__wrapper__slider__navigation, .sale__wrapper__slider__navigation, .products__wrapper__slider__navigation {
    right: 20px;
  }
}

@media (max-width: 380px) {
  .bikes__wrapper__slider__navigation, .scooters__wrapper__slider__navigation, .sale__wrapper__slider__navigation, .products__wrapper__slider__navigation {
    top: 0px;
  }
}

.bikes__wrapper__slider__navigation svg, .scooters__wrapper__slider__navigation svg, .sale__wrapper__slider__navigation svg, .products__wrapper__slider__navigation svg {
  cursor: pointer;
}

.bikes__wrapper__slider__navigation svg:first-child, .scooters__wrapper__slider__navigation svg:first-child, .sale__wrapper__slider__navigation svg:first-child, .products__wrapper__slider__navigation svg:first-child {
  margin-right: 20px;
}

.bikes__wrapper__cards, .scooters__wrapper__cards, .sale__wrapper__cards, .products__wrapper__cards {
  display: flex;
  padding-top: 40px;
}

.bikes__wrapper__cards_item, .scooters__wrapper__cards_item, .sale__wrapper__cards_item, .products__wrapper__cards_item {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  height: auto;
  border-radius: 12px;
  transition: all .3s ease;
}

.bikes__wrapper__cards_item:hover, .scooters__wrapper__cards_item:hover, .sale__wrapper__cards_item:hover, .products__wrapper__cards_item:hover {
  box-shadow: 13px 16px 12px rgba(0, 0, 0, 0.25);
  transition: all .3s ease;
}

.bikes__wrapper__cards_item.new::before, .scooters__wrapper__cards_item.new::before, .sale__wrapper__cards_item.new::before, .products__wrapper__cards_item.new::before {
  content: 'НОВИНКА';
  position: absolute;
  z-index: 3;
  top: -12px;
  right: 24px;
  font-size: 16px;
  font-weight: 700;
  width: 100px;
  height: 32px;
  background: var(--theme-gray);
  border-radius: 0 0 10px 10px;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
}

.bikes__wrapper__cards_item-details, .scooters__wrapper__cards_item-details, .sale__wrapper__cards_item-details, .products__wrapper__cards_item-details {
  cursor: pointer;
  z-index: 1;
  position: absolute;
  bottom: 30px;
  right: -1px;
  width: 76px;
  height: 44px;
  border-radius: 10px 0px 0px 10px;
  background: url("data:image/svg+xml,%3Csvg width='31' height='30' viewBox='0 0 31 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.1735 1.71464C16.7721 -0.571546 13.4911 -0.571546 13.0897 1.71464C12.7929 3.40526 10.6876 4.02343 9.52384 2.76167C7.95015 1.05542 5.18997 2.82928 6.08829 4.96956C6.7526 6.55228 5.31572 8.21053 3.65457 7.77823C1.40823 7.19364 0.0452414 10.1782 1.95808 11.493C3.37262 12.4653 3.06035 14.6372 1.42918 15.1716C-0.776607 15.8943 -0.309668 19.1419 2.01037 19.2139C3.72603 19.2671 4.63753 21.263 3.55422 22.5944C2.0893 24.3949 4.23792 26.8745 6.22857 25.6808C7.70064 24.798 9.54649 25.9842 9.355 27.69C9.09605 29.9967 12.2442 30.9211 13.2734 28.8406C14.0345 27.302 16.2287 27.302 16.9898 28.8406C18.0191 30.9211 21.1672 29.9967 20.9082 27.69C20.7167 25.9842 22.5626 24.798 24.0347 25.6808C26.0253 26.8745 28.1739 24.3949 26.709 22.5944C25.6257 21.263 26.5372 19.2671 28.2529 19.2139C30.5729 19.1419 31.0398 15.8943 28.834 15.1716C27.2029 14.6372 26.8906 12.4653 28.3051 11.493C30.218 10.1782 28.855 7.19364 26.6087 7.77823C24.9475 8.21053 23.5106 6.55228 24.1749 4.96956C25.0733 2.82928 22.3131 1.05542 20.7394 2.76167C19.5757 4.02343 17.4704 3.40526 17.1735 1.71464ZM15.1316 22.6702C19.2217 22.6702 22.5374 19.3545 22.5374 15.2645C22.5374 11.1744 19.2217 7.85871 15.1316 7.85871C11.0415 7.85871 7.72588 11.1744 7.72588 15.2645C7.72588 19.3545 11.0415 22.6702 15.1316 22.6702Z' fill='%23383838'/%3E%3C/svg%3E%0A") 25% 50% no-repeat, white;
}

@media (max-width: 380px) {
  .bikes__wrapper__cards_item-details, .scooters__wrapper__cards_item-details, .sale__wrapper__cards_item-details, .products__wrapper__cards_item-details {
    width: 50px;
    right: -10px;
    bottom: 24px;
  }
}

.bikes__wrapper__cards_item__header, .scooters__wrapper__cards_item__header, .sale__wrapper__cards_item__header, .products__wrapper__cards_item__header {
  background-color: var(--theme-accent-blue);
  height: 260px;
  border-radius: 12px 12px 0 0;
  position: relative;
  z-index: 2;
}

.bikes__wrapper__cards_item__header img, .scooters__wrapper__cards_item__header img, .sale__wrapper__cards_item__header img, .products__wrapper__cards_item__header img {
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  max-width: 100%;
}

.bikes__wrapper__cards_item__content, .scooters__wrapper__cards_item__content, .sale__wrapper__cards_item__content, .products__wrapper__cards_item__content {
  display: flex;
  flex-direction: column;
  background-color: var(--theme-gray);
  padding: 30px;
  border-radius: 0 0 12px 12px;
  position: relative;
  height: 100%;
  z-index: 1;
}

@media (max-width: 380px) {
  .bikes__wrapper__cards_item__content, .scooters__wrapper__cards_item__content, .sale__wrapper__cards_item__content, .products__wrapper__cards_item__content {
    padding: 24px;
  }
}

.bikes__wrapper__cards_item__content h2, .scooters__wrapper__cards_item__content h2, .sale__wrapper__cards_item__content h2, .products__wrapper__cards_item__content h2 {
  color: var(--theme-main);
  font-weight: 500;
  font-size: 21px;
  line-height: 130%;
  margin-top: 12px;
  margin-bottom: 6px;
}

@media (max-width: 480px) {
  .bikes__wrapper__cards_item__content h2, .scooters__wrapper__cards_item__content h2, .sale__wrapper__cards_item__content h2, .products__wrapper__cards_item__content h2 {
    font-size: 18px;
  }
}

.bikes__wrapper__cards_item__content span, .scooters__wrapper__cards_item__content span, .sale__wrapper__cards_item__content span, .products__wrapper__cards_item__content span {
  color: var(--theme-accent-blue);
  font-weight: 700;
  font-size: 30px;
  line-height: 130%;
}

@media (max-width: 480px) {
  .bikes__wrapper__cards_item__content span, .scooters__wrapper__cards_item__content span, .sale__wrapper__cards_item__content span, .products__wrapper__cards_item__content span {
    font-size: 24px;
  }
}

.bikes__wrapper__cards_item__content ul, .scooters__wrapper__cards_item__content ul, .sale__wrapper__cards_item__content ul, .products__wrapper__cards_item__content ul {
  margin-top: 20px;
  margin-bottom: -48px;
  font-size: 12px;
}

.bikes__wrapper__cards_item__content ul li:not(:last-child), .scooters__wrapper__cards_item__content ul li:not(:last-child), .sale__wrapper__cards_item__content ul li:not(:last-child), .products__wrapper__cards_item__content ul li:not(:last-child) {
  margin-bottom: 6px;
}

.bikes__wrapper__cards_item__content .blue-btn, .bikes__wrapper__cards_item__content .blue-white-btn, .bikes__wrapper__cards_item__content .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .bikes__wrapper__cards_item__content .white-btn, .scooters__wrapper__cards_item__content .blue-btn, .scooters__wrapper__cards_item__content .blue-white-btn, .scooters__wrapper__cards_item__content .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .scooters__wrapper__cards_item__content .white-btn, .sale__wrapper__cards_item__content .blue-btn, .sale__wrapper__cards_item__content .blue-white-btn, .sale__wrapper__cards_item__content .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .sale__wrapper__cards_item__content .white-btn, .products__wrapper__cards_item__content .blue-btn, .products__wrapper__cards_item__content .blue-white-btn, .products__wrapper__cards_item__content .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .products__wrapper__cards_item__content .white-btn {
  margin-top: auto;
}

.sale .blue-btn, .sale .blue-white-btn, .sale .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .sale .white-btn {
  min-width: 200px;
}

/*===================================Rent=====================================*/
.courier, .business {
  position: relative;
}

.courier:before, .business:before {
  content: '';
  position: absolute;
  top: 50px;
  left: 18%;
  z-index: 0;
  background: url("../assets/images/courier-bg.png") right center no-repeat, var(--theme-accent-green);
  width: 82%;
  height: calc(100% - 100px);
  border-radius: 60px 0 0 60px;
}

@media (max-width: 1000px) {
  .courier:before, .business:before {
    left: 80px;
    width: 100%;
  }
}

@media (max-width: 768px) {
  .courier:before, .business:before {
    left: 10px;
    background-position: right -80px center;
  }
}

@media (max-width: 680px) {
  .courier:before, .business:before {
    background-position: right -190px center;
    background-size: cover;
  }
}

.courier:after, .business:after {
  display: none;
  content: '';
  position: absolute;
  top: 50px;
  left: 10px;
  z-index: 0;
  opacity: 0.4;
  background: var(--theme-accent-green);
  width: 100%;
  height: calc(100% - 100px);
  border-radius: 60px 0 0 60px;
}

@media (max-width: 680px) {
  .courier:after, .business:after {
    display: block;
  }
}

.courier__wrapper, .business__wrapper {
  position: relative;
  z-index: 1;
  padding: 60px 40px;
  margin: 0 0 0 18%;
  max-width: initial;
}

@media (min-width: 1921px) {
  .courier__wrapper, .business__wrapper {
    max-width: 1200px;
    margin: 0 auto;
  }
}

@media (max-width: 1000px) {
  .courier__wrapper, .business__wrapper {
    margin: 0 0 0 80px;
  }
}

@media (max-width: 768px) {
  .courier__wrapper, .business__wrapper {
    margin: 0;
  }
}

@media (max-width: 480px) {
  .courier__wrapper, .business__wrapper {
    padding: 48px 32px;
  }
}

.courier__wrapper h1, .business__wrapper h1 {
  color: var(--theme-gray);
  text-transform: uppercase;
  font-size: 46px;
  margin-bottom: 40px;
}

@media (max-width: 768px) {
  .courier__wrapper h1, .business__wrapper h1 {
    font-size: 36px;
  }
}

@media (max-width: 480px) {
  .courier__wrapper h1, .business__wrapper h1 {
    font-size: 32px;
  }
}

.courier__wrapper h1 span, .business__wrapper h1 span {
  color: var(--theme-main);
}

.courier__wrapper h2, .business__wrapper h2 {
  color: var(--theme-gray);
  font-weight: 500;
  text-transform: uppercase;
  margin-bottom: 10px;
}

.courier__wrapper ul, .business__wrapper ul {
  margin-bottom: 60px;
  max-width: 420px;
}

@media (max-width: 680px) {
  .courier__wrapper ul, .business__wrapper ul {
    max-width: 350px;
  }
}

.courier__wrapper ul li, .business__wrapper ul li {
  position: relative;
  color: var(--theme-gray);
  font-size: 18px;
  font-weight: 500;
  line-height: 140%;
  margin-left: 16px;
}

.courier__wrapper ul li:before, .business__wrapper ul li:before {
  content: '';
  position: absolute;
  top: 8px;
  left: -16px;
  width: 8px;
  height: 8px;
  background: var(--theme-gray);
  border-radius: 50%;
}

.courier__wrapper .gray-btn:hover, .business__wrapper .gray-btn:hover {
  background-color: white;
  color: var(--theme-gray);
}

.business:before {
  background: url("../assets/images/business-bg.png") right center no-repeat, var(--theme-accent-blue);
}

@media (max-width: 768px) {
  .business:before {
    background-position: right -160px center;
  }
}

@media (max-width: 680px) {
  .business:before {
    background-size: cover;
  }
}

@media (max-width: 480px) {
  .business:before {
    background-position: right -280px center;
  }
}

.business:after {
  background: var(--theme-accent-blue);
}

.business__wrapper h1 {
  max-width: 600px;
}

@media (max-width: 768px) {
  .business__wrapper h1 {
    font-size: 46px;
  }
}

@media (max-width: 680px) {
  .business__wrapper h1 {
    font-size: 36px;
    max-width: 340px;
  }
}

.business__wrapper h3 {
  color: var(--theme-gray);
  max-width: 420px;
  margin-bottom: 60px;
}

/*===================================FAQ======================================*/
.faq__wrapper {
  padding-bottom: 80px;
}

@media (max-width: 1160px) {
  .faq__wrapper:before {
    height: 100%;
    max-height: 572px;
  }
}

@media (max-width: 1160px) {
  .faq__wrapper .faq__content {
    flex-direction: column;
  }
}

@media (max-width: 420px) {
  .faq__wrapper .faq__content {
    padding-left: 0;
    padding-right: 0;
  }
}

.faq__wrapper .faq__content::before {
  background: url("../assets/images/black-bike2.png") center no-repeat;
  width: 532px;
  height: 415px;
}

@media (max-width: 1160px) {
  .faq__wrapper .faq__content::before {
    top: 140px;
    left: 0;
  }
}

@media (max-width: 1000px) {
  .faq__wrapper .faq__content::before {
    transform: initial;
    left: initial;
    right: 0;
    top: 0;
    height: 350px;
    width: 445px;
    background-size: contain;
  }
}

@media (max-width: 580px) {
  .faq__wrapper .faq__content::before {
    right: -160px;
  }
}

@media (max-width: 420px) {
  .faq__wrapper .faq__content::before {
    width: 300px;
    height: 240px;
    top: 70px;
    right: -100px;
  }
}

@media (max-width: 420px) {
  .faq__wrapper .faq__content__title {
    padding-left: 20px;
    padding-right: 20px;
  }
}

.faq__wrapper .faq__content__title h1 {
  max-width: 315px;
}

@media (max-width: 1160px) {
  .faq__wrapper .faq__content__title h1 {
    max-width: initial;
    margin-bottom: 40px;
  }
}

@media (max-width: 680px) {
  .faq__wrapper .faq__content__title h1 {
    max-width: 310px;
  }
}

.faq__wrapper .faq__content__card {
  position: relative;
  z-index: 2;
  padding: 40px;
  background-color: var(--theme-gray);
  border-radius: 20px;
  max-width: 730px;
  width: 100%;
  box-shadow: 13px 16px 12px rgba(0, 0, 0, 0.25);
  overflow: visible !important;
}

@media (max-width: 1160px) {
  .faq__wrapper .faq__content__card {
    margin-left: auto;
  }
}

@media (max-width: 880px) {
  .faq__wrapper .faq__content__card {
    max-width: 640px;
  }
}

@media (max-width: 580px) {
  .faq__wrapper .faq__content__card {
    margin-right: -32px;
    border-radius: 20px 0 0 20px;
  }
}

@media (max-width: 420px) {
  .faq__wrapper .faq__content__card {
    margin-right: 0;
    border-radius: 0;
    width: 100%;
    padding: 20px;
  }
}

.faq__wrapper .faq__content__card_more {
  position: absolute;
  z-index: 1;
  bottom: -80px;
  right: 40px;
  width: 240px;
  height: 80px;
  background-color: var(--theme-accent-green);
  border-radius: 0 0 20px 20px;
  box-shadow: inset 0px 20px 12px rgba(0, 0, 0, 0.25);
}

.faq__wrapper .faq__content__card_more a {
  color: var(--theme-gray);
  font-weight: 700;
  font-size: 20px;
  line-height: 130%;
  text-transform: uppercase;
}

@keyframes open {
  0% {
    opacity: 0;
    transform: translateX(-10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes close {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  100% {
    opacity: 0;
    transform: translateX(-10px);
  }
}

.faq__wrapper .faq__content__card details {
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  -webkit-tap-highlight-color: transparent;
}

.faq__wrapper .faq__content__card details[open] summary ~ * {
  animation: open .4s;
}

.faq__wrapper .faq__content__card details.closing summary ~ * {
  animation: close .4s;
}

.faq__wrapper .faq__content__card details div > * + * {
  margin-top: 1.5em;
}

.faq__wrapper .faq__content__card summary {
  list-style: none;
}

.faq__wrapper .faq__content__card summary::-webkit-details-marker {
  display: none;
}

.faq__wrapper .faq__content__card summary {
  padding: 20px 0;
  position: relative;
  cursor: pointer;
}

.faq__wrapper .faq__content__card summary h2 {
  max-width: 470px;
  font-weight: 600;
  color: var(--theme-accent-green);
  text-transform: uppercase;
  padding-right: 60px;
}

@media (max-width: 420px) {
  .faq__wrapper .faq__content__card summary h2 {
    font-size: 18px;
  }
}

.faq__wrapper .faq__content__card summary:before {
  content: '';
  cursor: pointer;
  position: absolute;
  top: 50%;
  right: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--theme-accent-green) url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.2011 2.0166V22.3855M22.3863 12.2018L2.01746 12.2018' stroke='%23383838' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E%0A") 55% 55% no-repeat;
  transition: .25s ease;
  transform: translateY(-50%) translateZ(0);
}

.faq__wrapper .faq__content__card details[open] summary:before {
  background: var(--theme-main) url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.2011 2.0166V22.3855M22.3863 12.2018L2.01746 12.2018' stroke='%23383838' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E%0A") 55% 55% no-repeat;
  transform: translateY(-50%) translateZ(0) rotate(45deg);
  transition: .25s ease;
}

.footer {
  position: relative;
}

.footer:before {
  content: '';
  position: absolute;
  top: 0;
  right: 18%;
  z-index: 0;
  background-color: var(--theme-accent-green);
  width: 100%;
  height: 100%;
  border-radius: 0px 60px 0px 0px;
}

@media (max-width: 1920px) {
  .footer:before {
    right: calc(80px + (450 - 80) * ((100vw - 1000px) / (1920 - 1000)));
  }
}

@media (max-width: 1000px) {
  .footer:before {
    right: 240px;
  }
}

@media (max-width: 768px) {
  .footer:before {
    right: 140px;
  }
}

@media (max-width: 580px) {
  .footer:before {
    right: 80px;
  }
}

@media (max-width: 420px) {
  .footer:before {
    right: 33px;
  }
}

.footer:after {
  display: none;
  content: '';
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 80px;
  background: url("../assets/images/black-bike2.png") left/cover no-repeat;
  width: 490px;
  height: 546px;
}

@media (max-width: 1160px) {
  .footer:after {
    display: block;
  }
}

@media (max-width: 1000px) {
  .footer:after {
    bottom: -10px;
  }
}

@media (max-width: 720px) {
  .footer:after {
    bottom: 0;
    width: 395px;
    height: 395px;
  }
}

@media (max-width: 580px) {
  .footer:after {
    width: 315px;
    height: 370px;
  }
}

@media (max-width: 460px) {
  .footer:after {
    width: 260px;
    height: 275px;
    bottom: 50px;
  }
}

@media (max-width: 420px) {
  .footer:after {
    width: 240px;
  }
}

.footer__wrapper {
  position: relative;
  z-index: 1;
  padding: 40px;
  margin: 0 18% 0 0;
  max-width: initial;
}

@media (max-width: 1920px) {
  .footer__wrapper {
    margin-right: calc(80px + (450 - 80) * ((100vw - 1000px) / (1920 - 1000)));
  }
}

@media (min-width: 1921px) {
  .footer__wrapper {
    max-width: 1200px;
    margin: 0 auto;
  }
}

@media (max-width: 1000px) {
  .footer__wrapper {
    margin-right: 0;
  }
}

@media (max-width: 580px) {
  .footer__wrapper {
    padding: 40px 20px;
  }
}

@media (max-width: 580px) {
  .footer__wrapper {
    padding: 40px 20px;
  }
}

@media (max-width: 420px) {
  .footer__wrapper {
    padding: 30px 10px;
  }
}

@media (max-width: 1000px) {
  .footer__wrapper__top-nav img {
    width: 250px;
  }
}

@media (max-width: 420px) {
  .footer__wrapper__top-nav img {
    width: 200px;
  }
}

@media (max-width: 1000px) {
  .footer__wrapper__top-nav ul {
    display: none;
  }
}

.footer__wrapper__top-nav ul li a {
  font-weight: 500;
  line-height: 130%;
  font-size: 12px;
  color: var(--theme-gray);
  transition: all .3s ease;
}

.footer__wrapper__top-nav ul li a:hover {
  color: var(--theme-main);
  transition: all .3s ease;
}

.footer__wrapper__top-nav ul li:not(:last-child) {
  margin-right: 32px;
}

.footer__wrapper__contact {
  margin-top: 140px;
  max-width: 420px;
  color: var(--theme-gray);
  margin-bottom: 170px;
}

@media (max-width: 1000px) {
  .footer__wrapper__contact {
    margin-bottom: 80px;
  }
}

@media (max-width: 460px) {
  .footer__wrapper__contact {
    margin-bottom: 32px;
  }
}

@media (max-width: 1160px) {
  .footer__wrapper__contact {
    margin-top: 540px;
  }
}

@media (max-width: 680px) {
  .footer__wrapper__contact {
    margin-top: calc(66vw + 100px);
  }
}

@media (max-width: 420px) {
  .footer__wrapper__contact {
    max-width: 260px;
    margin-top: calc(66vw + 80px);
  }
}

.footer__wrapper__contact a {
  font-weight: 700;
  font-size: 48px;
  line-height: 120%;
  color: var(--theme-gray);
}

.footer__wrapper__contact h1 a {
  font-weight: 900;
}

@media (max-width: 640px) {
  .footer__wrapper__contact h1 a {
    font-size: 38px;
  }
}

@media (max-width: 460px) {
  .footer__wrapper__contact h1 a {
    font-size: 28px;
  }
}

.footer__wrapper__contact h2 {
  font-weight: 600;
  margin-top: 30px;
}

@media (max-width: 640px) {
  .footer__wrapper__contact h2 {
    font-size: 20px;
  }
}

@media (max-width: 460px) {
  .footer__wrapper__contact h2 {
    font-size: 18px;
  }
}

.footer__wrapper__social {
  margin-bottom: 100px;
  margin-top: 24px;
}

@media (max-width: 1000px) {
  .footer__wrapper__social {
    margin-bottom: 60px;
  }
}

.footer__wrapper__social a {
  display: block;
}

.footer__wrapper__social a:not(:last-child) {
  margin-right: 12px;
}

.footer__wrapper__bottom-nav {
  color: var(--theme-gray);
}

@media (max-width: 1000px) {
  .footer__wrapper__bottom-nav {
    flex-direction: column-reverse;
    align-items: flex-start;
    position: relative;
  }
  .footer__wrapper__bottom-nav a {
    margin-bottom: 16px;
    font-size: 16px;
  }
}

.footer__wrapper__bottom-nav > h4 {
  font-weight: 500;
}

@media (max-width: 1000px) {
  .footer__wrapper__bottom-nav > h4 {
    font-size: 16px;
    margin-top: 32px;
  }
}

@media (max-width: 460px) {
  .footer__wrapper__bottom-nav > h4 {
    margin-top: 110px;
  }
}

.footer__wrapper__bottom-nav a {
  font-size: 12px;
  font-weight: 500;
  color: var(--theme-gray);
  transition: all .3s ease;
}

@media (max-width: 680px) {
  .footer__wrapper__bottom-nav a:first-of-type {
    order: 1;
  }
}

.footer__wrapper__bottom-nav a:hover {
  color: var(--theme-main);
  transition: all .3s ease;
}

@media (max-width: 1000px) {
  .footer__wrapper__bottom-nav a {
    margin-bottom: 16px;
    font-size: 16px;
  }
}

@media (max-width: 640px) {
  .footer__wrapper__bottom-nav a {
    max-width: 200px;
  }
}

.footer__wrapper__bottom-nav .designer-logo {
  font-family: 'Montserrat', sans-serif;
}

@media (max-width: 1000px) {
  .footer__wrapper__bottom-nav .designer-logo {
    position: absolute;
    right: 0;
    bottom: -28px;
  }
  .footer__wrapper__bottom-nav .designer-logo h4 {
    display: none;
  }
}

@media (max-width: 1000px) and (max-width: 580px) {
  .footer__wrapper__bottom-nav .designer-logo {
    right: -10px;
  }
}

@media (max-width: 1000px) and (max-width: 420px) {
  .footer__wrapper__bottom-nav .designer-logo {
    right: 40px;
    bottom: -20px;
  }
}

.footer__wrapper__bottom-nav .designer-logo svg {
  margin-right: 6px;
  fill: var(--theme-gray);
}

@media (max-width: 1000px) {
  .footer__wrapper__bottom-nav .designer-logo svg {
    width: 50px;
    height: 49px;
    fill: var(--theme-accent-green);
  }
}

@media (max-width: 420px) {
  .footer__wrapper__bottom-nav .designer-logo svg {
    width: 32px;
    height: 31px;
    fill: var(--theme-gray);
  }
}

.footer__wrapper__bottom-nav .designer-logo a {
  text-decoration: underline;
  font-weight: 600;
}

.footer__wrapper__map {
  position: absolute;
  top: 50%;
  right: -12%;
  transform: translateY(-50%);
  z-index: 2;
}

@media (max-width: 1280px) {
  .footer__wrapper__map {
    right: calc(-210px + (-126 - -210) * ((100vw - 1000px) / (1280 - 1000)));
  }
}

@media (max-width: 1160px) {
  .footer__wrapper__map {
    transform: initial;
    right: initial;
    top: 130px;
    left: 0;
  }
}

@media (max-width: 680px) {
  .footer__wrapper__map {
    top: 140px;
  }
}

@media (max-width: 420px) {
  .footer__wrapper__map {
    top: 110px;
  }
}

.footer__wrapper__map:before {
  content: '';
  position: absolute;
  z-index: -1;
  top: 50%;
  transform: translateY(-50%);
  left: -6%;
  width: 112%;
  height: 117%;
  border-radius: 50px;
  background-color: var(--theme-gray);
  box-shadow: -10px 14px 23px rgba(0, 0, 0, 0.25);
}

@media (max-width: 768px) {
  .footer__wrapper__map:before {
    border-radius: 0 50px 50px 0;
  }
}

@media (max-width: 480px) {
  .footer__wrapper__map:before {
    border-radius: 0 30px 30px 0;
  }
}

.footer__wrapper__map iframe {
  border-radius: 20px;
}

@media (max-width: 1160px) {
  .footer__wrapper__map iframe {
    border-radius: 0 20px 20px 0;
  }
}

@media (max-width: 680px) {
  .footer__wrapper__map iframe {
    width: 90vw;
    height: 60vw;
  }
}

/*==================================Popup=====================================*/
.modal-wrapper {
  position: fixed;
  z-index: 20;
  visibility: hidden;
  opacity: 0;
  top: 0px;
  left: 0px;
  width: 100vw;
  height: 100%;
  background: rgba(245, 245, 245, 0.7);
  overflow-y: auto;
  overflow-x: hidden;
  transition: all .3s ease-in-out;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-wrapper > div {
  position: relative;
  z-index: 21;
  border-radius: 20px;
  display: none;
  margin: auto;
}

.modal-wrapper.black {
  background: rgba(56, 56, 56, 0.75);
}

.details-popup {
  background-color: var(--theme-gray);
  min-width: 300px;
  width: calc(100% - 80px);
  max-width: 700px;
  min-height: 470px;
  padding: 60px 40px;
  transition: all .3s ease-in-out;
}

.details-popup.new:before {
  content: 'НОВИНКА';
  position: absolute;
  z-index: 3;
  top: -12px;
  left: 40px;
  font-size: 16px;
  font-weight: 700;
  width: 100px;
  height: 32px;
  color: var(--theme-gray);
  background: var(--theme-accent-blue);
  border-radius: 0 0 10px 10px;
  filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 640px) {
  .details-popup.new:before {
    left: 80px;
  }
}

@media (max-width: 640px) {
  .details-popup {
    padding: 60px 20px 20px 20px;
  }
}

@media (max-width: 480px) {
  .details-popup {
    width: 100%;
  }
}

.details-popup__wrapper {
  height: 100%;
  min-height: 100%;
  overflow-y: auto;
  display: flex;
}

@media (max-width: 640px) {
  .details-popup__wrapper {
    flex-direction: column-reverse;
  }
}

.details-popup .details__close-btn {
  position: absolute;
  top: -1px;
  right: -1px;
  width: 40px;
  height: 40px;
  background-color: #F5F5F5;
  border-radius: 0px 18px 0px 8px;
  cursor: pointer;
}

.details-popup .details__description {
  width: 50%;
}

@media (max-width: 640px) {
  .details-popup .details__description {
    width: 100%;
  }
}

.details-popup .details__description h2 {
  color: var(--theme-accent-blue);
  font-weight: 600;
  margin-bottom: 20px;
}

.details-popup .details__description span {
  display: block;
  font-weight: 600;
  font-size: 14px;
  line-height: 130%;
  color: #F5F5F5;
  margin-bottom: 16px;
}

.details-popup .details__description ul {
  font-weight: 400;
  font-size: 12px;
  line-height: 140%;
  margin-bottom: 32px;
}

.details-popup .details__description .subscribe-price {
  display: flex;
  align-items: center;
  padding: 12px;
  border: 1px solid white;
  border-radius: 10px;
  width: max-content;
  margin-bottom: 24px;
}

.details-popup .details__description .subscribe-price span {
  margin: 0;
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
  text-transform: uppercase;
}

.details-popup .details__description .subscribe-price svg {
  margin-right: 10px;
}

.details-popup .details__description .blue-btn, .details-popup .details__description .blue-white-btn, .details-popup .details__description .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .details-popup .details__description .white-btn {
  min-width: 200px;
}

.details-popup .details__slider {
  width: 50%;
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
  justify-content: center;
}

@media (max-width: 640px) {
  .details-popup .details__slider {
    width: 100%;
    margin-bottom: 16px;
  }
}

.details-popup .details__slider .details__slider__wrapper {
  display: flex;
  margin-bottom: 12px;
}

.details-popup .details__slider .details__slider__wrapper_item {
  border-radius: 10px;
  min-width: 100%;
}

.details-popup .details__slider .details__thumbs-slider__wrapper {
  display: flex;
  margin-bottom: 36px;
}

@media (max-width: 640px) {
  .details-popup .details__slider .details__thumbs-slider__wrapper {
    margin-bottom: 16px;
  }
}

.details-popup .details__slider .details__thumbs-slider__wrapper_item {
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  cursor: pointer;
}

.details-popup .details__slider .details__thumbs-slider__wrapper_item img {
  display: block;
  max-width: 100%;
  min-height: 100%;
  border-radius: 10px;
}

.details-popup .details__slider .details__thumbs-slider__wrapper_item:before {
  content: '';
  z-index: 2;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
}

.details-popup .details__slider .details__thumbs-slider__wrapper_item:after {
  content: '';
  z-index: 3;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 1px solid transparent;
  border-radius: 10px;
  transition: all .3s ease;
}

.details-popup .details__slider .details__thumbs-slider__wrapper_item.swiper-slide-thumb-active:after {
  border: 1px solid white;
  transition: all .3s ease;
}

.details-popup .details__slider__navigation {
  margin-left: auto;
  display: flex;
}

@media (max-width: 640px) {
  .details-popup .details__slider__navigation {
    margin-left: 0;
    margin-right: auto;
    position: absolute;
    top: 15px;
  }
}

.details-popup .details__slider__navigation svg {
  cursor: pointer;
  user-select: none;
}

.details-popup .details__slider__navigation svg:not(:last-child) {
  margin-right: 10px;
}

.subscribe-popup {
  min-width: 300px;
  width: calc(100% - 80px);
  max-width: 550px;
}

@media (max-width: 480px) {
  .subscribe-popup {
    width: 100%;
  }
}

.subscribe-popup__wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  background-color: var(--theme-gray);
  border-radius: 20px;
}

.subscribe-popup__wrapper > svg {
  position: absolute;
  cursor: pointer;
  z-index: 2;
  top: 24px;
  right: 24px;
}

.subscribe-popup__wrapper_top {
  position: relative;
  background-color: var(--theme-accent-blue);
  border-radius: 18px 18px 0 0;
  padding: 40px;
}

@media (max-width: 600px) {
  .subscribe-popup__wrapper_top {
    padding: 40px 20px;
  }
}

@media (max-width: 520px) {
  .subscribe-popup__wrapper_top {
    padding: 20px;
  }
}

.subscribe-popup__wrapper_top:before {
  content: '';
  position: absolute;
  z-index: 1;
  width: 245px;
  height: 267px;
  bottom: -44px;
  right: 0;
  background: url("../assets/images/green-bike2.png") center/cover no-repeat;
}

@media (max-width: 640px) {
  .subscribe-popup__wrapper_top:before {
    width: 220px;
    height: 220px;
    bottom: -24px;
  }
}

@media (max-width: 580px) {
  .subscribe-popup__wrapper_top:before {
    width: 190px;
    height: 190px;
    bottom: -24px;
  }
}

@media (max-width: 520px) {
  .subscribe-popup__wrapper_top:before {
    width: 150px;
    height: 150px;
    bottom: -18px;
  }
}

@media (max-width: 360px) {
  .subscribe-popup__wrapper_top:before {
    width: 110px;
    height: 120px;
  }
}

.subscribe-popup__wrapper_top img {
  max-width: 100%;
  width: 210px;
  margin-bottom: 24px;
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_top img {
    width: 180px;
  }
}

.subscribe-popup__wrapper_top h1 {
  font-weight: 700;
  font-size: 46px;
  line-height: 115%;
  padding-right: 33%;
}

@media (max-width: 640px) {
  .subscribe-popup__wrapper_top h1 {
    font-size: 38px;
  }
}

@media (max-width: 600px) {
  .subscribe-popup__wrapper_top h1 {
    font-size: 32px;
  }
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_top h1 {
    font-size: 28px;
  }
}

.subscribe-popup__wrapper_bottom {
  padding: 40px;
}

@media (max-width: 600px) {
  .subscribe-popup__wrapper_bottom {
    padding: 20px;
  }
}

.subscribe-popup__wrapper_bottom form {
  display: flex;
  flex-direction: column;
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_bottom form .main-field, .subscribe-popup__wrapper_bottom form .new-select {
    font-size: 18px;
    padding: 10px;
  }
}

.subscribe-popup__wrapper_bottom form input:not(:nth-child(3))::placeholder {
  color: var(--theme-main);
}

.subscribe-popup__wrapper_bottom form input[type="submit"] {
  width: 100%;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 110.5%;
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_bottom form input[type="submit"] {
    font-size: 18px;
  }
}

.subscribe-popup__wrapper_bottom form .select {
  display: block;
  width: 100%;
  position: relative;
}

.subscribe-popup__wrapper_bottom form .new-select {
  width: 100%;
  position: relative;
  border: 1px solid var(--theme-accent-blue);
  cursor: pointer;
  user-select: none;
  transition: all .3s ease-in-out;
}

.subscribe-popup__wrapper_bottom form .new-select.on {
  border-radius: 10px 10px 0 0;
  transition: all .0s ease-in-out;
}

.subscribe-popup__wrapper_bottom form .new-select__list {
  position: absolute;
  top: 48px;
  left: 0;
  border: 1px solid var(--theme-accent-blue);
  border-radius: 0 0 10px 10px;
  cursor: pointer;
  width: 100%;
  z-index: 2;
  background: var(--theme-gray);
  user-select: none;
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_bottom form .new-select__list {
    top: 44px;
  }
}

.subscribe-popup__wrapper_bottom form .new-select__list.on {
  display: block;
}

.subscribe-popup__wrapper_bottom form .new-select__item span {
  display: block;
  padding: 10px 15px;
  font-family: 'Inter';
  font-size: 21px;
  line-height: 130%;
  color: var(--theme-main);
  transition: all .3s ease-in-out;
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_bottom form .new-select__item span {
    font-size: 18px;
    padding: 10px;
  }
}

.subscribe-popup__wrapper_bottom form .new-select__item span:hover {
  color: var(--theme-accent-blue);
  transition: all .3s ease-in-out;
}

.subscribe-popup__wrapper_bottom form .new-select:after {
  content: '';
  display: block;
  width: 28px;
  height: 14px;
  position: absolute;
  right: 16px;
  top: 16px;
  background: url("data:image/svg+xml,%3Csvg width='27' height='14' viewBox='0 0 27 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 2.31372L10.4853 10.799C12.0474 12.3611 14.58 12.3611 16.1421 10.799L24.6274 2.31372' stroke='%2324B7E6' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E%0A") no-repeat right center;
  -webkit-transition: all .27s ease-in-out;
  -o-transition: all .27s ease-in-out;
  transition: all .27s ease-in-out;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_bottom form .new-select:after {
    background: url("data:image/svg+xml,%3Csvg width='22' height='12' viewBox='0 0 27 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 2.31372L10.4853 10.799C12.0474 12.3611 14.58 12.3611 16.1421 10.799L24.6274 2.31372' stroke='%2324B7E6' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E%0A") no-repeat right center;
    width: 22px;
    height: 12px;
    right: 10px;
  }
}

.subscribe-popup__wrapper_bottom form .new-select.on:after {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.subscribe-popup__wrapper_bottom form > span {
  color: var(--theme-accent-blue);
  font-weight: 600;
  font-size: 26px;
  line-height: 100%;
  margin-left: 8px;
  margin-top: 3px;
  margin-bottom: 10px;
}

@media (max-width: 480px) {
  .subscribe-popup__wrapper_bottom form > span {
    font-size: 20px;
  }
}

.subscribe-popup__wrapper_bottom h4 {
  text-align: center;
  margin-top: 24px;
}

.subscribe-popup__wrapper_bottom h4 a {
  color: var(--theme-accent-blue);
}

/*================================Subscribe===================================*/
.subscribe__wrapper {
  display: flex;
  flex-direction: column;
}

.subscribe__wrapper > a {
  display: inline-block;
  width: max-content;
}

.subscribe__wrapper > h1 {
  color: var(--theme-gray);
  font-weight: 900;
  font-size: 46px;
  margin-top: 20px;
  margin-bottom: 50px;
}

@media (max-width: 420px) {
  .subscribe__wrapper > h1 {
    font-size: 36px;
  }
}

.subscribe__wrapper > form {
  display: flex;
  justify-content: space-between;
  column-gap: 40px;
  row-gap: 60px;
}

@media (max-width: 880px) {
  .subscribe__wrapper > form {
    flex-wrap: wrap;
  }
}

.subscribe__wrapper__info, .subscribe__wrapper__details {
  display: flex;
  flex-direction: column;
  background: var(--theme-gray);
  width: 50%;
}

@media (max-width: 880px) {
  .subscribe__wrapper__info, .subscribe__wrapper__details {
    width: 100%;
  }
}

.subscribe__wrapper__info {
  border-radius: 24px 24px 12px 12px;
}

@media (max-width: 880px) {
  .subscribe__wrapper__info {
    max-width: 512px;
  }
}

.subscribe__wrapper__info_top {
  position: relative;
  background: var(--theme-accent-blue);
  padding: 50px 30px;
  border-radius: 12px 12px 0 0;
  min-height: 210px;
  width: 100%;
}

@media (max-width: 1000px) {
  .subscribe__wrapper__info_top {
    min-height: 260px;
  }
}

@media (max-width: 880px) {
  .subscribe__wrapper__info_top {
    min-height: 210px;
  }
}

@media (max-width: 520px) {
  .subscribe__wrapper__info_top {
    min-height: 260px;
  }
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_top {
    padding: 25px;
    min-height: 195px;
  }
}

.subscribe__wrapper__info_top:before {
  content: '';
  position: absolute;
  z-index: 1;
  width: 338px;
  height: 199px;
  bottom: -44px;
  right: 0;
  background: url("../assets/images/green-bike3.png") center/cover no-repeat;
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_top:before {
    width: 250px;
    height: 160px;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
  }
}

.subscribe__wrapper__info_top h2 {
  max-width: 190px;
  font-weight: 700;
  font-size: 36px;
  line-height: 105%;
}

@media (max-width: 1000px) {
  .subscribe__wrapper__info_top h2 {
    max-width: 100%;
  }
}

@media (max-width: 880px) {
  .subscribe__wrapper__info_top h2 {
    max-width: 190px;
  }
}

@media (max-width: 480px) {
  .subscribe__wrapper__info_top h2 {
    max-width: 100%;
  }
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_top h2 {
    font-size: 30px;
  }
}

.subscribe__wrapper__info_bottom {
  padding: 40px 30px;
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_bottom {
    padding: 30px 24px;
  }
}

.subscribe__wrapper__info_bottom_bike h3 {
  font-weight: 500;
  font-size: 21px;
}

.subscribe__wrapper__info_bottom_bike h2 {
  color: var(--theme-accent-blue);
  font-weight: 700;
  font-size: 30px;
  margin-bottom: 30px;
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_bottom_bike h2 {
    font-size: 24px;
  }
}

.subscribe__wrapper__info_bottom_details {
  margin-top: 20px;
  margin-bottom: 75px;
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_bottom_details {
    margin-bottom: 50px;
  }
}

.subscribe__wrapper__info_bottom_details > div {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
}

.subscribe__wrapper__info_bottom_details > div h3, .subscribe__wrapper__info_bottom_details > div span {
  font-weight: 500;
  font-size: 26px;
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_bottom_details > div h3, .subscribe__wrapper__info_bottom_details > div span {
    font-size: 20px;
  }
}

@media (max-width: 1000px) {
  .subscribe__wrapper__info_bottom_details > div h3 {
    max-width: 160px;
  }
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_bottom_details > div h3 {
    max-width: 120px;
  }
}

.subscribe__wrapper__info_bottom_details .blue-btn, .subscribe__wrapper__info_bottom_details .blue-white-btn, .subscribe__wrapper__info_bottom_details .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .subscribe__wrapper__info_bottom_details .white-btn {
  max-width: 315px;
  width: 100%;
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_bottom_details .blue-btn, .subscribe__wrapper__info_bottom_details .blue-white-btn, .subscribe__wrapper__info_bottom_details .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .subscribe__wrapper__info_bottom_details .white-btn {
    padding: 14px;
  }
}

.subscribe__wrapper__info_bottom_sum {
  display: flex;
  justify-content: space-between;
}

.subscribe__wrapper__info_bottom_sum h1 {
  font-weight: 700;
}

@media (max-width: 420px) {
  .subscribe__wrapper__info_bottom_sum h1 {
    font-size: 26px;
    line-height: 105%;
  }
}

.subscribe__wrapper__details {
  border-radius: 12px;
  padding: 50px 30px;
  height: max-content;
}

@media (max-width: 880px) {
  .subscribe__wrapper__details {
    max-width: 472px;
  }
}

@media (max-width: 520px) {
  .subscribe__wrapper__details {
    max-width: 100%;
  }
}

.subscribe__wrapper__details_insurance {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
  align-items: center;
}

.subscribe__wrapper__details_insurance span {
  display: flex;
  align-items: center;
}

.subscribe__wrapper__details_insurance span h1 {
  margin-right: 8px;
}

@media (max-width: 420px) {
  .subscribe__wrapper__details_insurance span h1 {
    font-size: 32px;
    font-weight: 700;
  }
}

.subscribe__wrapper__details_insurance input {
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--theme-gray);
  margin: 0;
  margin-top: 7px;
  transition: all .1s ease-in-out;
}

.subscribe__wrapper__details_insurance input::before {
  content: '';
  display: inline-block;
  width: 22px;
  height: 22px;
  background-color: var(--theme-gray);
  border: 1px solid white;
  border-radius: 3px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
  transition: all .1s ease-in-out;
  cursor: pointer;
}

.subscribe__wrapper__details_insurance input:checked::before {
  background: var(--theme-accent-blue);
  border: 4px solid white;
  border-radius: 3px;
  transition: all .1s ease-in-out;
}

.subscribe__wrapper__details_shipping h2 {
  font-weight: 700;
  font-size: 30px;
  color: var(--theme-accent-blue);
}

@media (max-width: 420px) {
  .subscribe__wrapper__details_shipping h2 {
    font-size: 24px;
    line-height: 120%;
    max-width: 148px;
  }
}

.subscribe__wrapper__details_shipping > div:first-of-type {
  display: flex;
  column-gap: 24px;
  row-gap: 24px;
  margin-top: 50px;
}

@media (max-width: 420px) {
  .subscribe__wrapper__details_shipping > div:first-of-type {
    margin-top: 30px;
    flex-wrap: wrap;
  }
}

.subscribe__wrapper__details_shipping > div:first-of-type .white-btn {
  background: white;
  width: 100%;
  padding-left: initial;
  padding-right: initial;
}

@media (max-width: 420px) {
  .subscribe__wrapper__details_shipping > div:first-of-type .white-btn {
    padding-top: 14px;
    padding-bottom: 14px;
  }
}

.subscribe__wrapper__details_shipping > div:first-of-type .white-btn.active {
  background: var(--theme-accent-blue);
}

.subscribe__wrapper__details_shipping_info {
  margin-top: 40px;
  margin-bottom: 60px;
}

.subscribe__wrapper__details_shipping_info h3 {
  font-weight: 500;
  font-size: 21px;
}

.subscribe__wrapper__details_shipping_info h3:last-child {
  margin-top: 12px;
  color: var(--theme-accent-blue);
}

.subscribe__wrapper__details > .white-btn {
  background-color: var(--theme-accent-blue);
  color: var(--theme-main);
  max-width: 350px;
  width: 100%;
  padding-top: 19px;
  padding-bottom: 19px;
}

@media (max-width: 380px) {
  .subscribe__wrapper__details > .white-btn {
    font-size: 17px;
  }
}

/*=================================Profile====================================*/
/*===============================Application==================================*/
.application__wrapper, .profile__wrapper {
  position: relative;
}

.application__wrapper:before, .profile__wrapper:before {
  content: '';
  position: absolute;
  z-index: 1;
  width: 860px;
  height: 560px;
  top: 40%;
  right: -300px;
  transform: translateY(-50%);
  background: url("../assets/images/black-bike3.png") center/cover no-repeat;
}

@media (max-width: 1200px) {
  .application__wrapper:before, .profile__wrapper:before {
    right: calc(-500px + (-300 - -500) * ((100vw - 920px) / (1200 - 920)));
  }
}

@media (max-width: 920px) {
  .application__wrapper:before, .profile__wrapper:before {
    display: none;
  }
}

.application__wrapper > h1, .profile__wrapper > h1 {
  font-size: 46px;
  text-transform: uppercase;
  color: var(--theme-gray);
}

@media (max-width: 440px) {
  .application__wrapper > h1, .profile__wrapper > h1 {
    font-size: 36px;
  }
}

.application__wrapper > h2, .profile__wrapper > h2 {
  font-weight: 900;
  font-size: 36px;
  color: var(--theme-accent-blue);
}

@media (max-width: 440px) {
  .application__wrapper > h2, .profile__wrapper > h2 {
    font-size: 32px;
  }
}

.application__wrapper form, .profile__wrapper form {
  max-width: 732px;
}

.application__wrapper form > h2, .profile__wrapper form > h2 {
  color: var(--theme-accent-blue);
  font-weight: 900;
  font-size: 36px;
}

@media (max-width: 440px) {
  .application__wrapper form > h2, .profile__wrapper form > h2 {
    font-size: 32px;
  }
}

.application__wrapper form > input[type="submit"], .profile__wrapper form > input[type="submit"] {
  border-radius: 110px;
  color: var(--theme-main);
  font-weight: 600;
  font-size: 20px;
  padding: 18px 70px;
  transition: all .3s ease-in-out;
}

@media (max-width: 380px) {
  .application__wrapper form > input[type="submit"], .profile__wrapper form > input[type="submit"] {
    width: 100%;
  }
}

.application__wrapper form > input[type="submit"].disabled, .profile__wrapper form > input[type="submit"].disabled {
  filter: grayscale(60%);
  transition: all .3s ease-in-out;
}

.application__wrapper form > span, .profile__wrapper form > span {
  display: inline-flex;
  color: var(--theme-accent-green);
  margin-bottom: 16px;
}

.application__wrapper form > span svg, .profile__wrapper form > span svg {
  margin-right: 8px;
}

.application__wrapper__warning, .profile__wrapper__warning {
  position: relative;
  margin-top: 40px;
  padding-left: 60px;
  color: var(--theme-gray);
}

.application__wrapper__warning h2, .profile__wrapper__warning h2 {
  font-weight: 600;
}

.application__wrapper__warning svg, .profile__wrapper__warning svg {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.application__wrapper__data, .profile__wrapper__data {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 40px;
  row-gap: 40px;
  margin-top: 40px;
  margin-bottom: 40px;
}

@media (max-width: 520px) {
  .application__wrapper__data, .profile__wrapper__data {
    grid-template-columns: 1fr;
  }
}

.application__wrapper__data .input-field, .profile__wrapper__data .input-field {
  grid-column: 1;
}

.application__wrapper__data .input-field:nth-child(2), .profile__wrapper__data .input-field:nth-child(2) {
  grid-column: 2;
}

@media (max-width: 520px) {
  .application__wrapper__data .input-field:nth-child(2), .profile__wrapper__data .input-field:nth-child(2) {
    grid-column: 1;
  }
}

.application__wrapper__data .input-field span, .profile__wrapper__data .input-field span {
  display: none;
  color: var(--theme-accent-green);
  margin-top: 8px;
}

.application__wrapper__data .input-field span svg, .profile__wrapper__data .input-field span svg {
  margin-right: 6px;
}

.application__wrapper__contact, .profile__wrapper__contact {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 40px;
  margin-bottom: 40px;
  row-gap: 16px;
}

.application__wrapper__contact input, .profile__wrapper__contact input {
  display: none;
}

.application__wrapper__contact label, .profile__wrapper__contact label {
  display: flex;
  align-items: center;
  margin-right: 40px;
  position: relative;
  cursor: pointer;
  font-weight: 600;
  font-size: 24px;
  line-height: 130%;
  color: var(--theme-gray);
}

.application__wrapper__contact label span, .profile__wrapper__contact label span {
  position: relative;
  display: flex;
  flex-grow: 0;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  float: right;
  margin-left: 12px;
  width: 20px;
  height: 20px;
  border: 2px solid var(--theme-gray);
  border-radius: 100%;
  -webkit-tap-highlight-color: transparent;
}

.application__wrapper__contact label span:after, .profile__wrapper__contact label span:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background: var(--theme-accent-blue);
  transform: scale(0) translate(-50%, -50%);
  -webkit-transform: scale(0) translate(-50%, -50%);
  -moz-transform: scale(0) translate(-50%, -50%);
  -o-transform: scale(0) translate(-50%, -50%);
  -ms-transform: scale(0) translate(-50%, -50%);
  transition: all 0.2s ease;
  opacity: 0.08;
  pointer-events: none;
}

.application__wrapper__contact input[type="radio"]:checked + span, .profile__wrapper__contact input[type="radio"]:checked + span {
  border-color: var(--theme-accent-blue);
}

.application__wrapper__contact input[type="radio"]:checked + span:after, .profile__wrapper__contact input[type="radio"]:checked + span:after {
  transform: scale(1) translate(-50%, -50%);
  -webkit-transform: scale(1) translate(-50%, -50%);
  -moz-transform: scale(1) translate(-50%, -50%);
  -o-transform: scale(1) translate(-50%, -50%);
  -ms-transform: scale(1) translate(-50%, -50%);
  transition: all 0.2s cubic-bezier(0.35, 0.9, 0.4, 0.9);
  opacity: 1;
}

.application__wrapper__agreement > div, .profile__wrapper__agreement > div {
  display: inline-flex;
  align-items: flex-start;
}

.application__wrapper__agreement label, .profile__wrapper__agreement label {
  align-items: center;
  color: var(--theme-accent-green);
  margin-left: 8px;
  margin-bottom: 30px;
  max-width: 480px;
}

.application__wrapper__agreement label a, .profile__wrapper__agreement label a {
  color: var(--theme-accent-green);
  border-bottom: 2px solid var(--theme-accent-green);
  font-weight: 500;
}

.application__wrapper__agreement input, .profile__wrapper__agreement input {
  position: relative;
  -webkit-appearance: none;
  appearance: none;
  background-color: var(--theme-main);
  margin: 0;
  transition: all .1s ease-in-out;
  width: 18px;
  height: 18px;
}

.application__wrapper__agreement input::before, .profile__wrapper__agreement input::before {
  content: '';
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: inline-block;
  width: 18px;
  height: 18px;
  background-color: var(--theme-main);
  border: 1px solid rgba(56, 56, 56, 0.5);
  border-radius: 3px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
  transition: all .1s ease-in-out;
  cursor: pointer;
}

.application__wrapper__agreement input::after, .profile__wrapper__agreement input::after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 3px solid var(--theme-main);
  background: var(--theme-main);
  border-radius: 3px;
  transition: all .1s ease-in-out;
  cursor: pointer;
}

.application__wrapper__agreement input:checked::after, .profile__wrapper__agreement input:checked::after {
  background: var(--theme-accent-green);
  transition: all .1s ease-in-out;
}

.profile__wrapper > h1 {
  font-size: 36px;
}

@media (max-width: 440px) {
  .profile form > input[type="submit"] {
    font-size: 16px;
    width: 100%;
  }
}

/*==================================Login=====================================*/
.login {
  padding-top: 0;
  padding-bottom: 0;
}

.login__wrapper {
  flex-direction: column;
  min-height: calc(100vh - 90px);
}

.login__wrapper h1 {
  color: var(--theme-accent-blue);
  text-align: center;
}

@media (max-width: 380px) {
  .login__wrapper h1 {
    font-weight: 700;
    font-size: 32px;
  }
}

.login__wrapper form {
  flex-direction: column;
  margin-top: 40px;
  width: 100%;
}

.login__wrapper form input[type="text"] {
  max-width: 346px;
  margin-bottom: 60px;
}

.login__wrapper form h4 {
  max-width: 346px;
  margin-top: 32px;
  color: var(--theme-gray);
  text-align: center;
}

.login__wrapper form h4 a {
  color: var(--theme-accent-blue);
  font-weight: 600;
  border-bottom: 1px solid var(--theme-accent-blue);
}

/*=============================PurchaseHistory================================*/
@media (max-width: 440px) {
  .purchase-history__wrapper {
    padding-right: 10px;
    padding-left: 10px;
  }
}

.purchase-history__wrapper > span {
  font-size: 14px;
  color: var(--theme-accent-blue);
  margin-bottom: 30px;
}

.purchase-history__wrapper > h1 {
  text-transform: uppercase;
  color: var(--theme-gray);
  margin-bottom: 30px;
}

.purchase-history__tab__wrapper .tabs {
  display: flex;
  flex-wrap: wrap;
  row-gap: 16px;
  column-gap: 16px;
}

.purchase-history__tab__wrapper .tabs .tab {
  background: white;
  border: 1px solid var(--theme-accent-blue);
  color: var(--theme-accent-blue);
}

@media (max-width: 480px) {
  .purchase-history__tab__wrapper .tabs .tab {
    width: calc(50% - 8px);
  }
  .purchase-history__tab__wrapper .tabs .tab:first-child {
    width: 100%;
  }
}

.purchase-history__tab__wrapper .tabs .tab.active {
  background: var(--theme-accent-blue);
  color: white;
}

.purchase-history__tab__wrapper .tab__content .tab_item {
  display: none;
}

.purchase-history__tab__wrapper .tab__content .tab_item:first-child {
  display: block;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card {
  position: relative;
  display: flex;
  background: var(--theme-gray);
  border-radius: 30px 0px 20px 30px;
  margin-top: 60px;
}

@media (max-width: 600px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card {
    flex-direction: column;
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card.paid .purchase-history__card__description .blue-white-btn {
  display: none;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__title {
  position: relative;
  z-index: 1;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  width: 32%;
  padding: 30px 0 30px 30px;
  background: var(--theme-accent-blue);
  border-radius: 20px 0 0 20px;
}

@media (max-width: 990px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title {
    width: 35%;
  }
}

@media (max-width: 920px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title {
    width: 45%;
    min-width: 250px;
  }
}

@media (max-width: 600px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title {
    width: 100%;
    padding-bottom: 45vw;
    min-height: 300px;
    border-radius: 20px 0 0 0;
    overflow: visible;
  }
}

@media (max-width: 440px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title {
    padding: 20px 0 20px 20px;
    min-height: calc(240px + (300 - 240) * ((100vw - 320px) / (440 - 320)));
  }
}

@media (max-width: 340px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title {
    border-radius: calc(0px + (20 - 0) * ((100vw - 320px) / (340 - 320))) 0 0 0;
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__title h3 {
  font-weight: 500;
  color: var(--theme-gray);
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__title h1 {
  font-weight: 700;
  font-size: 30px;
  max-width: 235px;
  margin-top: 12px;
}

@media (max-width: 600px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title h1 {
    max-width: initial;
  }
}

@media (max-width: 440px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title h1 {
    font-size: 24px;
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__title img {
  position: absolute;
  z-index: 0;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  margin-top: auto;
  max-width: calc(100% - 15px);
}

@media (max-width: 1200px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title img {
    left: 15px;
    transform: initial;
    max-width: initial;
    min-width: 100%;
  }
}

@media (max-width: 920px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title img {
    min-width: 140%;
  }
}

@media (max-width: 600px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title img {
    z-index: 3;
    min-width: calc(100% - 60px);
    left: 50%;
    bottom: 30%;
    transform: translate(-50%, 50%);
  }
}

@media (max-width: 480px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title img {
    bottom: 25%;
  }
}

@media (max-width: 380px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__title img {
    max-width: calc(100% - 20px);
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: calc(50% - 16px) calc(50% - 16px);
  grid-template-rows: 1fr auto;
  justify-content: space-between;
  flex-grow: 1;
  padding: 32px;
}

@media (max-width: 1200px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description {
    grid-template-columns: calc(55% - 8px) calc(45% - 8px);
  }
}

@media (max-width: 990px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description {
    grid-template-columns: calc(50% - 8px) calc(50% - 8px);
  }
}

@media (max-width: 920px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description {
    padding-top: 60px;
  }
}

@media (max-width: 440px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description {
    padding: 40px 20px 20px 20px;
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_info {
  font-weight: 500;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_info h2 {
  font-weight: 500;
  color: var(--theme-accent-blue);
  margin-top: 20px;
  margin-bottom: 20px;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_info h2:last-of-type {
  color: var(--theme-accent-green);
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_info span:first-of-type {
  display: block;
  margin-bottom: 10px;
}

@media (max-width: 990px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_info span:first-of-type {
    max-width: 200px;
  }
}

@media (max-width: 920px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_info span:first-of-type {
    max-width: initial;
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_price {
  border-top: 1px solid #FFFFFF;
  padding-top: 20px;
}

@media (max-width: 920px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_price {
    margin-bottom: 40px;
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_price h2 {
  font-weight: 700;
  color: var(--theme-accent-blue);
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_price h4 {
  margin-top: 16px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  max-width: 300px;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total {
  grid-area: 1 / 2;
}

@media (max-width: 920px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total {
    grid-area: 2;
    margin-bottom: 10px;
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-month, .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-price {
  overflow: hidden;
  margin-bottom: 20px;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-month:after, .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-price:after {
  content: '...............................';
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 600px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-month:after, .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-price:after {
    content: '.................................................';
  }
}

@media (max-width: 480px) {
  .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-month:after, .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-price:after {
    content: '...............................';
  }
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-month span:first-of-type, .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-price span:first-of-type {
  float: left;
  margin-right: 10px;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-month span:last-of-type, .purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-price span:last-of-type {
  float: right;
  margin-left: 10px;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-month {
  font-weight: 500;
  font-size: 18px;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description_total-price {
  font-size: 24px;
  font-weight: 500;
  color: var(--theme-accent-blue);
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__description .blue-white-btn {
  display: inline;
  font-size: 20px;
  padding: 18px 0;
  height: max-content;
  margin-top: auto;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__payment {
  position: absolute;
  top: 0;
  right: 0;
  transform: translateY(-100%);
  background: var(--theme-accent-green);
  padding: 12px 30px;
  border-radius: 10px 10px 0 0;
  width: 100%;
  max-width: 40%;
  min-width: 300px;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__payment span {
  color: var(--theme-gray);
  font-weight: 700;
  float: right;
}

.purchase-history__tab__wrapper .tab__content .purchase-history__card__payment span:first-child {
  font-weight: 500;
  float: left;
}

/*=================================Payments===================================*/
@media (max-width: 440px) {
  .payments__wrapper {
    padding-left: 10px;
    padding-right: 10px;
  }
}

.payments__wrapper > span {
  color: var(--theme-accent-blue);
}

.payments__wrapper__content {
  display: flex;
  margin-top: 30px;
  column-gap: 32px;
}

@media (max-width: 680px) {
  .payments__wrapper__content {
    flex-direction: column;
    margin-top: 20px;
  }
}

.payments__wrapper__content__info {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 340px;
}

@media (max-width: 1000px) {
  .payments__wrapper__content__info {
    max-width: calc(220px + (340 - 220) * ((100vw - 680px) / (1000 - 680)));
  }
}

@media (max-width: 680px) {
  .payments__wrapper__content__info {
    max-width: 100%;
  }
}

.payments__wrapper__content__info h1 {
  color: var(--theme-gray);
  text-transform: uppercase;
}

.payments__wrapper__content__info > div {
  margin: 25px 0;
  padding: 15px 0;
  border-top: 1px solid rgba(56, 56, 56, 0.5);
  border-bottom: 1px solid rgba(56, 56, 56, 0.5);
}

.payments__wrapper__content__info > div h3 {
  font-weight: 500;
  color: rgba(56, 56, 56, 0.5);
  max-width: 250px;
}

@media (max-width: 680px) {
  .payments__wrapper__content__info > div h3 {
    max-width: 100%;
  }
}

.payments__wrapper__content__cabinet {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
  padding: 40px;
  width: 100%;
  max-width: 540px;
  border-radius: 12px;
  background: var(--theme-gray);
}

@media (max-width: 680px) {
  .payments__wrapper__content__cabinet {
    max-width: 100%;
    padding: 30px;
  }
}

@media (max-width: 440px) {
  .payments__wrapper__content__cabinet {
    margin-top: 10px;
    padding: 24px;
  }
}

.payments__wrapper__content__cabinet_user {
  display: flex;
  align-items: center;
}

.payments__wrapper__content__cabinet_user > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-left: 16px;
}

.payments__wrapper__content__cabinet_user > div h2 {
  font-weight: 700;
}

@media (max-width: 440px) {
  .payments__wrapper__content__cabinet_user > div h2 {
    font-size: 20px;
  }
}

.payments__wrapper__content__cabinet_user > div h3 {
  color: var(--theme-accent-blue);
  font-weight: 500;
  margin-top: 6px;
}

@media (max-width: 440px) {
  .payments__wrapper__content__cabinet_user > div h3 {
    font-size: 16px;
  }
}

.payments__wrapper__content__cabinet_user > div h3 span {
  font-weight: 700;
}

.payments__wrapper__content__cabinet_menu {
  margin: 25px 0;
  padding: 25px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.payments__wrapper__content__cabinet_menu ul {
  display: flex;
  flex-direction: column;
}

.payments__wrapper__content__cabinet_menu ul li {
  display: inline-flex;
  align-items: center;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 500;
}

@media (max-width: 440px) {
  .payments__wrapper__content__cabinet_menu ul li {
    font-size: 16px;
  }
}

.payments__wrapper__content__cabinet_menu ul li a {
  color: var(--theme-main);
}

.payments__wrapper__content__cabinet_menu ul li svg {
  margin-right: 28px;
}

.payments__wrapper__content__cabinet_menu-city {
  margin-top: 20px;
  font-size: 18px;
  color: var(--theme-accent-blue);
}

@media (max-width: 440px) {
  .payments__wrapper__content__cabinet_menu-city {
    font-size: 16px;
  }
}

.payments__wrapper__content__cabinet_menu-city span:first-of-type {
  font-weight: 700;
  margin-right: 20px;
}

.payments__wrapper__content__cabinet_links {
  display: flex;
  flex-direction: column;
  font-weight: 500;
}

@media (max-width: 440px) {
  .payments__wrapper__content__cabinet_links {
    font-size: 16px;
  }
}

.payments__wrapper__content__cabinet_links a {
  color: var(--theme-main);
  margin-bottom: 20px;
}

.payments__wrapper__content__cabinet .cabinet-logout {
  margin-top: 10px;
  color: var(--theme-main);
  font-weight: 700;
  margin-bottom: 10px;
}

/*====================================Cart====================================*/
.cart__wrapper {
  min-height: calc(100vh - 90px);
}

@media (max-width: 370px) {
  .cart__wrapper {
    padding-right: 10px;
    padding-left: 10px;
  }
}

.cart__wrapper > h1 {
  position: relative;
  color: var(--theme-gray);
  text-transform: uppercase;
  margin-bottom: 24px;
  width: max-content;
  --items-count: '0';
}

.cart__wrapper > h1:before {
  content: var(--items-count);
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -5px;
  right: -30px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--theme-accent-blue);
  font-size: 16px;
  font-weight: 700;
  color: white;
}

.cart__wrapper_back {
  position: relative;
  z-index: 1;
}

.cart__wrapper_back:before {
  content: '';
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--theme-accent-blue);
}

.cart__wrapper_back:after {
  content: '';
  position: absolute;
  z-index: 3;
  top: calc(50% - 4px);
  right: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--theme-accent-blue);
}

.cart__wrapper_back > a {
  position: relative;
  z-index: 4;
  display: inline-block;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
  color: var(--theme-accent-blue);
  padding: 6px;
  border: 1px solid var(--theme-accent-blue);
  border-radius: 50px;
  background: white;
}

.cart__wrapper__content {
  display: flex;
  margin-top: 20px;
  column-gap: 64px;
}

@media (max-width: 1200px) {
  .cart__wrapper__content {
    column-gap: 16px;
  }
}

@media (max-width: 920px) {
  .cart__wrapper__content {
    flex-direction: column;
  }
}

.cart__wrapper__content__products {
  flex: 2 0 0;
  display: flex;
  flex-direction: column;
}

.cart__wrapper__content__products .empty-cart {
  margin-top: 20px;
  color: var(--theme-gray);
  font-weight: 500;
}

.cart__wrapper__content__products_item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 20px;
  margin-bottom: 20px;
}

@media (max-width: 700px) {
  .cart__wrapper__content__products_item {
    display: grid;
    grid-template-columns: repeat(5, auto);
    grid-template-rows: repeat(2, auto);
    column-gap: 16px;
  }
}

@media (max-width: 580px) {
  .cart__wrapper__content__products_item {
    grid-template-columns: repeat(6, 1fr);
    justify-items: center;
    row-gap: 16px;
  }
}

@media (max-width: 370px) {
  .cart__wrapper__content__products_item {
    column-gap: 0;
  }
}

.cart__wrapper__content__products_item > img {
  display: block;
  max-width: 25%;
}

@media (max-width: 700px) {
  .cart__wrapper__content__products_item > img {
    max-width: 100%;
    min-width: 180px;
    max-height: 120px;
    grid-column: span 2;
    grid-row: span 2;
  }
}

@media (max-width: 580px) {
  .cart__wrapper__content__products_item > img {
    grid-column: span 3;
    grid-row: 1;
  }
}

@media (max-width: 420px) {
  .cart__wrapper__content__products_item > img {
    min-width: 140px;
  }
}

@media (max-width: 370px) {
  .cart__wrapper__content__products_item > img {
    grid-column: span 6;
    margin: 0 auto;
    max-height: initial;
  }
}

.cart__wrapper__content__products_item > h3 {
  max-width: 22%;
  font-size: 14px;
  font-weight: 700;
  color: var(--theme-accent-blue);
}

@media (max-width: 700px) {
  .cart__wrapper__content__products_item > h3 {
    max-width: 100%;
    grid-column: span 3;
  }
}

@media (max-width: 580px) {
  .cart__wrapper__content__products_item > h3 {
    max-width: 80%;
    margin-right: auto;
  }
}

@media (max-width: 370px) {
  .cart__wrapper__content__products_item > h3 {
    max-width: 100%;
    grid-column: span 6;
    margin: 0 auto;
  }
}

.cart__wrapper__content__products_item_counter {
  display: flex;
  align-items: center;
  color: var(--theme-gray);
  font-size: 16px;
  font-weight: 500;
  column-gap: 14px;
  user-select: none;
}

@media (max-width: 700px) {
  .cart__wrapper__content__products_item_counter {
    grid-row: 2;
    grid-column: 3;
  }
}

@media (max-width: 580px) {
  .cart__wrapper__content__products_item_counter {
    grid-column: span 3;
  }
}

@media (max-width: 370px) {
  .cart__wrapper__content__products_item_counter {
    grid-row: auto;
    grid-column: span 2;
  }
}

.cart__wrapper__content__products_item_counter .products_item_counter-plus, .cart__wrapper__content__products_item_counter .products_item_counter-minus {
  display: block;
  border: 1px solid rgba(56, 56, 56, 0.5);
  border-radius: 50%;
  width: 28px;
  height: 28px;
  padding: 0;
}

.cart__wrapper__content__products_item_counter .products_item_counter-value {
  width: 18px;
  text-align: center;
}

@media (max-width: 370px) {
  .cart__wrapper__content__products_item_counter .products_item_counter-value {
    width: auto;
  }
}

.cart__wrapper__content__products_item_price {
  display: flex;
  flex-direction: column;
  color: var(--theme-gray);
  font-size: 16px;
  font-weight: 500;
  width: 100px;
  align-items: center;
}

@media (max-width: 700px) {
  .cart__wrapper__content__products_item_price {
    grid-row: 2;
    grid-column: 4;
  }
}

@media (max-width: 580px) {
  .cart__wrapper__content__products_item_price {
    grid-column: span 2;
    margin-right: auto;
    width: auto;
  }
}

@media (max-width: 370px) {
  .cart__wrapper__content__products_item_price {
    grid-row: auto;
    grid-column: span 3;
    margin-right: 0;
  }
}

.cart__wrapper__content__products_item_controls {
  display: flex;
  align-items: center;
}

@media (max-width: 700px) {
  .cart__wrapper__content__products_item_controls {
    grid-row: 2;
    grid-column: 5;
    margin-left: auto;
  }
}

@media (max-width: 580px) {
  .cart__wrapper__content__products_item_controls {
    grid-column: span 1;
  }
}

@media (max-width: 370px) {
  .cart__wrapper__content__products_item_controls {
    grid-row: auto;
  }
}

.cart__wrapper__content__products_item_controls-favourite {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 18px;
  height: 18px;
  margin-right: 14px;
}

.cart__wrapper__content__products_item_controls-favourite svg {
  fill: white;
  stroke: rgba(56, 56, 56, 0.5);
  transform: translateX(2px);
  transition: .4s ease-in-out;
  opacity: 0.9;
}

.cart__wrapper__content__products_item_controls-favourite svg:hover {
  fill: #EF5350;
  stroke: #EF5350;
}

.cart__wrapper__content__products_item_controls-remove {
  border: 1px solid rgba(56, 56, 56, 0.5);
  border-radius: 50%;
  width: 33px;
  height: 33px;
  padding: 0;
}

.cart__wrapper__content__info {
  flex: 1.1 0 0;
  width: 100%;
  max-width: 470px;
  margin-left: auto;
}

@media (max-width: 1100px) {
  .cart__wrapper__content__info {
    flex: 1 0 0;
  }
}

.cart__wrapper__content__info_price {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  color: var(--theme-gray);
}

.cart__wrapper__content__info_price > span {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 12px;
}

.cart__wrapper__content__info_price > div {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
}

.cart__wrapper__content__info_price > div .total-price {
  font-weight: 700;
  font-size: 24px;
}

.cart__wrapper__content__info_price > div span {
  width: max-content;
}

.cart__wrapper__content__info_price > div span:last-of-type {
  font-size: 10px;
  color: rgba(56, 56, 56, 0.5);
}

.cart__wrapper__content__info_delivery {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: var(--theme-gray);
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  margin: 8px 0;
}

.cart__wrapper__content__info_promocode {
  display: flex;
  flex-direction: column;
}

.cart__wrapper__content__info_promocode > span {
  font-weight: 700;
  font-size: 12px;
  color: var(--theme-gray);
}

.cart__wrapper__content__info_promocode > span:last-of-type {
  font-size: 10px;
  font-weight: 400;
  color: var(--theme-accent-green);
  margin: 10px;
}

.cart__wrapper__content__info_promocode > div {
  position: relative;
  margin-top: 12px;
}

.cart__wrapper__content__info_promocode > div input {
  border: 1px solid var(--theme-accent-green);
  border-radius: 10px;
  width: 100%;
  height: 31.2px;
  padding-right: 160px;
  padding-left: 8px;
  color: var(--theme-gray);
}

@media (max-width: 1000px) {
  .cart__wrapper__content__info_promocode > div input {
    padding-right: 120px;
  }
}

@media (max-width: 920px) {
  .cart__wrapper__content__info_promocode > div input {
    padding-right: 160px;
  }
}

@media (max-width: 480px) {
  .cart__wrapper__content__info_promocode > div input {
    height: 40px;
  }
}

.cart__wrapper__content__info_promocode > div a {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  background: var(--theme-accent-green);
  border-radius: 10px;
  padding: 8px 40px;
  width: max-content;
  color: white;
}

@media (max-width: 1000px) {
  .cart__wrapper__content__info_promocode > div a {
    padding: 8px 20px;
  }
}

@media (max-width: 920px) {
  .cart__wrapper__content__info_promocode > div a {
    padding: 8px 40px;
  }
}

@media (max-width: 480px) {
  .cart__wrapper__content__info_promocode > div a {
    height: 40px;
  }
}

.cart__wrapper__content__info_buy {
  display: flex;
  margin-top: 10px;
  column-gap: 8px;
  row-gap: 20px;
  width: 100%;
}

@media (max-width: 1100px) {
  .cart__wrapper__content__info_buy {
    flex-direction: column;
  }
}

@media (max-width: 920px) {
  .cart__wrapper__content__info_buy {
    flex-direction: row;
  }
}

@media (max-width: 375px) {
  .cart__wrapper__content__info_buy {
    flex-direction: column;
  }
}

.cart__wrapper__content__info_buy .blue-btn, .cart__wrapper__content__info_buy .blue-white-btn, .cart__wrapper__content__info_buy .subscribe__wrapper__details_shipping > div:first-of-type .white-btn, .subscribe__wrapper__details_shipping > div:first-of-type .cart__wrapper__content__info_buy .white-btn {
  transform: scale(1);
}

.cart__wrapper__content__info_buy .blue-btn:hover, .cart__wrapper__content__info_buy .blue-white-btn:hover, .cart__wrapper__content__info_buy .subscribe__wrapper__details_shipping > div:first-of-type .white-btn:hover, .subscribe__wrapper__details_shipping > div:first-of-type .cart__wrapper__content__info_buy .white-btn:hover {
  transform: scale(1.03);
}

.cart__wrapper__content__info_buy div {
  display: flex;
  flex-direction: column;
  width: 50%;
}

@media (max-width: 1100px) {
  .cart__wrapper__content__info_buy div {
    width: 100%;
  }
}

@media (max-width: 920px) {
  .cart__wrapper__content__info_buy div {
    width: 50%;
  }
}

@media (max-width: 375px) {
  .cart__wrapper__content__info_buy div {
    width: 100%;
  }
}

.cart__wrapper__content__info_buy div:first-child a {
  color: var(--theme-accent-blue);
  background: white;
  border: 1px solid var(--theme-accent-blue);
}

.cart__wrapper__content__info_buy div:last-child a {
  color: white;
}

.cart__wrapper__content__info_buy div a {
  font-size: 12px;
  padding: 12px;
  width: 100%;
}

.cart__wrapper__content__info_buy div span {
  margin-top: 10px;
  margin-left: 10px;
  font-weight: 400;
  font-size: 10px;
  color: var(--theme-accent-blue);
}

/*================================Purchase====================================*/
.purchase__wrapper {
  min-height: calc(100vh - 160px);
}

@media (max-width: 820px) {
  .purchase__wrapper {
    min-height: initial;
  }
}

.purchase__wrapper > h1 {
  text-transform: uppercase;
  color: var(--theme-gray);
}

@media (max-width: 440px) {
  .purchase__wrapper > h1 {
    font-size: 32px;
  }
}

.purchase__wrapper > form {
  margin-top: 30px;
  display: flex;
  row-gap: 20px;
  column-gap: 40px;
}

@media (max-width: 820px) {
  .purchase__wrapper > form {
    column-gap: 20px;
  }
}

@media (max-width: 680px) {
  .purchase__wrapper > form {
    flex-direction: column-reverse;
  }
}

.purchase__wrapper__options {
  width: 66.66%;
}

@media (max-width: 680px) {
  .purchase__wrapper__options {
    width: 100%;
  }
}

.purchase__wrapper__options .blue-white-btn {
  display: block;
  padding: 12px 32px;
  max-width: 200px;
  font-size: 12px;
  height: 44px;
}

.purchase__wrapper__options .purchase__cart_item {
  display: grid;
  grid-template-columns: 2fr 1.5fr 0.8fr 0.8fr 0.8fr;
  align-items: center;
  justify-content: space-between;
  column-gap: 16px;
  row-gap: 16px;
  color: var(--theme-gray);
  margin-top: 10px;
  margin-bottom: 10px;
  justify-items: center;
}

@media (max-width: 1024px) {
  .purchase__wrapper__options .purchase__cart_item {
    grid-template-columns: repeat(6, 1fr);
  }
}

.purchase__wrapper__options .purchase__cart_item img {
  display: block;
  max-width: 100%;
  max-height: 120px;
}

@media (max-width: 1024px) {
  .purchase__wrapper__options .purchase__cart_item img {
    grid-column: span 3;
  }
}

@media (max-width: 340px) {
  .purchase__wrapper__options .purchase__cart_item img {
    grid-column: span 6;
  }
}

.purchase__wrapper__options .purchase__cart_item h3 {
  font-size: 14px;
  font-weight: 700;
  color: var(--theme-accent-blue);
}

@media (max-width: 1024px) {
  .purchase__wrapper__options .purchase__cart_item h3 {
    grid-column: span 3;
    max-width: 200px;
  }
}

@media (max-width: 340px) {
  .purchase__wrapper__options .purchase__cart_item h3 {
    grid-column: span 6;
    max-width: 100%;
  }
}

.purchase__wrapper__options .purchase__cart_item span {
  font-size: 16px;
  font-weight: 500;
}

@media (max-width: 1024px) {
  .purchase__wrapper__options .purchase__cart_item span {
    grid-column: span 2;
  }
}

.purchase__wrapper__options .purchase__cart_item > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

@media (max-width: 1024px) {
  .purchase__wrapper__options .purchase__cart_item > div {
    grid-column: span 2;
  }
}

.purchase__wrapper__options .row-radio {
  display: flex;
  align-items: center;
  column-gap: 16px;
  color: rgba(56, 56, 56, 0.5);
  margin-top: 10px;
  margin-bottom: 10px;
}

.purchase__wrapper__options .row-radio input {
  display: none;
}

.purchase__wrapper__options .row-radio label {
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
}

.purchase__wrapper__options .row-radio label span {
  position: relative;
  display: flex;
  flex-grow: 0;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  margin-right: 12px;
  width: 10px;
  height: 11px;
  border-radius: 2px;
  border: 1px solid rgba(56, 56, 56, 0.5);
  -webkit-tap-highlight-color: transparent;
}

.purchase__wrapper__options .row-radio label span:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5px;
  height: 5px;
  background: var(--theme-accent-green);
  transform: scale(0) translate(-50%, -50%);
  -webkit-transform: scale(0) translate(-50%, -50%);
  -moz-transform: scale(0) translate(-50%, -50%);
  -o-transform: scale(0) translate(-50%, -50%);
  -ms-transform: scale(0) translate(-50%, -50%);
  transition: all 0.2s ease;
  opacity: 0.08;
  pointer-events: none;
}

.purchase__wrapper__options .row-radio input[type="radio"]:checked + span:after {
  transform: scale(1) translate(-50%, -50%);
  -webkit-transform: scale(1) translate(-50%, -50%);
  -moz-transform: scale(1) translate(-50%, -50%);
  -o-transform: scale(1) translate(-50%, -50%);
  -ms-transform: scale(1) translate(-50%, -50%);
  transition: all 0.2s cubic-bezier(0.35, 0.9, 0.4, 0.9);
  opacity: 1;
}

.purchase__wrapper__options .purchase__cart_delivery-region {
  display: flex;
  flex-direction: column;
  color: var(--theme-gray);
  font-weight: 700;
  font-size: 12px;
}

.purchase__wrapper__options .purchase__cart_delivery-region > input {
  font-weight: 700;
  font-size: 14px;
  max-width: 200px;
  margin-top: 10px;
}

.purchase__wrapper__options .purchase__person-data__wrapper > span {
  display: block;
  color: var(--theme-gray);
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 10px;
}

.purchase__wrapper__options .purchase__person-data__wrapper .purchase__person-data {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 32px;
  row-gap: 16px;
  margin-bottom: 10px;
}

@media (max-width: 480px) {
  .purchase__wrapper__options .purchase__person-data__wrapper .purchase__person-data {
    grid-template-columns: 1fr;
  }
}

.purchase__wrapper__options .purchase__person-data__wrapper .purchase__person-data .input-field > input {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 6px;
}

.purchase__wrapper__options .purchase__person-data__wrapper .purchase__person-data .input-field > span {
  display: inline-flex;
  column-gap: 4px;
  font-size: 10px;
  color: var(--theme-accent-green);
}

.purchase__wrapper__options .purchase__person-data__wrapper .purchase__person-data__contact-method {
  color: var(--theme-gray);
  font-weight: 700;
  font-size: 12px;
}

.purchase__wrapper__options__accordion .accordion__item {
  position: relative;
}

.purchase__wrapper__options__accordion .accordion__item .accordion__trigger svg {
  fill: rgba(56, 56, 56, 0.5);
}

.purchase__wrapper__options__accordion .accordion__item_active .accordion__trigger svg {
  transform: rotate(90deg);
  transition: .4s ease-in-out;
  fill: var(--theme-accent-green);
}

.purchase__wrapper__options__accordion .accordion__item_active .accordion__trigger a {
  opacity: 0;
}

.purchase__wrapper__options__accordion .accordion__item_active .accordion__content {
  margin: 10px 32px;
  transition: all .4s ease-in-out;
  opacity: 1;
}

@media (max-width: 1100px) {
  .purchase__wrapper__options__accordion .accordion__item_active .accordion__content {
    margin: 10px;
  }
}

.purchase__wrapper__options__accordion .accordion__item_active .accordion__title:before {
  border: none;
  background: var(--theme-accent-green);
}

.purchase__wrapper__options__accordion .accordion__trigger {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  column-gap: 16px;
  padding: 12px 12px 12px 32px;
  background: rgba(56, 56, 56, 0.06);
  border-radius: 50px;
  cursor: pointer;
}

.purchase__wrapper__options__accordion .accordion__trigger:not(:last-child) {
  margin-bottom: 15px;
}

.purchase__wrapper__options__accordion .accordion__trigger svg {
  transition: .4s ease-in-out;
}

.purchase__wrapper__options__accordion .accordion__trigger a {
  position: relative;
  display: block;
  margin-left: auto;
  font-size: 12px;
  font-weight: 500;
  text-decoration: underline;
  color: var(--theme-accent-green);
  opacity: 1;
  transition: opacity .4s ease-in-out;
}

@media (max-width: 340px) {
  .purchase__wrapper__options__accordion .accordion__trigger a {
    font-size: 10px;
  }
}

.purchase__wrapper__options__accordion .accordion__trigger a:before {
  content: '';
  position: absolute;
  top: 50%;
  left: -20px;
  transform: translateY(-50%);
  width: 12px;
  height: 10px;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='10' viewBox='0 0 12 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4.5L4.5 9L11 1' stroke='%2324B7E6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
}

.purchase__wrapper__options__accordion .accordion__title {
  position: relative;
  font-weight: 700;
  font-size: 12px;
  color: rgba(56, 56, 56, 0.5);
  text-transform: uppercase;
}

@media (max-width: 340px) {
  .purchase__wrapper__options__accordion .accordion__title {
    font-size: 10px;
  }
}

.purchase__wrapper__options__accordion .accordion__title:before {
  content: '';
  position: absolute;
  top: 50%;
  left: -18px;
  transform: translateY(-50%);
  width: 10px;
  height: 10px;
  border: 1px solid rgba(56, 56, 56, 0.5);
  border-radius: 50%;
  transition: background .4s ease-in-out, border .4s ease-in-out;
  transition-delay: 0s, .25s;
}

.purchase__wrapper__options__accordion .accordion__content {
  height: 0;
  margin: 0 15px;
  opacity: 0;
  overflow: hidden;
  transition: all .4s ease-in-out;
}

.purchase__wrapper__options__accordion .accordion__content .method__info {
  position: absolute;
  top: 56px;
  right: 0;
  display: flex;
  flex-direction: column;
  max-width: 150px;
  background: #F3F3F3;
  border-radius: 10px;
  padding: 16px;
}

@media (max-width: 440px) {
  .purchase__wrapper__options__accordion .accordion__content .method__info {
    display: none;
  }
}

.purchase__wrapper__options__accordion .accordion__content .method__info > div {
  display: flex;
  align-items: center;
  border-bottom: 1px solid rgba(56, 56, 56, 0.5);
  padding-bottom: 12px;
  margin-bottom: 8px;
  column-gap: 8px;
}

.purchase__wrapper__options__accordion .accordion__content .method__info > div span {
  font-size: 12px;
  font-weight: 700;
  max-width: 80px;
  color: var(--theme-gray);
}

.purchase__wrapper__options__accordion .accordion__content .method__info > span {
  font-size: 10px;
  font-weight: 500;
  color: rgba(56, 56, 56, 0.5);
}

.purchase__wrapper__options__accordion .accordion__content > h3 {
  font-weight: 700;
  font-size: 12px;
  color: var(--theme-gray);
  margin-bottom: 10px;
}

.purchase__wrapper__options__accordion .accordion__content ul {
  padding-right: 145px;
}

@media (max-width: 440px) {
  .purchase__wrapper__options__accordion .accordion__content ul {
    padding-right: 0;
  }
}

.purchase__wrapper__options__accordion .accordion__content ul li {
  font-size: 12px;
  color: rgba(56, 56, 56, 0.5);
  margin-bottom: 6px;
}

.purchase__wrapper__options__accordion .accordion__content ul li input {
  display: none;
}

.purchase__wrapper__options__accordion .accordion__content ul li label {
  display: flex;
  align-items: baseline;
  position: relative;
  cursor: pointer;
}

.purchase__wrapper__options__accordion .accordion__content ul li label span {
  position: relative;
  display: flex;
  flex-grow: 0;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  margin-right: 12px;
  width: 10px;
  height: 11px;
  border-radius: 2px;
  border: 1px solid rgba(56, 56, 56, 0.5);
  -webkit-tap-highlight-color: transparent;
}

.purchase__wrapper__options__accordion .accordion__content ul li label span:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5px;
  height: 5px;
  background: var(--theme-accent-green);
  transform: scale(0) translate(-50%, -50%);
  -webkit-transform: scale(0) translate(-50%, -50%);
  -moz-transform: scale(0) translate(-50%, -50%);
  -o-transform: scale(0) translate(-50%, -50%);
  -ms-transform: scale(0) translate(-50%, -50%);
  transition: all 0.2s ease;
  opacity: 0.08;
  pointer-events: none;
}

.purchase__wrapper__options__accordion .accordion__content ul li input[type="radio"]:checked + span:after {
  transform: scale(1) translate(-50%, -50%);
  -webkit-transform: scale(1) translate(-50%, -50%);
  -moz-transform: scale(1) translate(-50%, -50%);
  -o-transform: scale(1) translate(-50%, -50%);
  -ms-transform: scale(1) translate(-50%, -50%);
  transition: all 0.2s cubic-bezier(0.35, 0.9, 0.4, 0.9);
  opacity: 1;
}

.purchase__wrapper__info {
  width: 33.33%;
  min-width: 250px;
}

@media (max-width: 680px) {
  .purchase__wrapper__info {
    width: 100%;
  }
}

.purchase__wrapper__info_order {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 40px;
  background: var(--theme-accent-green);
  border-radius: 10px;
  padding: 12px;
  font-size: 12px;
  margin-bottom: 20px;
}

.purchase__wrapper__info_order span {
  text-transform: uppercase;
  font-weight: 700;
}

.purchase__wrapper__info_order a {
  font-weight: 500;
  color: white;
  text-decoration: underline;
}

.purchase__wrapper__info_price {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--theme-gray);
  padding: 0 10px;
  margin-bottom: 10px;
}

@media (max-width: 980px) {
  .purchase__wrapper__info_price > span {
    max-width: 100px;
  }
}

.purchase__wrapper__info_price > div {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.purchase__wrapper__info_price > div span:first-of-type {
  font-weight: 700;
  font-size: 24px;
}

.purchase__wrapper__info_price > div span:last-of-type {
  font-size: 10px;
  color: rgba(56, 56, 56, 0.5);
}

.purchase__wrapper__info ul {
  display: flex;
  flex-direction: column;
}

.purchase__wrapper__info ul li {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 10px;
  color: var(--theme-gray);
  font-size: 12px;
  color: rgba(56, 56, 56, 0.5);
  margin-bottom: 4px;
  font-weight: 500;
}

.purchase__wrapper__info ul li:last-child {
  background: rgba(56, 56, 56, 0.06);
  border-radius: 6px;
  color: var(--theme-gray);
}

.purchase__wrapper__info > span {
  font-weight: 700;
  color: var(--theme-gray);
  margin-left: auto;
  margin-top: 10px;
  display: block;
  text-align: end;
  padding-right: 10px;
}

/*===============================BonusAccount=================================*/
@media (max-width: 440px) {
  .bonus__wrapper {
    padding-right: 10px;
    padding-left: 10px;
  }
}

.bonus__wrapper > h1 {
  text-transform: uppercase;
  color: var(--theme-gray);
  margin-bottom: 12px;
}

.bonus__content {
  display: flex;
  flex-direction: column;
  column-gap: 32px;
}

.bonus__content .bonus-account {
  max-width: 520px;
}

.bonus__content .bonus-account > h2, .bonus__content .bonus-account > h3 {
  color: var(--theme-gray);
}

.bonus__content .bonus-account > h2 {
  font-weight: 700;
}

.bonus__content .bonus-account > h2 span {
  color: var(--theme-accent-blue);
}

.bonus__content .bonus-account form {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
  margin-top: 32px;
}

.bonus__content .bonus-account form > span {
  display: inline-flex;
  color: var(--theme-accent-green);
  margin-bottom: 16px;
}

.bonus__content .bonus-account form > span svg {
  margin-right: 8px;
}

.bonus__content .bonus-account form input[type="submit"] {
  width: max-content;
}

@media (max-width: 440px) {
  .bonus__content .bonus-account form input[type="submit"] {
    width: 100%;
  }
}

.bonus__content .subscribtions {
  margin-top: 32px;
}

.bonus__content .subscribtions > h2, .bonus__content .subscribtions > h3 {
  color: var(--theme-gray);
}

.bonus__content .subscribtions > h2 {
  font-weight: 700;
}

.bonus__content .subscribtions__wrapper__card {
  position: relative;
  display: flex;
  background: var(--theme-gray);
  border-radius: 30px 0px 20px 30px;
  margin-top: 60px;
}

@media (max-width: 600px) {
  .bonus__content .subscribtions__wrapper__card {
    flex-direction: column;
  }
}

.bonus__content .subscribtions__wrapper__card__title {
  position: relative;
  z-index: 1;
  overflow-x: hidden;
  display: flex;
  flex-direction: column;
  width: 32%;
  padding: 30px 0 30px 30px;
  background: var(--theme-accent-blue);
  border-radius: 20px 0 0 20px;
}

@media (max-width: 990px) {
  .bonus__content .subscribtions__wrapper__card__title {
    width: 35%;
  }
}

@media (max-width: 920px) {
  .bonus__content .subscribtions__wrapper__card__title {
    width: 45%;
    min-width: 250px;
  }
}

@media (max-width: 600px) {
  .bonus__content .subscribtions__wrapper__card__title {
    width: 100%;
    padding-bottom: 45vw;
    min-height: 300px;
    border-radius: 20px 0 0 0;
    overflow: visible;
  }
}

@media (max-width: 440px) {
  .bonus__content .subscribtions__wrapper__card__title {
    padding: 20px 0 20px 20px;
    min-height: calc(240px + (300 - 240) * ((100vw - 320px) / (440 - 320)));
  }
}

@media (max-width: 340px) {
  .bonus__content .subscribtions__wrapper__card__title {
    border-radius: calc(0px + (20 - 0) * ((100vw - 320px) / (340 - 320))) 0 0 0;
  }
}

.bonus__content .subscribtions__wrapper__card__title h3 {
  font-weight: 500;
  color: var(--theme-gray);
}

.bonus__content .subscribtions__wrapper__card__title h1 {
  font-weight: 700;
  font-size: 30px;
  max-width: 235px;
  margin-top: 12px;
}

@media (max-width: 600px) {
  .bonus__content .subscribtions__wrapper__card__title h1 {
    max-width: initial;
  }
}

@media (max-width: 440px) {
  .bonus__content .subscribtions__wrapper__card__title h1 {
    font-size: 24px;
  }
}

.bonus__content .subscribtions__wrapper__card__title img {
  position: absolute;
  z-index: 0;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  margin-top: auto;
  max-width: calc(100% - 15px);
}

@media (max-width: 1200px) {
  .bonus__content .subscribtions__wrapper__card__title img {
    left: 15px;
    transform: initial;
    max-width: initial;
    min-width: 100%;
  }
}

@media (max-width: 920px) {
  .bonus__content .subscribtions__wrapper__card__title img {
    min-width: 140%;
  }
}

@media (max-width: 600px) {
  .bonus__content .subscribtions__wrapper__card__title img {
    z-index: 3;
    min-width: calc(100% - 60px);
    left: 50%;
    bottom: 30%;
    transform: translate(-50%, 50%);
  }
}

@media (max-width: 480px) {
  .bonus__content .subscribtions__wrapper__card__title img {
    bottom: 25%;
  }
}

@media (max-width: 380px) {
  .bonus__content .subscribtions__wrapper__card__title img {
    max-width: calc(100% - 20px);
  }
}

.bonus__content .subscribtions__wrapper__card__description {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: calc(50% - 16px) calc(50% - 16px);
  grid-template-rows: 1fr auto;
  justify-content: space-between;
  flex-grow: 1;
  padding: 32px;
}

@media (max-width: 1200px) {
  .bonus__content .subscribtions__wrapper__card__description {
    grid-template-columns: calc(55% - 8px) calc(45% - 8px);
  }
}

@media (max-width: 990px) {
  .bonus__content .subscribtions__wrapper__card__description {
    grid-template-columns: calc(50% - 8px) calc(50% - 8px);
  }
}

@media (max-width: 920px) {
  .bonus__content .subscribtions__wrapper__card__description {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .bonus__content .subscribtions__wrapper__card__description {
    padding-top: 60px;
  }
}

@media (max-width: 440px) {
  .bonus__content .subscribtions__wrapper__card__description {
    padding: 40px 20px 20px 20px;
  }
}

.bonus__content .subscribtions__wrapper__card__description_info {
  font-weight: 500;
}

.bonus__content .subscribtions__wrapper__card__description_info h2 {
  font-weight: 500;
  color: var(--theme-accent-blue);
  margin-top: 20px;
  margin-bottom: 20px;
}

.bonus__content .subscribtions__wrapper__card__description_info h2:last-of-type {
  color: var(--theme-accent-green);
}

.bonus__content .subscribtions__wrapper__card__description_info span:first-of-type {
  display: block;
  margin-bottom: 10px;
}

@media (max-width: 990px) {
  .bonus__content .subscribtions__wrapper__card__description_info span:first-of-type {
    max-width: 200px;
  }
}

@media (max-width: 920px) {
  .bonus__content .subscribtions__wrapper__card__description_info span:first-of-type {
    max-width: initial;
  }
}

.bonus__content .subscribtions__wrapper__card__description_price {
  border-top: 1px solid #FFFFFF;
  padding-top: 20px;
}

@media (max-width: 920px) {
  .bonus__content .subscribtions__wrapper__card__description_price {
    margin-bottom: 40px;
  }
}

.bonus__content .subscribtions__wrapper__card__description_price h2 {
  font-weight: 700;
  color: var(--theme-accent-blue);
}

.bonus__content .subscribtions__wrapper__card__description_price h4 {
  margin-top: 16px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.5);
  max-width: 300px;
}

.bonus__content .subscribtions__wrapper__card__description_total {
  grid-area: 1 / 2;
}

@media (max-width: 920px) {
  .bonus__content .subscribtions__wrapper__card__description_total {
    grid-area: 2;
    margin-bottom: 10px;
  }
}

.bonus__content .subscribtions__wrapper__card__description_total-month, .bonus__content .subscribtions__wrapper__card__description_total-price {
  overflow: hidden;
  margin-bottom: 20px;
}

.bonus__content .subscribtions__wrapper__card__description_total-month:after, .bonus__content .subscribtions__wrapper__card__description_total-price:after {
  content: '...............................';
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 600px) {
  .bonus__content .subscribtions__wrapper__card__description_total-month:after, .bonus__content .subscribtions__wrapper__card__description_total-price:after {
    content: '.................................................';
  }
}

@media (max-width: 480px) {
  .bonus__content .subscribtions__wrapper__card__description_total-month:after, .bonus__content .subscribtions__wrapper__card__description_total-price:after {
    content: '...............................';
  }
}

.bonus__content .subscribtions__wrapper__card__description_total-month span:first-of-type, .bonus__content .subscribtions__wrapper__card__description_total-price span:first-of-type {
  float: left;
  margin-right: 10px;
}

.bonus__content .subscribtions__wrapper__card__description_total-month span:last-of-type, .bonus__content .subscribtions__wrapper__card__description_total-price span:last-of-type {
  float: right;
  margin-left: 10px;
}

.bonus__content .subscribtions__wrapper__card__description_total-month {
  font-weight: 500;
  font-size: 18px;
}

.bonus__content .subscribtions__wrapper__card__description_total-price {
  font-size: 24px;
  font-weight: 500;
  color: var(--theme-accent-blue);
}

.bonus__content .subscribtions__wrapper__card__description input[type="submit"] {
  display: inline;
  font-size: 20px;
  padding: 18px 0;
  height: max-content;
  margin-top: auto;
}

.bonus__content .subscribtions__wrapper__card__payment {
  position: absolute;
  top: 0;
  right: 0;
  transform: translateY(-100%);
  background: var(--theme-accent-green);
  padding: 12px 30px;
  border-radius: 10px 10px 0 0;
  width: 100%;
  max-width: 40%;
  min-width: 300px;
}

.bonus__content .subscribtions__wrapper__card__payment span {
  color: var(--theme-gray);
  font-weight: 700;
  float: right;
}

.bonus__content .subscribtions__wrapper__card__payment span:first-child {
  font-weight: 500;
  float: left;
}

/*===================================Cards====================================*/
.cards__wrapper {
  min-height: calc(100vh - 90px);
}

.cards__wrapper > h1 {
  text-transform: uppercase;
  color: var(--theme-gray);
  margin-bottom: 12px;
}

.cards__wrapper__list {
  display: flex;
  flex-wrap: wrap;
  column-gap: 16px;
  row-gap: 16px;
  margin-top: 16px;
  margin-bottom: 16px;
}

.cards__wrapper__list__item {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 300px;
  width: 100%;
  max-width: 320px;
  min-height: 160px;
  padding: 20px;
  background: var(--theme-gray);
  border-radius: 20px;
  transition: all .5s ease-in-out;
  justify-content: space-around;
  cursor: pointer;
}

@media (max-width: 440px) {
  .cards__wrapper__list__item {
    max-width: 100%;
  }
}

.cards__wrapper__list__item:before {
  content: '';
  position: absolute;
  z-index: 3;
  top: 20px;
  right: 20px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  opacity: 0;
  transform: translate(0);
  transition: opacity .2s ease-in-out;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='14' height='11' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23222' d='M12 1 5 7.5 2 5l-1 .5L5 10l8-8.5z'/%3E%3C/svg%3E") center center no-repeat, var(--theme-accent-blue);
}

.cards__wrapper__list__item.picked:before {
  opacity: 1;
}

.cards__wrapper__list__item:hover {
  box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.35);
  transform: translateY(-2px);
}

.cards__wrapper__list__item_top {
  display: flex;
  align-items: center;
  padding-bottom: 16px;
}

.cards__wrapper__list__item_bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #FFFFFF;
  padding-top: 16px;
}

.cards__wrapper__list__item__card-number {
  font-weight: 700;
}

.cards__wrapper__list__item__card-date {
  font-weight: 500;
}

.cards__wrapper .blue-white-btn {
  max-width: 320px;
}

@media (max-width: 440px) {
  .cards__wrapper .blue-white-btn {
    max-width: 100%;
  }
}

/*================================Catalog=====================================*/
.catalog__wrapper > h1 {
  color: var(--theme-gray);
  text-transform: uppercase;
  margin-bottom: 24px;
}

.catalog__wrapper__cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 20px;
  row-gap: 20px;
}

@media (max-width: 640px) {
  .catalog__wrapper__cards {
    grid-template-columns: 1fr;
  }
}

.catalog__wrapper__cards_item {
  position: relative;
  display: flex;
  align-items: flex-start;
  border-radius: 20px;
  padding: 40px;
  min-height: 280px;
  background-color: var(--theme-accent-blue);
  overflow: hidden;
  transition: all .5s ease-in-out;
}

@media (max-width: 840px) {
  .catalog__wrapper__cards_item {
    min-height: 240px;
    padding: 20px;
  }
}

@media (max-width: 740px) {
  .catalog__wrapper__cards_item {
    min-height: 220px;
  }
}

@media (max-width: 480px) {
  .catalog__wrapper__cards_item {
    min-height: 200px;
  }
}

.catalog__wrapper__cards_item:hover {
  box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.25);
}

.catalog__wrapper__cards_item:hover img {
  transform: translateX(-2%);
}

.catalog__wrapper__cards_item h2 {
  padding-top: 10px;
  position: relative;
  z-index: 2;
  font-size: 36px;
  color: var(--theme-main);
  text-transform: uppercase;
  font-weight: 700;
}

@media (max-width: 840px) {
  .catalog__wrapper__cards_item h2 {
    font-size: 32px;
  }
}

.catalog__wrapper__cards_item img {
  position: absolute;
  bottom: -18%;
  right: -18%;
  width: 85%;
  transition: all .5s ease-in-out;
}

@media (max-width: 960px) {
  .catalog__wrapper__cards_item img {
    width: 100%;
  }
}

@media (max-width: 640px) {
  .catalog__wrapper__cards_item img {
    width: 85%;
    right: -50px;
    bottom: -25%;
  }
}

@media (max-width: 380px) {
  .catalog__wrapper__cards_item img {
    bottom: -45px;
    width: 90%;
  }
}

/*================================Products====================================*/
.products__wrapper > h1 {
  color: var(--theme-gray);
  text-transform: uppercase;
  margin-bottom: 24px;
}

.products__wrapper__cards {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  padding: 20px 0 40px 0;
  column-gap: 40px;
  row-gap: 40px;
}

@media (max-width: 1140px) {
  .products__wrapper__cards {
    column-gap: 20px;
    row-gap: 20px;
  }
}

@media (max-width: 1080px) {
  .products__wrapper__cards {
    grid-template-columns: 1fr 1fr;
    column-gap: 40px;
    row-gap: 40px;
    padding: 20px 40px 40px 40px;
  }
}

@media (max-width: 860px) {
  .products__wrapper__cards {
    padding: 20px 0 40px 0;
  }
}

@media (max-width: 720px) {
  .products__wrapper__cards {
    grid-template-columns: 1fr;
    padding: 20px 80px 40px 80px;
  }
}

@media (max-width: 580px) {
  .products__wrapper__cards {
    padding: 20px 40px 40px 40px;
  }
}

@media (max-width: 480px) {
  .products__wrapper__cards {
    padding: 20px 0 40px 0;
  }
}

@media (max-width: 380px) {
  .products__wrapper__cards {
    row-gap: 20px;
  }
}