/* =============================================================================
   contact.css — Contact page (form + book-a-call aside). Async. Tokens only.
   ============================================================================= */

.pd-contact .pd-lead { max-width: 60ch; }
.pd-contact__body { padding-top: var(--pd-space-8); }

.pd-contact__grid { display: grid; gap: var(--pd-space-8); }
@media (min-width: 64rem) {
  .pd-contact__grid { grid-template-columns: 1.4fr 1fr; align-items: start; }
}

/* Form fields */
.pd-contactform .pd-field { margin-bottom: var(--pd-space-4); }
.pd-contactform label { display: block; margin-bottom: var(--pd-space-2); font-weight: 600; }
.pd-contactform input[type="text"],
.pd-contactform input[type="email"],
.pd-contactform select,
.pd-contactform textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  color: var(--pd-on-dark);
  background: rgba(245,246,250,0.04);
  border: 1px solid var(--pd-border-dark);
  border-radius: var(--pd-radius-sm);
  font: inherit;
}
.pd-contactform textarea { resize: vertical; min-height: 8rem; }
/* Native <select> + its dropdown popup: force the dark scheme so options stay readable
   (the translucent field background otherwise composites to white-on-white in the popup). */
.pd-contactform select { color-scheme: dark; cursor: pointer; }
.pd-contactform select option { color: var(--pd-on-dark); background-color: var(--pd-surface-1); }
.pd-contactform input::placeholder,
.pd-contactform textarea::placeholder { color: var(--pd-grey); }
.pd-contactform input:focus-visible,
.pd-contactform select:focus-visible,
.pd-contactform textarea:focus-visible {
  outline: none;
  border-color: var(--pd-violet);
  box-shadow: var(--pd-focus);
}
.pd-contactform .pd-btn { margin-top: var(--pd-space-2); }
.pd-contactform__note { margin-top: var(--pd-space-3); font-size: var(--pd-text-sm); }

/* Inline notices */
.pd-formnotice { padding: var(--pd-space-3) var(--pd-space-4); border-radius: var(--pd-radius-sm); margin-bottom: var(--pd-space-6); }
.pd-formnotice--error { background: rgba(248,113,113,0.12); color: var(--pd-danger); }

/* Aside cards */
.pd-contact__aside .pd-card { margin-bottom: var(--pd-space-4); }
.pd-contact__aside h2 { font-size: var(--pd-h3); margin-bottom: var(--pd-space-2); }

/* Success state */
.pd-contact__success { max-width: 40rem; margin: 0 auto; text-align: center; }
.pd-contact__check {
  display: inline-grid; place-items: center;
  width: 56px; height: 56px; margin: 0 auto var(--pd-space-4);
  border-radius: var(--pd-radius-pill);
  background: rgba(56,217,169,0.15); color: var(--pd-success);
}
.pd-contact__success h2 { font-size: var(--pd-h3); margin-bottom: var(--pd-space-2); }
.pd-contact__success .pd-btn-row { margin-top: var(--pd-space-6); }