/* /honormagic6pro */
.hm6__header {
  position: relative;
  display: grid;
  grid-template-columns: auto auto auto;
  align-items: center;
  gap: 50px;
  padding: 0 20px;
}

@media (max-width: 1400px) {
  .hm6__header {
    grid-template-columns: auto auto;
    padding: 40px 0 0;
  }
}

@media (max-width: 850px) {
  .hm6__header {
    grid-template-columns: 1fr;
    justify-items: center;
  }
}

@media (max-width: 500px) {
  .hm6__header {
    padding: 50px 0 0;
  }
}

.hm6__claim .gradient {
  width: max-content;
  padding: 12px 25px 16px;
  margin: 25px auto 0;
  border-radius: 0 30px 30px 30px;
  font-size: 36px;
  line-height: 1;
  background: linear-gradient(-114deg, rgba(252, 255, 0, 1) 0%, rgba(252, 255, 0, 1) 13%, rgba(255, 207, 0, 1) 84%, rgba(255, 207, 0, 1) 100%);
}

@media (max-width: 500px) {
  .hm6__claim .gradient {
    font-size: 18px;
  }
}

.hm6__claim .img--claim {
  margin: 0 auto;
}

.hm6__claim .img--logo {
  position: absolute;
  bottom: 0;
  left: 0;
}

@media (max-width: 1400px) {
  .hm6__claim .img--logo {
    bottom: unset;
    top: 0;
  }
}

@media (max-width: 850px) {
  .hm6__claim .img--logo {
    left: 50%;
    transform: translateX(-50%);
  }
}

@media (max-width: 1400px) {
  .hm6__phones {
    max-width: 400px;
  }
}

.hm6__bubbles {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 851px) and (max-width: 1400px) {
  .hm6__bubbles {
    grid-column: span 2;
  }
}

.hm6__bubbles > div {
  border: 3px solid #fff;
}

.hm6__bubbles .bubble {
  width: 130px;
  height: 130px;
}

@media (max-width: 500px) {
  .hm6__bubbles .bubble {
    width: 90px;
    height: 90px;
    font-size: 12px;
  }
}

.hm6__bubbles .bg--violetBrand {
  border-radius: 0 50% 50% 50%;
}

@media (max-width: 500px) {
  .hm6__bubbles .bg--violetBrand .img--gift {
    max-width: 20px;
  }
}

.hm6__bubbles .bubble--green {
  position: relative;
  width: 200px;
  height: 200px;
  margin: 0 -15px;
  border-radius: 50% 0 50% 50%;
  font-size: 28px;
  z-index: -1;
}

@media (max-width: 500px) {
  .hm6__bubbles .bubble--green {
    width: 140px;
    height: 140px;
    font-size: 20px;
  }
}

.hm6__bubbles .bubble--green .discountCode {
  margin: 10px 0 0;
  font-size: 18px;
}

@media (max-width: 500px) {
  .hm6__bubbles .bubble--green .discountCode {
    font-size: 14px;
  }
}

.hm6__bubbles .bg--orangeBrand {
  border-radius: 50% 50% 0 50%;
}

@media (min-width: 851px) and (max-width: 1400px) {
  .hm6__desc {
    grid-column: span 2;
    margin: 0 auto;
  }
}

.hm6__desc .desc {
  max-width: 390px;
  margin: 20px auto 0;
}

.hm6__desc .desc .desc--price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 15px;
}

.hm6__desc .desc .desc--price > div:nth-child(1) {
  font-size: 58px;
}

@media (max-width: 500px) {
  .hm6__desc .desc .desc--price > div:nth-child(1) {
    font-size: 40px;
  }
}

.hm6__desc .desc .desc--price > div:nth-child(2) {
  font-size: 23px;
  text-decoration: line-through;
}

@media (max-width: 500px) {
  .hm6__desc .desc .desc--price > div:nth-child(2) {
    font-size: 20px;
  }
}

