
.contactForm {
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  padding: 50px 0px;

}
.contactLeftTitle {
 color: #2E2E2E;
    font-size: 40px;
    font-weight: 500;
}
.contactLeftDesc {
  color: #737373;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 15px;
}
.contactGrid {
  display: grid;
  grid-template-columns: 6fr 6fr;
  gap: 40px;
}
.contactCardGrid {
  display: grid;
  grid-template-columns: repeat(2, 6fr);
  gap: 20px;
}
.contactCard {
  background-color: #FBF7EB;
  border: 1px solid #F2E6C1;
  border-radius: 10px;
  padding: 10px;
  text-align: center;
}
.contactCard div {
  margin-bottom: 10px;
}
.contactCard > :nth-child(2) {
  color: #2e2e2e;
  font-size: 16px;
  font-weight: 500;
}
.contactCard > :last-child {
  color: #737373;
  font-size: 14px;
  font-weight: 500;
 
}
.contactRight {
  background-color: #ffffff;
  border: 1px solid #dadada;
  border-radius: 10px;
  padding: 30px;
}
.contactRight div {
  margin-bottom: 15px;
}
.contactFormTitle {
  color: #2e2e2e;
  font-size: 20px;
  font-weight: 500;
}
.contactInput label {
  color: #2e2e2e;
  font-size: 14px;
  font-weight: 500;
}
.contactInput input {
  background-color: #FDFDFD;
  border: 1px solid #E4E4E4;
  border-radius: 5px;
  padding: 8px;
  width: 100%;
  font-size: 14px;
  outline: none;
}
.contactInput input::placeholder {
  font-size: 12px;
}
.contactInput textarea {
  background-color: #FDFDFD;
  border: 1px solid #E4E4E4;
  border-radius: 5px;
  padding: 8px;
  width: 100%;
  font-size: 14px;
  resize: none;
  outline: none;
}
.contactInput textarea::placeholder {
  font-size: 12px;
}
.btnSubmit button {
  width: 100%;
  border: none;
  background-color: #D4AF37;
  color: white;
  font-size: 16px;
  font-weight: 500;
  padding: 8px;
  border-radius: 10px;
}

/* faq section  */
.faqContainer {
  font-family: "Outfit", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  padding: 50px 0px;
}
.faqTitle{
    color: #2E2E2E;
    font-size: 40px;
    font-weight: 500;
}
.faqDesc{
    color: #737373;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 20px;
}
.faqCard{
    background-color: white;
    border-radius: 10px;
    padding: 20px;
    border: 1px solid #DADADA;
      margin-bottom: 20px;
}
.faqCard>:first-child{
    color: #585858;
    font-size: 20px;
    font-weight: 500;
}
.faqCard>:last-child{
    color: #737373;
    font-size: 16px;
    font-weight: 400;
}

@media screen and (max-width:992px){
  .contactGrid{
    display: grid;
    grid-template-columns: 12fr;
    gap: 20px;
  }
  .contactForm{
    padding-top: 50px;
    padding-bottom: 0px;
  }
}
@media screen and (max-width:776px){
  .contactLeftTitle {
    font-size: 35px;
  }
  .faqTitle{
    font-size: 35px;
  }
}
@media screen and (max-width:556px){
  .contactLeftTitle {
    font-size: 25px;
  }
  .contactLeftDesc{
    font-size: 14px;
  }
  .faqTitle{
    font-size: 25px;
  }
  .faqDesc {
    font-size: 14px;
  }
  .contactCardGrid{
    display: grid;
    grid-template-columns: 12fr;
  }
  .contactRight {
    padding: 15px;
  }
   .contactFormTitle {
    font-size: 18px;
  }
  .btnSubmit button{
    font-size: 14px;
  }
  .faqCard>:first-child{
    font-size: 18px;
  }
   .faqCard>:last-child {
    font-size: 14px;
  }
 
}
@media screen and (max-width:456px){
  .contactLeftTitle {
    font-size: 20px;
  }
  .faqTitle{
    font-size: 20px;
  }
   .contactCard > :nth-child(2) {
    font-size: 14px;
  }
  .contactCard > :last-child {
    font-size: 12px;
  }
  .contactFormTitle {
    font-size: 16px;
  }
  .contactInput label{
    font-size: 12px;
  }
   .faqCard>:first-child{
    font-size: 16px;
  }
  .faqCard>:last-child {
    font-size: 12px;
  }
}