body{
    background-color:#FFFAF0;
    color: black;
      font-family: 'IBM';
     
}
a{
    color: black;
}
.left_side{
    position: relative;
}
.arrow_contact{
           position: absolute;
    top: 36%;
    left: 0;
    max-width: 400px;
}
.contacts{
    display:flex;
    gap:120px;
    font-style:normal;
    margin-top: 100px;
}

.contacts_column{
    display:flex;
    flex-direction:column;
    gap:40px;
}
.email_sub, .phone_sub, .adress_sub{
    margin-bottom: 7px;
    text-transform: uppercase;
}
.hero_right form{
    display:flex;
    flex-direction:column;
    gap:26px;
    max-width: 450px;
}

.form-group{
    display:flex;
    flex-direction:column;
}

.form-group label{
    text-transform:uppercase;
    margin-bottom:5px;
}

.form-group input,
.form-group textarea{
    border:none;
    border-bottom:2px solid #000;
    background:transparent;
    padding:5px 0;
    outline:none;
    font:inherit;
}

.form-group textarea{
    resize:none;
}

.required{
    color:#8B5CF6;
}

.file-upload{
    margin-top:-10px;
}

.file-label{
    display:flex;
    align-items:flex-start;
    gap:12px;
    cursor:pointer;
    text-decoration:none;
    color:inherit;
}

.file-label img{
    width:24px;
}
.form-group input::placeholder,
.form-group textarea::placeholder {
    color: #000;
    opacity: 1; 
}
.btn{
    align-self:flex-start;

    padding:15px 52px;
 font-weight: 450;
    border:none;
    background:#000;
    color:#fff;
    font-family: 'IBM';
    text-transform:uppercase;
    cursor:pointer;
}
.hero{
    align-items: end;
    gap: 20px;
}
.contacts_bottom{
    display: none;
}
.header_title{
    max-width: 540px;
}
@media (max-width: 980px) {
    .contacts{
        gap: 40px;
    }
}
@media (max-width: 860px) {
.contacts{
    display: none;
}
.header_button{
    display: none;
}
.hero {
        flex-direction: column;
        align-items: center;
    }
.header_title{
    max-width: 100%;
}
.left_side {
        display: flex;
        flex-direction: column;
        align-items: center; 
        width: 100%;
        box-sizing: border-box;
    }
    .left_side .header_title {
        align-self: flex-start;
        width: 100%;
        text-align: left;
    }
    .header_border{
        align-self: flex-start;
    }
    .hero_right form .btn {
    align-self: center;
}
.hero_right form{
    margin-top: 30px;
            padding-right: 20px;
}
.contacts_bottom{
    margin-top: 30px;
    display: block;
    margin-bottom: 30px;
}
.arrow_contact{
    display: none;
}
}