@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap");

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  /* display: none; <- Crashes Chrome on hover */
  -webkit-appearance: none;
  margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

html {
  scroll-behavior: smooth;
}

:root {
  --font-family: "Gilroy", sans-serif;
  --second-family: "Benzin-Regular", sans-serif;
  --third-family: "Montserrat", sans-serif;
  --font3: "Roboto", sans-serif;
  --font4: "Mulish", sans-serif;

  --curent-size: 1920;
}

body {
  background: linear-gradient(316deg, #fff 0%);
}

a {
  text-decoration: none;
  cursor: pointer;
}

button {
  cursor: pointer;
}

.backbtn {
  display: none !important;
}

ol,
ul {
  list-style: none;
}

.container {
  width: calc((1720 / var(--curent-size)) * 100vw);
  margin: 0 auto;
}

header {
  padding: calc((20 / var(--curent-size)) * 100vw)
    calc((20 / var(--curent-size)) * 100vw);
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
  background: linear-gradient(316deg, #fff 0%);
}

.header-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
}

.header-menu {
  display: flex;
  align-items: center;
  gap: calc((30 / var(--curent-size)) * 100vw);
  list-style: none;
}

.header-menu li a {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((18 / var(--curent-size)) * 100vw);
  letter-spacing: 0.01em;
  color: #19181f;
}

.logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.logo svg {
  width: calc((234 / var(--curent-size)) * 100vw);
  height: calc((52 / var(--curent-size)) * 100vw);
}

.header-nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  margin-right: calc((82 / var(--curent-size)) * 100vw);
  gap: calc((12 / var(--curent-size)) * 100vw);
}

.header-nav p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((17 / var(--curent-size)) * 100vw);
  color: #19181f;
  margin-right: calc((12 / var(--curent-size)) * 100vw);
}

.header-nav a {
  width: calc((46 / var(--curent-size)) * 100vw);
  height: calc((46 / var(--curent-size)) * 100vw);
  border-radius: calc((9 / var(--curent-size)) * 100vw);
  background: #f5f5f4;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header-nav a svg {
  width: calc((23 / var(--curent-size)) * 100vw);
  height: auto;
}

.cart-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.cart-icon img {
  width: calc((53 / var(--curent-size)) * 100vw);
  height: calc((53 / var(--curent-size)) * 100vw);
}

.curent-cart-count {
  position: absolute;
  top: calc((-6 / var(--curent-size)) * 100vw);
  right: calc((-6 / var(--curent-size)) * 100vw);
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((15 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #fff;
  width: calc((25 / var(--curent-size)) * 100vw);
  height: calc((25 / var(--curent-size)) * 100vw);
  border-radius: 50%;
  z-index: 2;
  background: #6182a3;
  display: flex;
  align-items: center;
  justify-content: center;
}

#main {
  padding-top: calc((121 / var(--curent-size)) * 100vw);
}

.main-wrapper {
  width: 100%;
  height: calc((833 / var(--curent-size)) * 100vw);
  background-image: url(../img/main.jpg);
  background-repeat: repeat;
  background-size: cover;
  border-radius: calc((50 / var(--curent-size)) * 100vw);
}

.main-wrapper-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  padding: calc((140 / var(--curent-size)) * 100vw)
    calc((96 / var(--curent-size)) * 100vw);
  position: relative;
}

.main-wrapper-content h1 {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((42 / var(--curent-size)) * 100vw);
  line-height: 122%;
  color: #19181f;
  max-width: calc((1000 / var(--curent-size)) * 100vw);
}

.main-wrapper-content > p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((27 / var(--curent-size)) * 100vw);
  line-height: 160%;
  color: #19181f;
  margin: calc((34 / var(--curent-size)) * 100vw) 0
    calc((70 / var(--curent-size)) * 100vw) 0;
}

.main-btns {
  display: flex;
  align-items: center;
  gap: calc((25 / var(--curent-size)) * 100vw);
}

