section{
  font-family: Inter;
  font-weight: 500;
}
.btn {
  font-family: Rubik;
  background: #FFD147;
  box-shadow: 0 0 30px 0 rgba(177, 153, 20, 0.116);
  color: #212121;
  padding: 18px 40px;
  white-space: nowrap;
  transition: .2s;
}
.btn:hover {
  background: #FFD14790;
}
h1{
    color: #686868;
    font-size: 30px;
    margin: 0;
}
h2{
    font-family: Rubik;
    font-size: 50px;
    color: #000;
    font-weight: 500;
    line-height: 1.2;
}

.bg_y_lg{background: linear-gradient(90deg, rgba(239, 181, 3, 1), rgba(255, 209, 71, 1));}
.btn.bg_y_lg:hover{background: linear-gradient(90deg, rgba(239, 181, 3, .5), rgba(255, 209, 71, .5));}
.btn-white{
    background: #fff;
    box-shadow: 0 0 15px #7B4A0640;
    width: 280px;
}
.btn-white.btn:hover{
    background: linear-gradient(90deg, rgba(239, 181, 3, .05), rgba(255, 209, 71, .05));
}
.btn.btn-yellow_border{
  padding: 18px 40px;
  background: #fff;
  border: 2px solid #FFC100;
  color: #FFC100;
}
.btn-yellow_border.btn:hover{
    background: linear-gradient(90deg, rgba(239, 181, 3, .2), rgba(255, 209, 71, .2));
}
.fz24{font-size: 24px;}
.cdg{color: #686868;}
.bs{box-shadow: 0 0 25px #31313132;}


section.promo{
  min-height: calc(95vh - 93px);
}
section:not(.promo){
  margin-bottom: 16vh;
}
.promo_img{max-width: 45vw;}
section.who_can{
    width: 100%;
}
.items-wrap {
  position: relative;
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: 14px;
}
.items {
  flex-shrink: 0;
  display: flex;
  gap: 14px;
  counter-reset: item;
  justify-content: space-around;
  min-width: 100%;
}
.marquee {
  animation: scroll 20s linear infinite;
}
.reverce {
  animation-direction: reverse;
}
.items-wrap:hover .marquee {
  animation-play-state: paused;
}
.marquee-item{
  padding: 15px 30px;
  color: #B1B1B1;
  border: 2px solid #C9C9C9;
  border-radius: 100px;
  font-size: 20px;
}

@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-100% - 20px));
  }
}
.whc_arrow{
  position: absolute;
  right: 40%;
  top: 60%;
}

.reg_btn_yellow_wrap{
    border-radius: 60px;
    padding: 20px 15px;
    width: 55%;
    padding-left: 10%;
}
.reg_btn_light_wrap{
    width: 100%;
    background: #FFFFFF33;
    border-radius: 60px;
    padding: 20px 0;
}


section.how_to_invite{}
.hti_number{
  width: 60px;
  height: 60px;
}
.hti_name{
  font-family: Rubik;
  font-weight: 500;
  font-size: 24px;
}
.hti_comment{
  font-family: Inter;
  font-size: 18px;
  color: #505050;
  font-weight: 500;
}
.hti_field{
  font-size: 18px;
  color: #505050;
  padding: 20px 30px;
  background-color: #fff;
  gap: 15px;
  background-color: #F7F7F7;
}
.hti_number_w50{
  width: calc(50% - 15px);
  box-sizing: border-box;
}


section.get_price{}
.gp_comment{
  font-size: 24px;
  color: #505050;
}
.gp_list{padding-right: 130px;}
.gp_block{
  box-shadow: 0 0 32px #89898924;
  font-size: 24px;
}
.gp_yellow_circule{
  display: flex;
  justify-content: center;
  width: 568px;
  height: 568px;
  min-width: 568px;
  border-radius: 50%;
  background-color: #FFDD74;
  position: relative;
  margin-bottom: -40px;
  margin-right: -90px;
}
.gp_yellow_circule img{
  position: absolute;
  bottom: 0;
}


@media (max-width:1280px) {
  h2{font-size: 40px;}
  .hti_number_w50{width: 100%;}
  .gp_comment, .gp_block{font-size: 18px;}
  .gp_block {padding: 15px;}
  .gp_yellow_circule{
    width: 468px;
    height: 468px;
    min-width: 468px;
  }
  .gp_yellow_circule{margin-bottom: 0;margin-top: 90px;}
  .gp_yellow_circule img{width: 100%;}
  .gp_list{padding-right: 50px;}
  .who_can_comment{font-size: 20px;}
}
@media (max-width:900px) {
  h1,h2{width: 100%;}
  .promo_img{max-width: 100%; margin-left: -10%;}
  section.promo{margin-bottom: 16vh;}
  .brrd30{border-radius: 15px;}
  .brrd15{border-radius: 7.5px;}
  .who_can_comment,
  .reg_btn_yellow_wrap{width: 100%;}
  .reg_btn_yellow_wrap,
  .reg_btn_light_wrap{padding: 15px;padding-left: 10vw;}
  .gp_block {padding: 10px;}
  .gp_yellow_circule{margin-right: 0;}
  .gp_list {padding-right: 0;}
  .gp_comment, .gp_block{font-size: 16px;}
  .whc_arrow{width: 50vw;top: 90%;}
}
@media (max-width:600px) {
  h1{font-size: 16px;}
  h2{font-size: 26px;}
  .who_can_comment{font-size: 14px;}
  .btn{
    width: 100%;
    padding: 12px;
    font-size: 14px;
  }
  .reg_btn_yellow_wrap,
  .reg_btn_light_wrap{
    padding: 11px 15px;
    padding-left: 10vw;
  }
  .marquee-item{
    padding: 8px 20px;
    font-size: 12px;
    border: 1px solid #C9C9C9;
  }
  section.promo, section:not(.promo) {margin-bottom: 10vh;}
  .hti_number{
    width: 40px;
    height: 40px;
  }
  .hti_name{font-size: 16px;}
  .hti_field, .hti_comment{font-size: 12px;}
  .hti_field img{width: 20px;}
  .hti_field{padding: 15px;}
  .gp_mb_btn{margin-top: -70px;z-index: 20;}
  .gp_comment{font-size: 14px;}
  .gp_block{font-size: 12px;}
  .gp_yellow_circule {
      width: 320px;
      height: 320px;
      min-width: 320px;
      margin-top: 40px;
  }
}