.case-study-page { background: var(--about-surface); }
.case-study-page main { background: var(--about-surface); }
.case-study-page .site-footer { margin-top: 0px; }
.case-study-hero { padding: 60px 0px 56px; background: var(--about-surface); }
.case-title-grid { display: grid; grid-template-columns: minmax(0px, 1.2fr) minmax(390px, 0.8fr); gap: 72px; align-items: start; }
.case-title-copy h1 { max-width: 760px; font-size: clamp(52px, 6vw, 78px); line-height: 0.98; }
.case-deck { max-width: 690px; margin: 28px 0px 0px; color: var(--ink-soft); font-family: Georgia, "Times New Roman", serif; font-size: clamp(24px, 2.35vw, 32px); line-height: 1.3; }
.case-reading { display: flex; gap: 10px; margin: 26px 0px 0px; color: var(--rose); font-size: 14px; font-weight: 750; letter-spacing: 0.04em; }
.case-facts { display: grid; grid-template-columns: 1fr 1fr; margin: 0px; overflow: hidden; background: rgb(255, 249, 248); border: 1px solid rgb(234, 219, 216); border-radius: 20px; }
.case-facts > div { min-width: 0px; padding: 18px 22px; border-bottom: 1px solid rgb(234, 219, 216); }
.case-facts > div:nth-child(2n+1):not(.fact-wide) { border-right: 1px solid rgb(234, 219, 216); }
.case-facts .fact-wide { grid-column: 1 / -1; }
.case-facts .fact-recognition { border-bottom: 0px; background: rgb(255, 253, 252); }
.case-facts dt { color: var(--eyebrow-rose); font-size: 11px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.case-facts dd { margin: 6px 0px 0px; color: var(--ink); font-size: 15px; font-weight: 650; line-height: 1.45; }
.case-chapter { padding: 78px 0px; scroll-margin-top: 94px; }
.chapter-soft { background: var(--range-surface); }
.chapter-heading { display: grid; grid-template-columns: 58px minmax(0px, 1fr); gap: 16px; align-items: center; max-width: 900px; margin: 0px auto 36px; }
.chapter-number { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: var(--rose); background: var(--wash); border-radius: 50%; font-family: Georgia, "Times New Roman", serif; font-size: 17px; font-weight: 700; }
.chapter-heading h2 { font-size: clamp(30px, 3.3vw, 42px); }
.case-prose { width: calc(100% - 148px); max-width: 752px; margin-inline: auto; color: var(--ink-soft); font-size: 17px; line-height: 1.66; }
.case-prose p { margin: 0px 0px 24px; }
.case-prose p:last-child { margin-bottom: 0px; }
.chapter-lead { color: var(--ink); font-family: Georgia, "Times New Roman", serif; font-size: clamp(23px, 2.2vw, 30px); line-height: 1.4; }
.chapter-kicker { color: var(--rose); font-size: 14px; font-weight: 850; letter-spacing: 0.13em; text-transform: uppercase; }
.chapter-turn { color: var(--ink); font-size: 20px; font-weight: 750; }
.case-figure { max-width: 1140px; margin: 46px auto 0px; }
.case-figure img { width: 100%; height: auto; border: 1px solid rgba(49, 45, 42, 0.09); border-radius: 14px; box-shadow: rgba(49, 45, 42, 0.07) 0px 12px 32px; }
.case-figure figcaption { margin-top: 12px; color: var(--ink-soft); font-size: 14px; text-align: center; }
.case-figure-featured { padding: 18px; background: var(--ivory); border-radius: 20px; }
.case-figure-featured + .case-prose { margin-top: 48px; }
.people-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 14px; max-width: 1040px; margin: 36px auto 42px; }
.people-grid article { min-height: 210px; padding: 26px 22px; background: var(--white); border: 1px solid rgba(108, 63, 73, 0.12); border-radius: 16px; }
.person-product { margin: 0px 0px 28px; color: var(--eyebrow-rose); font-size: 12px; font-weight: 850; letter-spacing: 0.14em; }
.people-grid h3 { font-family: Georgia, "Times New Roman", serif; font-size: 27px; font-weight: 500; }
.people-grid article > p:last-child { margin: 12px 0px 0px; color: var(--ink-soft); font-size: 15px; line-height: 1.5; }
.problem-panel { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 0px; max-width: 960px; margin: 0px auto; overflow: hidden; background: var(--wash); border-left: 5px solid var(--rose); border-radius: 0px 20px 20px 0px; }
.problem-panel article { padding: 34px 36px; }
.problem-panel article + article { border-left: 1px solid rgba(108, 63, 73, 0.16); }
.problem-panel p { margin: 0px; color: var(--ink-soft); font-size: 17px; line-height: 1.65; }
.problem-panel .problem-label { margin: 0px 0px 16px; color: var(--rose); font-size: 13px; font-weight: 850; letter-spacing: 0.12em; line-height: 1.35; text-transform: uppercase; }
.audit-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 22px; margin: 54px 0px; }
.audit-card { overflow: hidden; background: var(--white); border: 1px solid rgba(49, 45, 42, 0.1); border-radius: 18px; box-shadow: rgba(49, 45, 42, 0.05) 0px 7px 22px; }
.audit-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-bottom: 1px solid rgba(49, 45, 42, 0.08); }
.audit-card > div { padding: 24px 26px 28px; }
.audit-card .card-meta { margin-bottom: 12px; }
.audit-card > div > p:last-child { margin: 0px; color: var(--ink-soft); font-size: 16px; line-height: 1.55; }
.paired-figures { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 22px; margin: 46px 0px; }
.paired-figures .case-figure { margin: 0px; }
.tall-screen-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 24px; align-items: start; max-width: 1040px; margin: 50px auto; }
.tall-screen-grid .case-figure { margin: 0px; padding: 16px; background: var(--range-surface); border-radius: 18px; }
.tall-screen-grid img { border-radius: 10px; box-shadow: none; }
.invention-section { color: var(--ivory); background: var(--featured); }
.invention-section .chapter-number { color: var(--ivory); background: rgba(249, 237, 236, 0.15); }
.invention-section .chapter-heading { max-width: 900px; }
.invention-section .chapter-heading h2 { color: var(--ivory); }
.invention-intro { max-width: 900px; margin: 0px auto 42px; padding: 42px 46px; color: var(--ink); background: var(--ivory); border-radius: 20px; }
.invention-intro h3 { max-width: 780px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(28px, 3vw, 39px); font-weight: 500; line-height: 1.2; }
.invention-intro > p:not(.chapter-kicker) { margin: 20px 0px 0px; color: var(--ink-soft); font-size: 17px; line-height: 1.65; }
.prose-on-dark { color: rgba(248, 244, 234, 0.86); }
.comparison-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 18px; margin: 50px 0px; }
.comparison-grid figure { margin: 0px; overflow: hidden; background: var(--ivory); border-radius: 16px; }
.comparison-grid img { width: 100%; border-bottom: 1px solid rgba(49, 45, 42, 0.1); }
.comparison-grid figcaption { padding: 14px 18px 16px; color: var(--ink-soft); font-size: 13px; font-weight: 750; letter-spacing: 0.04em; }
.recognition-callout { display: grid; grid-template-columns: 52px minmax(0px, 1fr); gap: 20px; align-items: center; max-width: 760px; margin: 40px auto 0px; padding: 24px 28px; color: var(--ivory); background: rgba(248, 244, 234, 0.1); border: 1px solid rgba(248, 244, 234, 0.28); border-radius: 16px; }
.recognition-mark { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; color: var(--featured); background: var(--ivory); border-radius: 50%; }
.recognition-mark svg { width: 27px; height: 27px; fill: none; stroke: currentcolor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.recognition-mark svg path:first-of-type { fill: currentcolor; stroke: none; }
.recognition-callout p { margin: 0px; }
.recognition-label { color: var(--coral-light); font-size: 12px; font-weight: 850; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 5px !important; }
.recognition-callout div > p:last-child { font-family: Georgia, "Times New Roman", serif; font-size: 22px; line-height: 1.35; }
.impact-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 14px; margin: 0px 0px 52px; }
.impact-grid article { min-height: 170px; padding: 28px 24px; background: var(--white); border: 1px solid rgba(108, 63, 73, 0.13); border-radius: 16px; }
.impact-grid strong { display: block; color: var(--rose); font-family: Georgia, "Times New Roman", serif; font-size: 42px; line-height: 1; }
.impact-grid span { display: block; margin-top: 16px; color: var(--ink-soft); font-size: 14px; line-height: 1.45; }
.animation-frame { max-width: 980px; padding: 16px; background: var(--white); border-radius: 20px; }
.reflection-section { padding-block: 82px; }
.reflection-layout { max-width: 1140px; }
.reflection-layout .chapter-heading { max-width: 900px; }
.reflection-card { max-width: 900px; margin: 0px auto; padding: 8px 36px; background: var(--wash); border: 1px solid rgba(108, 63, 73, 0.12); border-radius: 20px; }
.reflection-card article { display: grid; grid-template-columns: 48px 190px minmax(0px, 1fr); gap: 22px; align-items: start; padding: 30px 0px; }
.reflection-card article + article { border-top: 1px solid rgba(49, 45, 42, 0.13); }
.reflection-index { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; color: var(--ivory); background: var(--rose); border-radius: 50%; font-size: 12px; font-weight: 800; }
.reflection-card h3 { padding-top: 5px; color: var(--ink); font-size: 17px; letter-spacing: 0px; line-height: 1.4; }
.reflection-card p { margin: 0px; color: var(--ink-soft); font-size: 16px; line-height: 1.6; }
.case-project-nav { display: block; padding: 50px 0px; background: var(--range-surface); border-top: 1px solid rgba(49, 45, 42, 0.12); }
.case-project-nav-inner { display: flex; justify-content: flex-end; }
.next-case { display: flex; align-items: center; gap: 20px; min-width: min(100%, 430px); padding: 4px 0px; color: var(--ink); text-align: right; text-decoration: none; }
.next-case > span:first-child { display: grid; gap: 5px; flex: 1 1 0%; }
.project-direction { color: var(--eyebrow-rose); font-size: 12px; font-weight: 850; letter-spacing: 0.13em; text-transform: uppercase; }
.project-name { font-family: Georgia, "Times New Roman", serif; font-size: 24px; }
.project-arrow { color: var(--rose); font-size: 30px; transition: transform 0.2s; }
.next-case:hover .project-name, .next-case:focus-visible .project-name { color: var(--rose); }
.next-case:hover .project-arrow, .next-case:focus-visible .project-arrow { transform: translateX(4px); }
.case-project-nav .next-case:hover, .case-project-nav .next-case:focus-visible { background: transparent; }
.next-case:focus-visible { outline: 2px solid var(--rose); outline-offset: 8px; border-radius: 4px; }
.learning-journey-page .case-title-grid { align-items: start; }
.learning-journey-page .case-title-copy h1 { max-width: 820px; }
.reframe-panel { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); max-width: 900px; margin: 0px auto 44px; overflow: hidden; background: var(--wash); border-left: 5px solid var(--rose); border-radius: 0px 20px 20px 0px; }
.reframe-panel article { min-height: 170px; padding: 34px 36px; }
.reframe-panel article + article { border-left: 1px solid rgba(108, 63, 73, 0.16); }
.reframe-panel p { margin: 0px; color: var(--ink-soft); font-family: Georgia, "Times New Roman", serif; font-size: 25px; line-height: 1.45; }
.reframe-panel .problem-label { margin: 0px 0px 15px; color: var(--rose); font-family: inherit; font-size: 13px; font-weight: 850; letter-spacing: 0.12em; line-height: 1.35; text-transform: uppercase; }
.vision-grid { display: grid; grid-template-columns: minmax(0px, 1.45fr) minmax(260px, 0.55fr); gap: 24px; align-items: stretch; max-width: 1080px; margin: 48px auto 0px; }
.vision-grid .case-figure { display: flex; flex-direction: column; margin: 0px; padding: 16px; background: var(--ivory); border-radius: 18px; }
.vision-grid img { flex: 1 1 0%; object-fit: contain; box-shadow: none; }
.vision-tablet img { max-height: 590px; }
.learner-origin-grid { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 22px; align-items: stretch; max-width: 1060px; margin: 46px auto; }
.learner-origin-grid .case-figure { display: flex; flex-direction: column; margin: 0px; padding: 16px; background: var(--white); border-radius: 18px; }
.learner-origin-grid img { flex: 1 1 0%; object-fit: contain; box-shadow: none; }
.journey-screen-pair { max-width: 1100px; margin-inline: auto; }
.journey-screen-pair .case-figure { padding: 14px; background: var(--white); border-radius: 18px; }
.journey-screen-pair img { box-shadow: none; }
.mobile-story { display: grid; grid-template-columns: minmax(0px, 1.45fr) minmax(320px, 0.85fr); gap: 40px; align-items: center; max-width: 1080px; margin: 58px auto 0px; padding: 36px; background: var(--wash); border-radius: 20px; }
.mobile-screens { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; align-items: start; }
.mobile-screens figure { margin: 0px; overflow: hidden; background: var(--white); border-radius: 9px; box-shadow: rgba(49, 45, 42, 0.08) 0px 8px 24px; }
.mobile-screens img { width: 100%; height: auto; border: 0px; border-radius: 0px; box-shadow: none; }
.mobile-story h3 { margin: 12px 0px 18px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(28px, 3vw, 39px); font-weight: 500; line-height: 1.2; }
.mobile-story div > p:last-child { margin: 0px; color: var(--ink-soft); font-size: 17px; line-height: 1.65; }
.paper-wide { max-width: 900px; padding: 18px; background: var(--ivory); border-radius: 20px; }
.paper-wide img { box-shadow: none; }
.journey-versioning .versioning-whiteboard { max-width: 900px; padding: 16px; background: var(--ivory); border-radius: 18px; }
.journey-versioning .versioning-whiteboard img { box-shadow: none; }
.versioning-steps { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 18px; margin: 46px 0px 0px; }
.versioning-steps article { position: relative; overflow: hidden; padding: 14px 14px 24px; color: var(--ink); background: var(--ivory); border-radius: 18px; }
.versioning-steps article > span { position: absolute; top: 24px; left: 24px; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--ivory); background: var(--rose); border-radius: 50%; font-size: 12px; font-weight: 800; }
.versioning-steps img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: center top; border-radius: 10px; }
.versioning-steps h3 { margin: 20px 10px 8px; font-family: Georgia, "Times New Roman", serif; font-size: 23px; font-weight: 500; }
.versioning-steps p { margin: 0px 10px; color: var(--ink-soft); font-size: 15px; line-height: 1.55; }
.safeguard-callout { max-width: 900px; margin: 38px auto 0px; padding: 28px 32px; color: var(--ivory); background: rgba(248, 244, 234, 0.1); border: 1px solid rgba(248, 244, 234, 0.28); border-radius: 16px; }
.safeguard-callout p { margin: 0px; }
.safeguard-callout p:last-child { margin-top: 7px; font-family: Georgia, "Times New Roman", serif; font-size: 22px; line-height: 1.42; }
.wizard-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 18px; margin: 46px 0px; }
.wizard-grid figure { position: relative; margin: 0px; overflow: hidden; background: var(--white); border: 1px solid rgba(49, 45, 42, 0.1); border-radius: 18px; }
.wizard-grid figure > span { position: absolute; top: 20px; left: 20px; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--ivory); background: var(--rose); border-radius: 50%; font-size: 12px; font-weight: 800; }
.wizard-grid img { width: 100%; aspect-ratio: 16 / 11; object-fit: cover; object-position: center top; border-bottom: 1px solid rgba(49, 45, 42, 0.08); }
.wizard-grid figcaption { padding: 17px 20px 19px; color: var(--ink); font-family: Georgia, "Times New Roman", serif; font-size: 20px; }
.user-import-figure { max-width: 900px; padding: 14px; }
.user-import-figure img { box-shadow: none; }
.reporting-feature { display: grid; grid-template-columns: minmax(0px, 1.2fr) minmax(320px, 0.8fr); gap: 42px; align-items: center; max-width: 1080px; margin: 54px auto; padding: 28px; background: var(--wash); border: 1px solid rgba(108, 63, 73, 0.1); border-radius: 20px; }
.reporting-feature .case-figure { margin: 0px; padding: 14px; background: var(--white); border-radius: 14px; }
.reporting-feature img { box-shadow: none; }
.reporting-feature h3 { margin: 12px 0px 18px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(28px, 3vw, 39px); font-weight: 500; line-height: 1.2; }
.reporting-feature div > p:last-child { margin: 0px; color: var(--ink-soft); font-size: 17px; line-height: 1.65; }
.reporting-drilldown { max-width: 1080px; padding: 28px; background: var(--wash); border: 1px solid rgba(108, 63, 73, 0.1); }
.reporting-drilldown img { box-shadow: none; }
.journey-impact-grid { max-width: 1040px; margin-inline: auto; }
.durability-pair { max-width: 1080px; margin-inline: auto; }
.durability-pair .case-figure { padding: 14px; background: var(--white); border-radius: 18px; }
.durability-pair img { box-shadow: none; }
.journey-recognition { max-width: 900px; color: var(--ink); background: var(--ivory); border-color: rgba(108, 63, 73, 0.14); }
.journey-recognition .recognition-mark { color: var(--ivory); background: var(--rose); }
.journey-recognition .recognition-label { color: var(--eyebrow-rose); }
.journey-reflection { margin-top: 36px; }
.case-project-nav-pair { justify-content: space-between; gap: 44px; }
.case-project-nav-pair .next-case { min-width: 0px; gap: 20px; }
.previous-case { text-align: left; }
.case-project-nav .previous-case > .project-arrow { display: inline; flex: 0 0 auto; }
.case-project-nav .previous-case > .project-copy { display: grid; gap: 5px; flex: 0 1 auto; }
.previous-case:hover .project-arrow, .previous-case:focus-visible .project-arrow { transform: translateX(-4px); }
.role-flow { display: grid; grid-template-columns: minmax(0px, 1fr) 54px minmax(0px, 1fr); gap: 18px; align-items: center; max-width: 960px; margin: 42px auto; }
.role-flow article { position: relative; min-height: 230px; padding: 32px; background: var(--white); border: 1px solid rgba(108, 63, 73, 0.13); border-radius: 18px; }
.role-flow article > span { position: absolute; top: 24px; right: 24px; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--ivory); background: var(--rose); border-radius: 50%; font-size: 12px; font-weight: 800; }
.role-flow h3 { max-width: 310px; margin-top: 12px; font-family: Georgia, "Times New Roman", serif; font-size: 28px; font-weight: 500; line-height: 1.2; }
.role-flow article > p:last-child { margin: 16px 0px 0px; color: var(--ink-soft); font-size: 16px; line-height: 1.55; }
.role-flow-arrow { color: var(--rose); font-size: 34px; text-align: center; }
.storyboard-card { padding: 18px; background: var(--ivory); border-radius: 20px; }
.storyboard-card img { box-shadow: none; }
.tf-problem { margin-bottom: 34px; }
.metric-strip { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 14px; max-width: 1040px; margin: 46px auto; }
.metric-strip article { min-height: 150px; padding: 26px 22px; background: var(--white); border: 1px solid rgba(108, 63, 73, 0.13); border-radius: 16px; }
.metric-strip strong { display: block; color: var(--rose); font-family: Georgia, "Times New Roman", serif; font-size: 36px; line-height: 1; }
.metric-strip span { display: block; margin-top: 14px; color: var(--ink-soft); font-size: 14px; line-height: 1.45; }
.sod-figure { max-width: 1040px; }
.attempt-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 22px; margin-top: 48px; }
.attempt-grid article { display: flex; flex-direction: column; overflow: hidden; background: var(--wash); border: 1px solid rgba(108, 63, 73, 0.1); border-radius: 18px; }
.attempt-grid article > p, .attempt-grid article > h3 { margin-inline: 26px; }
.attempt-grid .chapter-kicker { margin-top: 28px; }
.attempt-grid h3 { margin-top: 8px; font-family: Georgia, "Times New Roman", serif; font-size: 27px; font-weight: 500; }
.attempt-grid h3 + p { margin-top: 12px; margin-bottom: 24px; color: var(--ink-soft); font-size: 15px; line-height: 1.55; }
.attempt-grid img { width: calc(100% - 28px); margin: auto 14px 14px; border: 1px solid rgba(49, 45, 42, 0.08); border-radius: 12px; }
.chapter-dark { color: var(--ivory); background: var(--featured); }
.chapter-dark .chapter-heading { max-width: 900px; }
.chapter-dark .chapter-heading h2 { color: var(--ivory); }
.chapter-dark .chapter-number { color: var(--ivory); background: rgba(249, 237, 236, 0.14); }
.chapter-dark .chapter-kicker { color: var(--coral-light); }
.decision-layout { display: grid; grid-template-columns: minmax(300px, 0.75fr) minmax(0px, 1.25fr); gap: 42px; align-items: center; }
.decision-layout > div { padding: 34px; background: rgba(248, 244, 234, 0.09); border: 1px solid rgba(248, 244, 234, 0.2); border-radius: 18px; }
.decision-layout h3 { margin-top: 12px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(28px, 3vw, 40px); font-weight: 500; line-height: 1.2; }
.decision-layout > div > p:not(.chapter-kicker) { margin: 18px 0px 0px; color: rgba(248, 244, 234, 0.84); font-size: 16px; line-height: 1.62; }
.decision-layout .case-figure { margin: 0px; padding: 14px; background: var(--ivory); border-radius: 18px; }
.decision-layout img { box-shadow: none; }
.sequence-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 20px; margin: 48px 0px; }
.sequence-grid figure { position: relative; margin: 0px; overflow: hidden; background: var(--white); border: 1px solid rgba(49, 45, 42, 0.1); border-radius: 18px; }
.sequence-grid figure > span, .wireframe-triptych figure > span { position: absolute; top: 18px; left: 18px; z-index: 1; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: var(--ivory); background: var(--rose); border-radius: 50%; font-size: 12px; font-weight: 800; }
.sequence-grid img { width: 100%; border-bottom: 1px solid rgba(49, 45, 42, 0.08); }
.sequence-grid figcaption { padding: 16px 20px 18px; color: var(--ink); font-family: Georgia, "Times New Roman", serif; font-size: 19px; }
.tf-supervisor-intro { margin-top: 58px; }
.supervisor-pair, .tf-context-pair, .stress-user-pair { max-width: 1080px; margin-inline: auto; }
.supervisor-pair .case-figure, .tf-context-pair .case-figure, .stress-user-pair .case-figure { padding: 14px; background: var(--white); border-radius: 18px; }
.supervisor-pair img, .tf-context-pair img, .stress-user-pair img { box-shadow: none; }
.tf-impact { max-width: none; margin: 54px auto 0px; }
.scope-card { max-width: 900px; margin: 42px auto; padding: 34px 38px; background: var(--wash); border-left: 5px solid var(--rose); border-radius: 0px 18px 18px 0px; }
.stress-testing-page #ambiguity .scope-card { margin-bottom: 0px; }
.scope-card h3 { max-width: 780px; margin-top: 11px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(27px, 3vw, 38px); font-weight: 500; line-height: 1.22; }
.scope-card > p:last-child { margin: 18px 0px 0px; color: var(--ink-soft); font-size: 16px; line-height: 1.62; }
.roadmap-figure { max-width: 1040px; padding: 16px; background: var(--ivory); border-radius: 20px; }
.roadmap-figure img { box-shadow: none; }
.sod-gallery { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 18px; max-width: 1040px; margin: 48px auto 0px; }
.sod-gallery figure { margin: 0px; padding: 14px; background: var(--white); border: 1px solid rgba(49, 45, 42, 0.09); border-radius: 18px; }
.sod-gallery img { width: 100%; border-radius: 12px; }
.transaction-filtering-page #decision .decision-layout, .stress-testing-page #planning .decision-layout { display: block; }
.transaction-filtering-page #decision .decision-layout > div, .stress-testing-page #planning .decision-layout > div { max-width: 760px; margin: 0px auto; }
.transaction-filtering-page #decision .decision-layout h3, .stress-testing-page #planning .decision-layout h3 { max-width: 760px; font-family: inherit; font-size: 17px; font-weight: 700; line-height: 1.6; }
.transaction-filtering-page #decision .decision-layout .case-figure, .stress-testing-page #planning .decision-layout .case-figure { max-width: 1140px; margin: 38px auto 0px; }
.storyboard-comparison { display: grid; grid-template-columns: 1fr; gap: 28px; max-width: 1040px; margin: 48px auto 0px; }
.storyboard-comparison figure { margin: 0px; padding: 20px; background: var(--wash); border-radius: 18px; }
.storyboard-comparison img { width: 100%; margin-top: 14px; border: 1px solid rgba(49, 45, 42, 0.08); border-radius: 12px; }
.storyboard-comparison figcaption { margin-top: 12px; color: var(--ink-soft); font-size: 14px; text-align: center; }
.wireframe-triptych { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 18px; margin-top: 48px; }
.wireframe-triptych figure { position: relative; margin: 0px; overflow: hidden; background: var(--white); border: 1px solid rgba(49, 45, 42, 0.1); border-radius: 18px; }
.wireframe-triptych img { width: 100%; height: auto; object-fit: contain; border-bottom: 1px solid rgba(49, 45, 42, 0.08); }
.wireframe-triptych figcaption { padding: 16px 18px 18px; font-family: Georgia, "Times New Roman", serif; font-size: 18px; }
.finding-list { max-width: 900px; margin: 44px auto; padding: 0px 34px; background: var(--wash); border: 1px solid rgba(108, 63, 73, 0.12); border-radius: 20px; }
.finding-list article { display: grid; grid-template-columns: 44px minmax(0px, 1fr); gap: 20px; padding: 27px 0px; }
.finding-list article + article { border-top: 1px solid rgba(49, 45, 42, 0.13); }
.finding-list article > span { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; color: var(--ivory); background: var(--rose); border-radius: 50%; font-size: 12px; font-weight: 800; }
.finding-list h3 { padding-top: 4px; font-size: 18px; }
.finding-list p { margin: 8px 0px 0px; color: var(--ink-soft); font-size: 16px; line-height: 1.55; }
.research-card { max-width: 960px; padding: 16px; background: var(--ivory); border-radius: 20px; }
.research-card img { box-shadow: none; }
.testing-results-intro { margin-top: 38px; }
.handoff-gallery { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 20px; margin-top: 48px; }
.handoff-gallery figure { margin: 0px; overflow: hidden; background: var(--white); border: 1px solid rgba(49, 45, 42, 0.1); border-radius: 18px; }
.handoff-gallery .handoff-feature { grid-column: 1 / -1; }
.handoff-gallery img { width: 100%; border-bottom: 1px solid rgba(49, 45, 42, 0.08); }
.handoff-gallery figcaption { padding: 15px 18px 17px; color: var(--ink-soft); font-size: 14px; text-align: center; }
.recognition-banner { display: grid; grid-template-columns: 58px minmax(0px, 1fr); gap: 22px; align-items: center; max-width: 900px; margin: 0px auto 40px; padding: 28px 32px; color: var(--ivory); background: var(--featured); border-radius: 18px; }
.recognition-banner p { margin: 0px; font-family: Georgia, "Times New Roman", serif; font-size: clamp(21px, 2.3vw, 29px); line-height: 1.35; }
.recognition-banner .recognition-label { color: var(--coral-light); font-family: inherit; font-size: 12px; line-height: 1.4; margin-bottom: 8px !important; }
.recognition-banner span { display: block; margin-top: 8px; color: rgba(248, 244, 234, 0.72); font-size: 13px; }
.stress-reflection { background: var(--wash); }
.stress-testing-page .case-project-nav-inner { justify-content: flex-start; }
.stress-only-previous { min-width: 0px; text-align: left; }
@media (min-width: 981px) {
  .ihub-audit-page .case-title-grid { grid-template-columns: minmax(0px, 1fr) minmax(450px, 0.9fr); gap: 56px; }
  .stress-testing-page .case-title-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 72px; }
}

