/* Shared inner-page layouts. All outer sections use the site's full-width gutter. */
.page-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-block: var(--section-space);
  background: var(--wash);
  text-align: center;
}
.page-hero .page-label { margin: 0 0 12px; }
.page-hero h1 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 1240px;
  min-height: 1.22em;
  margin: 0;
  font-size: clamp(32px, 3.4vw, 50px);
  line-height: 1.22;
  text-wrap: balance;
}
.page-hero .page-lead {
  width: 100%;
  max-width: var(--reading);
  margin: 0;
  font-size: 17px;
  line-height: 1.65;
  text-wrap: pretty;
}
.page-hero .page-lead::before {
  content: "";
  display: block;
  width: 64px;
  margin: 18px auto;
  border-top: 2px solid var(--line);
}
.service-nav,
.service-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  gap: 4px 24px;
  padding-block: 12px;
  border-bottom: 1px solid var(--line);
}
.service-nav a,
.service-tabs a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding-block: 8px;
  font-size: 14px;
  line-height: 1.45;
  text-align: center;
}
.service-nav a[aria-current="page"],
.service-tabs a[aria-current="page"] {
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-thickness: 2px;
}
.service-nav a:hover,
.service-tabs a:hover { text-decoration: underline; text-underline-offset: 6px; }

.role-note,
.process,
.about-statement,
.audiences,
.company-facts,
.contact-layout,
.service-opening,
.scope-section,
.deliverables,
.technical-section,
.responsibility,
.supporting-scope,
.begin-section,
.related,
.not-found { padding-block: var(--section-space); }

.role-note { background: var(--wash); text-align: center; }
.role-note > div,
.role-note .role-copy { max-width: var(--reading); margin-inline: auto; }
.role-note h2 { margin-bottom: 20px; text-wrap: balance; }
.role-note p:not(.eyebrow) { text-align: left; }
.role-note .text-link { margin-top: 20px; }

.process {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px clamp(28px, 4vw, 64px);
}
.process article { min-width: 0; border-top: 1px solid var(--line); padding-top: 22px; }
.process h2 { font-size: clamp(21px, 1.7vw, 25px); line-height: 1.4; margin-bottom: 12px; }
.process p { max-width: var(--reading); }

.about-statement {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 64px);
  align-items: center;
}
.about-statement h2 { margin-bottom: 20px; text-wrap: balance; }
.about-statement > div { min-width: 0; max-width: var(--reading); }
.about-statement figure { min-width: 0; height: clamp(300px, 30vw, 430px); }
.about-statement img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.audiences { background: var(--wash); }
.audiences .section-heading { margin: 0 0 30px; text-align: center; }
.audiences .section-heading h2 { max-width: 1000px; margin-inline: auto; text-wrap: balance; }
.audiences article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: clamp(28px, 4vw, 64px);
  min-width: 0;
  padding-block: 24px;
  border-top: 1px solid var(--line);
}
.audiences article:last-child { padding-bottom: 0; }
.audiences h3 { max-width: 440px; font-size: clamp(20px, 1.65vw, 24px); line-height: 1.45; }
.audiences article p { max-width: var(--reading); }
.company-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: clamp(28px, 4vw, 64px);
}
.company-facts dl { margin: 0; min-width: 0; }
.company-facts dl > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
.company-facts dl > div:first-child { padding-top: 0; }
.company-facts dt { color: var(--muted); font-weight: 400; }
.company-facts dd { margin: 0; overflow-wrap: anywhere; }
.company-facts a { text-decoration: underline; text-underline-offset: 4px; }

.service-opening,
.technical-section,
.responsibility,
.deliverables {
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  gap: 24px;
  text-align: center;
}
.service-opening > *,
.technical-section > *,
.responsibility > *,
.deliverables > * { min-width: 0; width: 100%; max-width: var(--reading); }
.service-opening h2,
.technical-section h2,
.responsibility h2,
.deliverables h2 { text-wrap: balance; }
.service-opening p,
.technical-section p:not(.eyebrow),
.responsibility p,
.deliverables p:not(.eyebrow),
.deliverables ul { text-align: left; }
.technical-section,
.responsibility { border-top: 1px solid var(--line); }
.scope-section { background: var(--wash); }
.scope-intro { max-width: var(--reading); margin: 0 auto 30px; text-align: center; }
.scope-intro h2 { margin-bottom: 18px; text-wrap: balance; }
.scope-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px clamp(28px, 4vw, 64px); }
.scope-grid article { min-width: 0; padding-top: 22px; border-top: 1px solid var(--line); }
.scope-grid h3 { font-size: clamp(21px, 1.7vw, 25px); line-height: 1.4; margin-bottom: 12px; text-align: center; }
.scope-grid p { max-width: var(--reading); }
.deliverables h2 { margin-bottom: 18px; }
.deliverables ul { margin: 0; padding: 0; list-style: none; }
.deliverables li { padding: 15px 0; border-bottom: 1px solid var(--line); }
.deliverables li:first-child { padding-top: 0; }
.supporting-scope .section-heading { margin: 0 0 30px; text-align: center; }
.supporting-scope .section-heading h2 { max-width: 1000px; margin-inline: auto; text-wrap: balance; }
.supporting-scope article {
  display: grid;
  grid-template-columns: 1fr;
  justify-items: center;
  gap: 20px;
  padding-block: 26px;
  border-top: 1px solid var(--line);
}
.supporting-scope article:last-child { padding-bottom: 0; }
.supporting-scope article > * { min-width: 0; width: 100%; max-width: var(--reading); }
.supporting-scope h3 { font-size: clamp(23px, 2vw, 28px); line-height: 1.35; text-align: center; }
.begin-section { background: var(--wash); text-align: center; }
.begin-section h2 { max-width: 1000px; margin-inline: auto; text-wrap: balance; }
.begin-section > p:not(.eyebrow) { max-width: var(--reading); margin: 18px auto 24px; }
.begin-section .button { max-width: 100%; }
.related { text-align: center; }
.related > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px clamp(28px, 4vw, 64px); }
.related a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 60px;
  padding-block: 16px;
  border-top: 1px solid var(--line);
  font-family: var(--heading);
  font-size: clamp(19px, 1.6vw, 23px);
  line-height: 1.4;
}
.related a:hover { text-decoration: underline; text-underline-offset: 5px; }
.not-found { text-align: center; }

