/* COBOL: a complete project story, shared navigation and open visual scenes. */
.chapter-label{font-size:13px;letter-spacing:.08em;color:#6c5b8c}.section-bridge{margin:65px auto 10px;font-size:clamp(29px,3.2vw,43px);line-height:1.25;letter-spacing:-.035em;color:#263c5e;max-width:900px;text-align:center}.section-bridge strong{font-weight:600;background:var(--dicsys-title);background-clip:text;-webkit-background-clip:text;color:transparent}.challenge-grid h3{margin-top:17px}.challenge-grid p{color:#626f83}.flow-label{font-size:12px;letter-spacing:.08em;color:#6e758c}.flow-canvas{min-height:475px;margin-top:40px;grid-template-columns:280px 1fr 315px;gap:26px}.flow-sources,.flow-results{gap:22px;padding-top:40px}.source-piece{min-height:110px;padding:12px 15px;transform:rotate(-5deg);border-radius:5px}.source-piece:nth-of-type(2){min-height:110px}.source-piece strong,.result-piece strong{font-size:17px;color:#294c74}.source-piece small,.result-piece small{font-size:13px;line-height:1.5;color:#63748d}.source-piece .file-symbol{font-size:28px;min-width:45px}.source-mini{display:flex;flex-direction:column;gap:5px;margin-top:9px}.source-mini code{font:10px/1.5 var(--mono);color:#7e8fa9}.source-mini .field-stroke{display:block;height:7px;width:95px;background:linear-gradient(90deg,#e0e9f4 0 30%,transparent 30% 36%,#d1deed 36%);border-radius:2px}.source-db{height:80px;width:75px;flex-shrink:0}.source-db svg{height:100%;width:100%}.flow-core>strong{font-size:25px}.flow-core>span{font-size:13px;color:#69778c}.expert-seal{font-size:12px;color:#755d91}.result-piece,.result-piece[aria-pressed=true]{border:0;border-radius:0;background:none;box-shadow:none;padding:8px 0;min-height:110px;gap:8px}.result-piece:hover{transform:translateX(-4px);background:none}.result-symbol{height:95px;width:90px}.result-arrow{font-size:20px;color:#8b6caf}.flow-results .flow-label{left:0}.flow-canvas:before{inset:0 5%}.flow-caption{font-size:14px;color:#758298;text-align:center;margin:15px auto 0;max-width:70ch}.flow-caption strong{font-weight:500;color:#4c6e90}.knowledge-flow{padding-bottom:55px}.knowledge-flow .section-intro>p{max-width:65ch}.wire-signals path{stroke-width:2.5}
.project-story{padding:65px 0;background:linear-gradient(180deg,#f7f5fb80,#fff 80%)}.project-preview{margin-top:35px}#project-overview svg{display:block;width:100%;height:auto;max-height:510px;overflow:visible}.project-invitation{display:flex;justify-content:space-between;align-items:center;gap:40px;margin:25px 0 0;padding:15px 0}.project-invitation h3{font-size:29px;line-height:1.2;color:#2d4a70;margin:13px 0}.project-invitation p{font-size:16px;color:#697a90;max-width:54ch;margin:0}.project-invitation>.btn{flex-shrink:0}.benefit-section{padding-top:65px}.benefit-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:45px}.benefit-tile,.knowledge-tile,.control-tile{padding:0;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}.benefit-art{height:230px;margin:0}.beneficiary{font-size:12px;color:#7d6895;letter-spacing:.08em}.benefit-tile h3{font-size:27px;min-height:65px;color:#2d4d73}.benefit-tile>p{font-size:16px;color:#6b788b;min-height:54px}.metric-line{margin-top:18px;padding:22px 0 16px;border-color:#e4e8f0}.metric-line strong{font-size:16px;color:#395c82}.metric-line div>span{font-size:13px;color:#738096}.metric-detail summary{font-size:13px;color:#78618f}.metric-detail p{font-size:14px;color:#69788e}.metric-note,.illustration-label{font-size:13px;color:#778296}.start-caption{font-size:12px;color:#7f6a96}.start-stops strong{font-size:14px;color:#5e7591}.stop-orb{font-size:12px;width:38px;height:38px}.start-path>.btn{font-size:14px}.flow-motion-control{display:block;margin:12px auto 0;padding:7px 14px;border:0;background:none;color:#6d7e95;font-size:12px;text-decoration:underline;text-underline-offset:4px}
.modernization-dialog{position:fixed;inset:0;margin:0;padding:0;border:0;width:100%;max-width:none;height:100dvh;max-height:none;background:#fff;overflow:auto}.modernization-dialog[open]{display:flex;flex-direction:column}.story-progress{height:4px;flex-shrink:0;background:#edf0f7}.story-progress i{display:block;width:var(--story-progress,20%);height:100%;background:var(--dicsys-spectrum);transition:width .2s}.story-header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 32px;max-width:1320px;width:100%;margin:auto}.story-brand{display:flex;align-items:center;gap:15px;font-size:13px;color:#798297}.story-brand>span{border-left:1px solid #e1e5ee;padding-left:15px}.story-header .btn{font-size:13px;padding:11px 19px;min-height:44px}.story-content{width:min(1180px,100%);margin:0 auto;padding:5px 32px 22px;flex:1}.story-route{display:flex;gap:8px;justify-content:center;max-width:830px;margin:0 auto 25px}.story-route button{display:flex;gap:10px;align-items:center;justify-content:center;flex:1;padding:10px 8px;min-height:44px;border:0;border-bottom:2px solid #e5e6f1;background:none;color:#8591a5;font-size:12px}.story-route button span{font-size:13px}.story-route button[aria-pressed=true]{color:#7857a8;border-color:#9c7bc3}.story-route button.complete{border-color:#bfdde9;color:#5482a0}.story-heading{text-align:center}.story-heading .kicker{margin-bottom:12px}.story-heading h2{font-size:clamp(28px,3vw,42px);line-height:1.15;max-width:950px;margin:0 auto 16px;outline:none}.story-heading>p{font-size:16px;max-width:75ch;line-height:1.65;margin:0 auto;color:#6c7b90}#story-art{max-width:1000px;margin:8px auto 0}#story-art svg{display:block;width:100%;height:auto;max-height:380px;overflow:visible}.story-takeaway{display:grid;grid-template-columns:1fr 1fr;gap:45px;margin:22px auto 0;padding-top:20px;border-top:1px solid #e5e8f0;max-width:950px}.story-takeaway span{font-size:11px;letter-spacing:.08em;color:#947aab}.story-takeaway p{font-size:14px;color:#61768e;margin:10px 0 0;line-height:1.65}.story-takeaway>div:last-child{border-left:2px solid #cdb8df;padding-left:24px}.scenario-controls{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:10px 0 0}.scenario-controls button{background:white;border:1px solid #e2e5ee;border-radius:25px;font-size:12px;padding:10px 16px;min-height:42px;color:#73829a}.scenario-controls button[aria-pressed=true]{background:#f0eaf7;border-color:#bda6d6;color:#8059a6}.story-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;max-width:1180px;width:100%;margin:0 auto;padding:20px 32px;border-top:1px solid #e4e8f0}.story-controls>div{display:flex;gap:10px}.story-controls>span{font-size:12px;color:#7c8a9e}.story-controls .btn{font-size:13px;min-height:44px;padding:12px 20px}
/* Same unboxed section index as the other Dicsys landings, with six destinations. */
.wheel-links[data-count="6"] a:nth-child(1){transform:translate(0,-210px)}.wheel-links[data-count="6"] a:nth-child(2){transform:translate(-30px,-138px)}.wheel-links[data-count="6"] a:nth-child(3){transform:translate(-48px,-66px)}.wheel-links[data-count="6"] a:nth-child(4){transform:translate(-48px,6px)}.wheel-links[data-count="6"] a:nth-child(5){transform:translate(-30px,78px)}.wheel-links[data-count="6"] a:nth-child(6){transform:translate(0,150px)}
@media(max-width:1050px){.flow-canvas{grid-template-columns:235px 1fr 270px;gap:15px}.source-piece strong,.result-piece strong{font-size:15px}.result-symbol{width:70px}.flow-core>strong{font-size:20px}.flow-core>span{font-size:11px}.source-mini code{font-size:9px}.source-piece .file-symbol{min-width:30px;font-size:23px}.benefit-grid{gap:25px}.benefit-tile h3{font-size:24px}.project-invitation{gap:25px}.project-invitation h3{font-size:26px}}
@media(max-width:760px){.chapter-label{font-size:12px;letter-spacing:.06em}.section-bridge{font-size:31px;line-height:1.3;margin:42px auto 12px;text-align:center}.section-bridge br{display:none}.flow-canvas{grid-template-columns:1fr;gap:20px;min-height:0}.flow-label{font-size:12px}.flow-sources{gap:8px;padding-top:30px}.source-piece,.source-piece:nth-of-type(2){min-height:125px;padding:13px 7px}.source-piece strong{font-size:13px}.source-piece small{font-size:10px}.source-piece .file-symbol{font-size:27px;min-width:0}.source-mini{display:none}.source-db{height:38px;width:40px}.flow-core>strong{font-size:24px}.flow-core>span{font-size:13px}.flow-core .expert-seal{font-size:12px}.flow-results{gap:7px;padding-top:31px}.result-piece{min-height:105px;gap:10px}.result-piece strong{font-size:17px}.result-piece small{font-size:13px}.result-symbol{width:85px;height:85px}.flow-caption{font-size:14px;line-height:1.7}.knowledge-flow{padding-bottom:35px}.project-story{padding:40px 0}.project-preview{margin-top:20px}#project-overview svg{min-height:230px}.project-invitation{flex-direction:column;align-items:flex-start;gap:25px;margin-top:15px}.project-invitation h3{font-size:26px}.project-invitation p{font-size:16px}.project-invitation>.btn{font-size:14px}.benefit-section{padding-top:40px}.benefit-grid{grid-template-columns:1fr;gap:35px}.benefit-art{height:240px;max-width:380px;margin:auto}.benefit-tile{max-width:430px;text-align:left}.benefit-tile h3{font-size:27px;min-height:0}.benefit-tile>p{font-size:16px;min-height:0}.beneficiary{font-size:12px}.metric-line strong{font-size:17px}.metric-line div>span{font-size:13px}.metric-note,.illustration-label{font-size:12px;line-height:1.7}.story-header{padding:16px 20px;gap:12px}.story-brand{font-size:11px;gap:9px}.story-brand img{width:90px;height:auto}.story-brand>span{padding-left:9px}.story-header .btn{font-size:11px;padding:10px 14px}.story-content{padding:5px 20px 20px}.story-route{gap:3px;margin-bottom:22px}.story-route button{flex-direction:column;gap:5px;font-size:10px;padding:8px 2px}.story-route button span{font-size:10px}.story-heading h2{font-size:29px}.story-heading>p{font-size:15px}#story-art svg{min-height:205px;max-height:none}.story-takeaway{grid-template-columns:1fr;gap:20px;margin-top:20px}.story-takeaway>div:last-child{padding-left:15px}.story-takeaway p{font-size:14px}.scenario-controls{gap:6px}.scenario-controls button{font-size:11px;padding:9px 12px}.story-controls{padding:16px 20px;gap:14px;align-items:flex-start;flex-direction:column}.story-controls>div{justify-content:space-between;width:100%}.story-controls .btn{font-size:12px;padding:12px 15px}.story-controls>span{font-size:11px}.start-stops strong{font-size:12px}.wheel-links[data-count="6"] a:nth-child(1){transform:translate(0,-365px)}.wheel-links[data-count="6"] a:nth-child(2){transform:translate(-25px,-305px)}.wheel-links[data-count="6"] a:nth-child(3){transform:translate(-36px,-245px)}.wheel-links[data-count="6"] a:nth-child(4){transform:translate(-36px,-185px)}.wheel-links[data-count="6"] a:nth-child(5){transform:translate(-25px,-125px)}.wheel-links[data-count="6"] a:nth-child(6){transform:translate(0,-65px)}}
/* Keep navigation and controls available while each scene scrolls independently. */
.modernization-dialog[open]{display:grid;grid-template-rows:4px auto minmax(0,1fr) auto;overflow:hidden}.story-content{overflow:auto;min-height:0;scrollbar-gutter:stable}#story-art svg{max-height:320px}.flow-results .result-piece{padding-right:20px}
@media(max-width:760px){#story-art svg{max-height:none}.flow-results .result-piece{padding-right:15px}}
@media(prefers-reduced-motion:reduce){.story-progress i{transition:none}}