.main-btns a {
  height: calc((86 / var(--curent-size)) * 100vw);
  width: calc((375 / var(--curent-size)) * 100vw);
  border-radius: calc((23 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc((8 / var(--curent-size)) * 100vw);
}

.btn {
  height: calc((86 / var(--curent-size)) * 100vw);
  width: calc((375 / var(--curent-size)) * 100vw);
  border-radius: calc((23 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc((8 / var(--curent-size)) * 100vw);
}

.main-btns a p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((21 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #fff;
}

.btn p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((21 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #fff;
}

.main-btns a:last-child svg {
  width: calc((16 / var(--curent-size)) * 100vw);
  height: auto;
}

.btn svg {
  width: calc((16 / var(--curent-size)) * 100vw);
  height: auto;
}

.btn {
  background: linear-gradient(90deg, #6284a4 0%, #365068 100%);
}

.main-btns a:last-child {
  background: initial;
  border: calc((3 / var(--curent-size)) * 100vw) solid #1d1f20;
}

.main-btns a:last-child p {
  color: #1d1f20;
}

.main-wrapper-content > img {
  position: absolute;
  top: 15%;
  right: calc((-33 / var(--curent-size)) * 100vw);
  z-index: 99;
  width: calc((241 / var(--curent-size)) * 100vw);
}

.under-line {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
  padding-top: calc((100 / var(--curent-size)) * 100vw);
  gap: calc((50 / var(--curent-size)) * 100vw);
}

.under-line div {
  display: flex;
  align-items: center;
  gap: calc((40 / var(--curent-size)) * 100vw);
  width: fit-content;
}

.under-line div span {
  width: calc((100 / var(--curent-size)) * 100vw);
  height: calc((100 / var(--curent-size)) * 100vw);
  background: #e9e9e9;
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.under-line div span img {
  width: calc((54 / var(--curent-size)) * 100vw);
}

.under-line div p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((23 / var(--curent-size)) * 100vw);
  line-height: 164%;
  color: #19181f;
}

#category {
  padding-top: calc((160 / var(--curent-size)) * 100vw);
}

.category-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  gap: calc((70 / var(--curent-size)) * 100vw);
}

.title {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((55 / var(--curent-size)) * 100vw);
  line-height: 135%;
  color: #19181f;
}

.category-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((27 / var(--curent-size)) * 100vw);
}

.category-item-content {
  width: calc((557 / var(--curent-size)) * 100vw);
  height: calc((280 / var(--curent-size)) * 100vw);
  background: linear-gradient(90deg, #ececed 0%, #e4e4e4 100%);
  border-radius: calc((30 / var(--curent-size)) * 100vw);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: calc((42 / var(--curent-size)) * 100vw) 0
    calc((36 / var(--curent-size)) * 100vw)
    calc((38 / var(--curent-size)) * 100vw);
  overflow: hidden;
}

.category-item-content span {
  width: calc((83 / var(--curent-size)) * 100vw);
  height: calc((83 / var(--curent-size)) * 100vw);
  background: #4e6c88;
  border-radius: calc((12 / var(--curent-size)) * 100vw);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.category-item-content span img {
  width: calc((44 / var(--curent-size)) * 100vw);
}

.category-item-content p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((25 / var(--curent-size)) * 100vw);
  line-height: 157%;
  color: #19181f;
}

.circle {
  position: absolute;
  bottom: calc((-55 / var(--curent-size)) * 100vw);
  right: calc((-30 / var(--curent-size)) * 100vw);
  width: calc((283 / var(--curent-size)) * 100vw);
  height: calc((283 / var(--curent-size)) * 100vw);
}

.category-item:nth-child(1) .category-item-content > img {
  position: absolute;
  top: calc((25 / var(--curent-size)) * 100vw);
  right: calc((10 / var(--curent-size)) * 100vw);
  width: calc((250 / var(--curent-size)) * 100vw);
}

.category-item:nth-child(2) .category-item-content > img {
  position: absolute;
  top: calc((25 / var(--curent-size)) * 100vw);
  right: calc((10 / var(--curent-size)) * 100vw);
  width: calc((250 / var(--curent-size)) * 100vw);
}

.category-item:nth-child(3) .category-item-content > img {
  position: absolute;
  top: calc((25 / var(--curent-size)) * 100vw);
  right: calc((10 / var(--curent-size)) * 100vw);
  width: calc((250 / var(--curent-size)) * 100vw);
}

.category-item:nth-child(4) .category-item-content > img {
  position: absolute;
  top: calc((25 / var(--curent-size)) * 100vw);
  right: calc((10 / var(--curent-size)) * 100vw);
  width: calc((210 / var(--curent-size)) * 100vw);
}

.category-item:nth-child(5) .category-item-content > img {
  position: absolute;
  top: calc((40 / var(--curent-size)) * 100vw);
  right: calc((60 / var(--curent-size)) * 100vw);
  width: calc((127 / var(--curent-size)) * 100vw);
}

.category-item:nth-child(6) .category-item-content > img {
  position: absolute;
  top: calc((25 / var(--curent-size)) * 100vw);
  right: calc((35 / var(--curent-size)) * 100vw);
  width: calc((170 / var(--curent-size)) * 100vw);
}

.category-items {
  display: flex;
  align-items: flex-start;
  width: 100%;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: calc((74 / var(--curent-size)) * 100vw) 0;
}

#hits {
  padding-top: calc((134 / var(--curent-size)) * 100vw);
}

.hit-trades {
  display: flex;
  align-items: flex-start;
  width: 100%;
  flex-wrap: wrap;
  margin-top: calc((134 / var(--curent-size)) * 100vw);
  justify-content: space-between;
}

.hits-wrapper-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.hits-wrapper-head > a {
  display: flex;
  align-items: center;
  gap: calc((6 / var(--curent-size)) * 100vw);
}

.hits-wrapper-head > a p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((26 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #333;
}

.hits-wrapper-head > a svg {
  width: calc((20 / var(--curent-size)) * 100vw);
  margin-top: calc((4 / var(--curent-size)) * 100vw);
}

.trade-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc((340 / var(--curent-size)) * 100vw);
}

.circle-item {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: linear-gradient(90deg, #6081a1 0%, #38526b 100%);
  position: relative;
}

.shadow {
  position: absolute;
  bottom: calc((12 / var(--curent-size)) * 100vw);
  left: 50%;
  transform: translate(-50%, 0);
  width: calc((238 / var(--curent-size)) * 100vw);
}

.trade-img {
  position: absolute;
  bottom: calc((40 / var(--curent-size)) * 100vw);
  left: 50%;
  transform: translate(-50%, 0);
  width: calc((145 / var(--curent-size)) * 100vw);
}

.trade-item > p {
  margin-top: calc((45 / var(--curent-size)) * 100vw);
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((35 / var(--curent-size)) * 100vw);
  line-height: 127%;
  text-align: center;
  color: #19181f;
}

.trade-item > h6 {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((24 / var(--curent-size)) * 100vw);
  line-height: 157%;
  text-align: center;
  color: #19181f;
  margin: calc((13 / var(--curent-size)) * 100vw) 0;
}

.trade-item > span {
  display: flex;
  align-items: center;
  gap: calc((6 / var(--curent-size)) * 100vw);
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((24 / var(--curent-size)) * 100vw);
  line-height: 157%;
  text-align: center;
  color: #5c5b5f;
}

.trade-item > span img {
  width: calc((22 / var(--curent-size)) * 100vw);
  height: calc((22 / var(--curent-size)) * 100vw);
}

.trade-item .btn {
  border: none;
  width: calc((292 / var(--curent-size)) * 100vw);
}

.trade-btns {
  margin-top: calc((24 / var(--curent-size)) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((20 / var(--curent-size)) * 100vw);
}

.trade-item a {
  width: calc((292 / var(--curent-size)) * 100vw);
}

.trade-item a {
  height: calc((86 / var(--curent-size)) * 100vw);
  width: calc((292 / var(--curent-size)) * 100vw);
  border-radius: calc((23 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc((8 / var(--curent-size)) * 100vw);
}

.trade-item a {
  background: initial;
  border: calc((2 / var(--curent-size)) * 100vw) solid #1d1f20;
}

.trade-item a p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((21 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #1d1f20;
}

.about-wrapper {
  background-image: url(../img/about-bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: calc((595 / var(--curent-size)) * 100vw);
  border-radius: calc((50 / var(--curent-size)) * 100vw);
  position: relative;
}

.about-wrapper-data {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  padding: calc((115 / var(--curent-size)) * 100vw)
    calc((0 / var(--curent-size)) * 100vw)
    calc((100 / var(--curent-size)) * 100vw)
    calc((100 / var(--curent-size)) * 100vw);
  justify-content: space-between;
}

.about-wrapper-data > p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((55 / var(--curent-size)) * 100vw);
  line-height: 135%;
  text-transform: uppercase;
  color: #19181f;
}

.about-wrapper-data > span {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((27 / var(--curent-size)) * 100vw);
  line-height: 160%;
  color: #19181f;
}

#about {
  padding-top: calc((150 / var(--curent-size)) * 100vw);
}

.man {
  position: absolute;
  bottom: calc((0 / var(--curent-size)) * 100vw);
  right: calc((148 / var(--curent-size)) * 100vw);
  width: calc((675 / var(--curent-size)) * 100vw);
}

.mail-1 {
  position: absolute;
  bottom: calc((-30 / var(--curent-size)) * 100vw);
  left: 48%;
  transform: translate(-50%, 0);
  width: calc((130 / var(--curent-size)) * 100vw);
}
.mail-2 {
  position: absolute;
  top: calc((80 / var(--curent-size)) * 100vw);
  right: calc((-45 / var(--curent-size)) * 100vw);
  width: calc((220 / var(--curent-size)) * 100vw);
}

.verify-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((75 / var(--curent-size)) * 100vw);
}

.verify-wrapper > p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((24 / var(--curent-size)) * 100vw);
  line-height: 105%;
  color: #19181f;
}

.verify-items {
  display: flex;
  align-items: flex-start;
  width: 100%;
  justify-content: space-between;
}

.verify-items div {
  background: linear-gradient(90deg, #ececed 0%, #e4e4e4 100%);
  border-radius: calc((30 / var(--curent-size)) * 100vw);
  width: calc((557 / var(--curent-size)) * 100vw);
  height: calc((220 / var(--curent-size)) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: calc((34 / var(--curent-size)) * 100vw) 0
    calc((34 / var(--curent-size)) * 100vw)
    calc((40 / var(--curent-size)) * 100vw);
  position: relative;
}

.verify-items div span {
  border-radius: calc((12 / var(--curent-size)) * 100vw);
  width: calc((110 / var(--curent-size)) * 100vw);
  height: calc((45 / var(--curent-size)) * 100vw);
  background: #f7f7f7;
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  line-height: 171%;
  text-align: center;
  color: #19181f;
}

.verify-items div p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  line-height: 160%;
  color: #19181f;
}

.verify-items div img {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  right: calc((34 / var(--curent-size)) * 100vw);
  width: calc((120 / var(--curent-size)) * 100vw);
  padding: calc((20 / var(--curent-size)) * 100vw);
  background: #6284a440;
  border-radius: calc((12 / var(--curent-size)) * 100vw);
}

#verify {
  padding-top: calc((150 / var(--curent-size)) * 100vw);
}

.verify-form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((40 / var(--curent-size)) * 100vw);
  width: 100%;
}

.verify-form > p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((33 / var(--curent-size)) * 100vw);
  line-height: 105%;
  color: #19181f;
}

.verify-form > form {
  display: flex;
  align-items: center;
  width: 100%;
  gap: calc((30 / var(--curent-size)) * 100vw);
}

.verify-form > form .btn {
  width: calc((445 / var(--curent-size)) * 100vw);
  height: calc((103 / var(--curent-size)) * 100vw);
  flex-shrink: 0;
  border: none;
  cursor: pointer;
}

.verify-form > form input {
  width: 100%;
  padding: 0 calc((44 / var(--curent-size)) * 100vw);
  height: calc((103 / var(--curent-size)) * 100vw);
  border: calc((3 / var(--curent-size)) * 100vw) solid #6a6a6a;
  border-radius: calc((23 / var(--curent-size)) * 100vw);
  outline: none;
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  line-height: 162%;
  text-align: left;
  color: #6a6a6a;
}

#reviews {
  padding-top: calc((150 / var(--curent-size)) * 100vw);
}

.reviews-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  gap: calc((88 / var(--curent-size)) * 100vw);
}

.reviews-items {
  width: 100%;
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: calc((42 / var(--curent-size)) * 100vw) 0;
}

.reviews-item {
  width: calc((557 / var(--curent-size)) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((40 / var(--curent-size)) * 100vw);
}

.review-img {
  width: 100%;
  height: calc((500 / var(--curent-size)) * 100vw);
  background: linear-gradient(90deg, #dee2e5 0%);
  position: relative;
  border-radius: calc((30 / var(--curent-size)) * 100vw);
  overflow: hidden;
}

.review-img > img {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  width: calc((380 / var(--curent-size)) * 100vw);
}

.review-data {
  position: absolute;
  bottom: calc((30 / var(--curent-size)) * 100vw);
  left: calc((30 / var(--curent-size)) * 100vw);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);
  background: rgba(47, 47, 47, 0.3);
  display: flex;
  align-items: center;
  gap: calc((50 / var(--curent-size)) * 100vw);
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  padding: calc((12 / var(--curent-size)) * 100vw);
}

.review-data a {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  line-height: 145%;
  color: #fff;
}

.review-data span {
  background: rgba(185, 185, 185, 0.3);
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  width: calc((83 / var(--curent-size)) * 100vw);
  height: calc((76 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  line-height: 203%;
  text-align: center;
  color: #fff;
}

.review-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((15 / var(--curent-size)) * 100vw);
  width: 100%;
}

.review-text p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((32 / var(--curent-size)) * 100vw);
  line-height: 139%;
  color: #19181f;
}

.review-text h6 {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((25 / var(--curent-size)) * 100vw);
  line-height: 172%;
  color: #19181f;
}

.review-text span {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((25 / var(--curent-size)) * 100vw);
  line-height: 164%;
  color: #646464;
}

#faq {
  padding-top: calc((120 / var(--curent-size)) * 100vw);
  padding-bottom: calc((140 / var(--curent-size)) * 100vw);
}

/*  */

.faq-items {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  list-style: none;
  gap: calc((30 / var(--curent-size)) * 100vw)
    calc((20 / var(--curent-size)) * 100vw);
  width: 100%;
  margin-top: calc((65 / var(--curent-size)) * 100vw);
}

.faq-item {
  border-radius: calc((27 / var(--curent-size)) * 100vw);
  padding: calc((22 / var(--curent-size)) * 100vw)
    calc((22 / var(--curent-size)) * 100vw)
    calc((22 / var(--curent-size)) * 100vw)
    calc((42 / var(--curent-size)) * 100vw);
  border: calc((1 / var(--curent-size)) * 100vw) solid #d7d7d7;
  cursor: pointer;
  display: grid;
  grid-template-rows: auto 0fr;
  transition: grid-template-rows 0.3s ease;
  width: calc((850 / var(--curent-size)) * 100vw);
}

.faq-item-head {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
  gap: 34px;
}

.faq-item-head p {
  font-family: var(--third-family);
  font-weight: 600;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  line-height: 172%;
  color: #323232;
}

.faq-item-head img {
  width: calc((61 / var(--curent-size)) * 100vw);
  height: calc((61 / var(--curent-size)) * 100vw);
  transition: 0.3s ease;
}

.answer {
  min-height: 0;
  overflow: hidden;
  visibility: hidden;
  margin-top: 0;
  font-family: var(--third-family);
  font-weight: 600;
  font-size: calc((18 / var(--curent-size)) * 100vw);
  line-height: 172%;
  color: #323232;
  opacity: 0.7;
}

.faq-item.active {
  grid-template-rows: auto 1fr;
}

.faq-item.active .answer {
  visibility: visible;
  margin-top: calc((10 / var(--curent-size)) * 100vw);
  transition: 0.3s linear;
}

.faq-item.active .faq-item-head img {
  transform: rotate(45deg);
  transition: 0.3s ease;
}

footer {
  background: #1f2123;
  padding: calc((52 / var(--curent-size)) * 100vw) 0
    calc((60 / var(--curent-size)) * 100vw) 0;
}

.footer-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  gap: calc((35 / var(--curent-size)) * 100vw) 0;
}

.footer-head {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
}

.footer-logo img {
  width: calc((262 / var(--curent-size)) * 100vw);
  height: calc((59 / var(--curent-size)) * 100vw);
}

.footer-menu {
  display: flex;
  align-items: center;
  list-style: none;
  gap: calc((33 / var(--curent-size)) * 100vw);
}

.footer-menu li a {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  letter-spacing: 0.01em;
  color: #fff;
}

.footer-links {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: calc((20 / var(--curent-size)) * 100vw);
}

.footer-links a:first-child {
  display: flex;
  align-items: center;
  gap: calc((6 / var(--curent-size)) * 100vw);
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((24 / var(--curent-size)) * 100vw);
  letter-spacing: 0.01em;
  text-align: right;
  color: #fff;
}

.footer-links a:first-child img {
  width: calc((25 / var(--curent-size)) * 100vw);
  height: calc((25 / var(--curent-size)) * 100vw);
}

.footer-links a:last-child {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((19 / var(--curent-size)) * 100vw);
  letter-spacing: 0.01em;
  text-decoration: underline;
  text-decoration-skip-ink: none;
  color: #fff;
}

.footer-nav > p {
  color: #fff;
}

.footer-nav {
  margin: 0;
}

.footer-ander {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
}

.under-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc((40 / var(--curent-size)) * 100vw);
}

