.contact-sec{
  padding:80px 0;
  background:#f6f9fc;
}

.contact-grid{
  display:grid;
  grid-template-columns:420px 1fr;
  gap:40px;
  align-items:start;
}

/* CONTACT INFO CARD */
.contact-sec .info-card{
  background:linear-gradient(160deg,#005182,#003e66);
  border-radius:20px;
  padding:36px 32px;
  position:sticky;
  top:90px;
}

.contact-sec  .info-card h2{
  font-size:26px;
  color:#fff;
  margin-bottom:8px;
}

.contact-sec  .info-card > p{
  font-size:14px;
  color:rgba(255,255,255,.75);
  margin-bottom:28px;
  line-height:22px;
}

.contact-sec  .info-items{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-bottom:28px;
}

.contact-sec  .info-item{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  border-radius:12px;
  transition:background .3s;
  text-decoration:none;
}

.contact-sec .info-item:hover{
  background:rgba(255,255,255,.1);
}

.contact-sec .ii-ico{
  width:42px;
  height:42px;
  border-radius:10px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
}

.contact-sec .ii-phone .ii-ico{background:rgba(147,197,253,.15);color:#93c5fd;}
.contact-sec .ii-mail .ii-ico{background:rgba(250,163,31,.2);color:#fde68a;}
.contact-sec .ii-wa .ii-ico{background:rgba(37,211,102,.15);color:#4ade80;}
.contact-sec .ii-addr .ii-ico{background:rgba(239,68,68,.15);color:#fca5a5;}

.contact-sec .ii-txt{
    flex:1;
    min-width:0;
    display: flex;
    flex-direction: column;
}

.contact-sec .ii-label{
  font-size:11px;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  margin-bottom:10px;
}

.contact-sec .ii-val{
  font-size:14px;
  font-weight:700;
  color:#fff;
  line-height:1.4;
}

.contact-sec .info-divider{
  height:1px;
  background:rgba(255,255,255,.1);
  margin:20px 0;
}

.contact-sec .info-hours{
  padding:16px;
  background:rgba(255,255,255,.07);
  border-radius:10px;
  margin-bottom:20px;
}

.contact-sec .ih-title{
  font-size:12px;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  color:rgba(255,255,255,.55);
  margin-bottom:8px;
  display:flex;
  align-items:center;
  gap:6px;
}

.contact-sec .ih-title i{color:#faa31f;}

.contact-sec .ih-row{
  display:flex;
  justify-content:space-between;
  font-size:13px;
  color:rgba(255,255,255,.8);
  padding:3px 0;
}

.contact-sec .ih-row span:last-child{
  color:#fff;
  font-weight:700;
}

.contact-sec .social-row{
  display:flex;
  gap:10px;
}

.contact-sec .soc-btn{
  width:38px;
  height:38px;
  border-radius:10px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:17px;
  transition:all .3s;
}

.contact-sec .soc-btn:hover{
  background:#faa31f;
  border-color:#faa31f;
}

/* FORM CARD */
.contact-sec .form-card{
  background:#fff;
  border-radius:20px;
  padding:40px 36px;
  box-shadow:rgba(149,157,165,.2) 0 8px 24px;
}

.contact-sec .form-card h2{
  font-size:28px;
  margin-bottom:6px;
  color:#1D1729;
  margin-top:0;
}

.contact-sec .form-card > p{
  font-size:15px;
  color:#666;
  margin-bottom:30px;
  line-height:22px;
      font-family: 'DM Sans' !important;
}

.contact-sec .form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-bottom: 10px;
}

.contact-sec .form-row.single{
  grid-template-columns:1fr;
}

.contact-sec .form-card .form-one.contact-form-validated .form-group{
  position:relative;
}

.contact-sec .form-card .form-one.contact-form-validated .form-group label{
  display:block;
  font-size:12px;
  font-weight:700;
  color:#666;
  letter-spacing:.5px;
  text-transform:uppercase;
  margin-bottom:7px;
  margin-top: 0;
}

.contact-sec .form-card .form-one.contact-form-validated .form-group label.error{
    font-size: 12px !important;
    color:red !important;
        font-weight: 400 !important;
}

.contact-sec .form-group label span{color:#faa31f;}

.contact-sec .form-card .form-one.contact-form-validated .form-input {
    width: 100% !important;
    padding: 13px 16px 13px 40px !important;
    border: 2px solid #e0eaf2 !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-family: 'DM Sans', sans-serif !important;
    color: #1D1729 !important;
    background: #fff !important;
    transition: all .3s !important;
    outline: none !important;
    height: 50px !important;
}

.contact-sec .form-card .form-one.contact-form-validated .form-input:focus{
  border-color:#005182 !important;
  box-shadow:0 0 0 3px rgba(0,81,130,.1) !important;
}

.contact-sec  .form-card .form-one.contact-form-validated .form-input::placeholder{color:#aaa;}

.contact-sec .fi-icon{
    position: absolute;
    left: 14px;
    top: 10px;
    color: #bbb;
    font-size: 17px;
    pointer-events: none;
    transition: color .3s;
    padding-top: 27px;
}

.contact-sec .fi-icon{
    
}

.contact-sec .form-group:focus-within .fi-icon{color:#005182;}

.contact-sec textarea.form-input{
  padding-top:13px;
  resize:vertical;
  min-height:130px;
}

.contact-sec .textarea-icon {
    bottom: auto;
    top: 10px;
}

.contact-sec select.form-input{
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23aaa' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
}

.contact-sec .form-privacy{
  font-size:13px;
  color:#888;
  margin-bottom:22px;
  line-height:20px;
}

.contact-sec .form-privacy a{
  color:#005182;
  font-weight:600;
}

.contact-sec .form-privacy a:hover{color:#faa31f;}

.contact-sec .btn-submit{
  width:100%;
  padding:15px 28px;
  background:#005182;
  color:#fff;
  border:none;
  border-radius:10px;
  font-size:16px;
  font-weight:700;
  font-family:'DM Sans',sans-serif;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  transition:all .3s;
}

.contact-sec .btn-submit:hover{
  background:#003e66;
  transform:translateY(-2px);
  box-shadow:0 8px 25px rgba(0,81,130,.3);
}

.contact-sec .btn-submit:disabled{
  opacity:.6;
  cursor:not-allowed;
  transform:none;
}

.contact-sec .form-success{
  display:none;
  background:#f0fdf4;
  border:2px solid #86efac;
  border-radius:12px;
  padding:20px 24px;
  text-align:center;
  margin-top:16px;
}

.contact-sec .form-success i{
  font-size:28px;
  color:#16a34a;
  margin-bottom:8px;
  display:block;
}

.contact-sec .form-success h3{
  font-size:17px;
  color:#15803d;
  margin-bottom:4px;
}

.contact-sec .form-success p{
  font-size:14px;
  color:#166534;
  margin:0;
}


@media(min-width:220px) and (max-width:1024px){
    .contact-sec{
        padding: 60px 0;
    }
    
    .contact-sec .contact-grid{
        grid-template-columns: 1fr;
    }
    
    .contact-sec .info-card{
        position: relative;
        top: unset;
    }
}

@media(min-width:220px) and (max-width:767px) {
 .contact-sec .form-card{
        padding:26px 22px;
    }
    
    .contact-sec  #contact-form{
        padding: 0 !important;
    }
    
    .contact-sec .form-row{
        grid-template-columns: 1fr;
        gap: 5px;
    }

    
    .contact-sec ,.qa-sec{
        padding: 40px 0;
    }
    
    .contact-sec .form-card h2{
        font-size:24px;
    }
    
}