.site-directory ul {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.company-note a {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.contact-intro {
  color: #c9c7c2;
  line-height: 2;
  margin: 28px 0 40px;
}
.contact-card {
  border-top: 1px solid #e3c79a66;
  border-bottom: 1px solid #ffffff24;
  padding: 28px 0;
  max-width: 680px;
}
.contact-kicker {
  font:
    11px/1.4 ui-monospace,
    monospace;
  letter-spacing: 0.2em;
  color: var(--mint);
}
.contact-status {
  font-family: var(--serif);
  font-size: clamp(19px, 2.2vw, 27px);
  line-height: 1.6;
  margin: 18px 0;
}
@media (max-width: 650px) {
  header {
    height: auto;
    min-height: 63px;
    flex-wrap: wrap;
    padding-top: 18px;
    padding-bottom: 16px;
  }
  header nav {
    flex-wrap: wrap;
    row-gap: 10px;
  }
  .site-directory ul {
    grid-template-columns: 1fr;
  }
}

.contact-email {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  color: var(--mint);
  font-size: clamp(18px, 2.4vw, 28px);
  overflow-wrap: anywhere;
  border-bottom: 1px solid #e3c79a66;
  padding-bottom: 6px;
}
.contact-email:hover {
  color: var(--white);
}
.contact-form {
  display: grid;
  gap: 12px;
}
.contact-form label {
  margin-top: 14px;
  font-size: 14px;
}
.contact-form label span {
  margin-left: 8px;
  color: var(--mint);
  font-size: 11px;
}
.contact-form input,
.contact-form textarea {
  width: 100%;
  background: #0a0c11;
  border: 1px solid #ffffff45;
  border-radius: 4px;
  padding: 14px;
  color: var(--white);
  font: inherit;
}
.contact-form textarea {
  resize: vertical;
  line-height: 1.8;
}
.contact-form input:focus,
.contact-form textarea:focus {
  outline: 2px solid var(--mint);
  outline-offset: 2px;
}
.contact-submit {
  justify-self: start;
  margin-top: 12px;
  border: 1px solid #e3c79a75;
  border-radius: 4px;
  background: #10131b;
  color: var(--white);
  padding: 14px 22px;
  font: inherit;
  cursor: pointer;
}
.contact-submit:hover {
  background: var(--mint);
  color: var(--ink);
}
.contact-submit:disabled {
  opacity: 0.6;
  cursor: wait;
}
.contact-submit span {
  margin-left: 28px;
}
.contact-trap {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.principles li {
  grid-template-columns: 1fr;
}

/* A continuous dark surface across the corporate pages. */
.site-directory,
.vision.editorial,
.approach,
.company.editorial {
  background: var(--ink);
  color: var(--white);
}
.site-directory .label,
.vision.editorial .label,
.vision.editorial .vision-copy > .eyebrow,
.approach .label,
.approach .eyebrow {
  color: var(--mint);
}
.site-directory h2 {
  color: var(--white);
}
.site-directory a {
  border-color: #ffffff2b;
}
.site-directory a:hover {
  color: var(--mint);
}
.site-directory a:focus-visible {
  outline-color: var(--mint);
}
.directory-arrow {
  border-color: #ffffff45;
}
.site-directory a:hover .directory-arrow {
  background: var(--mint);
  color: var(--ink);
}
.vision.editorial .vision-copy > p:not(.eyebrow),
.principles p {
  color: #bdbfbe;
}
.vision.editorial .orbit {
  border-color: #e3c79a24;
  box-shadow:
    0 0 0 28px #e3c79a08,
    0 0 0 70px #e3c79a06,
    0 0 0 120px #e3c79a04;
}
.approach {
  border-top-color: #ffffff20;
}
.principles,
.principles li {
  border-color: #ffffff29;
}
