/* /contact/ only: the opening with the form beside the after-send path.
   Owner: ux-designer builder. Form, routes and buttons come from layout.css. */

main > .reach { padding-block: var(--space-7) var(--section-pad); }
.reach__title { font-size: var(--t-h1); line-height: 1.08; }
.reach__sub { margin-block-start: var(--space-3); max-inline-size: 38rem; font-size: var(--t-lead); line-height: 1.6; }
.reach__grid { display: grid; gap: var(--space-8); margin-block-start: var(--space-7); }
.reach__h2 { font-size: clamp(1.625rem, 1.1rem + 1.2vw, 2.25rem); }
/* the form opens on its first field (the error summary above it is hidden at rest) */
.reach__form .form { margin-block-start: var(--space-5); padding-block-start: var(--space-5); }
/* an inline link inside the consent sentence: padded to a 24px target */
.check label a { font-weight: 700; padding-block: 2px; }

/* ---- the after-send path ------------------------------------------------ */
.after__moment { margin-block-start: var(--space-6); }

/* ---- routes: the location is text, not a link ---------------------------- */
.route--static .route__value,
.route--static:hover .route__value { text-decoration: none; }

@media (min-width: 1024px) {
  .reach__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: start; }
  .reach__form { grid-column: 1 / span 7; }
  .after { grid-column: 9 / span 4; position: sticky; inset-block-start: calc(var(--head-h) + var(--space-6)); }
}