.hm6__desc .desc a {
  display: inline-flex;
  margin: 20px 0 0;
  font-size: 21px;
  text-decoration: underline;
}

.hm6__desc .desc--text {
  margin: 20px auto 0;
}

.hm6__desc .img--gift {
  margin: 0 auto 10px;
}

.hm6--june {
  display: grid;
  grid-template-columns: auto auto auto;
  align-items: center;
  gap: 40px;
  min-height: 400px;
}

@media (max-width: 1100px) {
  .hm6--june {
    grid-template-columns: auto auto;
    justify-content: center;
    justify-items: center;
  }
}

@media (max-width: 760px) {
  .hm6--june {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 500px) {
  .hm6--june {
    grid-template-columns: 1fr;
  }
}

.hm6--june .gifts {
  display: flex;
  align-items: flex-end;
}

@media (max-width: 1100px) {
  .hm6--june .gifts {
    grid-column: span 2;
    order: 3;
  }
}

@media (max-width: 500px) {
  .hm6--june .gifts {
    grid-column: unset;
  }
}

@media (max-width: 500px) {
  .hm6--june .gifts img {
    transform: rotate(-90deg) scale(0.5);
    margin: 0 -40px 0 -70px;
  }
}

.hm6--june .drops {
  display: flex;
  margin: 40px 0 0;
}

@media (max-width: 1400px) {
  .hm6--june .drops {
    transform: scale(0.66);
    margin: 40px -40px 0;
  }
}

@media (max-width: 1100px) {
  .hm6--june .drops {
    transform: scale(0.5625);
    margin: -40px;
  }
}

.hm6--june .drop {
  width: 160px;
  height: 160px;
  border: 3px solid #fff;
  font-size: 23px;
}

.hm6--june .drop.bg--violetBrand {
  margin: 0 -50px 50px 0;
  border-radius: 0 50% 50% 50%;
}

.hm6--june .drop.bg--violetBrand svg {
  width: 40px;
  height: 40px;
  margin: 0 0 8px;
}

.hm6--june .drop.bg--orangeBrand {
  position: relative;
  margin: 90px 0 0 0;
  border-radius: 50% 50% 0 50%;
  z-index: -1;
}

.hm6--june .drop.bg--greenBrand {
  position: relative;
  margin: -60px 0 0 -140px;
  border-radius: 50% 0 50% 50%;
  z-index: -2;
}

@media (min-width: 760px) and (max-width: 1100px) {
  .hm6--june > img {
    max-width: 300px;
  }
}

@media (max-width: 500px) {
  .hm6--june > img {
    max-width: 160px;
  }
}

.hm6--june .claim {
  margin: 25px 0 0;
  line-height: 1;
}

@media (min-width: 501px) and (max-width: 760px) {
  .hm6--june .claim {
    transform: scale(0.675);
  }
}

@media (max-width: 500px) {
  .hm6--june .claim {
    margin: 0;
  }
}

.hm6--june .claim img {
  display: block;
  margin: 0 auto;
}

@media (min-width: 760px) and (max-width: 1400px) {
  .hm6--june .claim img {
    max-width: 360px;
  }
}

@media (max-width: 500px) {
  .hm6--june .claim img {
    max-width: 300px;
  }
}

.hm6--june .claim .gradient {
  max-width: max-content;
  margin: 25px auto 0;
  padding: 12px 30px 15px;
  border-radius: 0 30px 30px 30px;
  font-size: 32px;
  background: linear-gradient(225deg, #fcff00 0%, #fcff00 13%, #ffcf00 84%, #ffcf00 100%);
}

@media (max-width: 500px) {
  .hm6--june .claim .gradient {
    font-size: 24px;
  }
}

.hm6--june .claim .price {
  font-size: 58px;
}

@media (max-width: 500px) {
  .hm6--june .claim .price {
    font-size: 40px;
  }
}