/* TODO: Поправить отступы в соответствии с общими стилями проекта */
div#comp_4560dc56fd9b7cd75d55d0a3f9627366 {
  width:100%;
}

.s_form_discound form {
  display: flex;
  align-items: center;
  gap: clamp(10px, 3vw, 16px) !important;

  .form_item {
    position: relative;
  }
}

.form_label {
  position: absolute;
  pointer-events: none;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  font-size: clamp(14px, 3vw, 16px);
  color: var(--grey-AF);
  white-space: nowrap;
  overflow: hidden;
  transition: .4s;
  display: inline-block;
}

.form_item .form_input:focus ~ .form_label,
.form_item .form_input:not(:placeholder-shown) ~ .form_label {
  top: -9999% !important;
  transform: unset;
  font-size: var(--font-size16);
}
.form_item .form_input:not(:focus):valid{padding:0!important;}
.form_item .form_input:not(:focus):valid ~ .form_label {
  top: 50px;
}

.form_discound__check {
  font-size: var(--font-size14);
  font-weight: 400;
  line-height: var(--ln18);
  color: var(--white);

  > a {
    font-size: var(--font-size14);
    font-weight: 400;
    line-height: var(--ln18);
    color: var(--white);

    &:hover {
      color: var(--white);
      text-decoration: underline;
    }
  }
}

.main_screen__social {
  width: 100%;
  max-width: 100%;
  height:68px;
  display: flex;
  gap: clamp(10px, 3vw, 13px);
  background: white;
  border-radius: 12px;
  justify-content: space-between;
  @media screen and (width <= 780px) {
    backdrop-filter: blur(50px);
    background: var(--white-F5);
    border-radius: 20px;
    height:53.39px;
  }

  .social_phone {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 0 0 10px;
    @media screen and (width <= 780px) {
      width:170px;
    }
    @media screen and (width <= 450px){
      width: 240px;
    }
    @media screen and (width <= 429px){
      width: 220px;
    }
    @media screen and (width <= 400px){
      width:200px;
    }
    @media screen and (width <= 380px){
      width:185px;
    }
    @media screen and (width <= 385px){
      width:194px;
    }
    @media screen and (width <= 361px){
      width:170px;
    }
    @media screen and (width <= 354px){
      width:164px;
    }
    @media screen and (width <= 321px){
      width:144px;
    }
    > input.phone {
      height: 60px;
      min-height: 60px;
      color: black;
      font-weight: 400;
      font-size: var(--font-size20);
      line-height: 100%;
      letter-spacing: 0;
      display: block;
      padding: 0;
      background: inherit;
      @media screen and (width <= 360px){
        font-size:15.5px;
      }
      @media screen and (width <= 354px){
        font-size:15.5px;
      }
      @media screen and (width <= 321px){
        font-size:14px;
      }
    }

    > input.phone::placeholder {
      color: black;
    }

    /* Для Firefox */
    > input.phone::-moz-placeholder {
      color: black;
      opacity: 1; /* Firefox снижает непрозрачность до 0.54 по умолчанию */
    }

    .txt_phone {
      color: var(--grey-73);
      font-weight: 400;
      font-size: var(--font-size14);
      line-height: 100%;
      letter-spacing: 0;
      position: relative;
      top: clamp(1px,1vw,10px);
      text-wrap:nowrap;
    }
  }

  .btn_blur.desc_phone {
    color: #000;
    font-weight: 400;
    font-size: var(--font-size16);
    line-height: 100%;
    letter-spacing: 0;
    background: #E7E4DE;
    margin: 0;
    text-align: center;
    text-wrap-style: balance;
    cursor: pointer;
    height: 68px;
    @media screen and (width <= 780px) {
      border-radius: 20px;
      width:137px;
      height:53.39px;
    }
  }
}