.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.35fr);
  gap: clamp(28px, 5vw, 80px);
  align-items: start;
}
.contact-info { min-width: 0; }
.contact-info h2,
.form-heading { font-size: clamp(25px, 2.2vw, 32px); line-height: 1.35; margin-bottom: 20px; }
.contact-info > p { max-width: 480px; }
.contact-info dl { margin: 28px 0 0; display: grid; gap: 18px; }
.contact-info dt { margin-bottom: 3px; color: var(--muted); font-size: 14px; font-weight: 500; }
.contact-info dd { margin: 0; overflow-wrap: anywhere; }
.contact-info a { text-decoration: underline; text-underline-offset: 4px; }
.inquiry-area { min-width: 0; }
.form-intro { font-size: 14px; margin-bottom: 22px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 24px; }
.field { display: flex; flex-direction: column; min-width: 0; }
.field.full { grid-column: 1 / -1; }
.field label { margin-bottom: 8px; font-size: 15px; font-weight: 500; line-height: 1.5; }
.field label span { font-size: 14px; color: var(--muted); font-weight: 400; }
.field input,
.field select,
.field textarea {
  width: 100%;
  max-width: 100%;
  min-height: 50px;
  margin: 0;
  padding: 11px 12px;
  border: 1px solid var(--input-line, #979797);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: inherit;
  font-size: 16px;
  line-height: 1.5;
}
.field select { padding-right: 30px; text-overflow: ellipsis; }
.field textarea { min-height: 156px; resize: vertical; }
.field-hint { margin-top: 7px; color: var(--muted); font-size: 13px; line-height: 1.55; }
.field-error { margin-top: 6px; color: var(--error-ink, #a02525); font-size: 14px; line-height: 1.5; }
.field-error:empty { display: none; }
.field [aria-invalid="true"] { border-color: var(--error-ink, #a02525); border-width: 2px; }
.form-feedback { margin-bottom: 22px; padding: 16px; border: 1px solid var(--error-ink, #a02525); color: var(--error-ink, #a02525); line-height: 1.55; }
.inquiry-area form > .button { margin-top: 24px; }
.form-note { max-width: 620px; margin-top: 18px; font-size: 13px; line-height: 1.6; }
.honeypot { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#inquiry-receipt { padding: 26px; border: 1px solid var(--line); background: var(--wash); }
#inquiry-receipt h2 { margin-bottom: 20px; }
#inquiry-receipt .text-link { margin-top: 22px; }
.inquiry-area noscript p { margin-top: 20px; }

@media (min-width: 701px) and (max-width: 1100px) {
  .page-hero h1 { min-height: 2.44em; }
}
@media (max-width: 900px) {
  .audiences article { gap: 24px; }
  .contact-layout { grid-template-columns: 1fr; gap: 32px; }
  .contact-info { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; }
  .contact-info > h2 { grid-column: 1; }
  .contact-info > p { grid-column: 1; }
  .contact-info dl { grid-column: 2; grid-row: 1 / 3; margin-top: 0; }
  .inquiry-area { border-top: 1px solid var(--line); padding-top: 28px; }
}
@media (max-width: 700px) {
  .page-hero h1 { min-height: 0; font-size: clamp(30px, 6vw, 40px); }
  .page-hero .page-lead { font-size: 16px; }
  .page-hero .page-lead::before { margin-block: 18px; }
  .service-nav,
  .service-tabs { gap: 0 16px; }
  .service-nav a,
  .service-tabs a { flex: 1 1 calc(50% - 16px); font-size: 13px; }
  .process,
  .about-statement,
  .company-facts,
  .service-opening,
  .scope-grid,
  .deliverables,
  .technical-section,
  .responsibility,
  .supporting-scope article,
  .related > div { grid-template-columns: 1fr; gap: 24px; }
  .about-statement figure { height: auto; aspect-ratio: 4 / 3; }
  .process h2,
  .scope-grid h3 { font-size: 22px; }
  .audiences article { display: block; }
  .audiences article h3 { margin-bottom: 12px; }
  .company-facts dl > div { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); }
  .supporting-scope article { padding-block: 24px; }
  .related a { min-height: 44px; }
}
@media (max-width: 560px) {
  .contact-info { display: block; }
  .contact-info dl { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 24px; }
  .contact-info dl > div:first-child { grid-column: 1 / -1; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .inquiry-area form > .button { width: 100%; }
  .company-facts dl > div { grid-template-columns: 1fr; gap: 4px; }
  .company-facts dt { font-size: 14px; }
  #inquiry-receipt { padding: 20px; }
}