.under-links a,
.under-links p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((17 / var(--curent-size)) * 100vw);
  letter-spacing: 0.01em;
  color: #fff;
}

.under-links a {
  text-decoration: underline;
  text-decoration-skip-ink: none;
}

.socials-links {
  display: flex;
  align-items: center;
  gap: calc((17 / var(--curent-size)) * 100vw);
}

.socials-links a {
  display: flex;
  align-items: center;
  justify-content: center;
}

.socials-links a img {
  width: calc((44 / var(--curent-size)) * 100vw);
  height: calc((44 / var(--curent-size)) * 100vw);
}

.burger-btn {
  display: none;
}

.cart-icon img {
  width: calc((55 / var(--curent-size)) * 100vw);
}

.mobile-item {
  display: none;
}

.catalog-content-wrapper {
  padding-top: calc((206 / var(--curent-size)) * 100vw);
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-bottom: calc((100 / var(--curent-size)) * 100vw);
}

.tabs {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
  margin: calc((56 / var(--curent-size)) * 100vw) 0
    calc((92 / var(--curent-size)) * 100vw) 0;
}

.tabs li {
  border: calc((2 / var(--curent-size)) * 100vw) solid #adadad;
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  width: calc((230 / var(--curent-size)) * 100vw);
  height: calc((72 / var(--curent-size)) * 100vw);
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((17 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #828282;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: 0.3s ease;
}

.tabs li:hover {
  background: #5f809f;
  color: #fff;
  transition: 0.3s ease;
  border: calc((2 / var(--curent-size)) * 100vw) solid #5f809f;
}
.tabs li.active {
  background: #5f809f;
  color: #fff;
  border: calc((2 / var(--curent-size)) * 100vw) solid #5f809f;
}

.catalog-content {
  display: flex;
  align-items: flex-start;
  width: 100%;
  gap: calc((78 / var(--curent-size)) * 100vw);
}

.filters {
  width: calc((252 / var(--curent-size)) * 100vw);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((44 / var(--curent-size)) * 100vw);
}

.filter-item {
  width: 100%;
}

.range-data {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: calc((23 / var(--curent-size)) * 100vw);
}

.custom-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: calc((1 / var(--curent-size)) * 100vw);
  background: #e0e0e0;
  border-radius: calc((5 / var(--curent-size)) * 100vw);
  outline: none;
  cursor: pointer;
}

.range-data div {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((18 / var(--curent-size)) * 100vw);
  letter-spacing: -0.06em;
  color: #706e7b;
}

.custom-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: calc((19 / var(--curent-size)) * 100vw);
  height: calc((19 / var(--curent-size)) * 100vw);
  background: #5f809f;
  border-radius: 50%;
  cursor: pointer;
}

.custom-range::-moz-range-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: calc((19 / var(--curent-size)) * 100vw);
  height: calc((19 / var(--curent-size)) * 100vw);
  background: #5f809f;
  border-radius: 50%;
  cursor: pointer;
}

.filter-item > p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((24 / var(--curent-size)) * 100vw);
  letter-spacing: -0.04em;
  color: #19181f;
  opacity: 0.6;
}

.catalog-items {
  display: flex;
  align-items: flex-start;
  width: 100%;
  flex-wrap: wrap;
  gap: calc((122 / var(--curent-size)) * 100vw)
    calc((65 / var(--curent-size)) * 100vw);
}

.catalog-itemss {
  display: flex;
  align-items: flex-start;
  width: 100%;
  flex-wrap: wrap;
  gap: calc((122 / var(--curent-size)) * 100vw)
    calc((65 / var(--curent-size)) * 100vw);
}

.catalog-items .trade-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc((298 / var(--curent-size)) * 100vw);
}

.catalog-itemss .trade-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: calc((298 / var(--curent-size)) * 100vw);
}

.catalog-itemss .trade-img {
  position: absolute;
  bottom: calc((40 / var(--curent-size)) * 100vw);
  left: 50%;
  transform: translate(-50%, 0);
  width: calc((125 / var(--curent-size)) * 100vw);
}

.catalog-head {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.filter-btn {
  display: none;
}

#single-trade {
  padding-top: calc((280 / var(--curent-size)) * 100vw);
  padding-bottom: calc((100 / var(--curent-size)) * 100vw);
}

.single-trade-wrapper {
  display: flex;
  align-items: flex-start;
  width: 100%;
  gap: calc((135 / var(--curent-size)) * 100vw);
}

.single-imgs-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: calc((40 / var(--curent-size)) * 100vw);
}

.main-img {
  width: calc((600 / var(--curent-size)) * 100vw);
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: linear-gradient(90deg, #6081a1 0%, #38526b 100%);
  position: relative;
}

.single-shadow {
  position: absolute;
  bottom: calc((30 / var(--curent-size)) * 100vw);
  width: calc((420 / var(--curent-size)) * 100vw);
  left: 50%;
  transform: translate(-50%, 0);
}

.single-main-img {
  position: absolute;
  top: -5%;
  left: 50%;
  transform: translate(-50%);
  width: calc((254 / var(--curent-size)) * 100vw);
}

.imgs-poginations {
  display: flex;
  align-items: center;
}

.imgs-poginations {
  display: flex;
  align-items: center;
  gap: calc((23 / var(--curent-size)) * 100vw);
}

.imgs-poginations span {
  width: calc((112 / var(--curent-size)) * 100vw);
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: calc((2 / var(--curent-size)) * 100vw) solid #6186ab;
  cursor: pointer;
}

.single-trade-data {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: calc((666 / var(--curent-size)) * 100vw);
}

.single-trade-data h1 {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((61 / var(--curent-size)) * 100vw);
  line-height: 133%;
  color: #19181f;
}

.single-trade-data > p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((25 / var(--curent-size)) * 100vw);
  color: #828282;
  padding: calc((32 / var(--curent-size)) * 100vw) 0
    calc((65 / var(--curent-size)) * 100vw) 0;
  width: 100%;
  border-bottom: calc((1 / var(--curent-size)) * 100vw) solid #e6e6e6;
}

.single-list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((30 / var(--curent-size)) * 100vw);
  margin-top: calc((42 / var(--curent-size)) * 100vw);
}

.single-list > p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((25 / var(--curent-size)) * 100vw);
  color: #19181f;
}

.single-list ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: calc((22 / var(--curent-size)) * 100vw);
}

.single-list ul li {
  display: flex;
  align-items: center;
  width: 100%;
  gap: calc((10 / var(--curent-size)) * 100vw);
}

.single-list ul li p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  color: #2f2d39;
}

.single-list ul li span {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  color: #8b8b8b;
}

.single-price {
  display: flex;
  align-items: center;
  width: 100%;
  gap: calc((50 / var(--curent-size)) * 100vw);
  margin-top: calc((53 / var(--curent-size)) * 100vw);
}

.single-price p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((47 / var(--curent-size)) * 100vw);
  line-height: 127%;
  color: #19181f;
}

.single-price span {
  display: flex;
  align-items: center;
  gap: calc((6 / var(--curent-size)) * 100vw);
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((23 / var(--curent-size)) * 100vw);
  line-height: 157%;
  text-align: center;
  color: #5c5b5f;
}

.single-price span img {
  width: calc((21 / var(--curent-size)) * 100vw);
  height: calc((21 / var(--curent-size)) * 100vw);
}

.single-btns {
  display: flex;
  align-items: center;
  gap: calc((26 / var(--curent-size)) * 100vw);
  margin-top: calc((48 / var(--curent-size)) * 100vw);
}

