/* Homepage trial authorized September 13: one body role in every section.
   The selected hero subtitle, headings, labels and navigation retain their roles. */
main#hero {
  --type-body:16px;
  --home-body-color:#353535;
  --home-body-color-on-dark:#e2e2e6;
}
@media(max-width:639px) {
  main#hero { --type-body:14px; }
}
@media(max-width:339px) {
  main#hero .contact-field input { font-size:var(--type-body); }
  main#hero .contact-field input::placeholder { font-size:inherit; }
}

html body main#hero :is(
  .services__intro,
  .service-card > p,
  .format-card > p,
  .process__intro,
  .process-step > p:not(.process-step__stage),
  .process__footer-copy,
  .about__intro,
  .about__role,
  .about__founder-copy li,
  .about__team-copy,
  .trust__insurance-copy > p:last-child,
  .reviews__intro,
  .review-card blockquote,
  .faq__lead,
  .faq-item__answer p,
  .contact__intro > p:not(.section-kicker),
  .contact__direct a
) {
  font-family:var(--font-body)!important;
  font-size:var(--type-body)!important;
  font-weight:400!important;
  line-height:1.5!important;
  color:var(--home-body-color)!important;
}

main#hero :is(.formats__shell,.trust__insurance,.contact__shell) {
  --home-body-color:var(--home-body-color-on-dark);
}

/* Homepage preview: direct contacts share the intro's left grid edge. */
main#hero .contact__direct {
  justify-items:start;
  text-align:left;
}
main#hero .contact__direct-links {
  display:flex;
  align-items:baseline;
  gap:6px;
  white-space:nowrap;
}
main#hero .contact__direct-separator {
  display:block;
  margin:0;
  color:var(--color-orange);
  font-size:var(--type-body);
  font-weight:400;
  line-height:1.5;
  letter-spacing:normal;
}
@media(min-width:960px) {
  main#hero .contact__shell { row-gap:32px; }
  main#hero .contact__form-column { display:contents; }
  main#hero .contact__intro { grid-column:1;grid-row:1; }
  main#hero .contact-form { grid-column:2;grid-row:1 / span 2; }
  main#hero .contact__direct { grid-column:1;grid-row:2;align-self:end; }
}
@media(min-width:960px) and (max-width:1099px) {
  main#hero .contact__shell {
    grid-template-columns:minmax(0,1fr) minmax(480px,1.35fr);
    column-gap:32px;
    padding-inline:32px;
  }
  main#hero .contact-form { padding:24px; }
}
@media(max-width:959px) {
  main#hero .contact__direct {
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    justify-content:flex-end;
    gap:8px 16px;
    text-align:right;
  }
}
@media(max-width:390px) {
  main#hero .contact__direct-links { flex-direction:column;align-items:flex-end;gap:8px; }
  main#hero .contact__direct-separator { display:none; }
}

html body main#hero .review-card__topic {
  font-size:var(--type-kicker)!important;
  line-height:1.5!important;
  font-weight:400!important;
}

/* Inline line wrappers cannot retain an older size or shade. */
html body main#hero :is(
  .services__intro,.service-card > p,.format-card > p,.process__intro,
  .process-step > p:not(.process-step__stage),.process__footer-copy,
  .about__intro,.about__role,.about__founder-copy li,.about__team-copy,
  .trust__insurance-copy > p:last-child,.reviews__intro,.review-card blockquote,
  .faq__lead,.faq-item__answer p,.contact__intro > p:not(.section-kicker)
) span {
  font-family:inherit!important;
  font-size:inherit!important;
  font-weight:inherit!important;
  line-height:inherit!important;
  color:inherit!important;
}

/* FAQ answers reflow to the body role instead of retaining old fitted lines. */
html body main#hero .faq-item__answer :is(.adaptive-line,.faq-sentence) {
  display:inline;
  white-space:normal;
  text-wrap:wrap;
}
/* Questions and answers share one reading measure, set for the whole FAQ. */
html body main#hero .faq-item__answer p {
  width:100%;
  max-width:100%;
  text-wrap:wrap!important;
}
html body main#hero .faq-item__answer br { display:none!important; }

/* Measured wraps apply on desktop as well as compact layouts. */
html body main#hero .home-body-line,
html body main#hero :is(h2,h3) > .adaptive-line {
  display:block!important;
  white-space:pre!important;
  text-wrap:nowrap!important;
}

/* The reduced body role allows the approved wide header pattern on tablets. */
@media(min-width:700px) and (max-width:959px) {
  html body #hero :is(.services__header,.process__header,.about__header,.reviews__header) {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:start;
    gap:24px 32px;
  }
  html body #hero :is(.services__header,.process__header,.about__header,.reviews__header) > div:first-child { grid-column:1; }
  html body #hero :is(.services__aside,.process__intro,.about__intro,.reviews__intro) {
    grid-column:2;grid-row:1;width:100%;max-width:none;margin-top:0;
  }
}
