/* S-72: shorter crane hero (height: .fhero--page, commercial.css); existing video and posters retained. */
.pw-hero .fhero__body { padding-top: var(--s-8); padding-bottom: var(--s-6); }
.pw-hero :is(.film__poster, .film__video) { object-position: 50% 65%; }
/* S-74 (Reed live instruction 2026-10-24): photography and choices, a simple process, one invitation, then the footer.
   Each pathway has its own layout; one paper ground, no tinted boxes, no dark band (the footer is the page's only dark). */
.pw-index { margin-top: var(--s-5); }
.detail-main .pw-path { padding-block: var(--s-9) 0; }
.detail-main .pw-index + .pw-path { padding-top: var(--s-8); }
/* the small number over each title, with a short amber tick (one of the page's restrained accents) */
.pw-route-heading { display: grid; gap: var(--s-3); min-width: 0; }
.pw-path__no { display: flex; align-items: center; gap: var(--s-3); color: var(--muted); font-size: var(--fs-6); font-weight: 500; line-height: 1.4; font-variant-numeric: tabular-nums; }
.pw-path__no::after { content: ""; width: var(--s-6); border-top: 2px solid var(--accent); }
.pw-path h2 { margin: 0; font-size: var(--fs-2); }
.pw-path__eyebrow { margin: var(--s-3) 0 0; color: var(--muted); font-size: var(--fs-6); line-height: 1.5; }
.pw-route-description { max-width: 44ch; margin: var(--s-5) 0 var(--s-3); font-size: var(--fs-4); line-height: 1.5; }
.pw-route-audience { max-width: 44ch; margin: 0 0 var(--s-4); color: var(--muted); font-size: var(--fs-5); line-height: 1.5; }
.pw-path .tlink { display: inline-flex; align-items: center; min-height: 44px; font-size: var(--fs-5); }
/* photographs: owner-supplied stills, decorative */
.pw-photo { display: block; overflow: hidden; background: var(--paper-2); border-radius: var(--radius); }
.pw-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 1 Adopt or Pilot: image and text */
.pw-feature { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-6); align-items: center; }
.pw-feature__media .pw-photo { aspect-ratio: 3 / 2; }
.pw-feature__body { min-width: 0; }
@media (min-width: 960px) {
  .pw-feature { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s-8); }
  .pw-feature__media .pw-photo { aspect-ratio: 4 / 3; }
  .pw-feature__media .pw-photo img { object-position: 72% 50%; }
}

/* 2 Distribute, License or Integrate: three image-led options, each one link; no boxes, no inner rules */
.pw-options { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-7); margin: var(--s-7) 0 0; padding: 0; list-style: none; }
.pw-options > li { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; min-width: 0; scroll-margin-top: calc(var(--header-h) + var(--s-6)); }
.pw-option__img { aspect-ratio: 3 / 2; margin-bottom: var(--s-5); }
.pw-options h3 { margin: 0 0 var(--s-2); font-size: var(--fs-4); font-weight: 400; line-height: 1.45; }
.pw-options a { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--s-4); min-height: 44px; color: var(--ink); text-decoration: none; }
/* the title's first line centred on the 40px arrow, so one- and two-line titles share one line of arrows */
.pw-option__title { padding-top: calc((40px - var(--lh-3) * 1em) / 2); }
.pw-options a::after { content: ""; position: absolute; inset: 0; }
.pw-options .arrow { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--ink-deep); border-radius: 50%; font-size: var(--fs-4); line-height: 1; }
.pw-options > li:is(:hover, :focus-within) .arrow { color: var(--ink-deep); background: var(--accent); border-color: var(--accent); }
.pw-options a:focus-visible { outline: none; }
.pw-options a:focus-visible::after { outline: 2px solid var(--ink-deep); outline-offset: 6px; }
.pw-option-description { margin: 0 0 var(--s-2); font-size: var(--fs-5); line-height: 1.5; }
.pw-option-audience { margin: 0; color: var(--muted); font-size: var(--fs-5); line-height: 1.5; }
.pw-anchor { position: absolute; top: 0; scroll-margin-top: calc(var(--header-h) + var(--s-6)); }
.pw-distribute-close { margin: var(--s-6) 0 0; }
@media (min-width: 560px) and (max-width: 959px) {
  .pw-options > li { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); grid-template-rows: auto auto 1fr; column-gap: var(--s-5); }
  .pw-option__img { grid-row: 1 / span 3; margin: 0; }
  .pw-options > li > :not(.pw-option__img) { grid-column: 2; }
}
@media (min-width: 960px) {
  .pw-options { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto auto auto 1fr; gap: 0 var(--s-6); }
  .pw-options > li { grid-template-rows: subgrid; grid-row: span 4; }
}

