/* =====================================================================
   Contact form
   File: 12-contact.css
   ===================================================================== */

/* contact form */
.contact-wrap{display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; margin-top:50px;}
.contact-info-item{display:flex; gap:16px; align-items:flex-start; padding:20px 0; border-top:1px solid var(--line);}
.contact-info-item:last-child{border-bottom:1px solid var(--line);}
.ci-ic{width:38px; height:38px; border-radius:10px; background:var(--card); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.ci-label{font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--muted2); margin-bottom:4px;}
.ci-val{font-size:15px; font-weight:500;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.field{position:relative; margin-bottom:18px;}
.field label{display:block; font-size:11.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted2); margin-bottom:9px;}
.field input, .field select, .field textarea{
  width:100%; background:rgba(255,255,255,.02); border:1px solid var(--line); border-radius:11px; padding:15px 16px;
  color:var(--text); font-family:inherit; font-size:14.5px; outline:none; transition:border-color .3s ease, background .3s ease;
}
.field select option{background:var(--bg); color:var(--text);}
.field textarea{resize:vertical; min-height:120px;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--orange); background:rgba(252,110,32,.04);}
.form-note{font-size:12px; color:var(--muted2); margin-top:6px;}
.form-success{display:none; align-items:center; gap:10px; background:rgba(80,220,140,.08); border:1px solid rgba(80,220,140,.3); color:#7fe3ac; padding:14px 18px; border-radius:12px; font-size:13.5px; margin-top:14px;}
.form-success.show{display:flex;}
@media(max-width:900px){.contact-wrap{grid-template-columns:1fr;} .field-row{grid-template-columns:1fr;}}