/* The render is the focus; chapter controls remain outside the architecture. */
.case-study-animation{grid-template-columns:minmax(240px,.7fr) minmax(0,1.5fr);gap:5%;max-width:1600px}
.case-visual,.case-narrative{min-width:0}.case-visual{top:28px;overflow:visible}
#building-model{position:relative;width:100%;aspect-ratio:4/3;background:#c7c9c3;overflow:hidden;isolation:isolate}
#building-model canvas{display:block;width:100%;height:100%;object-fit:contain;max-width:none}
.model-fallback{position:absolute;top:35%;left:10%;right:10%;font-size:15px;text-align:center;line-height:1.5}
#building-model[data-ready=true] .model-fallback{display:none}
.model-label{position:absolute;bottom:18px;left:20px;font-size:9px;letter-spacing:.1em;color:#25372d;pointer-events:none;background:#f5f4eddd;padding:7px 9px}
.model-motion-toggle{position:absolute;top:14px;right:14px;border:1px solid #4e5b4e55;border-radius:0;background:#f5f4eddd;color:#25372d;font:inherit;font-size:10px;min-height:40px;padding:8px 12px;cursor:pointer}
.model-motion-toggle:focus-visible,.scene-nav a:focus-visible{outline:2px solid #26382f;outline-offset:3px}.model-motion-toggle[hidden]{display:none}
.model-legend{position:absolute;top:16px;left:20px;max-width:65%;background:#f5f4edee;padding:9px 10px;font-size:10px;line-height:1.5;color:#25372d;display:flex;align-items:center;gap:7px;flex-wrap:wrap}.model-legend[hidden]{display:none}
.model-legend span{display:inline-block;width:15px;height:3px}.legend-thermal{background:#ad8a52}.legend-supply{background:#437c8f}.legend-extract{background:#a06448}
.case-toolbar{font-size:10px;letter-spacing:.08em;border-bottom:0;padding:12px 0 15px}
.scene-nav{position:relative;gap:14px;margin-top:8px}.scene-nav a{display:inline-flex;align-items:center;min-height:44px;font-size:11px;transition:color .2s}.scene-nav:after{content:'';height:2px;position:absolute;bottom:-3px;left:0;width:var(--scene-progress,0%);background:#637d70}
.case-study-animation .case-step{min-height:92vh}.case-step h2{font-size:clamp(32px,3.5vw,54px)}
.model-source{margin-top:20px;color:#586158;font-size:11px;line-height:1.55;max-width:72ch}.model-source summary{cursor:pointer;min-height:32px;display:list-item}.model-source p{font-size:11px;line-height:1.55;margin:8px 0}
@media(min-width:901px){.case-visual{width:100%;max-width:calc((100svh - 200px)*4/3);justify-self:end}.model-source{margin-top:10px}}
@media(max-width:900px){.case-study-animation{grid-template-columns:minmax(0,1fr);gap:0}.case-visual{top:0;background:#f8f5f2;padding-bottom:8px}#building-model{aspect-ratio:4/3;max-width:calc(38svh*4/3);margin-inline:auto}#building-model canvas{height:100%;object-fit:contain}.case-toolbar{font-size:9px;padding:8px 0}.model-label{left:10px;bottom:10px;font-size:8px;padding:5px}.model-motion-toggle{right:10px;top:10px;font-size:9px;min-height:36px;padding:7px}.model-legend{left:10px;top:10px;max-width:62%;font-size:8px;padding:6px}.scene-nav{margin:0;gap:10px}.scene-nav a{font-size:10px}.model-source{margin-top:8px;font-size:10px}.model-source p{font-size:10px}.case-study-animation .case-step{min-height:78vh;scroll-margin-top:calc(var(--model-panel-height,400px) + 16px);padding:40px 0 70px}.case-step h2{font-size:36px}}
@media(prefers-reduced-motion:reduce){.scene-nav a{transition:none}}
.frame-comparison{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0 0}.frame-comparison img{width:100%;height:auto;display:block;margin:0 0 10px;max-width:none}.frame-comparison strong,.frame-comparison span{display:block}.frame-comparison strong{font-size:16px;font-weight:500}.frame-comparison span{font-size:11px;color:#586158;margin-top:4px}.frame-comparison figcaption{grid-column:1/-1;font-size:11px;line-height:1.5;color:#586158}


.model-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;margin:0!important;max-height:none!important}#building-model:not([data-ready=true]) canvas{opacity:0}#building-model[data-ready=true] .model-poster{display:none}.model-fallback{display:none}#building-model[data-ready=false] .model-fallback{display:block;background:#f5f4edf0;padding:14px;z-index:2}

/* Heat recovery chapter switch */
.model-switch{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid #b9bcb2;margin-top:24px}.model-switch a{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;font-size:12px;text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;color:#586158}.model-switch a[aria-current=step]{border-color:#31483b;color:#26382f}.model-switch a:hover{color:#26382f;background:#e9eae2}.model-switch a:focus-visible{outline:2px solid #26382f;outline-offset:2px}

.model-flow-key{display:grid;grid-template-columns:1fr 1fr;gap:3px 12px;max-width:70%}.model-flow-key span{display:flex;align-items:center;gap:5px;width:auto;height:auto}.model-flow-key span:before{content:"";display:inline-block;width:10px;height:3px;background:var(--flow-color);flex-shrink:0}@media(max-width:900px){.model-flow-key{gap:2px 8px;max-width:65%;font-size:7px}}
.model-switch a:before{content:none}
@media(max-width:900px){.model-flow-key{font-size:8.5px}}

/* Keep the four airflow connections visible on small screens. */
@media(max-width:900px){#building-model{overflow:visible;margin-bottom:44px}.model-legend{top:calc(100% + 4px);left:0;max-width:none;width:100%;box-sizing:border-box;padding:5px 8px;background:#efeee7}.model-flow-key{grid-template-columns:1fr 1fr}}

@media(max-width:900px){.model-source{margin-bottom:0}}

/* The rendered model shares the page surface. */
body,.case-visual,#building-model{background:#f4efe9}

/* Revision 12: the visual is unlabelled; the narrative carries the explanation. */
.case-toolbar,.model-label,.model-motion-toggle,.model-legend{display:none!important}
.methodology-summary{max-width:55ch;font-size:clamp(19px,2vw,27px);line-height:1.5}
.pillar-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;margin:52px 0 48px}
.pillar-overview a{display:block;text-decoration:none;color:inherit;border-top:1px solid #9da69d;padding-top:18px}
.pillar-overview span{font-size:12px;color:#65786b}.pillar-overview h2{font-size:clamp(23px,2.5vw,34px);line-height:1.12;margin:24px 0 18px}.pillar-overview p{font-size:16px;line-height:1.6;margin:0}.pillar-overview a:hover{border-color:#26382f}
.methodology-why{display:grid;grid-template-columns:1fr 2fr;gap:0 40px;border-top:1px solid #c7c9c0;padding-top:28px}.methodology-why h2{font-size:27px;grid-row:span 2}.methodology-why p{max-width:65ch;margin-top:0}
.case-step h3{font-size:20px;font-weight:500;margin:28px 0 12px}.case-step .eyebrow{color:#52685a}
.airflow-key{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;padding:0;list-style:none;font-size:12px;margin:24px 0}.airflow-key li:before{content:'';display:inline-block;width:16px;height:3px;background:var(--flow-color);margin-right:8px;vertical-align:middle}
.studio-intro .model-source{margin-top:42px;max-width:85ch}.studio-intro .model-source p{font-size:13px}
@media(min-width:901px){.case-visual{top:36px;max-width:calc((100svh - 80px)*4/3)}}
@media(max-width:900px){#building-model{margin-bottom:0;overflow:hidden;max-width:calc(38svh*4/3)}.case-visual{padding-bottom:0}.pillar-overview{grid-template-columns:1fr;gap:26px;margin:32px 0}.pillar-overview h2{margin:14px 0 12px}.methodology-why{grid-template-columns:1fr;gap:0}.methodology-why h2{grid-row:auto}.case-step h3{font-size:19px}}

.pillar-overview{align-items:start}.pillar-overview a:before{content:none}
