/* ============================================================
   forms.css — Contact / brief / multi-step project form
   ============================================================ */
.contact-grid{display:grid;grid-template-columns:0.9fr 1.1fr;gap:56px;align-items:start;}
.contact-info h2{font-size:clamp(28px,3.6vw,38px);margin-bottom:18px;}
.contact-info p{color:var(--text-muted);font-size:15px;max-width:36ch;margin-bottom:30px;}
.contact-list{list-style:none;border-top:1px solid var(--line);}
.contact-list li{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);font-size:15px;}
.contact-list li span:first-child{font-family:var(--font-mono);font-size:11px;color:var(--text-faint);text-transform:uppercase;letter-spacing:0.05em;}
.contact-list li a{font-weight:600;}
.contact-list li a:hover{color:var(--wine);}

.brief{background:var(--white);border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow-card);overflow:hidden;}
.brief-top{background:var(--wine);color:var(--white);padding:26px 34px;display:flex;justify-content:space-between;align-items:center;}
.brief-top h3{font-size:19px;}
.brief-top .chev{color:var(--mauve);}
.brief-form{padding:32px 34px 36px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.form-field{display:flex;flex-direction:column;gap:6px;}
.form-field.full{grid-column:1/-1;}
.form-field label{font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-faint);}
.form-field label .req{color:var(--wine);}
.form-field input,.form-field select,.form-field textarea{
  font-family:var(--font-body);font-size:14.5px;padding:11px 12px;
  border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--paper);color:var(--ink);width:100%;
}
.form-field textarea{resize:vertical;min-height:80px;}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:2px solid var(--wine);outline-offset:1px;}
.form-field input.invalid,.form-field select.invalid{border-color:var(--error);background:var(--error-bg);}
.form-error{font-size:12.5px;color:var(--error);margin-bottom:12px;display:none;}
.form-error.show{display:block;}

.service-pick{display:flex;flex-wrap:wrap;gap:8px;}
.service-chip{
  font-family:var(--font-mono);font-size:11.5px;border:1px solid var(--line);padding:7px 12px;
  border-radius:20px;cursor:pointer;background:var(--paper);transition:background .15s ease, border-color .15s ease;
}
.service-chip input{display:none;}
.service-chip.checked{background:var(--mauve-soft);border-color:var(--mauve);}

.brief-submit{width:100%;margin-top:6px;}
.brief-note{font-size:12px;color:var(--text-faint);text-align:center;margin-top:14px;}

/* multi-step form (Start a Project) */
.step-form{background:var(--white);border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow-card);padding:36px;max-width:640px;margin:0 auto;}
.step-progress{display:flex;gap:6px;margin-bottom:28px;}
.step-progress span{flex:1;height:3px;background:var(--line);border-radius:2px;}
.step-progress span.done{background:var(--wine);}
.step-panel[hidden]{display:none;}
.step-nav{display:flex;justify-content:space-between;margin-top:24px;gap:12px;}
.step-back{background:none;border:1px solid var(--line);border-radius:var(--radius-sm);padding:13px 22px;font-weight:600;cursor:pointer;}

@media (max-width:900px){.contact-grid{grid-template-columns:1fr;}}
@media (max-width:560px){.form-row{grid-template-columns:1fr;}.brief-top,.brief-form{padding-left:22px;padding-right:22px;}}