/* ==========================
Contact Form
Mobile First
========================== */

.contact-form{
  width:100%;
}

.form-group{
  margin-bottom:24px;
}

.form-group label{
  display:block;
  margin-bottom:5px;
  text-align: left;
  font-size:1rem;
  font-weight:600;
  line-height:1.6;
}

.form-group input,
.form-group textarea{
  width:100%;
  padding:14px 16px;
  border:1px solid #ddd;
  border-radius:4px;
  background:#fff;
  font-size:16px;
  line-height:1.6;
  font-family:inherit;
  appearance:none;
}

.form-group textarea{
  min-height:160px;
  resize:vertical;
}

.form-group input::placeholder,
.form-group textarea::placeholder{
  color:#b8b8b8;
  opacity:1;
}

.form-group input:focus,
.form-group textarea:focus{
  outline:none;
  border-color:#000;
}

/* checkbox */
.form-check{
  margin:0 0 32px 0;
  display: inline-block;
}

.form-check label{
  display:flex;
  align-items:flex-start;
  gap:10px;
  cursor:pointer;
  font-size:14px;
  line-height:1.6;
}

.form-check input[type="checkbox"]{
  width:20px;
  height:20px;
  flex-shrink:0;
  margin-top:2px;
}

/* submit button */
.submit-btn{
  width:100%;
  padding:18px;
  border:1px #000 solid;
  background:#fff;
  color:#000;
  font-size:16px;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  transition:.3s;
}

.submit-btn:hover{
  border:1px #fff solid;
  background:#000;
  color: #fff;
}


/* ==========================
Tablet / PC
========================== */

@media screen and (min-width:768px){

  .contact-form{
    max-width:800px;
    margin:0 auto;
  }

  .form-group{
    margin-bottom:32px;
  }

  .form-group label{
    font-size:15px;
  }

  .form-group input,
  .form-group textarea{
    padding:10px 20px;
  }

  .form-group textarea{
    min-height:200px;
  }

  .submit-btn{
    max-width:320px;
    margin:0 auto;
    display:block;
  }

}


@media screen and (orientation: landscape) and (max-width: 932px) {
.form-group label{
  font-size: 14px;
}
}