/* B3.3 Making Sense of a Changing World — locked story / B3 approved visual rhythm.
   Same design tokens as B1/B2 and accepted B3.1/B3.2. Not a site-wide change. */
.b3-changing-world{background:var(--gm-ivory)}
.b3-changing-world .b33-title-grid{
  display:grid;grid-template-columns:minmax(0,.90fr) minmax(0,1.10fr);
  gap:2.25rem;align-items:center;margin:1.5rem 0 2rem;
}
.b3-changing-world .b33-title-grid>*{min-width:0}
.b3-changing-world .project-story{max-width:55rem;margin-inline:auto}
.b3-changing-world .project-prose{max-width:70ch}
.b3-changing-world .b33-title-grid .b33-hero-photo{
  max-width:none;width:100%;margin:0;
}
.b3-changing-world .b33-hero-photo img{
  display:block;width:100%;height:auto;max-height:none;object-fit:contain;
}
.b3-changing-world .b33-title-grid .b33-hero-photo figcaption{
  max-width:46ch;margin:.4rem auto 0;text-align:center;font-size:.8rem;
}
.b3-changing-world .b33-method-graphic{width:100%;max-width:54rem;margin:1.25rem auto}
.b3-changing-world .b33-method-graphic img{
  display:block;width:100%;max-height:none;height:auto;object-fit:contain;
}
.b3-changing-world .b33-method-graphic figcaption{
  text-align:center;margin:.5rem auto;max-width:58ch;
}
.b3-changing-world .b33-legacy-note{
  max-width:66ch;margin:1rem auto 1.5rem;
  font-size:.95rem;color:var(--gm-body);font-style:italic;
}
.b3-changing-world .project-story> :is(#language,#failure,#lesson,#parallel),
.b3-changing-world .b33-method-panel{
  background:var(--gm-paper);border:1px solid var(--gm-line);
  border-left:3px solid var(--gm-gold);
  border-radius:.75rem;
  box-shadow:0 .3rem 1.1rem rgba(52,38,30,.035);
  padding:clamp(1rem,2.25vw,1.65rem);
  margin-block:1.5rem;
}
.b3-changing-world .b33-method-panel{
  max-width:70ch;border-left-width:2px;padding:1rem 1.35rem;
  box-shadow:none;
}
.b3-changing-world .b33-method-panel p{margin:0}
.b3-changing-world .b33-cadence-list{max-width:70ch;padding-left:1.5rem;margin-block:1rem}
.b3-changing-world .b33-cadence-list li{margin:.45rem 0;line-height:1.55}
.b3-changing-world .project-story> :is(#failure,#parallel) .project-table-wrap{max-width:none}
.b3-changing-world .b33-decision-link{
  max-width:70ch;margin:1rem 0;padding:.75rem 1rem;
  border-left:3px solid var(--gm-gold);background:var(--gm-paper);
}
@media(max-width:900px){
  .b3-changing-world .b33-title-grid{
    grid-template-columns:1fr;gap:1rem;margin:1rem 0 1.75rem;
  }
  .b3-changing-world .b33-title-grid .b33-hero-photo{max-width:42rem;margin-inline:auto}
}
@media(max-width:650px){
  .b3-changing-world .project-story{max-width:none}
  .b3-changing-world .project-story> :is(#language,#failure,#lesson,#parallel),
  .b3-changing-world .b33-method-panel{padding:1.1rem;margin-block:1.1rem}
}

/* Final role-table palette: nested Human / AI / External reality summary.
   Unlike other projects, Changing World's #parallel is a table wrapper inside
   #outcome, not a top-level section. Match the accepted cream / lilac / white
   summary treatment without changing other analytical tables or narrative. */
.b3-changing-world .project-story .b33-roles-table{
  max-width:100%;overflow-x:auto;
  margin-block:1.4rem;
  padding:clamp(1rem,2.3vw,1.7rem);
  background:var(--gm-ivory);
  border:1px solid var(--gm-line);
  border-left:3px solid var(--gm-plum);
  border-radius:.7rem;
}
.b3-changing-world .project-story .b33-roles-table .project-table{
  border-collapse:separate;border-spacing:0;
  table-layout:fixed;width:100%;
}
.b3-changing-world .project-story .b33-roles-table .project-table th{
  background:var(--gm-lavender);
  color:var(--gm-plum);
  font-weight:700;
  vertical-align:middle;
  border-bottom:2px solid var(--gm-plum);
}
.b3-changing-world .project-story .b33-roles-table .project-table td{
  background:var(--gm-paper);
  color:var(--gm-body);
}
.b3-changing-world .project-story .b33-roles-table .project-table :is(th,td){
  border-inline-end:1px solid var(--gm-line);
  border-bottom-width:1px;
  overflow-wrap:anywhere;
}
.b3-changing-world .project-story .b33-roles-table .project-table :is(th,td):first-child{
  border-inline-start:1px solid var(--gm-line);
}
@media(max-width:650px){
  .b3-changing-world .project-story .b33-roles-table{padding:1rem}
}