/* WordPress integration and approved iHub refinements. */
body.case-study-page #products-and-people .people-grid h3{font-family:Georgia,"Times New Roman",serif!important;font-weight:400!important;letter-spacing:0!important}
body.case-study-page .invention-section .chapter-heading h2{color:var(--ivory)!important}
body.case-study-page .invention-section .invention-intro h3{font-family:Georgia,"Times New Roman",serif!important;font-weight:500!important;letter-spacing:0!important}
body.case-study-page .reflection-section .reflection-card h3{font-weight:650!important;letter-spacing:.012em!important;line-height:1.45}

/* Case-study-specific typography and layout corrections. */
body.learning-journey-page .journey-versioning .invention-intro h3,
body.learning-journey-page .reporting-feature h3,
body.learning-journey-page .mobile-story h3,
body.learning-journey-page .versioning-steps h3,
body.transaction-filtering-page .role-flow h3,
body.transaction-filtering-page .attempt-grid h3,
body.stress-testing-page .scope-card h3,
body.stress-testing-page .role-flow h3{
  font-family:Georgia,"Times New Roman",serif!important;
  font-weight:400!important;
  letter-spacing:0!important;
}
body.learning-journey-page .mobile-story h3{letter-spacing:-.01em!important}
body.learning-journey-page .journey-versioning .invention-intro h3{max-width:850px!important;font-size:37px!important;letter-spacing:-.025em!important;line-height:1.18!important}
body.learning-journey-page .versioning-steps h3{letter-spacing:-.01em!important}
body.learning-journey-page .reporting-feature h3{letter-spacing:-.025em!important}
body.learning-journey-page .wizard-grid{align-items:start}
body.learning-journey-page .wizard-grid figure{align-self:start}
body.learning-journey-page .wizard-grid img{display:block;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important}
body.learning-journey-page .journey-impact-grid{width:100%;max-width:none}
body.learning-journey-page .journey-impact-grid article:last-child strong{font-size:36px;white-space:nowrap}
body.stress-testing-page .scope-card h3{letter-spacing:-.015em!important}
body.stress-testing-page #usability .finding-list h3{letter-spacing:.012em!important}
body.transaction-filtering-page #decision .chapter-heading h2,
body.stress-testing-page #planning .chapter-heading h2{color:var(--ivory)!important}
body.transaction-filtering-page #decision .decision-layout h3,
body.stress-testing-page #planning .decision-layout h3{color:var(--ivory)!important}
@media(min-width:721px){body.transaction-filtering-page .tf-metrics{width:100%;max-width:none;grid-template-columns:repeat(4,minmax(0,1fr))!important}}
.case-lightbox-trigger{cursor:zoom-in}
.case-lightbox[hidden]{display:none}
.case-lightbox{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:64px 28px 28px;background:rgba(20,18,17,.92)}
.case-lightbox figure{display:flex;flex-direction:column;align-items:center;max-width:min(94vw,1600px);max-height:calc(100vh - 92px);margin:0}
.case-lightbox img{display:block;width:auto;max-width:100%;height:auto;max-height:calc(100vh - 130px);background:#fff;border-radius:14px}
.case-lightbox figcaption{max-width:900px;margin-top:12px;color:var(--ivory);font-size:14px;line-height:1.5;text-align:center}
.case-lightbox-close{position:absolute;top:20px;right:24px;display:grid;place-items:center;width:44px;height:44px;padding:0;color:var(--ivory);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.55);border-radius:50%;font-family:Arial,sans-serif;font-size:30px;font-weight:300;line-height:1;cursor:pointer}
.case-lightbox-close:hover,.case-lightbox-close:focus-visible{color:var(--ink);background:var(--ivory);outline:3px solid rgba(255,255,255,.3);outline-offset:3px}
.case-lightbox-open{overflow:hidden}
@media(max-width:720px){.case-lightbox{padding:60px 14px 18px}.case-lightbox-close{top:12px;right:14px}}
@media (max-width: 980px) {
  .case-title-grid { grid-template-columns: 1fr; gap: 46px; }
  .case-facts { max-width: 680px; }
  .people-grid, .impact-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .versioning-steps, .wizard-grid { grid-template-columns: 1fr; }
  .versioning-steps article { display: grid; grid-template-columns: minmax(220px, 0.9fr) minmax(0px, 1.1fr); column-gap: 24px; }
  .versioning-steps img { grid-row: 1 / 3; }
  .versioning-steps h3 { align-self: end; margin-top: 28px; }
  .versioning-steps p { align-self: start; }
  .role-flow, .decision-layout, .stress-planning-layout { grid-template-columns: 1fr; }
  .role-flow-arrow { transform: rotate(90deg); }
  .wireframe-triptych { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .case-study-hero { padding: 50px 0px 48px; }
  .case-title-copy h1 { font-size: clamp(44px, 14vw, 62px); }
  .case-deck { font-size: 23px; }
  .case-facts { grid-template-columns: 1fr; }
  .case-facts > div, .case-facts > div:nth-child(2n+1):not(.fact-wide) { border-right: 0px; }
  .case-facts .fact-wide { grid-column: auto; }
  .case-chapter { padding: 60px 0px; }
  .chapter-heading { grid-template-columns: 46px minmax(0px, 1fr); gap: 12px; margin-bottom: 30px; }
  .chapter-number { width: 40px; height: 40px; font-size: 15px; }
  .chapter-heading h2 { font-size: clamp(28px, 8vw, 35px); }
  .case-prose { width: auto; font-size: 16px; }
  .people-grid, .audit-grid, .paired-figures, .tall-screen-grid, .comparison-grid, .impact-grid { grid-template-columns: 1fr; }
  .people-grid { gap: 12px; }
  .people-grid article { min-height: 0px; }
  .problem-panel { grid-template-columns: 1fr; }
  .problem-panel article { padding: 26px 24px; }
  .problem-panel article + article { border-top: 1px solid rgba(108, 63, 73, 0.16); border-left: 0px; }
  .reframe-panel { grid-template-columns: 1fr; }
  .reframe-panel article { min-height: 0px; padding: 26px 24px; }
  .reframe-panel article + article { border-top: 1px solid rgba(108, 63, 73, 0.16); border-left: 0px; }
  .reframe-panel p { font-size: 22px; }
  .case-figure { margin-top: 34px; }
  .audit-grid, .comparison-grid { margin-block: 38px; }
  .invention-intro { padding: 30px 24px; }
  .recognition-callout { grid-template-columns: 42px minmax(0px, 1fr); padding: 22px 20px; }
  .recognition-mark { width: 38px; height: 38px; }
  .recognition-callout div > p:last-child { font-size: 19px; }
  .reflection-section { padding-block: 64px; }
  .reflection-card { padding: 0px 24px; }
  .reflection-card article { grid-template-columns: 40px minmax(0px, 1fr); gap: 16px; padding: 26px 0px; }
  .reflection-card h3 { padding-top: 7px; }
  .reflection-card p { grid-column: 2; font-size: 16px; }
  .vision-grid, .learner-origin-grid, .mobile-story, .reporting-feature { grid-template-columns: 1fr; }
  .metric-strip, .attempt-grid, .sequence-grid, .sod-gallery, .storyboard-comparison, .handoff-gallery { grid-template-columns: 1fr; }
  .handoff-gallery .handoff-feature { grid-column: auto; }
  .role-flow article, .decision-layout > div { padding: 26px 24px; }
  .finding-list { padding: 0px 22px; }
  .recognition-banner { grid-template-columns: 46px minmax(0px, 1fr); padding: 24px; }
  .vision-tablet img { max-height: 520px; }
  .mobile-story { gap: 28px; padding: 30px 24px; }
  .mobile-screens { gap: 7px; }
  .versioning-steps article { display: block; }
  .versioning-steps article > span, .wizard-grid figure > span { top: 18px; left: 18px; }
  .case-project-nav { padding: 28px 0px; }
  .case-project-nav-pair { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
  .case-project-nav-pair .next-case { width: auto; }
  .next-case { flex: 0 0 auto; min-width: 0px; gap: 8px; padding: 8px 0px; }
  .project-arrow { font-size: 24px; line-height: 1; }
  .project-name { display: none; }
  .project-direction { font-size: 0px; line-height: 1; }
  .previous-case .project-direction::after { content: "Previous"; font-size: 12px; }
  .next-case:not(.previous-case) .project-direction::after { content: "Next"; font-size: 12px; }
  .wizard-grid img { height: auto; aspect-ratio: auto; object-fit: contain; }
  .wireframe-triptych img { height: auto; aspect-ratio: auto; object-fit: contain; }
}