.single-btns a {
  width: calc((320 / var(--curent-size)) * 100vw);
  height: calc((87 / var(--curent-size)) * 100vw);
  border-radius: calc((23 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc((6 / var(--curent-size)) * 100vw);
  border: calc((2 / var(--curent-size)) * 100vw) solid transparent;
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  text-align: center;
}

.single-btns a svg {
  width: calc((18 / var(--curent-size)) * 100vw);
  height: calc((16 / var(--curent-size)) * 100vw);
}

.single-btns a:first-child {
  background: linear-gradient(90deg, #6284a4 0%, #365068 100%);
  color: #fff;
}

.single-btns a:last-child {
  border: calc((2 / var(--curent-size)) * 100vw) solid #333;
  color: #333;
}

.single-btns a:last-child svg path {
  fill: #333;
}

#single-data {
  padding: calc((76 / var(--curent-size)) * 100vw) 0;
  background: rgba(248, 248, 248, 0.6);
}

.single-data-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  gap: calc((32 / var(--curent-size)) * 100vw);
}

.tabs-data {
  display: flex;
  align-items: center;
  gap: calc((34 / var(--curent-size)) * 100vw);
}

.message {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000ab;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999999;
  color: #ffffff;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  font-family: var(--font-family);
  opacity: 0;
  visibility: hidden;
}

.message.sended {
  opacity: 1;
  visibility: visible;
}

.message div {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: calc((20 / var(--curent-size)) * 100vw);
  background: #fff;
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  max-width: calc((600 / var(--curent-size)) * 100vw);
  width: 100%;
}

.message div p {
  margin-bottom: calc((20 / var(--curent-size)) * 100vw);
  font-size: calc((32 / var(--curent-size)) * 100vw);
}

.message div span:nth-child(4) {
  margin-top: calc((20 / var(--curent-size)) * 100vw);
}

.message div span,
.message div p {
  color: #000;
  text-align: center;
}

.tabs-data div {
  border: calc((2 / var(--curent-size)) * 100vw) solid #adadad;
  border-radius: calc((22 / var(--curent-size)) * 100vw);
  width: calc((280 / var(--curent-size)) * 100vw);
  height: calc((77 / var(--curent-size)) * 100vw);
  background: initial;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #828282;
  cursor: pointer;
  transition: 0.3s ease;
}

.tabs-data div:hover {
  background: #5f809f;
  border: calc((2 / var(--curent-size)) * 100vw) solid #5f809f;
  color: #fff;
  transition: 0.3s ease;
}

.tabs-data div.active {
  background: #5f809f;
  border: calc((2 / var(--curent-size)) * 100vw) solid #5f809f;
  color: #fff;
}

.content-data {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.content-data-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.content-data-item h1,
.content-data-item h2,
.content-data-item h3,
.content-data-item h4,
.content-data-item h5,
.content-data-item h6 {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((21 / var(--curent-size)) * 100vw);
  line-height: 143%;
  color: #19181f;
  margin: calc((38 / var(--curent-size)) * 100vw) 0
    calc((18 / var(--curent-size)) * 100vw) 0;
}
.content-data-item ol li,
.content-data-item ul li,
.content-data-item p,
.content-data-item span,
.content-data-item {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((21 / var(--curent-size)) * 100vw);
  line-height: 143%;
  color: #48474e;
}

.content-data-item ol,
.content-data-item ul {
  list-style: disc;
  padding-left: calc((20 / var(--curent-size)) * 100vw);
}

.hits-section {
  padding-bottom: calc((124 / var(--curent-size)) * 100vw);
}

.burger-wrapper {
  display: none;
}

.cart-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000af;
  z-index: 999;
  display: flex;
  justify-content: center;
  padding: calc((140 / var(--curent-size)) * 100vw) 0;
  overflow-y: auto;
  opacity: 0;
  visibility: hidden;
}

.cart-wrapper.open {
  opacity: 1;
  visibility: visible;
}

.cart-wrapper::-webkit-scrollbar {
  width: 0;
}

.cart-content {
  width: calc((800 / var(--curent-size)) * 100vw);
  height: fit-content;
  box-shadow:
    rgba(0, 0, 0, 0.4) 0px 2px 4px,
    rgba(0, 0, 0, 0.3) 0px 7px 13px -3px,
    rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
  border: none;
  border-top: calc((1 / var(--curent-size)) * 100vw) solid #ffffff25;
  border-right: calc((1 / var(--curent-size)) * 100vw) solid #ffffff25;
  background: #ffffff;
  border-radius: calc((40 / var(--curent-size)) * 100vw);
  padding: calc((60 / var(--curent-size)) * 100vw);
  position: relative;
}

.close-cart {
  position: absolute;
  top: calc((50 / var(--curent-size)) * 100vw);
  right: calc((50 / var(--curent-size)) * 100vw);
  background: initial;
  border: none;
  cursor: pointer;
}

.preloaders {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000d4;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease;
}

.preloaders.open {
  opacity: 1;
  visibility: visible;
}

.check-text {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000e8;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s ease;
  opacity: 0;
  visibility: hidden;
}

.check-text.open {
  opacity: 1;
  visibility: visible;
}

.check-text p {
  color: #fff;
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((18 / var(--curent-size)) * 100vw);
  line-height: 143%;
  text-align: center;
}

.check-text div {
  max-width: calc((440 / var(--curent-size)) * 100vw);
  width: 100%;
  min-width: calc((320 / var(--curent-size)) * 100vw);
  padding: calc((20 / var(--curent-size)) * 100vw);
}

.code-has {
  border-radius: 12px;
  border: calc((2 / var(--curent-size)) * 100vw) solid #6081a1;
  display: none;
  align-items: center;
  justify-content: center;
}

.code-has.open {
  display: flex;
}

.code-not-has {
  border-radius: 12px;
  border: calc((2 / var(--curent-size)) * 100vw) solid #ee7171;
  display: none;
  align-items: center;
  justify-content: center;
}

.code-not-has.open {
  display: flex;
}

.preloaders div {
  width: 6vmax;
  height: 6vmax;
  border-right: calc((4 / var(--curent-size)) * 100vw) solid #6081a1;
  border-radius: 100%;
  animation: spinRight 800ms linear infinite;
}

@keyframes spinRight {
  0% {
    transform: rotate(360deg);
  }

  100% {
    transform: rotate(0deg);
  }
}

.preloaders div:before {
  content: "";
  width: 4vmax;
  height: 4vmax;
  display: block;
  position: absolute;
  top: calc(50% - 2vmax);
  left: calc(50% - 2vmax);
  border-left: calc((3 / var(--curent-size)) * 100vw) solid #6081a1;
  border-radius: 100%;
  animation: spinLeft 800ms linear infinite;
}

.preloaders div:after {
  content: "";
  width: 4vmax;
  height: 4vmax;
  display: block;
  position: absolute;
  top: calc(50% - 2vmax);
  left: calc(50% - 2vmax);
  border-left: calc((3 / var(--curent-size)) * 100vw) solid #6081a1;
  border-radius: 100%;
  animation: spinLeft 800ms linear infinite;
}

.preloader div:after {
  width: 4vmax;
  height: 4vmax;
  top: calc(50% - 2vmax);
  left: calc(50% - 2vmax);
  border: 0;
  border-right: calc((2 / var(--curent-size)) * 100vw) solid #6081a1;
  animation: none;
}

.close-cart img {
  width: calc((30 / var(--curent-size)) * 100vw);
  height: calc((30 / var(--curent-size)) * 100vw);
}

.cart-content > p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((32 / var(--curent-size)) * 100vw);
  line-height: 133%;
  color: #19181f;
}

.cart-items {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  padding-top: calc((32 / var(--curent-size)) * 100vw);
}

.cart-item {
  display: flex;
  align-items: center;
  width: 100%;
  padding: calc((20 / var(--curent-size)) * 100vw) 0;
  border-bottom: 1px solid #d4d4d4;
}

.cart-item-img {
  width: calc((120 / var(--curent-size)) * 100vw);
  height: calc((120 / var(--curent-size)) * 100vw);
  border-radius: 50%;
  background: linear-gradient(90deg, #6081a1 0%, #38526b 100%);
  position: relative;
}

.delete {
  background: initial;
  border: 1px solid #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc((4 / var(--curent-size)) * 100vw);
  cursor: pointer;
}

.delete img {
  width: calc((14 / var(--curent-size)) * 100vw);
}

.cart-item-info {
  display: flex;
  align-items: center;
  gap: calc((10 / var(--curent-size)) * 100vw);
  flex-shrink: 0;
}

.cart-item-info span {
  font-family: "Gilroy";
  font-weight: 400;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  color: #ffffff;
  width: 100%;
}

.dop-1 {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((17 / var(--curent-size)) * 100vw);
  letter-spacing: 0.01em;
  color: #fff;
  opacity: 0.7;
}

.cart-item-btns {
  display: flex;
  align-items: center;
  position: relative;
}

.cart-item-btns button {
  background: initial;
  border: none;
  cursor: pointer;
}

.cart-item-btns button svg {
  width: calc((12 / var(--curent-size)) * 100vw);
}

.cart-item-btns button svg path {
  fill: #fff;
}

.alert,
.alerts {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #00000098;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999999;
  opacity: 0;
  visibility: hidden;
}

.alert.open,
.alerts.open {
  opacity: 1;
  visibility: visible;
}

.alert p,
.alerts p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((24 / var(--curent-size)) * 100vw);
  line-height: 133%;
  color: #ffffff;
}

.baner-pog {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  z-index: 24;
  margin-top: calc((20 / var(--curent-size)) * 100vw);
}

.baner-pog span {
  background: #90ffba;
}

.cart-sum-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  margin: calc((30 / var(--curent-size)) * 100vw) 0;
}

.cart-sum-wrapper p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((26 / var(--curent-size)) * 100vw);
  line-height: 141%;
  text-align: right;
  color: #19181f;
}

.cart-form {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  gap: calc((20 / var(--curent-size)) * 100vw);
}

.cart-form input {
  width: 100%;
  padding: calc((24 / var(--curent-size)) * 100vw)
    calc((40 / var(--curent-size)) * 100vw);
  background: initial;
  outline: none;
  border: none;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  color: #3a3a3a;
  position: relative;
  border: calc((2 / var(--curent-size)) * 100vw) solid #8a8a8a;
  border-radius: calc((20 / var(--curent-size)) * 100vw);
}

.cart-form input::placeholder {
  color: #cccccc;
}

.cart-form > p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((18 / var(--curent-size)) * 100vw);
  line-height: 157%;
  color: #19181f;
}

