.software-section{--software-columns:minmax(0,3fr) minmax(0,2fr);--software-gap:44px;--demo-heading-height:42px;--demo-heading-gap:18px}
.software-section>.section-heading{display:block;max-width:1000px;margin-bottom:42px}
.software-section>.section-heading h2{font-size:clamp(30px,3.2vw,44px)}
.software-section>.section-heading .software-intro{max-width:780px;font-size:16px;line-height:1.8;margin-top:20px;padding:0}
.software-section>.section-heading h2>.muted{color:var(--brand-blue)}
.software-section .feature-row{margin-top:84px}
.software-demo{display:grid;grid-template-columns:var(--software-columns);gap:var(--software-gap);align-items:start;scroll-margin-top:16px}
.demo-screen{min-width:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
.demo-screen .software-caption{justify-content:flex-end;min-height:var(--demo-heading-height);margin-bottom:var(--demo-heading-gap);padding-inline:3px}
.demo-laptop{position:relative;isolation:isolate;padding-bottom:6px}
.demo-laptop:after{content:'';position:absolute;z-index:-1;left:4%;right:4%;height:18px;bottom:-6px;border-radius:50%;background:#10212e35;filter:blur(8px)}
.demo-laptop-shell{position:relative;width:82%;margin-inline:auto;padding:1% 1% 1.8%;background:linear-gradient(135deg,#303236,#050606 20%,#101112 85%,#303235);border:1px solid #777b7e;border-radius:clamp(7px,1.1vw,14px) clamp(7px,1.1vw,14px) 2px 2px;box-shadow:inset 0 1px 1px #ffffffb0,inset 1px 0 1px #b3b6b899,inset -1px 0 1px #ffffff70,0 0 0 1px #1c1d1e;overflow:hidden}
.demo-laptop-display{position:relative;overflow:hidden;background:#f3f6f8;border-radius:clamp(3px,.5vw,7px) clamp(3px,.5vw,7px) 0 0;box-shadow:0 0 0 1px #020303}
.demo-laptop-menubar{aspect-ratio:40/1;background:linear-gradient(#d9e4e7,#e9eff1);border-bottom:1px solid #ffffff55}
.demo-laptop-viewport{position:relative;aspect-ratio:8/5;overflow:hidden}
.demo-laptop .demo-app{width:800px;height:500px;border:0;border-radius:0;box-shadow:none;transform:scale(var(--demo-scale,1));transform-origin:top left}
.demo-laptop-notch{position:absolute;z-index:6;top:1.7%;left:44%;width:12%;height:3.4%;border-radius:0 0 4px 4px;background:#08090a;box-shadow:0 1px 1px #0005}
.demo-laptop-notch>span{position:absolute;left:50%;top:29%;height:3px;width:3px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#294350,#10121a 65%);box-shadow:0 0 0 1px #040505}
.demo-laptop-base{position:relative;height:clamp(9px,1.5vw,19px);margin-top:-1px;border-radius:1px 1px 14px 14px / 1px 1px 11px 11px;background:linear-gradient(90deg,#75787a 0%,#e6e8ea 1%,#b9bdc0 3%,#f0f1f2 8%,#c3c7ca 18%,#dce0e3 50%,#bdc1c5 82%,#e5e7e9 96%,#a2a5a8 99%,#747779);border-top:1px solid #e3e6e8;box-shadow:inset 0 -3px 3px #45494c70,inset 0 1px 0 #ffffffcc,0 1px 1px #262b2f55}
.demo-laptop-base:after{content:'';position:absolute;left:1%;right:1%;bottom:2px;height:1px;background:linear-gradient(90deg,transparent,#8b8f92 10%,#f2f3f4 50%,#969a9e 90%,transparent)}
.demo-laptop-base>span{position:absolute;top:-1px;left:41.5%;width:17%;height:45%;background:linear-gradient(90deg,#8d9195,#cbd0d4 8%,#edf0f2 50%,#cbd0d4 92%,#8d9195);border-radius:0 0 7px 7px;box-shadow:inset 0 -1px 1px #6b717780,0 1px 1px #fff9}
.demo-laptop-feet{height:3px;margin:0 6%;position:relative}
.demo-laptop-feet:before,.demo-laptop-feet:after{content:'';position:absolute;top:0;width:6%;height:3px;background:linear-gradient(#777b7e,#202224);border-radius:0 0 3px 3px}
.demo-laptop-feet:before{left:0}.demo-laptop-feet:after{right:0}
.demo-guide{padding-top:0;min-width:0}
.demo-guide h3{display:flex;align-items:center;min-height:var(--demo-heading-height);font-size:clamp(26px,2.3vw,32px);font-weight:800;line-height:1.2;letter-spacing:-.8px;color:var(--brand-blue)}
.demo-guide-hint{display:flex;align-items:center;gap:8px;font-size:11px;line-height:1.6;color:var(--ink);margin:18px 0 0 4px}
.demo-guide-hint svg{height:13px;width:13px;color:#509694}
.demo-mode-label{color:var(--ink);font-size:12px;font-weight:700}
.demo-caption{margin-top:22px;padding-top:0;border-top:0;min-height:1.7em;color:var(--ink);font-size:14px;font-weight:700;line-height:1.7}
.software-demo [hidden]{display:none!important}
.demo-app{position:relative;display:grid;grid-template-columns:108px minmax(0,1fr);overflow:hidden;border:1px solid #dbe5e8;border-radius:10px;background:#f3f6f8;color:#123746;box-shadow:0 12px 40px #1237460a;isolation:isolate}
.demo-sidebar{position:relative;display:flex;flex-direction:column;background:#0d3548;color:#fff;padding:23px 10px;min-width:0}
.demo-brand{font-size:17px;font-weight:800;letter-spacing:-1px;white-space:nowrap}
.demo-brand span{color:#79c7c5}
.demo-product{font-size:10px;background:#ffffff0b;border:1px solid #ffffff0d;text-align:center;border-radius:5px;padding:6px 5px;margin-top:17px}
.demo-nav-item{display:flex;align-items:center;gap:9px;margin:28px -7px 0;padding:11px 12px;background:#ffffff12;border-radius:6px;color:#8bd6d0;font-size:11px;font-weight:600}
.demo-nav-item svg{width:16px;height:16px}
.demo-side-project{display:flex;flex-direction:column;gap:9px;margin-top:30px;font-size:10px}
.demo-side-project>span{font-size:6px;letter-spacing:1.3px;color:#9ab5c0}
.demo-side-project strong{font-size:11px;font-weight:600}
.demo-side-project small{font-size:8px;color:#a2bec7}
.demo-side-bottom{display:flex;align-items:center;gap:6px;font-size:8px;margin-top:auto;padding-top:30px;color:#a9c4cc}
.demo-side-bottom i{background:#76c7c0;width:5px;height:5px;border-radius:50%}
.demo-workspace{min-width:0}
.demo-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px;background:#fff;border-bottom:1px solid #e5ecef;font-size:11px}
.demo-topbar b{padding:0 9px;color:#8da5ae}
.demo-topbar strong{font-weight:700}
.demo-data-badge{background:#f0f5f5;border:1px solid #e0e8e8;padding:4px 7px;border-radius:4px;font-size:8px;color:#5c757e;white-space:nowrap}
.demo-workbody{padding:8px}
.demo-app-tabs{display:flex;gap:24px;align-items:center;font-size:10px;font-weight:600;margin:0 0 8px}
.demo-app-tabs>span{padding:3px 0 6px;border-bottom:2px solid transparent;color:#647c87}
.demo-app[data-phase="0"] .demo-calc-tab,.demo-app[data-phase="1"] .demo-calc-tab,.demo-app[data-phase="2"] .demo-calc-tab,.demo-app[data-phase="3"] .demo-summary-tab{color:#123746;border-color:#58a5a1}
.demo-pump,.demo-strand{border:1px solid #e1e9ec;border-radius:8px;background:#fff;padding:8px}
.demo-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;min-height:18px}
.demo-panel-heading>strong{font-size:14px;font-weight:800;letter-spacing:-.25px}
.demo-result-badge{display:flex;align-items:center;gap:5px;opacity:0;color:#387971;font-size:8px;transition:opacity .4s}
.demo-result-badge svg{height:13px;width:13px}
.demo-app[data-phase="3"] .demo-result-badge{opacity:1}
.demo-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.demo-metrics>div{padding:6px 10px;background:#f4f7f8;border:1px solid #edf1f2;border-radius:6px;transition:background .5s,border-color .5s}
.demo-metrics>div>span{font-size:9px;display:block;color:#69818b;line-height:1.5;min-height:14px}
.demo-metrics strong{display:block;font-weight:800;font-size:26px;font-variant-numeric:tabular-nums;letter-spacing:-1px;line-height:1.4;margin-top:3px}
.demo-metrics small{font-size:10px;font-weight:500;letter-spacing:0;color:#66838a}
.demo-app[data-phase="3"] .demo-metrics>div{background:#eaf5f2;border-color:#c7e4dc}
.demo-app[data-phase="3"] .demo-metrics strong{color:#216759}
.demo-strand{margin-top:8px}
.demo-room-count{background:#f0f5f5;padding:3px 7px;border-radius:4px;font-size:8px;color:#67818a}
.demo-settings{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-bottom:12px;border-bottom:1px solid #edf1f2}
.demo-setting{display:flex;align-items:center;gap:8px;justify-content:space-between;font-size:9px}
.demo-setting>span{min-width:0}
.demo-input{width:76px;min-width:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid #d6e2e7;border-radius:5px;padding:6px 10px;transition:border-color .25s,box-shadow .25s}
.demo-input b,.demo-cell b{font-weight:600;font-variant-numeric:tabular-nums}
.demo-input small{color:#6e858f;font-size:9px}
.demo-room-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 6px;font-size:11px}
.demo-room-heading strong{font-weight:600}
.demo-add{font-weight:700;background:#d9e021;padding:7px 9px;border-radius:5px;font-size:9px;white-space:nowrap}
.demo-table{position:relative;min-height:116px}
.demo-table-head,.demo-room{display:grid;grid-template-columns:minmax(87px,1.5fr) repeat(4,minmax(48px,1fr));gap:6px}
.demo-table-head{font-size:9px;font-weight:600;line-height:1.5;padding-bottom:7px;border-bottom:1px solid #e0e9ec;overflow-wrap:anywhere}
.demo-table-head small{display:block;font-size:8px;font-weight:400;color:#789099;margin-top:2px;letter-spacing:0}
.demo-room{opacity:0;transform:translateY(6px);padding-block:4px;border-bottom:1px solid #edf1f2;transition:opacity .35s,transform .35s}
.demo-room.is-visible{opacity:1;transform:none}
.demo-cell{padding:6px;border:1px solid #dce5e8;border-radius:5px;font-size:10px;line-height:1.5;min-width:0;min-height:29px;overflow-wrap:anywhere;transition:border-color .25s,box-shadow .25s}
.demo-empty{position:absolute;top:76px;left:0;right:0;text-align:center;color:#80969e;font-size:10px;transition:opacity .2s}
.demo-empty.is-hidden{opacity:0}
.demo-input.is-highlighted,.demo-cell.is-highlighted{border-color:#4b9e99;box-shadow:0 0 0 3px #4b9e9918}
.demo-add.is-highlighted{box-shadow:0 0 0 4px #d9e02125}
.demo-calculation-status{display:flex;align-items:center;gap:7px;min-height:22px;margin-top:7px;font-size:8px;color:#7d9299}
.demo-status-dot{width:5px;height:5px;background:#b4c6cc;border-radius:50%;flex-shrink:0}
.demo-app[data-phase="2"] .demo-status-dot{background:#7eaaa0;animation:demo-pulse .7s ease-in-out infinite alternate}
.demo-app[data-phase="3"] .demo-status-dot{background:#4d9f85}
.demo-app[data-phase="3"] .demo-calculation-status{color:#3c7f6d}
.demo-total{display:flex;align-items:center;gap:7px;margin-left:auto;opacity:0;transition:opacity .35s}
.demo-total b{font-weight:700}
.demo-app[data-phase="2"] .demo-total,.demo-app[data-phase="3"] .demo-total{opacity:1}
.demo-cursor{position:absolute;top:0;left:0;pointer-events:none;z-index:5;transform:translate(78%,80%);transition:transform .65s cubic-bezier(.2,.65,.2,1),opacity .25s;filter:drop-shadow(0 2px 3px #0b344833);opacity:0}
.demo-cursor>svg{width:23px;height:29px;stroke:#fff;fill:#153a4b;stroke-width:1.5}
.demo-cursor>span{position:absolute;width:20px;height:20px;border-radius:50%;border:2px solid #509694;top:-7px;left:-7px;opacity:0}
.demo-cursor.is-clicking>span{animation:demo-click .75s ease-out}
.demo-steps{display:grid;gap:10px;list-style:none;margin:var(--demo-heading-gap) 0 0;padding:0}
.demo-steps li{min-width:0}
.demo-steps button{position:relative;display:flex;align-items:flex-start;gap:13px;width:100%;padding:15px 14px;border:1px solid #cadbdc;border-radius:10px;background:#f7fafb;color:var(--ink);text-align:left;line-height:1.65;transition:background .4s,border-color .4s,transform .4s}
.demo-step-number{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border-radius:9px;border:1px solid #d4dff1;background:#e7edf7;color:var(--brand-blue);font-size:11px;font-weight:800;transition:background .4s,border-color .4s,color .4s,transform .4s}
.demo-step-copy{display:block;min-width:0;padding-right:9px}
.demo-step-copy strong{display:block;color:var(--ink);font-size:17px;font-weight:800;line-height:1.35;margin:4px 0 7px}
.demo-step-copy>span{display:block;font-size:14px;line-height:1.75;font-weight:600}
.demo-step-arrow{position:absolute;right:10px;top:27px;width:12px;height:12px;color:#509694;opacity:0;transform:translateX(-5px);transition:opacity .4s,transform .4s}
.demo-steps button:hover{background:#edf4f4;border-color:#8eafba}
.demo-steps button.is-complete .demo-step-number{background:#d7eeea;border-color:#b7d9d2}
.demo-steps button[aria-current=step]{background:var(--brand-blue);border-color:var(--brand-blue);box-shadow:0 10px 25px #2a3b811c;color:#edf2ff}
.demo-steps button[aria-current=step] .demo-step-number{background:#d9e021;border-color:#d9e021;color:#233f49;transform:scale(1.06)}
.demo-steps button[aria-current=step] .demo-step-copy strong{color:#fff}
.demo-steps button[aria-current=step] .demo-step-copy>span{animation:demo-step-explain .55s ease-out both}
.demo-steps button[aria-current=step] .demo-step-arrow{opacity:1;transform:none;color:#fff}
.motion-ready .software-demo .demo-steps li{opacity:0;transform:translateY(14px);transition:opacity .6s,transform .6s;transition-delay:.12s}
.motion-ready .software-demo .demo-steps li:nth-child(2){transition-delay:.22s}
.motion-ready .software-demo .demo-steps li:nth-child(3){transition-delay:.32s}
.motion-ready .software-demo .demo-steps li:nth-child(4){transition-delay:.42s}
.motion-ready .software-demo.is-visible .demo-steps li,.motion-paused .software-demo .demo-steps li{opacity:1;transform:none}
.demo-example-note{color:var(--ink);font-size:8px;padding:10px 0 13px;line-height:1.6}
.demo-example-note a{text-decoration:underline}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.demo-is-paused .demo-cursor,.demo-is-paused .demo-room{transition:none}
.demo-is-paused *,.demo-is-paused *:before,.demo-is-paused *:after{animation-play-state:paused!important}
@keyframes demo-step-explain{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes demo-click{0%{opacity:.8;transform:scale(.3)}100%{opacity:0;transform:scale(2.2)}}
@keyframes demo-pulse{to{opacity:.25}}
@media(max-width:1200px){.software-section{--software-gap:28px}}
@media(max-width:980px){.software-section .feature-row{margin-top:64px}.software-section{--software-columns:minmax(0,1fr)}.software-demo{gap:30px}.demo-guide{padding-top:0}.demo-guide h3{font-size:28px}.demo-steps{grid-template-columns:1fr 1fr;gap:10px 16px;margin-top:20px}.demo-steps button{height:100%}.demo-step-copy strong{font-size:17px}.demo-guide-hint{margin-top:14px}}
@media(max-width:600px){.software-section .feature-row{margin-top:56px}.demo-laptop-notch{border-radius:0 0 2px 2px}.demo-laptop-notch>span{width:2px;height:2px}.demo-steps button[aria-current=step]{transform:none}.demo-caption{min-height:3.4em;font-size:13px;margin-top:18px}.software-demo{gap:28px}.demo-screen{scroll-margin-top:16px}.demo-screen .software-caption{gap:8px;min-height:39px;flex-wrap:wrap;padding-block:5px;margin-bottom:9px}.demo-guide h3{font-size:28px}.software-section>.section-heading{margin-bottom:28px}.software-section>.section-heading .software-intro{font-size:15px;margin-top:16px}.demo-steps{grid-template-columns:1fr;gap:10px}.demo-steps button{padding:14px 12px;gap:13px}.demo-step-copy strong{font-size:17px}.demo-step-copy>span{font-size:14px;font-weight:600}.demo-guide-hint{font-size:11px}.demo-example-note{font-size:7px;padding-top:10px;max-width:300px}}
@media(prefers-reduced-motion:reduce){.software-demo *,.software-demo *:before,.software-demo *:after{animation:none!important;transition:none!important}.demo-cursor{display:none}.software-demo .demo-steps li{opacity:1!important;transform:none!important}.demo-steps button[aria-current=step]{transform:none}}
