/* ==========================================================================
   Peak Hire Services — Contact
   The shortest page on the site and deliberately the plainest: after four
   information-dense pages this should read as a release. One asymmetric grid,
   one form, no map, no grid, no timeline, no register.
   ========================================================================== */

/* --- Hero: compact. No CTA — the form is immediately below. -------------- */
.contact-hero{
  background:var(--midnight); color:var(--fg-dark); position:relative; overflow:hidden;
  padding-block:calc(var(--header-h) + clamp(44px,5.5vw,84px)) clamp(44px,5vw,72px);
}
.contact-hero__inner{ position:relative; z-index:1; max-width:820px; }
.contact-hero__title{ color:#F3F5F8; margin-top:var(--s5); max-width:17ch; }
.contact-hero__lead{ margin-top:var(--s5); max-width:58ch; color:#9FADBB; font-size:var(--t-lead); line-height:1.62; }

/* --- Asymmetric 8/4: form left, dark contact rail right ------------------ */
.contact__grid{
  display:grid; grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);
  gap:clamp(32px,4.5vw,72px); align-items:start;
}
@media (max-width:980px){ .contact__grid{ grid-template-columns:minmax(0,1fr); gap:var(--s8); } }

/* --- Form --------------------------------------------------------------- */
.form__fieldset{ border:0; padding:0; margin:0; }
.form__fieldset + .form__fieldset{ margin-top:var(--s8); }
.form__legend{
  padding:0; margin-bottom:var(--s5); width:100%;
  font-size:11.5px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-ink); border-bottom:1px solid var(--rule); padding-bottom:var(--s3);
}
.form__row{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--s5) var(--s6); }
.form__row + .form__row{ margin-top:var(--s5); }
@media (max-width:640px){ .form__row{ grid-template-columns:minmax(0,1fr); } }
.form__field--full{ grid-column:1 / -1; }

.field__label{
  display:block; font-size:13px; font-weight:600; letter-spacing:.01em;
  color:var(--fg); margin-bottom:9px;
}
.field__optional{ font-weight:400; color:var(--fg-soft); letter-spacing:0; }

.field__input,.field__select,.field__textarea{
  width:100%; font-family:var(--sans); font-size:16px; line-height:1.5; color:var(--fg);
  background:var(--ivory); border:0; border-bottom:1px solid var(--mist);
  border-radius:2px 2px 0 0; padding:14px var(--s4);
  transition:background var(--dur-micro) var(--ease), border-color var(--dur-micro) var(--ease);
  appearance:none;
}
.field__textarea{ min-height:118px; resize:vertical; }
.field__input::placeholder,.field__textarea::placeholder{ color:var(--fg-soft); opacity:1; }
.field__input:hover,.field__select:hover,.field__textarea:hover{ border-bottom-color:var(--slate); }
.field__input:focus,.field__select:focus,.field__textarea:focus{
  background:var(--white); border-bottom:2px solid var(--blue);
  padding-bottom:13px; outline:2px solid var(--blue); outline-offset:2px;
}
.field__select{
  background-image:linear-gradient(45deg,transparent 50%,var(--slate) 50%),
                   linear-gradient(135deg,var(--slate) 50%,transparent 50%);
  background-position:calc(100% - 19px) 21px, calc(100% - 13px) 21px;
  background-size:6px 6px, 6px 6px; background-repeat:no-repeat;
  padding-right:var(--s8); cursor:pointer;
}
.field__select:focus{ background-color:var(--white); }

.field__error{
  display:none; margin-top:8px; font-size:13.5px; line-height:1.45; color:var(--err);
}
.field.is-invalid .field__error{ display:block; }
.field.is-invalid .field__input,
.field.is-invalid .field__select,
.field.is-invalid .field__textarea{ border-bottom:2px solid var(--err); padding-bottom:13px; }

.form__actions{
  margin-top:var(--s7); display:flex; flex-wrap:wrap; gap:var(--s5); align-items:center;
}
.form__privacy{
  margin-top:var(--s5); font-size:13.5px; line-height:1.6; color:var(--fg-soft); max-width:56ch;
}
.form__privacy a{ color:var(--blue); text-underline-offset:3px; text-decoration:underline; }

/* Error summary — announced and focusable */
.form__summary{
  display:none; margin-bottom:var(--s6); padding:var(--s5);
  border:1px solid var(--err); border-left-width:2px; border-radius:var(--radius);
  background:#FDF6F4;
}
.form__summary.is-shown{ display:block; }
.form__summary-title{ font-size:15px; font-weight:650; color:var(--err); }
.form__summary ul{ margin-top:var(--s3); display:flex; flex-direction:column; gap:7px; }
.form__summary a{ font-size:14.5px; color:var(--err); text-decoration:underline; text-underline-offset:3px; }

