/* The same paper/green split becomes a drawing beside an ordinary reading order. */
.home .opening .side { padding-top: 140px; padding-bottom: 64px; }
.home h1 { font-size: clamp(44px, 4.1vw, 64px); }
.home .opening-copy p { max-width: 40ch; font-size: 17px; margin-top: 28px; }
.home .statement { font-size: clamp(28px, 2.6vw, 40px); line-height: 1.3; }
.home .opening .text-link { margin-top: 24px; }
.workflow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-top: 1px solid #9bb58f; }
.workflow-visual { padding: var(--section-space) var(--gutter); align-self: stretch; }
.workflow-visual h2 { max-width: 12ch; }
.workflow-drawing { display: block; width: 100%; max-width: 420px; height: auto; max-height: 45svh; margin: 36px auto 0; overflow: visible; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.workflow-map { stroke: #9bb58f; stroke-width: 1.2; }
.workflow-map circle { fill: #f2f4ef; }
.workflow-trace { stroke: #2d5a27; stroke-width: 3; }
[data-workflow-trace] { stroke-dasharray: 1; stroke-dashoffset: 0; }
.workflow-steps { list-style: none; padding: 0; margin: 0; counter-reset: workflow; }
.workflow-step { counter-increment: workflow; display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: 16px; align-content: center; padding: 48px var(--gutter); }
.workflow-step + .workflow-step { border-top: 1px solid #9bb58f; }
.workflow-step::before { content: counter(workflow); font-size: 18px; line-height: 1.65; font-variant-numeric: tabular-nums; }
h3 { margin: 0; font-family: var(--sc-font-display); font-size: clamp(28px, 2.7vw, 40px); font-weight: 400; line-height: 1.15; letter-spacing: -.02em; text-wrap: balance; }
.workflow-step p { margin-top: 24px; max-width: 44ch; }
/* Pin only the vector column. No copy is hidden, overlaid, or scroll-swapped. */
.njl-motion .workflow-visual { position: sticky; top: 0; height: 100svh; align-self: start; display: flex; flex-direction: column; justify-content: center; }
.njl-motion .workflow-step { min-height: 70svh; }
.home-proof { padding-block: clamp(64px, 8vw, 128px); }
.home-proof .reading, .home-work .reading { max-width: 1120px; }
.home-proof h2 { max-width: 18ch; }
.proof-list { margin: 40px 0 0; padding-left: 22px; max-width: 70ch; }
.proof-list li { padding-left: 12px; line-height: 1.62; text-wrap: pretty; }
.proof-list li + li { margin-top: 28px; }
.home-work { padding-top: 0; padding-bottom: clamp(64px, 8vw, 128px); }
.work-options { margin-top: 40px; }
.work-option { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 32px 64px; border-top: 1px solid #9bb58f; padding-block: 36px; }
.work-option:last-child { border-bottom: 1px solid #9bb58f; }
.work-option h3 { font-size: clamp(28px, 2.7vw, 36px); }
.work-option p { max-width: 56ch; }
.work-option .text-link { margin-top: 20px; }
/* The home ends at rest; assessment alone owns the moving curtain. */
.home .home-contact .contact-layout { display: flex; height: auto; min-height: 60svh; padding: var(--section-space) var(--gutter); }
.home .home-contact .contact-body { max-width: 64ch; margin-inline: auto; padding: 0; transform: none; }
.home-contact .contact-secondary { padding-left: 20px; line-height: 1.65; }
.home-contact .contact-secondary li { padding-left: 4px; }
.home-contact .contact-secondary li + li { margin-top: 16px; }
@media (max-width: 1100px) and (min-width: 701px) {
  .home h1 { font-size: 44px; }
  .workflow-step { padding: 40px 32px; grid-template-columns: 1.5rem minmax(0, 1fr); gap: 12px; }
  .work-option { gap: 32px; }
}
@media (max-width: 700px) {
  .home .opening .paper { padding-top: 180px; padding-bottom: 36px; }
  .home .opening .green { padding-top: 40px; padding-bottom: 48px; }
  .home h1 { font-size: clamp(36px, 10vw, 48px); max-width: 16ch; }
  .home .opening-copy p { font-size: 16px; margin-top: 20px; }
  .home .statement { font-size: 30px; max-width: 24ch; }
  .workflow { display: block; }
  .workflow-visual { padding: 40px var(--gutter) 32px; }
  .workflow-visual h2 { max-width: 18ch; }
  .workflow-drawing { max-width: 280px; max-height: 260px; margin-top: 24px; }
  .workflow-step { padding: 36px var(--gutter); grid-template-columns: 1.5rem minmax(0, 1fr); gap: 12px; }
  .workflow-step::before { font-size: 16px; }
  h3 { font-size: 30px; }
  .workflow-step p { margin-top: 16px; }
  .home-proof { padding-block: 56px; }
  .proof-list { margin-top: 28px; padding-left: 20px; }
  .proof-list li { padding-left: 6px; }
  .proof-list li + li { margin-top: 24px; }
  .home-work { padding-bottom: 56px; }
  .work-options { margin-top: 28px; }
  .work-option { display: block; padding-block: 28px; }
  .work-option h3 { font-size: 30px; margin-bottom: 16px; }
  .home .home-contact .contact-layout { min-height: 0; padding: 48px var(--gutter); }
  .home-contact .contact-link { font-size: 20px; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-workflow-trace] { stroke-dashoffset: 0 !important; }
}
