/*
 * One alignment system for the three case studies.
 * All primary content starts at the same left-hand page-grid line.
 * Narrow reading measures stay narrow without being centered independently.
 * The larger figures and multi-column compositions retain their intended widths.
 */
body.portfolio-case {
  --cs-page-gutter: max(3rem, calc((100vw - var(--cs-content)) / 2));
  --cs-wide-width: min(var(--cs-content), calc(100% - 6rem));
  --cs-reading-width: min(var(--cs-measure), calc(100% - 6rem));
}
/* InVision: content, art, diagram and chapter headings share their left edge. */
body.case-invision main > .read,
body.case-invision main > .narrowfig {
  width:var(--cs-reading-width) !important;
  max-width:none;
  margin-left:var(--cs-page-gutter) !important;
  margin-right:0 !important;
}
body.case-invision main > .narrowfig {
  width:min(870px, calc(100% - 6rem)) !important;
}
body.case-invision main > .shell,
body.case-invision main > .widefig {
  width:var(--cs-wide-width) !important;
  margin-left:var(--cs-page-gutter) !important;
  margin-right:0 !important;
}
/* AI: keep its original reading width and two-view behavior, align their
   left edge with the hero and wide editorial canvas rather than centering. */
body.case-ai .reading {
  width:var(--cs-reading-width) !important;
  max-width:none;
  margin-left:var(--cs-page-gutter) !important;
  margin-right:0 !important;
}
/* The AI workflow illustration is a deliberate wide visual, not an
   independently centered inset. Match the text edge instead. */
body.case-ai .ai-role-map {
  width:min(950px, calc(100vw - 6rem)) !important;
  max-width:none;
  left:auto !important;
  transform:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
}
/* Quality already uses the full grid for each section. Ensure every nested
   .read starts at the parent left edge and never adds its own centering. */
body.case-quality main .shell > .read,
body.case-quality main .read > .read,
body.case-quality main .system-head > .read {
  width:100% !important;
  max-width:var(--cs-content);
  margin-left:0 !important;
  margin-right:0 !important;
}
/* Use the reading measure for prose alone. Cards, tables, figures and grids
   align to the section container without artificial nested offsets. */
body.case-quality main .read > .read > p,
body.case-quality main .system-head > .read > p {
  max-width:var(--cs-measure);
}
@media(max-width:760px) {
  body.portfolio-case {
    --cs-page-gutter:1.125rem;
    --cs-wide-width:calc(100% - 2.25rem);
    --cs-reading-width:calc(100% - 2.25rem);
  }
  body.case-invision main > .narrowfig {width:var(--cs-wide-width) !important}
  body.case-ai .ai-role-map {width:calc(100vw - 2.25rem) !important}
}