.cad-story{margin:40px 0 0;border-top:1px solid #adc4bc;padding-top:30px}
.cad-story-heading{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start;margin-bottom:26px}
.cad-story-heading h4{font-size:30px;line-height:1.2;margin:12px 0 0}
.cad-story-heading>p{margin:0;max-width:62ch;line-height:1.7}
.cad-panel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:30px;align-items:start;background:#eef3f1;padding:26px}
.cad-figure{min-width:0;margin:0;padding:0!important}
.cad-canvas{position:relative;width:min(100%,calc(540px * var(--cad-ratio)));margin:0 auto;background:#fff;isolation:isolate}
.cad-canvas img,.engineering-stage .cad-canvas img,#drawing-cad .cad-canvas img{display:block;width:100%;height:auto;min-height:0;max-height:none;object-fit:initial}
.cad-leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.cad-leaders line{stroke:#173d50;stroke-width:1.5;vector-effect:non-scaling-stroke}
.cad-pin{position:absolute;transform:translate(-50%,-50%);width:32px;height:32px;border:2px solid #fff;border-radius:50%;background:#173d50;color:white;box-shadow:0 1px 5px #0004;padding:0;font:600 14px/1 Arial,sans-serif;cursor:pointer;z-index:1}
.cad-pin[aria-pressed=true]{background:#287251;box-shadow:0 0 0 3px #f6d676}
.cad-pin:focus-visible,.cad-note-button:focus-visible,.cad-expand:focus-visible{outline:3px solid #ca7e29;outline-offset:4px}
.cad-figure .media-caption{font-size:14px;line-height:1.5;margin-top:20px;padding-top:12px}
.cad-expand{display:block;background:#173d50;color:#fff;border:0;min-height:44px;padding:12px 16px;font:600 14px/1.4 Arial,sans-serif;margin-top:16px;cursor:pointer;text-align:left}
.cad-explanation h4{font-size:25px;line-height:1.25;margin:12px 0 22px}
.cad-explanation>p:not(.topic-label){font-size:16px;line-height:1.65}
.cad-notes{list-style:none!important;margin:0!important;padding:0!important;counter-reset:none!important}
.cad-notes li{display:block!important;position:relative;border-top:1px solid #b5cac3;padding:0!important;margin:0!important}
.cad-note-button{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;text-align:left;width:100%;padding:15px 5px;border:0;background:transparent;color:inherit;cursor:pointer;font:inherit;line-height:1.5}
.cad-note-button strong{display:block;font-size:17px;line-height:1.35}
.cad-note-number{font-size:13px;color:#287251}
.cad-note-text{display:block;font-size:15px;line-height:1.55;margin-top:6px;font-weight:400}
.cad-notes li.is-selected{background:#dae9e2;box-shadow:inset 3px 0 #287251}
.cad-story-views--pair{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cad-story-views--pair .cad-panel{display:block;min-width:0}
.cad-story-views--pair .cad-explanation{margin-top:24px}
.cad-story-views--pair .cad-canvas{width:min(100%,calc(350px * var(--cad-ratio)))}
.cad-story-views--pair .cad-explanation h4{font-size:23px}
/* The two tank details share editorial rows while keeping their own image ratios. */
@media(min-width:901px){
 #cad-olcum{--tank-frame-height:clamp(220px,25vw,350px)}
 #cad-olcum .cad-figure{display:grid;grid-template-rows:var(--tank-frame-height) 58px 48px;gap:16px}
 #cad-olcum .cad-canvas{align-self:center;justify-self:center;width:min(100%,calc(var(--tank-frame-height) * var(--cad-ratio)))}
 #cad-olcum .cad-figure .media-caption{margin:0;padding-top:12px;align-self:start}
 #cad-olcum .cad-expand{margin:0;align-self:start;justify-self:start}
}
.cad-legend{margin-top:24px;padding:20px 24px;border:1px solid #adc4bc;background:#fff}
.cad-legend ul{display:flex;gap:24px;flex-wrap:wrap;list-style:none;padding:0;margin:14px 0}
.cad-legend li{display:flex;align-items:center;gap:10px;font-size:15px}
.cad-legend li span{width:20px;height:12px;border:1px solid #687e82}
.cad-legend p{font-size:14px;margin:0}
.engineering-stage--cad{display:block!important;padding:0;background:transparent!important}
.engineering-stage--cad .cad-panel{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);padding:0;gap:0;background:white}
.engineering-stage--cad .cad-figure{padding:28px!important}
.engineering-stage--cad .cad-explanation{background:#173d50;color:white;padding:32px}
.engineering-stage--cad .cad-explanation .topic-label,.engineering-stage--cad .cad-note-number{color:#a9d4bd}
.engineering-stage--cad .cad-notes li{border-color:#58757c}
.engineering-stage--cad .cad-notes li.is-selected{background:#2b525e}
.cad-gallery-actions{display:flex;flex-wrap:wrap;gap:22px;padding:20px 28px;background:#e5eeea}
.solution-card .cad-story{margin:32px 0}
.solution-cad-links{display:flex;gap:20px;flex-wrap:wrap;margin:22px 0}
#drawing-cad[hidden],#drawing-large[hidden]{display:none!important}
#drawing-cad .cad-panel{display:block;padding:12px;background:#f1f5f3}
#drawing-cad .cad-canvas{width:min(100%,calc(62svh * var(--cad-ratio)))}
#drawing-cad .cad-explanation{max-width:900px;margin:28px auto 0}
#drawing-cad .cad-notes{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
#drawing-dialog.zoomed #drawing-cad .cad-canvas{width:190%;max-width:none;margin:0}
#drawing-dialog.zoomed #drawing-cad .cad-canvas img{width:100%;max-height:none}
#drawing-dialog.zoomed #drawing-cad .cad-explanation{margin-left:0}
@media(max-width:900px){.cad-panel,.engineering-stage--cad .cad-panel{grid-template-columns:1fr}.cad-story-heading{grid-template-columns:1fr;gap:18px}.cad-story-views--pair{grid-template-columns:1fr}.cad-canvas{width:min(100%,calc(500px * var(--cad-ratio)))}}
@media(max-width:550px){.cad-panel{padding:18px}.engineering-stage--cad .cad-figure{padding:20px!important}.engineering-stage--cad .cad-explanation{padding:22px}.cad-story-heading h4{font-size:26px}.cad-pin{width:30px;height:30px}.cad-note-button{min-height:48px}.cad-story-views--pair .cad-canvas{width:100%}#drawing-cad .cad-notes{grid-template-columns:1fr}}
/* Interactive source drawings: the viewport magnifies existing pixels only. */
.cad-viewport{overflow:hidden;background:#fff;position:relative}
.cad-viewport .cad-canvas{transform-origin:center;transition:transform .24s ease}
.cad-target{position:absolute;width:26px;height:26px;transform:translate(-50%,-50%);border:3px solid #287251;border-radius:50%;background:#e0bf3c55;opacity:0;pointer-events:none}
.cad-target.is-selected{opacity:1}
.cad-leaders line.is-selected{stroke:#287251;stroke-width:3}
.cad-selection{padding:16px;background:#e5eeea;color:#173d50;border-left:3px solid #287251;margin-top:16px}
.cad-selection[hidden]{display:none}
.cad-selected-text{font-size:16px!important;line-height:1.55!important;margin:0 0 12px!important}
.cad-focus-actions{display:flex;flex-wrap:wrap;gap:8px}
.cad-focus-actions button,.explorer-views button{border:1px solid #8ea9a3;background:white;color:#173d50;min-height:44px;padding:10px 14px;font:600 14px/1.4 Arial,sans-serif;cursor:pointer}
.cad-focus-actions button:first-child,.explorer-views button[aria-pressed=true]{background:#173d50;color:#fff;border-color:#173d50}
.cad-focus-actions button:focus-visible,.explorer-views button:focus-visible,.explorer-chapters button:focus-visible,.cad-gallery-actions button:focus-visible{outline:3px solid #b67625;outline-offset:3px}
.is-focused .cad-pin,.is-focused .cad-leaders{visibility:hidden}
.explorer-toolbar{padding:24px 28px;border:1px solid #adc4bc;background:#fff}
.explorer-toolbar .topic-label{margin:0;font-size:16px}
.explorer-hint{font-size:16px;line-height:1.55;margin:8px 0 18px;color:#4f6872}
.explorer-views{display:flex;flex-wrap:wrap;gap:8px}
.cad-gallery-actions button.text-link{border:0;border-bottom:1px solid currentColor;background:none;padding:0;font:inherit;font-weight:600;cursor:pointer;color:#173d50}
.engineering-stage--cad .cad-canvas{width:100%}
.engineering-stage--cad .cad-figure{align-self:center}
.engineering-stage--cad .cad-viewport{max-width:100%}
.explorer-film{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);background:#fff;gap:28px;padding:28px}
.explorer-film video{width:100%;height:auto;display:block;background:#102e3b}
.explorer-film h4{font-size:26px;margin:0 0 18px}
.explorer-film p{font-size:16px;line-height:1.6}
.explorer-chapters{display:grid;gap:10px;margin-top:20px}
.explorer-chapters button{display:grid;grid-template-columns:48px minmax(0,1fr);gap:6px 10px;text-align:left;padding:14px;border:1px solid #adc4bc;background:#f2f6f4;color:#173d50;cursor:pointer;font:inherit}
.explorer-chapters button[aria-current=true]{border-left:4px solid #287251;background:#deece5}
.explorer-chapters span{font-size:14px}
.explorer-chapters strong{font-size:16px}
.explorer-chapters small{grid-column:2;font-size:14px;line-height:1.5}
@media(min-width:901px){#cad-olcum .cad-figure{display:block}#cad-olcum .cad-viewport{height:var(--tank-frame-height);display:flex;align-items:center}#cad-olcum .cad-canvas{flex:none}#cad-olcum .cad-figure .media-caption{min-height:58px;margin-top:16px}#cad-olcum .cad-expand{margin-top:16px}}
@media(max-width:900px){.explorer-film{grid-template-columns:1fr}.engineering-stage--cad .cad-canvas{width:min(100%,calc(480px * var(--cad-ratio)))}}
@media(max-width:550px){.explorer-toolbar,.explorer-film{padding:18px}.explorer-views{gap:6px}.explorer-views button{flex:1 1 42%;padding:10px}.cad-focus-actions button{flex:1 1 42%}.cad-selection{padding:12px}.engineering-stage--cad .cad-figure{padding:18px!important}.cad-pin{width:34px;height:34px}.cad-note-number{font-size:14px}}
@media(prefers-reduced-motion:reduce){.cad-viewport .cad-canvas{transition:none}}
.engineering-stage--cad .cad-panel--wide{grid-template-columns:1fr}
.cad-panel--wide .cad-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.cad-panel--wide .cad-explanation{padding-top:24px}
.layer-explorer{margin-top:56px;padding-top:34px;border-top:1px solid #adc4bc}
.layer-intro{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-bottom:28px}
.layer-intro h3{font-size:32px;line-height:1.2;margin:12px 0 0}
.layer-intro p{font-size:16px;line-height:1.65;margin:0}
.layer-workspace{display:grid;grid-template-columns:minmax(0,2.5fr) minmax(260px,1fr);background:white;border:1px solid #adc4bc;margin-bottom:26px}
.layer-drawing{padding:24px;min-width:0;align-self:center}
.layer-viewport{overflow:auto;background:#fff;max-height:70svh}
.layer-stack{position:relative;isolation:isolate}
.layer-stack img{display:block;width:100%;height:auto}
.layer-stack img[data-layer-image]{position:absolute;inset:0;pointer-events:none}
.layer-stack img[hidden]{display:none!important}
.layer-viewport.is-zoomed .layer-stack{width:200%;min-width:1000px}
.layer-view-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:22px}
.layer-view-actions span{font-size:14px;color:#516871;flex:1 1 180px}
.layer-view-actions button,.layer-controls>button{background:#173d50;color:white;border:0;padding:12px 16px;min-height:44px;font:600 14px/1.5 Arial,sans-serif;cursor:pointer}
.layer-controls{padding:24px;background:#edf3f0}
.layer-controls fieldset{border:0;margin:0 0 20px;padding:0;min-width:0}
.layer-controls legend{font-size:20px;font-weight:600;margin-bottom:16px}
.layer-control{display:flex;gap:12px;align-items:flex-start;padding:13px 0;border-bottom:1px solid #b5cac3;cursor:pointer}
.layer-control input{width:20px;height:20px;flex:none;accent-color:#287251;margin:2px 0 0}
.layer-control strong{display:block;font-size:16px;line-height:1.4}
.layer-control small{display:block;font-size:14px;line-height:1.5;margin-top:5px;color:#4f6570}
.layer-status,.layer-color-note{font-size:14px;line-height:1.6;margin:16px 0 0}
.layer-color-note{color:#4f6570}
.layer-error{font-size:16px;color:#8b321b}
.layer-viewport:focus-visible,.layer-view-actions button:focus-visible,.layer-controls>button:focus-visible,.layer-control input:focus-visible{outline:3px solid #b67625;outline-offset:3px}
@media(max-width:900px){.layer-workspace,.layer-intro{grid-template-columns:1fr}.layer-intro{gap:18px}.layer-controls fieldset{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.cad-panel--wide .cad-notes{grid-template-columns:1fr;gap:0}}
@media(max-width:550px){.layer-drawing,.layer-controls{padding:18px}.layer-controls fieldset{grid-template-columns:1fr}.layer-intro h3{font-size:28px}.layer-explorer{margin-top:36px}}
.cad-panel--wide .cad-viewport{padding:20px 0}
#drawing-dialog.zoomed #drawing-cad .cad-viewport{overflow:visible;width:190%}
#drawing-dialog.zoomed #drawing-cad .cad-canvas{width:100%}