/* 3 Build a Market Together: a wider editorial section; the invitation on the left, the photograph to the right edge */
.detail-main .pw-build { padding-bottom: 0; }
.pw-editorial { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
.pw-editorial__media { order: -1; }
.pw-editorial__media .pw-photo { aspect-ratio: 3 / 2; border-radius: 0; }
.pw-editorial__body { min-width: 0; padding-inline: var(--gutter); }
@media (min-width: 960px) {
  .pw-editorial {
    --edge: max(var(--gutter), (100% - var(--maxw)) / 2 + var(--gutter));
    grid-template-columns: var(--edge) calc((min(100%, var(--maxw)) - 2 * var(--gutter)) * .4) var(--s-8) minmax(0, 1fr);
    align-items: center; column-gap: 0;
  }
  .pw-editorial__body { grid-column: 2; grid-row: 1; padding: var(--s-7) 0; }
  .pw-editorial__media { grid-column: 4; grid-row: 1; }
  .pw-editorial__media .pw-photo { aspect-ratio: auto; height: clamp(26rem, 34vw, 36rem); } /* original full-size photo (Reed 2026-10-24) */
  .pw-editorial__media .pw-photo img { object-position: 30% 50%; }
}

/* How it works (S-74): a compact process line on paper, small amber-ringed numbered markers; vertical below 960 */
.detail-main .pw-steps { padding-block: var(--s-9) 0; }
.pw-steps .label { margin-bottom: var(--s-3); }
.pw-steps h2 { margin: 0 0 var(--s-7); }
.pw-steps .steps__no:empty::before { content: counter(step); }
.steps.pw-process { grid-template-columns: minmax(0, 1fr); gap: 0; }
.pw-process > li { position: relative; padding: 0 0 var(--s-5) 44px; border-top: 0; }
.pw-process > li:last-child { padding-bottom: 0; }
.pw-process > li::before { content: ""; position: absolute; left: 14px; top: 36px; bottom: var(--s-2); border-left: 1px solid var(--line); }
.pw-process > li:last-child::before { display: none; }
.pw-process .steps__no {
  position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 28px; height: 28px; margin: 0;
  border: 1.5px solid var(--accent); border-radius: 50%; background: color-mix(in srgb, var(--accent) 18%, var(--paper));
  color: var(--ink); font-size: var(--fs-6); font-weight: 500; line-height: 1;
}
.pw-process .steps__term { padding-top: 3px; }
.pw-process .steps__text { max-width: 34ch; }
@media (min-width: 960px) {
  .steps.pw-process { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--s-6); }
  .pw-process > li, .pw-process > li:last-child { padding: 44px 0 0; }
  .pw-process > li::before { top: 14px; bottom: auto; left: 40px; right: calc(var(--s-3) - var(--s-6)); border-left: 0; border-top: 1px solid var(--line); }
  .pw-process .steps__term { padding-top: 0; }
}
/* the one closing invitation, directly beneath the process; then the footer */
.detail-main .pw-steps + .pw-close { padding-top: var(--s-8); }
.pw-close > .wrap::before { content: ""; grid-column: 1 / -1; margin-bottom: var(--s-3); border-top: 1px solid var(--line); }

/* motion: the photographs open to their edges as they enter (clip only, CSS, static fallback) */
@media screen and (prefers-reduced-motion: no-preference) {
  @supports (animation-timeline: view()) {
    html.js .pw-photo img { animation: x-open linear both; animation-timeline: view(); animation-range: entry 0% cover 30%; }
  }
}
@media (prefers-reduced-motion: no-preference) {
  html.js .pw-option__img img { transition: transform .6s var(--ease-out); }
  html.js .pw-options .arrow { transition: transform var(--dur-med) var(--ease-out), background-color var(--dur-fast) ease, border-color var(--dur-fast) ease, color var(--dur-fast) ease; }
  .pw-options > li:hover .pw-option__img img { transform: scale(1.03); }
  .pw-options > li:is(:hover, :focus-within) .arrow { transform: translateX(4px); }
}
@media (max-width: 759px) {
  .detail-main .pw-path, .detail-main .pw-steps { padding-top: var(--s-8); }
  .detail-main .pw-index + .pw-path { padding-top: var(--s-7); }
  .pw-steps h2 { margin-bottom: var(--s-6); }
  .detail-main .pw-steps + .pw-close { padding-top: var(--s-7); }
}
@media print {
  .pw-hero { height: auto; min-height: 0; max-height: none; }
  .pw-photo { display: none; }
}
/* very wide screens: the photo stops at the content edge instead of becoming a long strip */
@media (min-width: 1920px) {
  .pw-editorial__media { margin-right: max(var(--gutter), (100vw - var(--maxw)) / 2 + var(--gutter)); }
}
