.capabilities { background:var(--paper); color:var(--ink); margin-top:0; padding-block:6.5rem; position:relative; }.capabilities::before { background:var(--paper); content:""; inset:0 -50vw; position:absolute; z-index:-1; }.capabilities__intro,.capability-console { margin-inline:auto; width:min(calc(100% - 2.5rem),76rem); }.capabilities .eyebrow { color:var(--violet-soft); }.capabilities__intro h2 { font-size:clamp(2.5rem,5vw,4.5rem); letter-spacing:-.055em; line-height:.98; margin:0; max-width:12ch; }.capabilities__intro>p:last-child { color:#637381; font-size:1rem; line-height:1.6; margin:1.25rem 0 0; max-width:41rem; }
.capability-console { background:#171d27; border:1px solid #313c4c; border-radius:1.25rem; box-shadow:0 1.5rem 3.5rem rgba(22,28,36,.17); color:#fff; display:grid; margin-top:3rem; overflow:hidden; }.capability-console__copy { display:flex; flex-direction:column; min-height:20rem; padding:1.5rem; }.capability-console__step { color:var(--acid); font-size:.75rem; font-weight:900; letter-spacing:.12em; margin:0 0 2.3rem; }.capability-console__copy h3 { font-size:clamp(1.75rem,3vw,2.75rem); letter-spacing:-.055em; line-height:1; margin:0; max-width:13ch; }.capability-console__copy>p:not(.capability-console__step) { color:#b6c2cf; font-size:.94rem; line-height:1.6; margin:.95rem 0 0; max-width:28rem; }.capability-console__next { align-items:center; align-self:flex-start; background:transparent; border:0; color:var(--acid); cursor:pointer; font:inherit; font-size:.78rem; font-weight:900; margin-top:auto; padding:1rem 0 0; text-align:left; }.capability-console__next span { display:inline-block; font-size:1.1rem; margin-left:.45rem; transition:transform .2s ease; }.capability-console__next:hover span { transform:translateY(.2rem); }
.capability-console__screen { background:#222b38; border-block:1px solid #313c4c; min-height:25rem; overflow:hidden; padding:1rem; position:relative; }.capability-console__screen::before { background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:1.75rem 1.75rem; content:""; inset:0; pointer-events:none; position:absolute; }.capability-preview { display:none; height:100%; position:relative; z-index:1; }.capability-preview.is-active { display:block; }
.capability-console__controls { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }.capability-control { background:#171d27; border:0; border-right:1px solid #313c4c; border-top:1px solid #313c4c; color:#b6c2cf; cursor:pointer; font:inherit; font-size:.78rem; font-weight:800; min-height:3.8rem; padding:.65rem; text-align:left; transition:background .2s ease,color .2s ease; }.capability-control span { color:#778596; display:block; font-size:.625rem; margin-bottom:.25rem; }.capability-control.is-active,.capability-control:hover { background:#293344; color:#fff; }.capability-control.is-active span { color:var(--acid); }
.capability-preview__top,.inventory-preview>header { align-items:center; border-bottom:1px solid #3b4554; display:flex; font-size:.7rem; font-weight:800; justify-content:space-between; padding:.35rem .15rem 1rem; }.capability-preview button { background:#6e3a8f; border:0; border-radius:.35rem; color:#fff; font:inherit; font-size:.64rem; font-weight:800; padding:.5rem .6rem; }.template-grid { display:grid; gap:.75rem; grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:1rem; }.template-grid article { background:#2c3748; border:1px solid #465263; border-radius:.55rem; display:flex; flex-direction:column; min-height:8.5rem; padding:.8rem; }.template-grid i { align-items:center; background:#efe6f5; border-radius:.25rem; color:#6e3a8f; display:inline-flex; font-size:.6rem; font-style:normal; font-weight:900; height:1.4rem; justify-content:center; width:1.7rem; }.template-grid strong { font-size:.76rem; margin-top:auto; }.template-grid small { color:#a9b7c7; font-size:.62rem; margin-top:.35rem; }.template-grid__ai { background:linear-gradient(140deg,#4f2a67,#28384a)!important; grid-column:1/-1; min-height:5.2rem!important; }.template-grid__ai i { background:var(--acid); color:var(--ink); }
.designer-preview { display:grid; gap:.75rem; grid-template-columns:30% 1fr; height:100%; }.designer-preview aside { border-right:1px solid #414d5c; display:flex; flex-direction:column; gap:.4rem; padding:.3rem .65rem .3rem 0; }.designer-preview aside span { color:#9caaba; font-size:.62rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.designer-preview aside b { background:#303b4c; border-radius:.3rem; color:#cad5df; font-size:.66rem; font-weight:600; padding:.45rem; }.designer-preview>div { background:#f8fafb; border-radius:.55rem; color:#253040; padding:.75rem; }.designer-preview header { border-bottom:1px solid #dfe3e8; font-size:.78rem; font-weight:900; padding-bottom:.65rem; }.designer-preview header em { background:#dbf5d2; border-radius:.7rem; color:#337c1d; float:right; font-size:.55rem; font-style:normal; padding:.22rem .4rem; }.designer-preview section { padding-top:.85rem; }.designer-preview section>strong { display:block; font-size:.68rem; margin-bottom:.7rem; }.designer-preview label { border:1px solid #c5d0dc; border-radius:.3rem; display:block; font-size:.62rem; margin-top:.5rem; padding:.5rem; }.designer-preview label i { background:#dce5ee; border-radius:.3rem; display:block; height:.32rem; margin-top:.35rem; width:75%; }.designer-preview .designer-preview__drop { border:1px dashed #8d4ab7; color:#6e3a8f; }
.dispatch-preview { display:grid; gap:.75rem; height:100%; }.dispatch-preview__schedule { background:#293344; border:1px solid #596679; border-radius:.55rem; padding:.75rem; }.dispatch-preview__schedule span { color:var(--acid); display:block; font-size:.56rem; font-weight:900; letter-spacing:.1em; }.dispatch-preview__schedule strong { display:block; font-size:.9rem; margin-top:.4rem; }.dispatch-preview__schedule small { color:#aebdcb; font-size:.65rem; }.dispatch-preview__schedule b { background:#dbf5d2; border-radius:99rem; color:#286c19; float:right; font-size:.58rem; margin-top:-.3rem; padding:.25rem .45rem; }.dispatch-preview__route { align-items:center; display:flex; gap:.4rem; justify-content:space-between; padding:.6rem .1rem; }.dispatch-preview__route span { color:#dfe7ef; font-size:.6rem; font-weight:800; text-align:center; }.dispatch-preview__route i { background:linear-gradient(90deg,var(--violet),var(--acid)); height:2px; min-width:.8rem; }.dispatch-preview__people { background:#202a37; border-radius:.5rem; display:grid; grid-template-columns:1fr auto; padding:.35rem .7rem; }.dispatch-preview__people p { color:#dfe7ef; font-size:.67rem; font-weight:800; margin:.35rem 0; }.dispatch-preview__people p b { background:#76518d; border-radius:50%; display:inline-flex; font-size:.52rem; height:1.2rem; justify-content:center; margin-right:.3rem; padding-top:.35rem; width:1.2rem; }.dispatch-preview__people small { align-self:center; color:var(--acid); font-size:.58rem; }.dispatch-preview__people .is-waiting { color:var(--orange); }
.mobile-preview { background:#f7f9fb; border:8px solid #111927; border-radius:1.9rem; color:#202b39; height:21rem; margin:auto; max-width:12.2rem; overflow:hidden; padding:1.1rem .75rem .6rem; position:relative; }.mobile-preview__notch { background:#111927; border-radius:0 0 .75rem .75rem; height:.75rem; left:50%; position:absolute; top:0; transform:translateX(-50%); width:4.2rem; }.mobile-preview>small { display:block; font-size:.54rem; font-weight:900; }.mobile-preview header { align-items:center; border-bottom:1px solid #dfe3e8; display:flex; font-size:.65rem; font-weight:900; gap:.5rem; margin-top:1.4rem; padding-bottom:.65rem; }.mobile-preview header i { background:#efe6f5; border-radius:.3rem; color:#6e3a8f; font-style:normal; padding:.35rem; }.mobile-preview header em { color:#758598; font-size:.55rem; font-style:normal; font-weight:500; }.mobile-preview label { display:block; font-size:.58rem; font-weight:800; margin-top:.85rem; }.mobile-preview label b,.mobile-preview label button { border:1px solid #c9d4e0; border-radius:.35rem; box-sizing:border-box; display:block; font-size:.56rem; font-weight:600; margin-top:.3rem; padding:.5rem; width:100%; }.mobile-preview label b { color:#4d5c6e; }.mobile-preview label button { background:#efe6f5; border:0; color:#6e3a8f; }.mobile-preview footer { bottom:.6rem; display:flex; gap:.25rem; left:50%; position:absolute; transform:translateX(-50%); }.mobile-preview footer i { background:#cbd6e0; border-radius:99rem; height:.28rem; width:.28rem; }.mobile-preview footer .is-active { background:#6e3a8f; width:.9rem; }
.inventory-preview { background:#f8fafb; border-radius:.55rem; color:#273241; height:100%; padding:.85rem; }.inventory-preview>header { border-color:#dde4eb; }.inventory-preview>header button { background:#6e3a8f; }.inventory-preview__search { border:1px solid #cad5df; border-radius:.35rem; color:#91a1b1; font-size:.63rem; margin-top:.75rem; padding:.5rem; }.inventory-preview__table { display:grid; font-size:.6rem; gap:.55rem .35rem; grid-template-columns:1.4fr .7fr .9fr; margin-top:.9rem; }.inventory-preview__table>span { color:#8291a2; font-weight:800; }.inventory-preview__table b { font-weight:700; }.inventory-preview__table em { color:#3b8528; font-style:normal; }.inventory-preview__table em:last-child { color:#c88b00; }
.insights-preview { display:flex; flex-direction:column; gap:.8rem; height:100%; }.insights-preview__stats { display:grid; gap:.6rem; grid-template-columns:repeat(3,minmax(0,1fr)); }.insights-preview__stats span { background:#293344; border:1px solid #435065; border-radius:.45rem; padding:.55rem; }.insights-preview__stats small { color:#aab8c7; display:block; font-size:.53rem; }.insights-preview__stats b { color:#fff; font-size:1rem; }.insights-preview__charts { display:grid; flex:1; gap:.7rem; grid-template-columns:repeat(2,minmax(0,1fr)); }.insights-preview__charts article { background:#293344; border:1px solid #435065; border-radius:.45rem; min-height:7.5rem; padding:.65rem; position:relative; }.insights-preview__charts small { color:#cbd7e2; font-size:.57rem; font-weight:800; }.insights-preview__charts i:not(.insights-preview__donut i) { border-radius:99rem; display:block; height:.42rem; margin-top:.8rem; }.bar-one { background:#8d4ab7; width:45%; }.bar-two { background:#74caff; width:78%; }.bar-three { background:var(--acid); width:61%; }.insights-preview__charts svg { bottom:.7rem; height:4rem; left:.45rem; position:absolute; width:calc(100% - .9rem); }.insights-preview__charts path { fill:none; stroke:var(--acid); stroke-width:3; }.insights-preview__donut { grid-column:1/-1; }.insights-preview__donut i { background:conic-gradient(var(--acid) 0 74%,#ff4848 74% 86%,#475467 86% 100%); border-radius:50%; height:5rem; left:50%; position:absolute; top:2.1rem; transform:translateX(-50%); width:5rem; }.insights-preview__donut i::after { background:#293344; border-radius:50%; content:""; inset:.85rem; position:absolute; }.insights-preview__donut b { font-size:.7rem; left:50%; position:absolute; top:4.2rem; transform:translateX(-50%); z-index:1; }
@media (min-width:40rem) { .capabilities__intro,.capability-console { width:min(calc(100% - 4rem),76rem); }.capability-console__screen { min-height:27rem; padding:1.5rem; }.capability-console__controls { grid-template-columns:repeat(3,minmax(0,1fr)); }.template-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.template-grid__ai { grid-column:auto; min-height:8.5rem!important; } .dispatch-preview { grid-template-columns:1fr 1.5fr; }.dispatch-preview__people { grid-column:1/-1; } .insights-preview__charts { grid-template-columns:1.1fr 1fr .85fr; }.insights-preview__donut { grid-column:auto; } }
@media (min-width:64rem) { .capability-console { grid-template-columns:19rem minmax(0,1fr); }.capability-console__copy { min-height:32rem; padding:2rem; }.capability-console__screen { border-block:0; border-left:1px solid #313c4c; min-height:32rem; padding:2rem; }.capability-console__controls { grid-column:1/-1; grid-template-columns:repeat(6,minmax(0,1fr)); }.capability-control { min-height:4.2rem; padding:.75rem 1rem; }.designer-preview { grid-template-columns:27% 1fr; }.mobile-preview { height:25rem; max-width:14rem; }.inventory-preview { padding:1.2rem; }.inventory-preview__table { font-size:.72rem; margin-top:1.3rem; }.insights-preview__charts article { min-height:12rem; }.insights-preview__donut i { height:6.5rem; top:3.5rem; width:6.5rem; }.insights-preview__donut b { top:6rem; } }