/* Developer status region — used only until an endpoint is configured */
.form__status{
  display:none; margin-top:var(--s5); padding:var(--s4) var(--s5);
  border:1px dashed var(--rule-strong,var(--mist)); border-radius:var(--radius);
  font-size:14px; line-height:1.55; color:var(--fg-body); background:var(--ivory);
}
.form__status.is-shown{ display:block; }
.form__status code{ font-size:13px; color:var(--fg); }

/* Success panel — only rendered on a genuine 2xx, or the documented preview */
.form__success{ display:none; }
.form__success.is-shown{ display:block; }
.form__success h2{
  font-family:var(--serif); font-weight:400; font-size:clamp(28px,1.4rem + 1.5vw,40px);
  line-height:1.12; letter-spacing:-.022em; color:var(--fg);
}
.form__success p{ margin-top:var(--s4); font-size:var(--t-lead); color:var(--fg-body); max-width:48ch; line-height:1.62; }
.form__success .rule{ width:48px; height:1px; background:var(--gold); margin-bottom:var(--s5); }

/* --- Dark contact rail --------------------------------------------------- */
.rail{
  background:var(--midnight); color:var(--fg-dark);
  border-radius:var(--radius); padding:clamp(24px,2.6vw,36px);
  position:sticky; top:calc(var(--header-h-sm) + 24px);
}
@media (max-width:980px){ .rail{ position:static; } }
.rail__name{ font-family:var(--serif); font-weight:400; font-size:22px; letter-spacing:-.015em; color:var(--fg-dark); }
.rail__lines{ margin-top:var(--s4); display:flex; flex-direction:column; gap:10px; }
.rail__lines a,.rail__lines span{ font-size:15px; color:var(--fg-dark-soft); line-height:1.5; }
.rail__lines a{
  text-underline-offset:3px; display:inline-block; padding-block:3px;
  /* standalone links, so they meet the 24px minimum target size */
}
.rail__lines a:hover{ color:var(--gold-light); text-decoration:underline; }
.rail__direct{
  margin-top:var(--s6); padding-top:var(--s5); border-top:1px solid var(--rule-dark);
  font-size:14.5px; color:var(--fg-dark-soft); line-height:1.6;
}
.rail__direct a{ color:var(--gold-light); text-decoration:underline; text-underline-offset:3px; }

/* --- Reassurance: three typographic statements, no icons ---------------- */
.assurance{ margin-top:var(--s7); display:flex; flex-direction:column; gap:var(--s5); }
.assurance__item{ padding-top:var(--s4); border-top:1px solid var(--rule); }
.assurance__item h3{ font-size:14.5px; font-weight:650; color:var(--fg); letter-spacing:-.004em; }
.assurance__item p{ margin-top:7px; font-size:14px; color:var(--fg-body); line-height:1.55; }

/* --- Candidate: secondary by design ------------------------------------- */
.candidate__inner{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,auto);
  gap:var(--s5) clamp(32px,5vw,72px); align-items:center;
}
@media (max-width:760px){ .candidate__inner{ grid-template-columns:minmax(0,1fr); align-items:start; } }
.candidate__copy{ max-width:56ch; }
.candidate__copy h2{ font-size:clamp(21px,1.1rem + .85vw,27px); font-family:var(--serif); font-weight:400;
  line-height:1.16; letter-spacing:-.018em; color:var(--fg); }
.candidate__copy p{ margin-top:var(--s3); font-size:15.5px; color:var(--fg-body); line-height:1.6; }
.candidate__note{ margin-top:var(--s3); font-size:13.5px; color:var(--fg-soft); }

/* --- Closing location strip --------------------------------------------- */
.locstrip__inner{ display:grid; grid-template-columns:minmax(0,auto) minmax(0,1fr);
  gap:var(--s5) clamp(32px,5vw,64px); align-items:baseline; }
@media (max-width:760px){ .locstrip__inner{ grid-template-columns:minmax(0,1fr); } }
.locstrip__title{ font-family:var(--serif); font-weight:400; font-size:clamp(23px,1.1rem + 1.1vw,32px);
  line-height:1.12; letter-spacing:-.02em; color:var(--fg-dark); max-width:19ch; text-wrap:balance; }
.locstrip__copy{ font-size:15.5px; color:var(--fg-dark-soft); line-height:1.62; max-width:60ch; }