/* ---- contact.css ---- */
/*
  Contact form styles, shared by the homepage form and /contact (brief 6.9).
*/

.contact-details {
  font-style: normal;
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-m);
}

.contact-form[hidden] {
  display: none;
}

.honeypot {
  position: absolute;
  inline-size: var(--visually-hidden-size);
  block-size: var(--visually-hidden-size);
  overflow: hidden;
  clip-path: inset(50%);
}

.field-hint {
  font-size: var(--step--1);
  margin-block-start: calc(var(--space-3xs) * -1);
}

.form-more {
  max-inline-size: var(--form-max);
  border-block: var(--rule-hair) solid var(--rule-light);
}

.form-more summary {
  min-block-size: var(--target-min);
  padding-block: var(--space-xs);
  font-family: var(--font-structural);
  font-weight: var(--weight-bold);
  cursor: pointer;
}

.form-more-fields {
  padding-block-end: var(--space-m);
}

.form-privacy {
  font-size: var(--step--1);
}

.form-status:empty {
  display: none;
}

/* The in-place success state replaces the form. */
.form-success {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  padding-block-start: var(--space-s);
  border-block-start: var(--rule-strong) solid var(--state-ok);
}

.form-success [hidden],
.form-success[hidden] {
  display: none;
}

@media (width >= 48rem) {
  .contact-details {
    grid-column: 1 / 4;
  }

  .contact-form-wrap {
    grid-column: 4 / -1;
  }
}

@media (width >= 64rem) {
  .contact-form-wrap {
    grid-column: 4 / 10;
  }
}

/* ---- pages.css ---- */
/*
  Services page extras (immersive redesign): the sectors list and the
  contact page's details. Everything else on the inner pages is built from
  the shared blocks (blocks.css).
*/

/* ---- Services: sectors, a ruled two-column list (no labels) ---- */

.sector-list {
  display: grid;
  gap: 0 var(--gutter);
  margin-block-start: var(--space-l);
}

.sector {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  padding-block: var(--space-m);
  border-block-start: var(--rule-hair) solid var(--rule-light);
}

/* Cited evidence under a sector: record style, set off by a light rule. */
.sector-evidence {
  display: flex;
  flex-direction: column;
  gap: var(--space-xs);
  margin-block-start: var(--space-xs);
  padding-block-start: var(--space-s);
  border-block-start: var(--rule-hair) solid var(--rule-light);
}

@media (width >= 64rem) {
  .sector-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ---- Contact page ---- */

.contact-page-details {
  display: grid;
  gap: var(--space-2xs);
  align-content: start;
}

.contact-page-details dt {
  color: var(--text-muted);
}

.contact-page-details dd + dt {
  margin-block-start: var(--space-s);
}

@media (width >= 48rem) {
  .contact-page-details {
    grid-column: 1 / 4;
  }
}
