.contact-hero{
  padding:72px 0 20px;
}
.contact-hero h1{ font-size:clamp(36px,5vw,54px); margin-bottom:16px; max-width:16ch; }

.contact-section{
  padding:40px 0 130px;
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:56px;
  align-items:start;
}

.contact-cards{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.contact-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:26px;
  display:flex;
  gap:16px;
  align-items:flex-start;
}
.contact-card .icon-badge{ background:var(--tint); color:var(--blue); flex:none; }
.contact-card h3{ font-size:16px; margin-bottom:6px; letter-spacing:-0.01em; }
.contact-card p, .contact-card a{ font-size:14.5px; color:var(--ink-soft); line-height:1.55; }
.contact-card a:hover{ color:var(--blue); }

.contact-form{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:44px;
  box-shadow:var(--shadow-2);
}
.contact-form h2{ font-size:24px; margin-bottom:8px; }
.contact-form > p{ font-size:14.5px; color:var(--ink-soft); margin-bottom:30px; }

.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field{ margin-bottom:20px; }
.field label{
  display:block;
  font-size:13.5px;
  font-weight:650;
  color:var(--ink);
  margin-bottom:8px;
}
.field input, .field select, .field textarea{
  width:100%;
  font-family:inherit;
  font-size:15px;
  color:var(--ink);
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:13px;
  padding:13px 14px;
  transition:border-color .2s ease, background .2s ease;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;
  border-color:var(--blue);
  background:#fff;
}
.field textarea{ resize:vertical; min-height:120px; }

.form-note{
  margin-top:16px;
  font-size:13.5px;
  color:var(--teal);
  font-weight:600;
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .3s ease, transform .3s ease;
  display:flex;
  align-items:center;
  gap:8px;
}
.form-note.show{ opacity:1; transform:translateY(0); }

.contact-form button[type="submit"]{ width:100%; margin-top:6px; }

@media (max-width:860px){
  .contact-section{ grid-template-columns:1fr; }
  .form-row{ grid-template-columns:1fr; }
  .contact-form{ padding:30px 24px; }
}