/* Final AFARS narrative: compositions reuse the existing editorial/media primitives. */
body.afars-final :is(.case-toc a,.case-sections .story-row > .eyebrow) { text-transform: none; }
body.afars-final .case-hero > .case-deck { font-size: 20px; }
/* AFARS hero-only proportional spacing; retain shared case-page defaults. */
body.afars-final .case-hero { padding-top: clamp(16px, 2.25vw, 32px); }
body.afars-final .case-hero > .case-deck { margin-top: calc(var(--hero-deck-gap) / 2); }
body.afars-final .case-hero > .case-tags { margin-top: calc(clamp(20px, 2.5vw, var(--eyebrow-heading-gap)) / 2); }
body.afars-final .case-hero > .case-cover { margin-top: clamp(24px, 3.5vw, 48px); }
body.afars-final .research-takeaway { border-top: 0; padding-top: 0; }
body.afars-final .finding-sequence .kicker + p.type-body { margin-top: 0; }
body.afars-final .definition-section > .kicker { font-size: var(--small-title-size); font-weight: var(--small-title-weight); line-height: var(--small-title-leading); letter-spacing: var(--small-title-tracking); margin-bottom: var(--space-small); }
body.afars-final .definition-section > .kicker + p.type-body { margin-top: 0; }
body.afars-final .watching-statements { display: grid; gap: var(--grid-gap); margin-top: var(--grid-gap); }
body.afars-final .watching-statements > p.type-body { margin: 0; }
body.afars-final .research-narrative .research-introduction { max-width: none; }
body.afars-final .research-narrative .research-artifacts { margin-top: var(--section-gap); }
body.afars-final .research-narrative .research-artifacts > figure { margin: 0; min-width: 0; }
body.afars-final :is(.case-title,.story-content h2,.fact dt) { overflow-wrap: anywhere; }
body.afars-final .hero-experiences {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--grid-gap);
  padding: 0;
  background: transparent;
}
body.afars-final .hero-experiences .asset-placeholder { min-height: 18rem; }
body.afars-final .media-placeholder-label {
  display: block;
  margin-bottom: var(--space-small);
  font-size: var(--small-title-size);
  font-weight: var(--small-title-weight);
  letter-spacing: var(--small-title-tracking);
  color: var(--muted);
}
body.afars-final .asset-placeholder {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-wrap: anywhere;
}
body.afars-final .finding-sequence .finding-label { font-size: var(--type-subsection); font-weight: var(--type-ui-weight); line-height: var(--type-subsection-leading); }
body.afars-final .finding-sequence .kicker { margin-bottom: var(--space-small); }
body.afars-final .research-takeaway > h3.takeaway-statement {
  margin: 0;
  font: var(--type-editorial-weight) 30px / var(--type-section-leading) var(--font-editorial);
}
body.afars-final .pillar-navigation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--grid-gap);
  margin-top: var(--section-gap);
  font-family: var(--font-sans);
  font-size: var(--type-subsection);
  font-weight: var(--type-ui-weight);
  line-height: var(--type-subsection-leading);
  letter-spacing: var(--body-tracking);
}
body.afars-final .pillar-navigation span { color: var(--muted); }
body.afars-final .finding-sequence article:nth-child(1) .kicker,
body.afars-final #capture > .kicker,
body.afars-final .pillar-navigation a[href="#capture"] { color: #7F6B5D; }
body.afars-final .finding-sequence article:nth-child(2) .kicker,
body.afars-final #process > .kicker,
body.afars-final .pillar-navigation a[href="#process"] { color: #6B7785; }
body.afars-final .finding-sequence article:nth-child(3) .kicker,
body.afars-final #resolve > .kicker,
body.afars-final .pillar-navigation a[href="#resolve"] { color: #425A8B; }
body.afars-final .pillar-navigation a:hover { text-decoration: underline; }
html:has(body.afars-final) { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html:has(body.afars-final) { scroll-behavior: auto; } }
body.afars-final .definition-section,
body.afars-final .decision-section + .definition-section { margin-top: var(--section-gap); }
body.afars-final .definition-section > h3.type-editorial-subsection {
  font-family: var(--font-sans);
  font-size: var(--type-subsection);
  font-weight: var(--type-ui-weight);
  line-height: var(--type-subsection-leading);
  margin-bottom: var(--grid-gap);
}
body.afars-final .interaction-video { margin-top: var(--section-gap); }
body.afars-final .interaction-video .asset-placeholder { min-height: 0; aspect-ratio: 16 / 9; padding: var(--content-gap); }
body.afars-final .interaction-video-secondary { max-width: 60%; }
body.afars-final .interaction-video-primary { max-width: 80%; }
@media (max-width: 720px) {
  body.afars-final .interaction-video { max-width: 100%; }
  body.afars-final .interaction-video .asset-placeholder { aspect-ratio: auto; min-height: 10rem; }
}
body.afars-final :is(.decision-section,.pillar-navigation) { scroll-margin-top: calc(92px + var(--content-gap)); }
body.afars-final .decision-section { margin-top: var(--content-group-gap); }
/* Section Boundary Divider: each boundary owns both 80px clearances once. */
body.afars-final #system .decision-section + .decision-section {
  margin-top: var(--content-group-gap);
  border-top: 1px solid var(--line) !important; /* Override the legacy border:0 !important reset. */
  padding-top: var(--content-group-gap);
}
body.afars-final #system .decision-section > :last-child { margin-bottom: 0; }
body.afars-final #system .decision-section > :first-child { margin-top: 0; }
body.afars-final .decision-section > h3.type-editorial-subsection {
  font-family: var(--font-editorial);
  font-size: var(--type-editorial-subsection);
  font-weight: var(--type-editorial-weight);
  line-height: var(--type-section-leading);
  margin-bottom: var(--section-gap);
}
body.afars-final :is(.mobile-showcase,.portal-showcase,.feedback-showcase) { display: grid; gap: var(--grid-gap); min-width: 0; }
body.afars-final .mobile-showcase { grid-template-columns: repeat(3,minmax(0,1fr)); }
body.afars-final .mobile-showcase .asset-placeholder { aspect-ratio: 9 / 16; min-height: 0; padding: var(--content-gap); }
body.afars-final .portal-showcase .asset-placeholder { aspect-ratio: 16 / 9; min-height: 0; }
body.afars-final .portal-showcase { grid-template-columns: minmax(0,1fr); }
body.afars-final .portal-showcase .asset-placeholder + .asset-placeholder { aspect-ratio: 2 / 1; }
body.afars-final .feedback-showcase { grid-template-columns: repeat(2,minmax(0,1fr)); }
body.afars-final .feedback-showcase .asset-placeholder { aspect-ratio: 4 / 3; min-height: 0; }
body.afars-final .resolve-pillar > .resolve-decision:first-of-type { margin-top: 0; }
body.afars-final .resolve-pillar > .resolve-decision + .resolve-decision { margin-top: var(--section-gap); }
body.afars-final .definition-evidence { max-width: 70%; }
body.afars-final .definition-evidence .asset-placeholder.compact { min-height: 12rem; }
body.afars-final .prototype-placeholder { aspect-ratio: 16 / 9; min-height: 0; }
body.afars-final .status-evaluation { margin-top: var(--content-group-gap); }
body.afars-final .closing-reflection { margin-top: var(--content-group-gap); }
body.afars-final .closing-reflection > .eyebrow { margin-bottom: var(--grid-gap); }
body.afars-final .reflection-statement {
  font-family: var(--font-editorial);
  font-size: var(--type-editorial-subsection);
  line-height: var(--type-section-leading);
  color: var(--ink);
}
@media (max-width: 900px) {
  body.afars-final .research-narrative .research-introduction { max-width: none; }
  body.afars-final .mobile-showcase { grid-template-columns: minmax(0,1fr); }
  body.afars-final .mobile-showcase .asset-placeholder { aspect-ratio: auto; min-height: 18rem; }
}
@media (max-width: 720px) {
  body.afars-final .hero-experiences, body.afars-final .feedback-showcase { grid-template-columns: minmax(0,1fr); }
  body.afars-final .hero-experiences .asset-placeholder { min-height: 12rem; }
  body.afars-final .definition-evidence { max-width: none; }
  body.afars-final .portal-showcase .asset-placeholder { aspect-ratio: auto; min-height: 18rem; }
  body.afars-final .prototype-placeholder { aspect-ratio: auto; min-height: 18rem; }
}

/* AFARS-only review frames: labels describe future assets, never invented UI. */
body.afars-final .lifecycle-findings { border-left: 0; padding-left: 0; }
body.afars-final .lifecycle-user { color: var(--muted); text-transform: none; }
body.afars-final #outcomes .status-evaluation { margin-top: var(--section-gap); }
body.afars-final .lifecycle-findings article:nth-child(1) .lifecycle-stage { color: #7F6B5D; }
body.afars-final .lifecycle-findings article:nth-child(2) .lifecycle-stage { color: #6B7785; }
body.afars-final .lifecycle-findings article:nth-child(3) .lifecycle-stage { color: #425A8B; }
body.afars-final .current-state-journey { width: 100%; max-width: none; margin-inline: 0; }
body.afars-final .mvp-narrative { margin-top: var(--section-gap); }
body.afars-final .reporting-overview { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.7fr); align-items: center; gap: var(--content-gap); }
body.afars-final .reporting-overview > :last-child:nth-child(3) { grid-column: 1 / -1; }
body.afars-final .processing-demo { aspect-ratio: 16 / 9; margin-top: var(--section-gap); }
@media (max-width: 720px) {
  body.afars-final .reporting-overview { grid-template-columns: minmax(0,1fr); }
}
body.afars-final .visual-composition { min-width: 0; }
body.afars-final .hero-experiences.visual-composition { display: block; background: var(--soft); padding: var(--section-gap); }
body.afars-final :is(.composition-label,.visual-frame,.visual-annotation) {
  font-family: var(--font-sans);
  font-size: var(--small-title-size);
  line-height: var(--body-leading);
  font-weight: var(--type-body-weight);
  color: var(--muted);
}
body.afars-final .composition-label { display: block; margin-bottom: var(--grid-gap); }
body.afars-final .visual-frame {
  display: grid; place-items: center; width: 100%; min-width: 0;
  padding: var(--grid-gap); border: 1px solid var(--line);
  background: var(--soft); text-align: center;
}
body.afars-final .visual-frame > span { max-width: 100%; overflow-wrap: anywhere; }
body.afars-final .screen-mobile { aspect-ratio: 9 / 19.5; }
body.afars-final .screen-desktop { aspect-ratio: 16 / 10; }
body.afars-final .connected-experiences {
  display: grid; grid-template-columns: minmax(0, .55fr) minmax(0, 2fr) minmax(0, 1.4fr);
  gap: var(--content-gap); align-items: center;
}
body.afars-final .connected-experiences .visual-frame { background: var(--paper); }
body.afars-final .legacy-screens { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--grid-gap); }
body.afars-final #findings .finding-split > .legacy-composition { width: 70%; margin-inline: auto; }
body.afars-final .legacy-composition > figcaption { text-align: center; }
body.afars-final .legacy-level-labels { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); text-align: center; }
@media (max-width: 820px) {
  body.afars-final #findings .finding-split > .legacy-composition { width: 100%; }
}
body.afars-final .legacy-screen { min-width: 0; }
body.afars-final .legacy-crop { aspect-ratio: 645 / 1326; overflow: hidden; }
body.afars-final .legacy-crop .case-image-trigger { width: 100%; height: 100%; }
body.afars-final .legacy-composition .legacy-crop img { display: block; width: 100%; height: 100%; object-fit: cover; }
body.afars-final .capture-screens { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--content-gap); align-items: start; }
body.afars-final .capture-flow-images { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: var(--grid-gap); align-items: start; }
body.afars-final .capture-flow-labels { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: var(--grid-gap); align-items: end; margin-bottom: var(--space-small); font-family: var(--font-sans); font-size: var(--type-navigation-size); font-weight: var(--type-body-weight); line-height: var(--type-eyebrow-leading); color: var(--muted); text-align: center; }
body.afars-final .capture-flow-labels > div { min-width: 0; overflow-wrap: anywhere; }
body.afars-final .capture-step-number { color: var(--muted); white-space: nowrap; }
body.afars-final .legacy-level-labels .composition-label { font-size: var(--type-navigation-size); line-height: var(--type-eyebrow-leading); color: var(--muted); margin-bottom: var(--space-small); }
/* Trim only the source asset's side/bottom shadow canvas; keep the device and UI intact. */
body.afars-final .capture-flow-images img { display: block; width: calc(100% * 828 / 668); max-width: none; height: auto; transform: translateX(calc(-100% * 80 / 828)); border-radius: 0; }
body.afars-final .capture-flow-images .case-image-trigger { min-width: 0; aspect-ratio: 668 / 1376; overflow: hidden; border-radius: 0; }
body.afars-final .annotated-screen { display: grid; gap: var(--grid-gap); min-width: 0; }
body.afars-final .capture-primary .visual-frame { border-color: var(--muted); }
body.afars-final .visual-annotation { display: block; text-align: left; }
body.afars-final .artifact-frame { aspect-ratio: 16 / 9; }
body.afars-final .reporting-composition { display: grid; gap: var(--section-gap); }
body.afars-final .workflow-detail { aspect-ratio: 4 / 3; width: 60%; }
body.afars-final .resolve-compositions { display: grid; gap: calc(var(--section-gap) * 2); }
body.afars-final .resolve-evidence-group > h4 { margin: 0 0 var(--grid-gap); }
body.afars-final .resolve-evidence-group > .resolve-media-pair { margin-top: var(--section-gap); }
body.afars-final .resolve-compositions + p { margin-top: var(--section-gap); }
body.afars-final .process-media-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--section-gap) var(--content-gap); margin-block: var(--section-gap); }
body.afars-final .process-media-grid > .case-diagram { margin: 0; min-width: 0; }
body.afars-final #process .process-media-grid { margin-bottom: calc(var(--section-gap) * 2); }
body.afars-final #resolve .resolve-decision + .resolve-decision { margin-top: calc(var(--section-gap) * 2); }
body.afars-final figure > figcaption { margin-top: var(--caption-gap); text-align: center; }
body.afars-final .process-media-grid > .process-video { grid-column: 1 / -1; overflow: visible; }
body.afars-final .process-video video { display: block; width: 100%; height: auto; object-fit: contain; border-radius: 20px; box-shadow: var(--project-hover-shadow); }
/* Column ratio derives from 2880:1620 desktop and 675:1380 mobile assets: equal display heights. */
body.afars-final .resolve-media-pair { display: grid; grid-template-columns: minmax(0,1472fr) minmax(0,405fr); gap: var(--content-gap); align-items: start; }
body.afars-final .resolve-media-pair > .case-diagram { margin: 0; min-width: 0; }
body.afars-final .resolve-media-pair .case-image-trigger { overflow: visible; }
body.afars-final .cross-platform-pair { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: var(--content-gap); align-items: start; }
body.afars-final .closing-reflection > .reflection-statement { margin: 0; }
body.afars-final .closing-reflection > p.type-body { margin-top: var(--content-gap); }
@media (max-width: 900px) {
  body.afars-final .legacy-screens { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 720px) {
  body.afars-final .process-media-grid { grid-template-columns: minmax(0,1fr); }
  body.afars-final :is(.footer-row, .footer-primary) { gap: calc(var(--content-gap) / 4); }
  body.afars-final .connected-experiences, body.afars-final .capture-screens, body.afars-final .cross-platform-pair { grid-template-columns: minmax(0,1fr); }
  body.afars-final .connected-experiences > .screen-mobile,
  body.afars-final .capture-screens .screen-mobile,
  body.afars-final .cross-platform-pair .screen-mobile { width: 70%; margin-inline: auto; }
  body.afars-final .workflow-detail { width: 100%; }
  body.afars-final .hero-experiences.visual-composition { padding: var(--grid-gap); }
}
@media (max-width: 440px) {
  body.afars-final .legacy-screens { grid-template-columns: minmax(0,1fr); }
  body.afars-final .legacy-screen { width: 80%; margin-inline: auto; }
}