.cart-form button {
  cursor: pointer;
  width: 100%;

  padding: calc((30 / var(--curent-size)) * 100vw);
  background: linear-gradient(90deg, #6284a4 0%, #365068 100%);
  border-radius: calc((20 / var(--curent-size)) * 100vw);

  text-transform: uppercase;
  transition: 0.3s ease;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: calc((12 / var(--curent-size)) * 100vw);
}

.cart-form button p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((22 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #fff;
}

.cart-form button svg {
  width: calc((30 / var(--curent-size)) * 100vw);
}

.checkbox-wrapper {
  display: flex;
  align-items: center;
  gap: calc((20 / var(--curent-size)) * 100vw);
  cursor: pointer;
}

.checkbox {
  width: calc((24 / var(--curent-size)) * 100vw);
  height: calc((24 / var(--curent-size)) * 100vw);
  border: 1px solid #8a8a8a;
  border-radius: 4px;
  position: relative;
  cursor: pointer;
}

.checkbox.clicked:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(../img/check.png);
  background-repeat: no-repeat;
  background-size: contain;
}

.checkbox input {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
}

.checkbox-wrapper > p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  color: #3a3a3a;
}

.checkbox-wrapper > p a {
  color: #3a3a3a;
  text-decoration: underline;
  text-decoration-skip-ink: none;
}

.select-item {
  width: 100%;
  position: relative;
  cursor: pointer;
}

.select-item input {
  cursor: pointer;
  pointer-events: none;
}

.select-item svg {
  position: absolute;
  top: calc((20 / var(--curent-size)) * 100vw);
  right: calc((20 / var(--curent-size)) * 100vw);
  width: calc((20 / var(--curent-size)) * 100vw);
}

.dropdown {
  position: absolute;
  top: 104%;
  left: 0;
  width: 100%;
  border: calc((2 / var(--curent-size)) * 100vw) solid #8a8a8a;
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  background: #fff;
  z-index: 1;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
}

.dropdown.open {
  opacity: 1;
  visibility: visible;
}

.dropdown p {
  width: 100%;
  padding: calc((20 / var(--curent-size)) * 100vw)
    calc((20 / var(--curent-size)) * 100vw);
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((24 / var(--curent-size)) * 100vw);
  color: #3a3a3a;
  transition: 0.3s ease;
}

.dropdown p:hover {
  background: #ededed;
}

.cart-name {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-left: calc((20 / var(--curent-size)) * 100vw);
}

.cart-name p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((26 / var(--curent-size)) * 100vw);
  line-height: 133%;
  color: #19181f;
}

.cart-name span {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((18 / var(--curent-size)) * 100vw);
  color: #828282;
}

.cart-item-nav {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  margin-left: auto;
  gap: calc((10 / var(--curent-size)) * 100vw);
}

.cart-item-nav > p {
  font-family: var(--second-family);
  font-weight: 400;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  line-height: 154%;
  text-align: right;
  color: #19181f;
}

.delete-cart-item {
  width: calc((40 / var(--curent-size)) * 100vw);
  height: calc((40 / var(--curent-size)) * 100vw);
  border-radius: 50%;
  background: #6081a1;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
}

.delete-cart-item img {
  width: calc((14 / var(--curent-size)) * 100vw);
  height: calc((14 / var(--curent-size)) * 100vw);
  filter: invert(1);
}

.count-input {
  display: flex;
  align-items: center;
  gap: calc((8 / var(--curent-size)) * 100vw);
}

.count-input input {
  width: calc((80 / var(--curent-size)) * 100vw);
  height: calc((30 / var(--curent-size)) * 100vw);
  background: initial;
  border: 1px solid #cbcbcb;
  border-radius: 6px;
  text-align: center;
  outline: none;
}

.count-input button {
  background: #6081a1;
  width: calc((40 / var(--curent-size)) * 100vw);
  height: calc((30 / var(--curent-size)) * 100vw);
  border: none;
  border-radius: 6px;
  color: #fff;
  cursor: pointer;
}

.cart-shadow {
  position: absolute;
  bottom: calc((10 / var(--curent-size)) * 100vw);
  left: 50%;
  transform: translate(-50%, 0);
  width: 100%;
}

.trade-cart-img {
  position: absolute;
  left: 50%;
  top: calc((-10 / var(--curent-size)) * 100vw);
  transform: translate(-50%, 0);
  width: calc((50 / var(--curent-size)) * 100vw);
}

.form-contacts {
  position: relative;
  width: 100%;
  height: calc((900 / var(--curent-size)) * 100vw);
  background-image: url(../img/2.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: calc((50 / var(--curent-size)) * 100vw);
  overflow: hidden;
  padding: calc((70 / var(--curent-size)) * 100vw) 0 0
    calc((90 / var(--curent-size)) * 100vw);
}

.form-contacts-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.form-contacts-text > p {
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((23 / var(--curent-size)) * 100vw);
  line-height: 179%;
  color: #19181f;
  margin-top: calc((20 / var(--curent-size)) * 100vw);
}

#form-cont {
  width: calc((686 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: calc((20 / var(--curent-size)) * 100vw);
  margin-top: calc((40 / var(--curent-size)) * 100vw);
}

#form-cont input {
  width: calc((332 / var(--curent-size)) * 100vw);
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  height: calc((86 / var(--curent-size)) * 100vw);
  padding: 0 calc((20 / var(--curent-size)) * 100vw);
  background: #fafafa;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  line-height: 215%;
  color: #484848;
  border: none;
  outline: none;
}

#form-cont .select-item {
  width: calc((332 / var(--curent-size)) * 100vw);
}

#form-cont .select-item svg {
  position: absolute;
  top: calc((27 / var(--curent-size)) * 100vw);
  right: calc((20 / var(--curent-size)) * 100vw);
  width: calc((13 / var(--curent-size)) * 100vw);
}

#form-cont textarea {
  width: 100%;
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  height: calc((86 / var(--curent-size)) * 100vw);
  padding: calc((20 / var(--curent-size)) * 100vw)
    calc((20 / var(--curent-size)) * 100vw);
  background: #fafafa;
  font-family: var(--font-family);
  font-weight: 500;
  font-size: calc((20 / var(--curent-size)) * 100vw);
  line-height: 215%;
  color: #484848;
  border: none;
  outline: none;
  resize: none;
}

#form-cont button {
  width: 100%;
  height: calc((86 / var(--curent-size)) * 100vw);
  border-radius: calc((20 / var(--curent-size)) * 100vw);
  display: flex;
  align-items: center;
  gap: calc((10 / var(--curent-size)) * 100vw);
  background: linear-gradient(90deg, #6284a4 0%, #365068 100%);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

#form-cont button p {
  font-family: var(--font-family);
  font-weight: 600;
  font-size: calc((21 / var(--curent-size)) * 100vw);
  text-align: center;
  color: #fff;
}

#form-cont button svg {
  width: calc((16 / var(--curent-size)) * 100vw);
  height: calc((15 / var(--curent-size)) * 100vw);
}

#form-cont .checkbox-wrapper {
  width: 100%;
}

#form-contacts {
  margin-bottom: calc((110 / var(--curent-size)) * 100vw);
}

.form-contacts > img {
  position: absolute;
  bottom: 0;
  right: 0;
  width: calc((897 / var(--curent-size)) * 100vw);
}

