/* Hero: template-parts/page-hero.php + services.css */

/* ── Info cards ───────────────────────────────────────────────────── */
.contact-info-card {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}

.contact-info-card h5 {
  font-size: 1.1rem;
  border-bottom: 2px solid var(--primary-light);
  padding-bottom: .75rem;
}

/* ── Form card ────────────────────────────────────────────────────── */
.contact-form-card {
  background: #fff;
  border-radius: 2rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}

/* ── Inputs ───────────────────────────────────────────────────────── */
.contact-input {
  width: 100%;
  border: .5px solid #cdcdcd;
  border-radius: 4px;
  background: #fcfdff;
  padding: .65rem .9rem;
  font-family: inherit;
  font-size: .95rem;
  color: #1c1c1c;
  appearance: none;
  -webkit-appearance: none;
  outline: none;
  transition: border-color .2s;
}

.contact-input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(8,144,178,.12);
}

.contact-input::placeholder {
  color: #858585;
}

.contact-select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23858585' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 1rem center;
  padding-left: 2.5rem;
}

.contact-textarea {
  min-height: 120px;
  resize: vertical;
}

/* ── Submit button ────────────────────────────────────────────────── */
.btn-primary-c {
  background: linear-gradient(90deg, var(--primary-light) 0%, var(--primary-dark) 100%);
  color: #fff;
  border: none;
  border-radius: 4px 16px 4px 16px;
  font-size: 1.05rem;
  transition: opacity .2s;
}

.btn-primary-c:hover {
  opacity: .9;
  color: #fff;
}