/* /for-organizations/ — founder layout correction (26 September 2026).
   One reading order; one full-width column by default; two columns only where a screenshot sits beside short copy;
   product screenshots shown large enough to read without zooming (shown at or near their captured CSS size). */
.fo-page .shell { display: block; max-width: 1180px; margin: 0 auto; padding: 0 clamp(16px, 4vw, 40px); box-sizing: border-box; }
.fo-page h2 { font-family: var(--font-display); color: var(--ink); font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.1rem); line-height: 1.15; margin: 0 0 0.9rem; }
.fo-page h3 { color: var(--ink); font-size: 1.08rem; line-height: 1.3; margin: 0 0 0.4rem; }
.fo-page p { color: var(--body); line-height: 1.6; }
.fo-narrow { max-width: 760px; }
.fo-lead { font-size: 1.15rem; }
.fo-note, .fo-small { color: var(--muted); font-size: 0.95rem; }

/* sections: whitespace between sections, not inside tiny columns */
.fo-section { padding: clamp(56px, 7vw, 96px) 0; }
.fo-tinted { background: var(--wash); }

/* hero: copy beside a large Condition Profile */
.fo-hero { background: var(--wash); padding: clamp(40px, 6vw, 80px) 0; }
.fo-page .fo-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: start; }
@media (min-width: 1100px) { .fo-page .fo-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 660px); gap: 56px; } }

/* screenshots: evidence, not decoration */
.fo-shot { margin: 0; }
.fo-shot picture { display: block; }
.fo-shot img { display: block; width: 100%; height: auto; border: 1px solid var(--rule); border-radius: var(--radius); background: #fff; box-shadow: var(--lift); }
.fo-shot figcaption { color: var(--muted); font-size: 0.95rem; line-height: 1.5; margin-top: 0.9rem; max-width: 760px; }
.fo-shot-hero { max-width: 660px; }
.fo-shot-native { max-width: 506px; justify-self: end; }
.fo-shot-wide { max-width: 1040px; margin: 40px 0 0; }
.fo-gap-copy { margin-top: clamp(56px, 7vw, 88px); }

/* two columns only where a screenshot sits beside concise copy */
.fo-page .fo-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 32px; align-items: center; }
@media (min-width: 960px) { .fo-page .fo-split { grid-template-columns: minmax(0, 1fr) minmax(0, 506px); gap: 64px; } }

/* six audiences: a balanced 3 × 2 grid on wide screens, 2 × 3 on medium, one column on phones */
.fo-page .fo-audiences { max-width: none; list-style: none; margin: 1.6rem 0 0; padding: 0; display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .fo-page .fo-audiences { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .fo-page .fo-audiences { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fo-audiences li { background: var(--surface); border: 1px solid var(--rule); border-top: 3px solid var(--action); border-radius: var(--radius); padding: 22px 24px; }
.fo-audiences p { margin: 0; }

/* three steps: a balanced row of wide cards, stacked on phones */
.fo-page .fo-steps { max-width: none; list-style: none; margin: 1.6rem 0 0; padding: 0; display: grid; gap: 20px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .fo-page .fo-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fo-steps li { background: var(--surface); border: 1px solid var(--rule); border-radius: var(--radius); padding: 26px 26px 22px; }
.fo-steps p { margin: 0; }
.fo-step-n { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--ink); color: #fff; font-weight: 700; margin-bottom: 14px; }

.fo-not-list { margin: 0.4rem 0 1.2rem; padding-left: 1.2rem; color: var(--body); line-height: 1.7; }

/* closing call to action: a distinct final section */
.fo-close { background: var(--ink); padding: clamp(56px, 7vw, 96px) 0; }
.fo-close h2, .fo-close p { color: #fff; }
.fo-close .fo-small { color: var(--logo-mist); }
.fo-close .fo-small a { color: #fff; }