@media all and (max-width: 768px) {
  :root {
    --curent-size: 375;
  }

  #main {
    overflow: hidden;
  }

  .container {
    width: calc((355 / var(--curent-size)) * 100vw);
  }

  .burger-btn {
    display: flex;
    background: initial;
    border: none;
  }

  .burger-btn img {
    width: calc((46 / var(--curent-size)) * 100vw);
  }

  .header-menu,
  .header-nav {
    display: none;
  }

  .logo {
    position: static;
    transform: none;
  }

  .header-wrapper {
    justify-content: flex-start;
  }

  header {
    padding: calc((10 / var(--curent-size)) * 100vw)
      calc((0 / var(--curent-size)) * 100vw);
  }

  .cart-icon {
    margin-left: auto;
    margin-right: calc((17 / var(--curent-size)) * 100vw);
  }

  .logo svg {
    width: calc((183 / var(--curent-size)) * 100vw);
    height: calc((42 / var(--curent-size)) * 100vw);
  }

  .cart-icon img {
    width: calc((46 / var(--curent-size)) * 100vw);
  }

  .main-wrapper {
    width: 100%;
    height: calc((709 / var(--curent-size)) * 100vw);
    background-image: url(../img/main-m.jpg);
    border-radius: calc((35 / var(--curent-size)) * 100vw);
  }

  .main-wrapper-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    padding: calc((40 / var(--curent-size)) * 100vw)
      calc((30 / var(--curent-size)) * 100vw);
    position: relative;
  }

  .main-wrapper-content h1 br {
    display: none;
  }

  .main-wrapper-content h1 {
    font-size: calc((21 / var(--curent-size)) * 100vw);
  }

  .main-wrapper-content > p {
    font-size: calc((15 / var(--curent-size)) * 100vw);
    margin: calc((20 / var(--curent-size)) * 100vw) 0
      calc((30 / var(--curent-size)) * 100vw) 0;
  }

  .main-btns {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: calc((15 / var(--curent-size)) * 100vw);
    width: 100%;
  }

  .main-btns a {
    width: 100%;
    height: calc((60 / var(--curent-size)) * 100vw);
    border-radius: calc((18 / var(--curent-size)) * 100vw);
  }

  .main-btns a p {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: calc((16 / var(--curent-size)) * 100vw);
    text-align: center;
    color: #fff;
  }

  .main-btns a:last-child {
    border: calc((2 / var(--curent-size)) * 100vw) solid #1d1f20;
  }

  .main-wrapper-content > img {
    position: absolute;
    top: 45%;
    right: calc((-33 / var(--curent-size)) * 100vw);
    z-index: 99;
    width: calc((140 / var(--curent-size)) * 100vw);
  }

  .main-wrapper-content > img {
    position: absolute;
    top: 52%;
    right: calc((-20 / var(--curent-size)) * 100vw);
    z-index: 99;
    width: calc((120 / var(--curent-size)) * 100vw);
  }

  .under-line {
    flex-wrap: wrap;
    gap: calc((30 / var(--curent-size)) * 100vw);
  }

  .under-line div p {
    font-size: calc((17 / var(--curent-size)) * 100vw);
  }

  .under-line div span {
    width: calc((69 / var(--curent-size)) * 100vw);
    height: calc((69 / var(--curent-size)) * 100vw);
    border-radius: calc((13 / var(--curent-size)) * 100vw);
  }

  .under-line div span img {
    width: calc((40 / var(--curent-size)) * 100vw);
  }

  .under-line div {
    gap: calc((30 / var(--curent-size)) * 100vw);
  }

  .category-item-content {
    width: 100%;
    height: calc((197 / var(--curent-size)) * 100vw);
    background: linear-gradient(90deg, #ececed 0%, #e4e4e4 100%);
    border-radius: calc((30 / var(--curent-size)) * 100vw);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: calc((26 / var(--curent-size)) * 100vw) 0
      calc((26 / var(--curent-size)) * 100vw)
      calc((26 / var(--curent-size)) * 100vw);
    overflow: hidden;
  }

  #category {
    padding-top: calc((56 / var(--curent-size)) * 100vw);
  }

  .title {
    font-size: calc((25 / var(--curent-size)) * 100vw);
  }

  .category-wrapper {
    gap: calc((54 / var(--curent-size)) * 100vw);
  }

  .category-item {
    width: 49%;
  }

  .category-item .btn {
    height: calc((62 / var(--curent-size)) * 100vw);
    width: 100%;
    border-radius: calc((17 / var(--curent-size)) * 100vw);
    gap: calc((8 / var(--curent-size)) * 100vw);
  }

  .btn p {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .category-item-content p {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .category-item-content span {
    width: calc((40 / var(--curent-size)) * 100vw);
    height: calc((40 / var(--curent-size)) * 100vw);
    border-radius: calc((8 / var(--curent-size)) * 100vw);
  }

  .btn svg {
    width: calc((10 / var(--curent-size)) * 100vw);
    height: auto;
  }

  .category-item-content span img {
    width: calc((20 / var(--curent-size)) * 100vw);
  }

  .circle {
    position: absolute;
    bottom: calc((-30 / var(--curent-size)) * 100vw);
    right: calc((-30 / var(--curent-size)) * 100vw);
    width: calc((86 / var(--curent-size)) * 100vw);
  }

  .category-items {
    gap: calc((40 / var(--curent-size)) * 100vw) 0;
  }

  .category-item:nth-child(1) .category-item-content > img {
    position: absolute;
    top: calc((50 / var(--curent-size)) * 100vw);
    right: calc((-7 / var(--curent-size)) * 100vw);
    width: calc((94 / var(--curent-size)) * 100vw);
  }

  .category-item:nth-child(2) .category-item-content > img {
    position: absolute;
    top: calc((40 / var(--curent-size)) * 100vw);
    right: calc((-9 / var(--curent-size)) * 100vw);
    width: calc((110 / var(--curent-size)) * 100vw);
  }

  .category-item:nth-child(3) .category-item-content > img {
    position: absolute;
    top: calc((43 / var(--curent-size)) * 100vw);
    right: calc((0 / var(--curent-size)) * 100vw);
    width: calc((100 / var(--curent-size)) * 100vw);
  }

  .category-item:nth-child(4) .category-item-content > img {
    position: absolute;
    top: calc((42 / var(--curent-size)) * 100vw);
    right: calc((7 / var(--curent-size)) * 100vw);
    width: calc((90 / var(--curent-size)) * 100vw);
  }

  .category-item:nth-child(5) .category-item-content > img {
    position: absolute;
    top: calc((30 / var(--curent-size)) * 100vw);
    right: calc((18 / var(--curent-size)) * 100vw);
    width: calc((66 / var(--curent-size)) * 100vw);
  }
  .category-item:nth-child(6) .category-item-content > img {
    position: absolute;
    top: calc((43 / var(--curent-size)) * 100vw);
    right: calc((7 / var(--curent-size)) * 100vw);
    width: calc((77 / var(--curent-size)) * 100vw);
  }

  .hits-wrapper-head > a p {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: calc((17 / var(--curent-size)) * 100vw);
    text-align: center;
    color: #333;
  }

  .hits-wrapper-head {
    flex-direction: column;
    align-items: flex-start;
    gap: calc((20 / var(--curent-size)) * 100vw);
  }

  .hits-wrapper-head > a {
    align-self: flex-end;
  }

  .hit-trades {
    flex-direction: column;
    align-items: center;
    gap: calc((72 / var(--curent-size)) * 100vw)
      calc((10 / var(--curent-size)) * 100vw);
  }

  .trade-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc((172 / var(--curent-size)) * 100vw);
  }

  .trade-img {
    width: calc((126 / var(--curent-size)) * 100vw);
  }

  .about-wrapper {
    background-image: url(../img/about-bg-m.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: calc((584 / var(--curent-size)) * 100vw);
    border-radius: calc((33 / var(--curent-size)) * 100vw);
    position: relative;
  }

  .about-wrapper-data {
    padding: calc((30 / var(--curent-size)) * 100vw);
    justify-content: flex-start;
  }

  .about-wrapper-data > p {
    font-size: calc((30 / var(--curent-size)) * 100vw);
  }

  .about-wrapper-data > span {
    font-size: calc((14 / var(--curent-size)) * 100vw);
    margin: calc((12 / var(--curent-size)) * 100vw) 0
      calc((24 / var(--curent-size)) * 100vw) 0;
  }

  .about-wrapper-data > span br {
    display: none;
  }

  .about-wrapper-data .btn {
    height: calc((50 / var(--curent-size)) * 100vw);
    width: calc((185 / var(--curent-size)) * 100vw);
    border-radius: calc((14 / var(--curent-size)) * 100vw);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc((8 / var(--curent-size)) * 100vw);
  }

  .about-wrapper-data .btn p {
    font-size: calc((12 / var(--curent-size)) * 100vw);
  }

  .man {
    position: absolute;
    bottom: calc((0 / var(--curent-size)) * 100vw);
    right: calc((0 / var(--curent-size)) * 100vw);
    width: calc((339 / var(--curent-size)) * 100vw);
  }

  .mail-2 {
    position: absolute;
    top: calc((260 / var(--curent-size)) * 100vw);
    right: calc((0 / var(--curent-size)) * 100vw);
    width: calc((120 / var(--curent-size)) * 100vw);
  }

  .mail-1 {
    position: absolute;
    bottom: calc((200 / var(--curent-size)) * 100vw);
    left: 9%;
    transform: translate(-50%, 0);
    width: calc((70 / var(--curent-size)) * 100vw);
  }

  #about {
    padding-top: calc((118 / var(--curent-size)) * 100vw);
  }

  .verify-items {
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: calc((27 / var(--curent-size)) * 100vw);
  }

  .verify-items div {
    background: linear-gradient(90deg, #ececed 0%, #e4e4e4 100%);
    border-radius: calc((21 / var(--curent-size)) * 100vw);
    width: 100%;
    height: calc((162 / var(--curent-size)) * 100vw);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: calc((24 / var(--curent-size)) * 100vw) 0
      calc((24 / var(--curent-size)) * 100vw)
      calc((24 / var(--curent-size)) * 100vw);
    position: relative;
  }

  .verify-items div p {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .verify-items div span {
    border-radius: calc((8 / var(--curent-size)) * 100vw);
    width: calc((76 / var(--curent-size)) * 100vw);
    height: calc((31 / var(--curent-size)) * 100vw);
    font-size: calc((14 / var(--curent-size)) * 100vw);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .verify-items div img {
    position: absolute;
    bottom: 0;
    right: calc((46 / var(--curent-size)) * 100vw);
    width: calc((84 / var(--curent-size)) * 100vw);
  }

  .verify-form > form {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: calc((18 / var(--curent-size)) * 100vw);
  }

  .verify-form > p {
    font-size: calc((23 / var(--curent-size)) * 100vw);
  }

  .verify-form > form .btn {
    width: 100%;
    height: calc((68 / var(--curent-size)) * 100vw);
    flex-shrink: 0;
    border: none;
    cursor: pointer;
    border-radius: calc((15 / var(--curent-size)) * 100vw);
  }

  .verify-form > form input {
    padding: 0 calc((30 / var(--curent-size)) * 100vw);
    height: calc((68 / var(--curent-size)) * 100vw);
    border: calc((2 / var(--curent-size)) * 100vw) solid #6a6a6a;
    border-radius: calc((15 / var(--curent-size)) * 100vw);
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .verify-form {
    gap: calc((30 / var(--curent-size)) * 100vw);
  }

  .verify-wrapper {
    gap: calc((40 / var(--curent-size)) * 100vw);
  }

  #reviews {
    padding-top: calc((62 / var(--curent-size)) * 100vw);
  }

  .reviews-wrapper {
    gap: calc((44 / var(--curent-size)) * 100vw);
  }

  .reviews-item {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: calc((26 / var(--curent-size)) * 100vw);
  }

  .review-img {
    height: calc((350 / var(--curent-size)) * 100vw);
    border-radius: calc((21 / var(--curent-size)) * 100vw);
  }

  .review-img > img {
    width: calc((270 / var(--curent-size)) * 100vw);
  }

  .review-data {
    bottom: calc((20 / var(--curent-size)) * 100vw);
    left: calc((20 / var(--curent-size)) * 100vw);
    gap: calc((34 / var(--curent-size)) * 100vw);
    border-radius: calc((14 / var(--curent-size)) * 100vw);
    padding: calc((8 / var(--curent-size)) * 100vw)
      calc((8 / var(--curent-size)) * 100vw)
      calc((8 / var(--curent-size)) * 100vw)
      calc((18 / var(--curent-size)) * 100vw);
  }

  .review-text {
    gap: calc((12 / var(--curent-size)) * 100vw);
  }

  .review-data a {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .review-data span {
    width: calc((58 / var(--curent-size)) * 100vw);
    height: calc((53 / var(--curent-size)) * 100vw);
    font-size: calc((15 / var(--curent-size)) * 100vw);
  }

  .review-text p {
    font-size: calc((22 / var(--curent-size)) * 100vw);
  }

  .review-text h6 {
    font-size: calc((17 / var(--curent-size)) * 100vw);
  }

  .review-text span {
    font-size: calc((17 / var(--curent-size)) * 100vw);
  }

  #faq {
    padding-top: calc((63 / var(--curent-size)) * 100vw);
    padding-bottom: calc((92 / var(--curent-size)) * 100vw);
  }

  .faq-items {
    gap: calc((23 / var(--curent-size)) * 100vw);
    margin-top: calc((38 / var(--curent-size)) * 100vw);
  }

  .faq-item {
    border-radius: calc((19 / var(--curent-size)) * 100vw);
    padding: calc((16 / var(--curent-size)) * 100vw)
      calc((17 / var(--curent-size)) * 100vw)
      calc((16 / var(--curent-size)) * 100vw)
      calc((30 / var(--curent-size)) * 100vw);
  }

  .faq-item-head p {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .faq-item-head img {
    width: calc((45 / var(--curent-size)) * 100vw);
    height: calc((45 / var(--curent-size)) * 100vw);
  }

  .answer {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .footer-head {
    flex-wrap: wrap;
  }

  .footer-ander {
    flex-wrap: wrap;
  }

  .footer-menu {
    flex-wrap: wrap;
  }

  .under-links {
    flex-direction: column;
    align-items: flex-start;
  }

  .socials-links {
    display: none;
  }

  .footer-logo {
    order: -3;
  }

  .footer-links {
    order: -2;
  }

  .footer-links a:first-child img {
    width: calc((18 / var(--curent-size)) * 100vw);
    height: calc((18 / var(--curent-size)) * 100vw);
  }

  .footer-logo svg {
    width: calc((159 / var(--curent-size)) * 100vw);
    height: calc((36 / var(--curent-size)) * 100vw);
  }

  .footer-links a:first-child {
    gap: calc((2 / var(--curent-size)) * 100vw);
    font-size: calc((17 / var(--curent-size)) * 100vw);
  }

  .footer-links {
    gap: calc((10 / var(--curent-size)) * 100vw);
  }

  .footer-links a:last-child {
    font-size: calc((13 / var(--curent-size)) * 100vw);
  }

  .footer-menu {
    margin-top: calc((35 / var(--curent-size)) * 100vw);
  }

  .footer-menu li a {
    font-size: calc((15 / var(--curent-size)) * 100vw);
  }

  .under-links a,
  .under-links p {
    font-size: calc((15 / var(--curent-size)) * 100vw);
  }

  .under-links {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: calc((15 / var(--curent-size)) * 100vw);
  }

  footer {
    background: #1f2123;
    padding: calc((38 / var(--curent-size)) * 100vw) 0
      calc((20 / var(--curent-size)) * 100vw) 0;
  }

  .mobile-item {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: calc((44 / var(--curent-size)) * 100vw);
  }

  .mobile-item .footer-nav {
    display: flex;
  }

  .mobile-item .socials-links {
    display: flex;
  }

  .header-nav p {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .header-nav a {
    width: calc((40 / var(--curent-size)) * 100vw);
    height: calc((40 / var(--curent-size)) * 100vw);
    border-radius: calc((8 / var(--curent-size)) * 100vw);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .header-nav a svg {
    width: calc((20 / var(--curent-size)) * 100vw);
  }

  .socials-links a img {
    width: calc((37 / var(--curent-size)) * 100vw);
    height: calc((37 / var(--curent-size)) * 100vw);
  }

  .socials-links {
    gap: calc((10 / var(--curent-size)) * 100vw);
  }

  .tabs {
    flex-wrap: wrap;
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
    gap: calc((16 / var(--curent-size)) * 100vw);
    margin: calc((33 / var(--curent-size)) * 100vw) 0
      calc((97 / var(--curent-size)) * 100vw) 0;
  }

  .filters {
    display: none;
  }

  .tabs li {
    border: calc((1 / var(--curent-size)) * 100vw) solid #adadad;
    border-radius: calc((15 / var(--curent-size)) * 100vw);
    width: calc((169 / var(--curent-size)) * 100vw);
    height: calc((44 / var(--curent-size)) * 100vw);
    font-size: calc((12 / var(--curent-size)) * 100vw);
  }

  .catalog-content-wrapper {
    padding-top: calc((120 / var(--curent-size)) * 100vw);
  }

  .catalog-items {
    flex-direction: column;
    align-items: center;
  }

  .catalog-items .trade-item > p {
    margin-top: calc((39 / var(--curent-size)) * 100vw);
    font-size: calc((30 / var(--curent-size)) * 100vw);
  }

  .catalog-items .trade-item > h6 {
    font-size: calc((21 / var(--curent-size)) * 100vw);
  }

  .catalog-items .trade-item > span {
    font-size: calc((21 / var(--curent-size)) * 100vw);
  }

  .catalog-items .trade-item .btn {
    border: none;
    width: calc((257 / var(--curent-size)) * 100vw);
    height: calc((74 / var(--curent-size)) * 100vw);
  }

  .catalog-items .trade-btns {
    flex-direction: column;
    align-items: center;
  }

  .catalog-items .trade-item a {
    width: calc((257 / var(--curent-size)) * 100vw);
    height: calc((74 / var(--curent-size)) * 100vw);
  }

  .catalog-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }

  .filter-btn {
    display: flex;
    border: none;
    background: initial;
  }
  .filter-btn img {
    width: calc((35 / var(--curent-size)) * 100vw);
    height: calc((35 / var(--curent-size)) * 100vw);
  }

  .single-trade-wrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
    gap: calc((50 / var(--curent-size)) * 100vw);
  }

  .main-img {
    width: calc((326 / var(--curent-size)) * 100vw);
  }

  .single-trade-data {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }

  .single-main-img {
    width: calc((138 / var(--curent-size)) * 100vw);
  }

  .imgs-poginations span {
    width: calc((60 / var(--curent-size)) * 100vw);
    border: calc((1 / var(--curent-size)) * 100vw) solid #6186ab;
  }

  .single-imgs-wrapper {
    gap: calc((21 / var(--curent-size)) * 100vw);
  }

  #single-trade {
    padding-top: calc((150 / var(--curent-size)) * 100vw);
    padding-bottom: calc((54 / var(--curent-size)) * 100vw);
  }

  .single-trade-data h1 {
    font-size: calc((30 / var(--curent-size)) * 100vw);
  }

  .single-trade-data > p {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: calc((13 / var(--curent-size)) * 100vw);
    color: #828282;
    padding: calc((20 / var(--curent-size)) * 100vw) 0
      calc((35 / var(--curent-size)) * 100vw) 0;
    width: 100%;
    border-bottom: calc((1 / var(--curent-size)) * 100vw) solid #e6e6e6;
  }

  .single-list > p {
    font-size: calc((13 / var(--curent-size)) * 100vw);
  }

  .single-list ul li p,
  .single-list ul li span {
    font-size: calc((12 / var(--curent-size)) * 100vw);
  }

  .single-list ul {
    gap: calc((10 / var(--curent-size)) * 100vw);
  }

  .single-list {
    gap: calc((20 / var(--curent-size)) * 100vw);
    margin-top: calc((24 / var(--curent-size)) * 100vw);
  }

  .single-price p {
    font-size: calc((22 / var(--curent-size)) * 100vw);
  }

  .single-price span {
    font-size: calc((13 / var(--curent-size)) * 100vw);
  }

  .single-price span img {
    width: calc((14 / var(--curent-size)) * 100vw);
    height: calc((14 / var(--curent-size)) * 100vw);
  }

  .single-btns {
    display: flex;
    align-items: center;
    gap: calc((15 / var(--curent-size)) * 100vw);
    margin-top: calc((26 / var(--curent-size)) * 100vw);
  }

  .single-btns a {
    width: calc((167 / var(--curent-size)) * 100vw);
    height: calc((51 / var(--curent-size)) * 100vw);
    border-radius: calc((14 / var(--curent-size)) * 100vw);
    gap: calc((6 / var(--curent-size)) * 100vw);
    border: calc((1 / var(--curent-size)) * 100vw) solid transparent;
    font-size: calc((12 / var(--curent-size)) * 100vw);
  }

  .single-price {
    gap: calc((30 / var(--curent-size)) * 100vw);
    margin-top: calc((20 / var(--curent-size)) * 100vw);
  }

  .tabs-data div {
    border: calc((1 / var(--curent-size)) * 100vw) solid #adadad;
    border-radius: calc((12 / var(--curent-size)) * 100vw);
    width: calc((172 / var(--curent-size)) * 100vw);
    height: calc((43 / var(--curent-size)) * 100vw);
    font-size: calc((12 / var(--curent-size)) * 100vw);
  }

  .tabs-data {
    gap: calc((10 / var(--curent-size)) * 100vw);
  }

  #single-data {
    padding: calc((37 / var(--curent-size)) * 100vw) 0;
  }

  .content-data-item h1,
  .content-data-item h2,
  .content-data-item h3,
  .content-data-item h4,
  .content-data-item h5,
  .content-data-item h6 {
    font-size: calc((16 / var(--curent-size)) * 100vw);
    margin: calc((26 / var(--curent-size)) * 100vw) 0
      calc((13 / var(--curent-size)) * 100vw) 0;
  }

  .content-data-item p,
  .content-data-item span,
  .content-data-item {
    font-size: calc((15 / var(--curent-size)) * 100vw);
  }

  .hits-section {
    padding: calc((60 / var(--curent-size)) * 100vw) 0
      calc((124 / var(--curent-size)) * 100vw) 0 !important;
  }

  .single-shadow {
    bottom: calc((10 / var(--curent-size)) * 100vw);
  }

  #single-trade {
    overflow: hidden;
  }

  .burger-wrapper {
    display: flex;
    justify-content: flex-end;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.637);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s ease;
  }

  .burger-wrapper.open {
    opacity: 1;
    visibility: visible;
    transition: 0.3s ease;
  }

  .burger-content {
    width: 90%;
    height: 100%;
    background: linear-gradient(180deg, #6284a4 100%);
    padding: calc((100 / var(--curent-size)) * 100vw)
      calc((20 / var(--curent-size)) * 100vw)
      calc((20 / var(--curent-size)) * 100vw)
      calc((20 / var(--curent-size)) * 100vw);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    transform: translateX(100%);
    transition: 0.3s ease;
  }

  .burger-content.show {
    transform: translateX(0%);
    transition: 0.3s ease;
  }

  .burger-content > svg {
    width: calc((200 / var(--curent-size)) * 100vw);
    height: auto;
    flex-shrink: 0;
  }

  .burger-nav {
    display: flex;
    margin-top: auto;
  }

  .burger-menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: calc((60 / var(--curent-size)) * 100vw);
    gap: calc((26 / var(--curent-size)) * 100vw);
  }

  .burger-menu li {
    display: flex;
    align-items: center;
    height: auto;
    width: 100%;
  }

  .burger-menu li a {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: calc((22 / var(--curent-size)) * 100vw);
    line-height: 100%;
    letter-spacing: -0.02em;
    color: #fff;
    height: fit-content;
    text-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.2);
    width: 100%;
  }

  .cart-content {
    width: 100%;

    border-radius: calc((20 / var(--curent-size)) * 100vw);
    padding: calc((30 / var(--curent-size)) * 100vw)
      calc((10 / var(--curent-size)) * 100vw);
  }

  .cart-content > p {
    font-size: calc((24 / var(--curent-size)) * 100vw);
  }

  .close-cart {
    top: calc((20 / var(--curent-size)) * 100vw);
    right: calc((20 / var(--curent-size)) * 100vw);
  }

  .close-cart img {
    width: calc((18 / var(--curent-size)) * 100vw);
    height: calc((18 / var(--curent-size)) * 100vw);
  }

  .cart-item-img {
    width: calc((90 / var(--curent-size)) * 100vw);
    height: calc((90 / var(--curent-size)) * 100vw);
    flex-shrink: 0;
  }

  .trade-cart-img {
    width: calc((36 / var(--curent-size)) * 100vw);
  }

  .cart-name p {
    font-size: calc((18 / var(--curent-size)) * 100vw);
  }

  .cart-item {
    flex-wrap: wrap;
    position: relative;
    gap: calc((20 / var(--curent-size)) * 100vw) 0;
  }

  .delete-cart-item {
    position: absolute;
    top: calc((10 / var(--curent-size)) * 100vw);
    right: 0;
    width: calc((30 / var(--curent-size)) * 100vw);
    height: calc((30 / var(--curent-size)) * 100vw);
  }

  .cart-item-nav {
    margin-left: 0;
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: space-between;
    width: 100%;
  }

  .cart-name span {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .cart-item-nav > p {
    font-size: calc((16 / var(--curent-size)) * 100vw);
  }

  .cart-sum-wrapper p {
    font-size: calc((18 / var(--curent-size)) * 100vw);
  }

  .cart-form input {
    width: 100%;
    padding: calc((15 / var(--curent-size)) * 100vw)
      calc((20 / var(--curent-size)) * 100vw);
    font-size: calc((16 / var(--curent-size)) * 100vw);
    border: calc((1 / var(--curent-size)) * 100vw) solid #8a8a8a;
    border-radius: calc((12 / var(--curent-size)) * 100vw);
  }

  .cart-form {
    gap: calc((7 / var(--curent-size)) * 100vw);
  }

  .select-item svg {
    position: absolute;
    top: calc((12 / var(--curent-size)) * 100vw);
    right: calc((20 / var(--curent-size)) * 100vw);
    width: calc((10 / var(--curent-size)) * 100vw);
  }

  .dropdown p {
    padding: calc((12 / var(--curent-size)) * 100vw)
      calc((20 / var(--curent-size)) * 100vw);
    font-size: calc((16 / var(--curent-size)) * 100vw);
  }

  .dropdown {
    border: calc((1 / var(--curent-size)) * 100vw) solid #8a8a8a;
    border-radius: calc((12 / var(--curent-size)) * 100vw);
  }

  .cart-form button {
    padding: calc((16 / var(--curent-size)) * 100vw);
    border-radius: calc((12 / var(--curent-size)) * 100vw);
  }

  .cart-form button p {
    font-size: calc((16 / var(--curent-size)) * 100vw);
  }

  .checkbox-wrapper > p {
    font-size: calc((15 / var(--curent-size)) * 100vw);
  }

  .checkbox {
    width: calc((16 / var(--curent-size)) * 100vw);
    height: calc((16 / var(--curent-size)) * 100vw);
  }

  .trade-item > p {
    margin-top: calc((45 / var(--curent-size)) * 100vw);
    font-size: calc((18 / var(--curent-size)) * 100vw);
  }

  .trade-item > h6 {
    font-size: calc((18 / var(--curent-size)) * 100vw);
    margin: calc((13 / var(--curent-size)) * 100vw) 0;
  }

  .trade-btns {
    width: 100%;
  }

  .trade-item .btn {
    border: none;
    width: 100%;
  }

  .hit-trades {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    gap: calc((72 / var(--curent-size)) * 100vw)
      calc((10 / var(--curent-size)) * 100vw);
  }

  .hit-trade.trade-item a {
    height: calc((86 / var(--curent-size)) * 100vw);
    width: 100%;
    border-radius: calc((23 / var(--curent-size)) * 100vw);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc((8 / var(--curent-size)) * 100vw);
  }

  .hit-trade .trade-img {
    width: calc((66 / var(--curent-size)) * 100vw);
  }

  .hit-trade .trade-btns button {
    height: calc((50 / var(--curent-size)) * 100vw);
    border-radius: calc((12 / var(--curent-size)) * 100vw);
  }

  .hit-trade .trade-btns a {
    height: calc((50 / var(--curent-size)) * 100vw);
    border-radius: calc((12 / var(--curent-size)) * 100vw);
  }

  .hit-trade .trade-btns a p {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .hit-trade.trade-item > span {
    font-size: calc((14 / var(--curent-size)) * 100vw);
  }

  .hit-trade.trade-item > span img {
    width: calc((16 / var(--curent-size)) * 100vw);
    height: calc((16 / var(--curent-size)) * 100vw);
  }

  .hit-trades {
    margin-top: calc((50 / var(--curent-size)) * 100vw);
  }

  .hit-trade .shadow {
    width: calc((120 / var(--curent-size)) * 100vw);
  }

  .hit-trade .trade-btns {
    margin-top: auto;
  }

  .footer-links {
    display: none !important;
  }

  .form-contacts {
    flex-direction: column;
    align-items: flex-start;
    padding: calc((34 / var(--curent-size)) * 100vw)
      calc((30 / var(--curent-size)) * 100vw) 0
      calc((30 / var(--curent-size)) * 100vw);
    height: calc((1080 / var(--curent-size)) * 100vw);
    border-radius: calc((22 / var(--curent-size)) * 100vw);
    display: flex;
  }

  #form-cont .select-item {
    width: 100%;
  }

  .form-contacts > img {
    position: static;
    bottom: 0;
    right: 0;
    width: 100%;
    margin-top: auto;
  }

  .form-contacts-text > p {
    font-size: calc((18 / var(--curent-size)) * 100vw);
    margin-top: calc((20 / var(--curent-size)) * 100vw);
  }

  .form-contacts-text > p br {
    display: none;
  }

  .form-contacts-text .title {
    font-size: calc((28 / var(--curent-size)) * 100vw);
  }

  #form-cont {
    width: 100%;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: calc((20 / var(--curent-size)) * 100vw);
    margin-top: calc((18 / var(--curent-size)) * 100vw);
  }

  #form-cont input {
    width: 100%;
    border-radius: calc((16 / var(--curent-size)) * 100vw);
    height: calc((63 / var(--curent-size)) * 100vw);
    padding: 0 calc((20 / var(--curent-size)) * 100vw);
    font-size: calc((18 / var(--curent-size)) * 100vw);
  }

  #form-cont textarea {
    width: 100%;
    border-radius: calc((16 / var(--curent-size)) * 100vw);
    height: calc((63 / var(--curent-size)) * 100vw);
    font-size: calc((18 / var(--curent-size)) * 100vw);
    padding: calc((10 / var(--curent-size)) * 100vw)
      calc((20 / var(--curent-size)) * 100vw);
  }

  #form-cont button p {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: calc((16 / var(--curent-size)) * 100vw);
    text-align: center;
    color: #fff;
  }

  #form-cont .select-item svg {
    top: calc((17 / var(--curent-size)) * 100vw);
  }

  .checkbox {
    flex-shrink: 0;
  }

  #form-cont button {
    width: 100%;
    height: calc((63 / var(--curent-size)) * 100vw);
    border-radius: calc((16 / var(--curent-size)) * 100vw);
  }

  #form-cont button svg {
    width: calc((13 / var(--curent-size)) * 100vw);
    height: calc((11 / var(--curent-size)) * 100vw);
  }

  .catalog-itemss {
    width: 100%;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .catalog-itemss {
    gap: calc((76 / var(--curent-size)) * 100vw) 0;
  }

  .catalog-itemss .trade-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc((172 / var(--curent-size)) * 100vw);
  }

  .catalog-itemss .trade-img {
    position: absolute;
    bottom: calc((40 / var(--curent-size)) * 100vw);
    left: 50%;
    transform: translate(-50%, 0);
    width: calc((66 / var(--curent-size)) * 100vw);
  }

  .catalog-itemss .trade-item span {
    margin-top: auto;
    margin-bottom: calc((20 / var(--curent-size)) * 100vw);
  }

  .message {
    font-size: calc((16 / var(--curent-size)) * 100vw);
    text-align: center;
  }

  .tabs-data {
    flex-wrap: wrap;
  }

  .backbtn {
    display: flex !important;
    order: 100;
    width: 100% !important;
    border: 1px solid #000 !important;
  }

  .single-btns {
    flex-wrap: wrap;
  }

  .message div p {
    font-size: calc((24 / var(--curent-size)) * 100vw);
  }

  .hit-trades .trade-item:last-child {
    display: none;
  }

  .dop-1 {
    font-family: var(--font-family);
    font-weight: 500;
    font-size: calc((15 / var(--curent-size)) * 100vw);
    letter-spacing: 0.01em;
    color: #fff;
    opacity: 0.7;
    margin-top: calc((20 / var(--curent-size)) * 100vw);
    text-align: center;
  }
}
