.title{ margin:0 0 8px; font-size: clamp(28px, 5vw, 42px); }
.lede{ margin:0; color:var(--muted); max-width:72ch }

.form-grid{
  display:grid; gap:16px;
  grid-template-columns: 1fr 1fr;
}
@media (max-width: 820px){
  .form-grid{ grid-template-columns: 1fr; }
}
.row-2{ grid-column: 1 / -1; }

.field{ position:relative; }
.input, .textarea{
  width:100%;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.04);
  color:var(--text);
  padding:18px 16px 14px;
  outline:none;
  transition: border .2s, box-shadow .2s, background .2s;
}
.textarea{ min-height:160px; resize: vertical; }
.input:focus, .textarea:focus{
  border-color: color-mix(in oklab, var(--primary) 70%, white 30%);
  box-shadow: 0 0 0 4px color-mix(in oklab, var(--primary) 30%, transparent);
  background: rgba(255,255,255,.06);
}

.label{
  position:absolute; left:14px; top:14px; color:var(--muted);
  padding:0 6px; background:transparent; pointer-events:none;
  transform-origin:left top; transition:all .18s ease;
}
.input::placeholder, .textarea::placeholder{ color:transparent; }
.input:focus + .label, .textarea:focus + .label,
.input:not(:placeholder-shown) + .label, .textarea:not(:placeholder-shown) + .label{
  transform: translateY(-12px) scale(.85);
  background: var(--bg-1); color: var(--primary);
}

.btn.primary{
  background: linear-gradient(135deg, var(--primary), var(--accent));
  color:#fff; border: none;
  box-shadow: 0 10px 24px rgba(63, 99, 241, .35);
  padding:12px 16px; border-radius:12px;
}
.btn.primary[disabled]{ opacity:.6; cursor:not-allowed; }
.btn .spinner{
  width:16px; height:16px; border:2px solid rgba(255,255,255,.6);
  border-top-color:white; border-radius:50%;
  display:inline-block; vertical-align:middle; margin-right:8px;
  animation:spin 1s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg);} }

.status{
  margin-top:8px; padding:12px 14px; border-radius:12px; display:none;
  border:1px solid var(--line); background: rgba(255,255,255,.04);
}
.status.show{ display:block; }
.status.success{
  border-color: color-mix(in oklab, #28d17c 40%, var(--line));
  color: #28d17c;
}
.status.error{
  border-color: color-mix(in oklab, #ff6b6b 40%, var(--line));
  color: #ff6b6b;
}

.foot{ margin-top:10px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.chip{
  border:1px solid var(--line); padding:6px 10px; border-radius:999px;
  background: rgba(255,255,255,.04); color:var(--muted); font-weight:600; font-size:12px;
}

.honeypot{ position:absolute; left:-9999px; width:1px; height:1px; }