/* Visual narratives: lightweight SVG and actual artifacts, no rendering framework. */
.visual-system{padding:0 0 12px;background:radial-gradient(ellipse at 50% 44%,#376c7d80,transparent 68%)}
.system-switch{display:flex;gap:6px;margin:18px 0 0;position:relative;z-index:1}
.system-switch button{background:transparent;color:#c0cdd5;border:1px solid #42535e;padding:10px 14px;min-height:44px;font:11px var(--mono);flex:1;transform:none}
.system-switch button[aria-pressed=true]{background:#71c3d91a;border-color:#71c3d9;color:#a2dbea}
.system-switch button:hover{background:#71c3d922}
.system-scene{animation:scene-in .4s ease-out}
.system-scene svg{width:100%;max-height:470px;filter:drop-shadow(0 14px 18px #0003)}
.system-readout{font:11px/1.7 var(--mono);min-height:40px;margin:0;border-top:1px solid #42535e;padding:15px 0 0;color:#c0cdd5}
.visual-flow{stroke-dasharray:8 7;animation:visual-trace 6s linear infinite}
@keyframes visual-trace{to{stroke-dashoffset:-150}}
@keyframes scene-in{from{opacity:.35;transform:translateY(8px)}to{opacity:1;transform:none}}
.discipline-strip a{color:inherit;text-decoration:none;min-height:28px;display:flex;align-items:center}.discipline-strip a:hover{color:var(--blue)}
.visual-intro{padding:75px 0 35px;grid-template-columns:1.2fr 1fr;align-items:end;gap:20px 100px}
.visual-intro h2{font-size:clamp(38px,4.4vw,62px);margin-bottom:0}.visual-intro .large-copy{max-width:450px;margin-bottom:5px;font-size:23px}
.workflow-visual{padding:50px 0 80px}.workflow-visual h2{font-size:clamp(36px,4vw,56px)}
.compare-switch{display:flex;border:1px solid #9ab0b9;padding:4px;gap:4px;flex-shrink:0}
.compare-switch button{min-height:44px;background:transparent;border-color:transparent;color:var(--muted);font-size:12px;padding:12px 18px;transform:none}
.compare-switch button[aria-pressed=true]{background:#142a34;color:#fff}
.workflow-drawing{background:#e4eef1;border-block:1px solid #c4d1d5;padding:20px 0;overflow-x:auto;scrollbar-color:#236c80 #deedf1}
.workflow-drawing svg{display:block;width:100%;height:auto}.workflow-drawing>div{animation:scene-in .35s ease-out}
.tangled-lines{stroke-dasharray:6 6}.ordered-flow{stroke-dasharray:10 6;animation:visual-trace 8s linear infinite}
.workflow-caption{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-top:15px}.workflow-caption p{font-size:15px;margin:0}.workflow-visual>.small{font:10px var(--mono);display:block;margin-top:12px}
.readiness-map{display:flex;align-items:center;gap:0;margin:30px 0;min-width:0}.readiness-map span{position:relative;display:grid;place-items:center;aspect-ratio:1;width:22%;border:1px dashed #9ab0b9;border-radius:50%;font:10px var(--mono);color:var(--muted);transition:background .2s,border-color .2s}
.readiness-map span.complete{background:#d7edf2;border:1px solid #236c80;color:#17495a}.readiness-map span.complete:after{content:'✓';position:absolute;right:-3px;top:-3px;background:#236c80;color:white;width:17px;height:17px;display:grid;place-items:center;border-radius:50%;font-size:10px}.readiness-map i{height:1px;background:#a9c3cc;flex:1}
.artifact-spread{min-height:510px;isolation:isolate;overflow:hidden;display:block;padding:0}
.artifact-spread .artifact-sheet{position:absolute;width:52%;top:16%;display:block;transition:transform .25s;filter:drop-shadow(0 15px 12px #142a3425)}
.artifact-spread .artifact-sheet img{display:block;width:100%;height:auto;max-height:none;transform:none;box-shadow:none}
.artifact-spread .sheet-back{left:5%;transform:rotate(-14deg);z-index:1}.artifact-spread .sheet-middle{left:39%;top:11%;transform:rotate(12deg);z-index:2}.artifact-spread .sheet-front{left:23%;top:22%;transform:rotate(-3deg);z-index:3}
.artifact-spread .artifact-sheet:hover,.artifact-spread .artifact-sheet:focus-visible{transform:translateY(-15px) rotate(0);z-index:4}
.artifact-spread>span{position:absolute;bottom:20px;left:0;right:0;text-align:center;margin:0;font-size:8px;letter-spacing:.1em}
.visual-method{padding:40px 0 70px}.visual-method .method-track{margin-top:35px;gap:0}.visual-method .method-track>div{padding-right:25px;padding-top:30px}.visual-method .method-track>div:before{width:9px;height:9px;top:-5px;border-radius:50%;background:#236c80}.visual-method .method-track>div:last-child:before{background:#a37b18}.method-symbol{display:block;font-size:58px;line-height:1;color:#236c80;margin-bottom:24px;font-weight:300}.visual-method .method-track h3{margin-bottom:10px}
.capability-map{display:flex;align-items:center;gap:10px;margin-top:30px;max-width:460px;background:linear-gradient(120deg,#e0eef1,#f1f5f6);padding:24px 16px;border:1px solid #c4d1d5}
.capability-map span{padding:14px 8px;flex:1;text-align:center;background:white;border:1px solid #a4bec8;font:11px var(--mono)}.capability-map span:last-child{border-bottom:3px solid #c69b30}.capability-map i{font-style:normal;color:#236c80}.capability-context{margin-bottom:18px}.capability-context summary{font-size:13px;color:#236c80}.capability-context p{margin-bottom:5px}
@media(max-width:800px){.visual-intro{padding:50px 0 15px;gap:20px}.visual-intro .large-copy{font-size:21px}.workflow-visual{padding:30px 0 55px}.workflow-visual .section-heading{display:block;margin-bottom:24px}.compare-switch{display:inline-flex;margin-top:25px}.workflow-caption{display:block}.workflow-caption p{margin:10px 0}.workflow-drawing svg{min-width:680px}.workflow-drawing:after{content:'← Scroll to explore →';position:sticky;left:0;display:block;width:100%;text-align:center;font:10px var(--mono);color:#4c626c;padding-top:10px}.artifact-spread{min-height:480px;max-width:480px}.visual-method .method-track{gap:30px 0}.visual-method .method-track>div{padding-right:18px}.capability-map{max-width:100%}.system-scene svg{max-height:390px}.system-readout{font-size:10px}}
@media(max-width:430px){.visual-intro{grid-template-columns:1fr}.system-switch button{font-size:10px;padding:9px}.system-scene svg{max-height:340px}.artifact-spread{min-height:400px}.readiness-map span{font-size:9px}.capability-map{padding:18px 10px;gap:7px}.capability-map span{font-size:9px;padding:12px 4px}.workflow-visual h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){.system-scene,.visual-flow,.ordered-flow,.workflow-drawing>div{animation:none}.artifact-spread .artifact-sheet{transition:none}}
@media(max-width:800px){.hero-new{gap:24px}.hero-copy{display:contents}.hero-copy>.eyebrow{grid-row:1;margin:0}.hero-copy>h1{grid-row:2;margin:0}.hero-new>.hero-system{grid-row:3}.hero-copy>.hero-lead{grid-row:4;margin:0}.hero-copy>.actions{grid-row:5;margin:0}.hero-copy>.hero-foot{grid-row:6;margin:0}.hero-new .system-switch{margin-top:14px}}