/* The homepage previews share a visual language, with a different scene per system. */
#business-systems{background:#f4f7fa;padding:90px 0 70px;scroll-margin-top:30px}
#business-systems .search-heading{grid-template-columns:1.1fr 1fr;align-items:end;gap:90px;margin-bottom:42px}
#business-systems .search-heading h2{font-size:clamp(34px,3.6vw,49px);max-width:640px;line-height:1.13}
#business-systems .search-heading p{font-size:19px;max-width:490px}
.hero-stage+.platforms{padding-block:38px 42px;border-top:0;border-bottom:0}
.hero-stage+.platforms .platform-heading{margin-bottom:15px}
.hero-stage+.platforms .platform-heading p{font-size:18px}
.hero-stage+.platforms .platform-heading span{font-size:16px}
.system-tiles{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:20px;align-items:stretch}
.system-tile{--accent:#b32357;--tint:#f9dce6;position:relative;background:white;border:1px solid #dfe5ed;border-radius:9px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .3s,border-color .3s}
.tile-operations{--accent:#135e98;--tint:#d4eefa}
.tile-dashboard{--accent:#6653ad;--tint:#e7dff8}
.system-tile:hover{border-color:#b9c6d6;box-shadow:0 12px 36px #1932490a}
.system-tile-copy{padding:28px 25px 23px;position:relative;min-height:239px}
.system-name{font-size:15px;font-weight:650;color:var(--accent);padding-right:34px;margin-bottom:16px}
.system-tile h3{font-size:26px;letter-spacing:-1px;line-height:1.18;max-width:300px;margin-bottom:15px}
.system-tile-copy>p:last-of-type{font-size:16px;line-height:1.5}
.system-expand{display:none;position:absolute;top:19px;right:17px;align-items:center;justify-content:center;width:37px;height:37px;background:var(--tint);color:var(--accent);border:0;border-radius:6px;transition:background .2s,transform .25s}
.system-previews-ready .system-expand{display:flex}
.system-expand svg{width:19px;height:19px}
.system-expand:hover{transform:scale(1.09);background:var(--accent);color:white}
.system-tile-footer{padding:19px 24px;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;font-size:14px}
.system-tile-footer a{font-weight:600;white-space:nowrap}
.system-tile-footer a:hover{text-decoration:underline;text-underline-offset:4px;color:var(--accent)}
.system-tile-footer>span{font-size:12px;color:#64768b;text-align:right}
.system-demo{height:310px;position:relative;overflow:hidden;isolation:isolate;contain:layout paint;user-select:none;font-family:var(--body)}
.system-demo *{box-sizing:border-box}
.demo-response{background:linear-gradient(145deg,#fff4e6 0%,#fad9cf 36%,#da7da2 75%,#a04077 100%)}
.demo-orbit{position:absolute;width:460px;height:460px;top:0;left:20%;border:1px solid #ffffff60;border-radius:50%;box-shadow:0 0 0 25px #ffffff14,0 0 0 65px #ffffff0b}
.demo-phone{position:absolute;left:12%;top:24px;width:245px;background:#fff;border:5px solid #fff7fc;border-radius:19px;padding:16px 12px 28px;box-shadow:0 20px 40px #71304a26;transform:rotate(-5deg);font-size:12px}
.demo-phone-top{display:flex;gap:8px;align-items:center;color:#203445;font-weight:650;margin-bottom:19px;font-size:11px}
.demo-phone-top small{display:block;font-size:9px;color:#60758b;font-weight:400}
.demo-avatar{display:grid;place-items:center;flex-shrink:0;width:27px;height:27px;background:#fbe4ec;color:#a82955;border-radius:50%;font-weight:700}
.demo-message{font-size:12px;line-height:1.4;max-width:183px;padding:10px 12px;border-radius:10px;margin-bottom:10px}
.demo-message.inquiry{background:#eff3f8;color:#415669;border-bottom-left-radius:2px}
.demo-message.answer{background:#a92351;color:white;margin-left:auto;border-bottom-right-radius:2px;animation:reply-breathe 7s ease-in-out infinite}
.demo-message small{display:block;font-size:9px;margin-top:6px;opacity:.8}
.demo-booking{border:1px solid #e6d6df;border-radius:8px;padding:9px 11px;margin-left:25px;font-size:10px;color:#607081;background:white}
.demo-booking b{display:block;color:#99264f;font-size:11px;margin-top:3px}
.demo-time{position:absolute;right:7%;top:26px;width:91px;height:91px;border:1px solid #ffffffc9;border-radius:50%;background:#fffdf8;box-shadow:0 10px 30px #783c5718;transform:rotate(4deg)}
.demo-time svg{position:absolute;inset:5px;width:81px;height:81px;fill:none;stroke-width:2}
.timer-base{stroke:#f1d9e1}.timer-line{stroke:#b8295b;stroke-dasharray:214;stroke-dashoffset:48;transform-origin:40px 40px;transform:rotate(-90deg);animation:response-ring 7s ease-in-out infinite}
.demo-time>div{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#98284e}
.demo-time b{font:650 26px/1.15 var(--display);letter-spacing:-1px}.demo-time span{font-size:10px}
.demo-receipt{position:absolute;right:17px;bottom:37px;background:#fff8fc;box-shadow:0 10px 20px #733f5216;border:1px solid white;padding:11px 14px;border-radius:8px;font-size:12px;font-weight:600;color:#653244;transform:rotate(3deg)}
.demo-receipt i,.dashboard-top i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#348365;margin-right:6px}
.demo-disclosure{position:absolute;left:14px;bottom:10px;font-size:10px;color:#563c49;background:#ffffffac;padding:2px 6px;border-radius:3px;z-index:3}
.demo-operations{background:linear-gradient(140deg,#e4f4fc,#a2cfea 55%,#478dc0)}
.ops-map{width:360px;height:260px;position:absolute;top:13px;left:50%;transform:translateX(-50%) scale(.92)}
.ops-map>svg{position:absolute;inset:0;fill:none;stroke-width:1.8}
.ops-track{stroke:#3e769b60}.ops-signal{stroke:#fff;stroke-width:3;stroke-dasharray:34 440;animation:ops-travel 8s linear infinite}
.ops-node{position:absolute;display:flex;align-items:center;gap:10px;padding:13px 15px;width:155px;background:#fffffff2;border:1px solid white;border-radius:9px;color:#254660;box-shadow:0 9px 20px #1f517b17;font-size:13px;font-weight:600}
.ops-node small{display:block;font-size:9px;font-weight:400;color:#5b7284;white-space:nowrap}
.ops-node i{display:grid;place-items:center;font-style:normal;color:#286d9c;background:#e6f3fd;border-radius:6px;width:26px;height:29px;font-size:18px}
.node-quote{left:12px;top:13px;transform:rotate(-4deg)}.node-schedule{right:0;top:90px;transform:rotate(3deg)}.node-dispatch{left:0;top:184px;transform:rotate(-3deg)}.node-invoice{right:7px;top:235px}
.ops-approval{position:absolute;left:11px;top:123px;font-size:10px;color:#285673;border-left:2px solid #679fc1;padding:5px 10px;width:120px;line-height:1.4}
.demo-dashboard{background:linear-gradient(145deg,#f2ebff,#c1b1e8 55%,#787dc6)}
.dashboard-window{position:absolute;width:325px;left:25px;top:38px;background:#fff;border:1px solid white;border-radius:9px;box-shadow:0 20px 40px #39277c24;transform:rotate(-4deg);padding:18px 17px 16px}
.dashboard-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:11px;color:#34435c}
.dashboard-top>span{font-size:8px;color:#648076}.dashboard-top i{width:4px;height:4px;margin-right:3px}
.dashboard-tabs{display:flex;gap:17px;font-size:9px;color:#8790a1;margin-top:22px;border-bottom:1px solid #eef0f6;padding-bottom:9px}.dashboard-tabs b{color:#5e4797}
.dashboard-plot{height:125px;position:relative;margin-top:14px}
.chart-grid{position:absolute;inset:0;background:repeating-linear-gradient(0deg,#edf0f7 0 1px,transparent 1px 30px)}
.dashboard-plot svg{position:absolute;inset:0;width:100%;height:100%;fill:none;overflow:visible}
.chart-area{fill:#8f78c814}.chart-primary{stroke:#7560b0;stroke-width:2;stroke-dasharray:400;stroke-dashoffset:0;animation:chart-reveal 9s ease-in-out infinite}.chart-secondary{stroke:#cc859c;stroke-width:1.7}
.dashboard-bottom{display:flex;justify-content:space-between;margin-top:10px;font-size:9px;color:#718093}
.dashboard-chip{position:absolute;bottom:29px;right:16px;background:#333a62;border:1px solid #c7c4e9;border-radius:9px;padding:13px 17px;display:flex;gap:14px;align-items:center;box-shadow:0 8px 24px #42377820;color:#c9cee4;font-size:10px;transform:rotate(3deg)}
.dashboard-chip b{color:white;font-weight:600;font-size:14px}.chip-bars{display:flex;align-items:end;gap:3px;height:29px}.chip-bars i{width:5px;background:#bda0ee;border-radius:2px;height:16px;transform-origin:bottom;animation:bar-breathe 6s ease-in-out infinite}.chip-bars i:nth-child(2){height:23px;animation-delay:-1s}.chip-bars i:nth-child(3){height:19px;animation-delay:-2s}.chip-bars i:nth-child(4){height:29px;animation-delay:-3s}
.systems-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:28px}.systems-bottom p{font-size:16px}.systems-motion{display:none;background:transparent;border:1px solid #c8d1dd;border-radius:20px;padding:7px 14px;color:#50637b;font-size:12px;white-space:nowrap}.system-previews-ready .systems-motion{display:block}
.system-demo *{animation-play-state:paused!important}.system-demo.demo-running *{animation-play-state:running!important}
@keyframes reply-breathe{0%,100%{transform:translateY(0)}45%{transform:translateY(-4px)}}
@keyframes response-ring{0%,100%{stroke-dashoffset:155}65%,85%{stroke-dashoffset:12}}
@keyframes ops-travel{to{stroke-dashoffset:-474}}
@keyframes chart-reveal{0%,100%{stroke-dashoffset:170;opacity:.55}45%,80%{stroke-dashoffset:0;opacity:1}}
@keyframes bar-breathe{50%{transform:scaleY(.65)}}
/* Native dialogs keep the full service brief on the homepage. */
.system-dialog{--accent:#b32357;--tint:#f9dce6;position:fixed;inset:0;border:1px solid #e6e9ef;border-radius:14px;padding:0;width:min(1030px,calc(100% - 64px));max-width:none;max-height:90dvh;margin:auto;overflow-y:auto;overscroll-behavior:contain;color:#1b2f40;background:white;box-shadow:0 30px 100px #12243e30;scrollbar-gutter:stable}
.system-dialog.tile-operations{--accent:#135e98;--tint:#d4eefa}.system-dialog.tile-dashboard{--accent:#6653ad;--tint:#e7dff8}
.system-dialog::backdrop{background:#253c5b45;backdrop-filter:blur(7px)}
.system-dialog-shell{position:relative}
.system-close{position:sticky;float:right;right:20px;top:20px;margin:20px 20px -60px 0;z-index:5;width:40px;height:40px;background:#edf1f7;color:#24394c;border:1px solid #dce4ec;border-radius:7px;display:grid;place-items:center}
.system-close svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7}.system-close:hover{background:var(--tint);color:var(--accent)}
.system-dialog-intro{padding:62px 65px 40px;max-width:850px}
.system-dialog-intro h2{font-size:44px;line-height:1.13;margin-bottom:23px;letter-spacing:-1.5px}
.system-dialog-intro>p:not(.system-name){font-size:19px;line-height:1.65}
.system-dialog-actions{display:flex;align-items:center;flex-wrap:wrap;gap:25px;margin-top:27px}
.system-dialog .button{background:var(--accent);border-color:var(--accent);border-radius:30px;font-size:16px;min-height:48px}.system-dialog .button:hover{background:#1c3145;border-color:#1c3145}
.system-dialog>.system-dialog-shell>.system-demo{height:340px;margin:0 65px;border-radius:7px}
.system-dialog .demo-phone{left:28%;top:26px;transform:rotate(-5deg) scale(1.15);transform-origin:top}
.system-dialog .demo-time{right:23%;top:44px;transform:rotate(4deg) scale(1.12)}
.system-dialog .demo-receipt{right:20%;bottom:40px}
.system-dialog .ops-map{top:10px;transform:translateX(-50%) scale(1.1)}
.system-dialog .node-invoice{display:flex}
.system-dialog .dashboard-window{left:27%;top:38px;transform:rotate(-4deg) scale(1.12);transform-origin:top}
.system-dialog .dashboard-chip{right:19%;bottom:35px}
.system-dialog-details{padding:45px 65px 65px}.system-dialog-details>h2{font-size:28px;letter-spacing:-.8px}
.system-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px 40px;margin-top:30px}
.system-detail-grid h3,.system-fit h3,.system-scope h3{font:600 20px/1.3 var(--body);margin-bottom:9px;color:#243a4e}
.system-detail-grid p,.system-fit p,.system-scope p{font-size:17px;line-height:1.6}
.system-detail-grid>div{border-top:2px solid var(--tint);padding-top:18px}
.system-fit{margin-top:40px;padding:26px;background:#f4f7fa;border-radius:7px}.system-scope{padding:30px 0}
.system-dialog-end{border-top:1px solid #dce4ed;padding-top:35px;margin-top:5px}.system-dialog-end h2{font-size:32px;max-width:540px;line-height:1.2;margin-bottom:16px}.system-dialog-end p{font-size:17px;max-width:600px;margin-bottom:24px}
html.system-dialog-open{overflow:hidden}
@media(max-width:1100px){.system-tiles{gap:14px;grid-template-columns:repeat(3,1fr)}.system-tile-copy{padding:26px 20px 22px;min-height:284px}.system-tile h3{font-size:24px}.system-name{font-size:13px}.system-tile-footer{padding:16px 20px}.system-tile-footer>span{display:none}.ops-map{transform:translateX(-50%) scale(.8)}.demo-phone{left:5%;transform:rotate(-5deg) scale(.9);transform-origin:top left}.demo-time{right:4%;width:78px;height:78px}.demo-time svg{width:68px;height:68px}.dashboard-window{left:16px;transform:rotate(-4deg) scale(.88);transform-origin:top left}}
@media(max-width:740px){#business-systems{padding:50px 0}#business-systems .search-heading{grid-template-columns:1fr;gap:20px;margin-bottom:30px}#business-systems .search-heading h2{font-size:35px}#business-systems .search-heading p{font-size:18px}.system-tiles{grid-template-columns:1fr;gap:25px}.system-tile-copy{padding:26px 25px 23px;min-height:0}.system-tile h3{font-size:28px;max-width:280px}.system-name{font-size:15px}.system-tile-copy>p:last-of-type{max-width:360px}.system-demo{height:300px}.system-tile-footer>span{display:block}.system-tile-footer{padding:20px 24px}.demo-phone{left:13%;transform:rotate(-5deg)}.demo-time{right:8%;width:91px;height:91px}.demo-time svg{width:81px;height:81px}.ops-map{transform:translateX(-50%) scale(.95)}.dashboard-window{left:9%;transform:rotate(-4deg)}.systems-bottom{align-items:start;gap:14px}.systems-bottom p{font-size:14px;max-width:230px}.systems-motion{font-size:11px}.hero-stage+.platforms{padding-block:24px 28px}.hero-stage+.platforms .platform-heading{margin-bottom:8px}.hero-stage+.platforms .platform-heading p{font-size:17px}.hero-stage+.platforms .platform-heading span{font-size:15px}.system-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);border-radius:12px}.system-dialog-intro{padding:64px 24px 30px}.system-dialog-intro h2{font-size:33px}.system-dialog-intro>p:not(.system-name){font-size:17px}.system-dialog-actions{gap:20px}.system-dialog-actions .text-link{font-size:15px}.system-dialog>.system-dialog-shell>.system-demo{margin:0 12px;height:300px}.system-dialog .demo-phone{left:9%;transform:rotate(-5deg)}.system-dialog .demo-time{right:6%;top:26px;transform:rotate(4deg)}.system-dialog .demo-receipt{right:12px;bottom:35px}.system-dialog .ops-map{top:0;transform:translateX(-50%) scale(.88)}.system-dialog .dashboard-window{left:18px;transform:rotate(-4deg) scale(.95);transform-origin:top left}.system-dialog .dashboard-chip{right:15px;bottom:30px}.system-dialog-details{padding:30px 24px}.system-dialog-details>h2{font-size:26px}.system-detail-grid{grid-template-columns:1fr;gap:22px}.system-fit{padding:22px}.system-dialog-end h2{font-size:29px}.system-close{top:12px;right:12px;margin:12px 12px -52px 0}}
@media(prefers-reduced-motion:reduce){.system-demo *{animation:none!important}.systems-motion{display:none!important}.system-expand,.system-tile{transition:none}}
