/* ===== Contact page ===== */

.contact-section{ padding:72px 0 100px; }
.contact-grid{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:48px;
  position:relative; z-index:1;
}
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }

.contact-intro h1{
  font-size:clamp(2.4rem,6vw,3.4rem);
  text-transform:uppercase;
  margin-bottom:18px;
}
.contact-intro p{ color:var(--grey); font-size:1.05rem; max-width:40ch; }
.contact-email{
  display:inline-block;
  color:var(--cyan);
  font-weight:600;
  margin-top:8px;
}

.contact-form{ padding:30px; }
.hp-field{ position:absolute; left:-9999px; }

.toggle-row{ display:flex; gap:0; margin-bottom:26px; border-radius:6px; overflow:hidden; border:1px solid var(--navy-600); }
.toggle-btn{
  flex:1;
  padding:13px;
  background:transparent;
  color:var(--grey);
  border:none;
  font-family:var(--font-label);
  font-weight:600;
  text-transform:uppercase;
  font-size:.82rem;
  letter-spacing:.04em;
  cursor:pointer;
}
.toggle-btn.active{ background:var(--cyan); color:var(--navy-950); }

.field{ display:block; margin-bottom:18px; }
.field span{
  display:block;
  font-family:var(--font-label);
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--grey-dim);
  margin-bottom:6px;
}
.field input, .field textarea{
  width:100%;
  background:var(--navy-900);
  border:1px solid var(--navy-600);
  border-radius:6px;
  padding:12px 14px;
  color:var(--white);
  font-family:var(--font-body);
  font-size:.95rem;
  resize:vertical;
}
.field input:focus, .field textarea:focus{
  outline:none;
  border-color:var(--cyan);
}
