/* Native 3D: the established InMedoc palette, with no rendering dependencies. */
.hero-motion{display:inline-flex;min-height:36px;margin:9px 0 -10px;padding:5px 0;color:var(--muted);gap:8px;font-size:11px}
.hero-motion>span:first-child{display:grid;place-items:center;width:21px;height:21px;border:1px solid #B6C7E4;border-radius:50%;font-size:10px;color:var(--primary)}
.hero-visual{perspective:1500px;padding-top:38px;padding-bottom:37px}
.dashboard-stage{position:relative;transform-style:preserve-3d;transform:rotateX(calc(1.5deg + var(--tilt-x,0deg))) rotateY(calc(-3deg + var(--tilt-y,0deg)));transition:transform .5s var(--ease)}
.dashboard-layer{position:absolute;inset:5px;border:1px solid #BDCEED;border-radius:16px;pointer-events:none}
.layer-back{background:#DCE7FA;transform:translate3d(13px,17px,-30px) rotate(1.5deg);box-shadow:0 25px 55px -26px #10244740}
.layer-middle{background:#EDF3FE;transform:translate3d(7px,8px,-14px) rotate(.65deg)}
.dashboard-stage .app-window{transform:translateZ(5px);box-shadow:0 20px 50px -27px #10244750}
.hero-visual .visual-halo{display:block;position:absolute;inset:2% -4% 0;background:radial-gradient(ellipse,#DCE9FF 0%,#ECF3FF 42%,transparent 70%);border-radius:50%;z-index:-1;pointer-events:none}
.hero-visual .floating-pill{top:0;animation:hero-label-float 8s ease-in-out infinite;box-shadow:0 8px 25px -13px #245BDB55}
.hero-visual .floating-result{bottom:-2px;animation:hero-label-float 9s ease-in-out -3s infinite;box-shadow:0 15px 32px -18px #10244780}
.hero-visual:focus-within .dashboard-stage{transform:none}
.hero-visual:focus-within .floating-pill,.hero-visual:focus-within .floating-result{animation-play-state:paused}
@keyframes hero-label-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* A pharmacy stock carton, an AI cube and a reviewable purchase order. */
.business-band{gap:48px;grid-template-columns:.9fr 1.1fr;padding-top:28px;padding-bottom:64px;min-height:490px}
.band-copy{padding-block:20px}.band-visual{min-width:0;container-type:inline-size}
.supply-stage{position:relative;width:100%;max-width:440px;aspect-ratio:440/250;margin:-5px auto -18px}
.supply-world{position:absolute;inset:0;perspective:1000px}
.supply-floor{position:absolute;width:89%;height:52%;left:5.5%;top:33%;border:1px solid #345484;border-radius:50%;background:radial-gradient(ellipse at 50% 40%,#245BDB40,transparent 68%),repeating-linear-gradient(0deg,transparent 0 23px,#5274AB18 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,#5274AB18 23px 24px);transform:rotateX(66deg);box-shadow:0 15px 32px #020D201C}
.supply-connections{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.signal-track,.signal-stream{fill:none;stroke-linecap:round;stroke-width:1.5;stroke:#5D85BC}
.signal-stream{stroke:#83DFFF;stroke-width:3;stroke-dasharray:2 22;animation:supply-signal 7s linear infinite}
.object-shadow{position:absolute;top:67%;width:23%;height:9%;border-radius:50%;background:radial-gradient(ellipse,#020D2055,transparent 72%);transform:translateX(-50%);animation:supply-shadow 7s ease-in-out infinite}
.stock-shadow{left:17%;animation-delay:-1s}.ai-shadow{left:50%;animation-delay:-3s}.po-shadow{left:83%;animation-delay:-5s}
.supply-object{--w:70px;--h:88px;--d:40px;position:absolute;top:46%;width:0;height:0;transform-style:preserve-3d}
.object-float{width:var(--w);height:var(--h);position:absolute;left:calc(var(--w) / -2);top:calc(var(--h) / -2);transform-style:preserve-3d;animation:supply-float 7s ease-in-out infinite}
.stock-object{left:17%;--w:clamp(42px,16cqw,70px);--h:clamp(60px,20cqw,88px);--d:clamp(25px,9cqw,40px)}
.stock-object .object-float{animation-delay:-1s}
.ai-object{left:50%;top:42%;--w:clamp(50px,18cqw,78px);--h:var(--w);--d:var(--w)}
.ai-object .object-float{animation-delay:-3s}
.po-object{left:83%;--w:clamp(46px,18cqw,80px);--h:clamp(64px,24cqw,106px);--d:7px}
.po-object .object-float{animation-delay:-5s}
.cuboid{position:absolute;inset:0;width:var(--w);height:var(--h);transform-style:preserve-3d;transform:rotateX(-17deg) rotateY(-29deg)}
.cube-face{position:absolute;left:50%;top:50%;width:var(--w);height:var(--h);backface-visibility:hidden;border:1px solid #FFFFFF32;background:#EDF3FF}
.face-front{transform:translate(-50%,-50%) translateZ(calc(var(--d) / 2))}
.face-back{transform:translate(-50%,-50%) rotateY(180deg) translateZ(calc(var(--d) / 2));background:#D1DFF6}
.face-right{width:var(--d);transform:translate(-50%,-50%) rotateY(90deg) translateZ(calc(var(--w) / 2));background:#B0C7ED}
.face-left{width:var(--d);transform:translate(-50%,-50%) rotateY(-90deg) translateZ(calc(var(--w) / 2));background:#A3BCE6}
.face-top{height:var(--d);transform:translate(-50%,-50%) rotateX(90deg) translateZ(calc(var(--h) / 2));background:#FFFFFF}
.face-bottom{height:var(--d);transform:translate(-50%,-50%) rotateX(-90deg) translateZ(calc(var(--h) / 2));background:#96B1DF}
.stock-pack-back{transform:translate3d(18px,-19px,-28px) rotateX(-17deg) rotateY(-29deg) scale(.8)}
.stock-pack .face-front{background:#F4F8FF;overflow:hidden}.stock-pack .face-top:after{content:'';position:absolute;inset:0 38%;background:#D8E5F9}
.pack-cross{position:absolute;left:15%;top:9%;width:30%;aspect-ratio:1;display:grid;place-items:center;background:var(--primary);color:white;border-radius:3px;font:600 clamp(16px,4cqw,22px)/1 Arial,sans-serif}
.pack-line{position:absolute;left:15%;top:49%;height:3px;width:62%;background:#B1C6E7;border-radius:2px}.pack-line.short{top:59%;width:41%}
.pack-band{position:absolute;inset:76% 0 0;background:#245BDB}.stock-pack .face-right{background:linear-gradient(#C1D4F1 76%,#1949BB 76%)}
.ai-cube{animation:ai-orient 12s ease-in-out infinite}
.ai-cube .face-front{background:linear-gradient(135deg,#3676EE,#245BDB 65%,#194BB9);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#FFFFFF;gap:3px;box-shadow:inset 0 0 0 3px #FFFFFF0C}
.ai-cube .face-front>.icon{width:30%;height:30%;stroke-width:1.5}.ai-cube b{font-size:clamp(18px,5cqw,25px);font-weight:650;letter-spacing:1px;line-height:1}
.ai-cube .face-right{background:#153E9C;display:flex;align-items:center;justify-content:center;gap:5px}
.ai-cube .face-right i{height:30%;width:3px;background:#578AE8;border-radius:3px}.ai-cube .face-right i:nth-child(2){height:50%;background:#91BCFF}
.ai-cube .face-left,.ai-cube .face-back{background:#173D94}.ai-cube .face-top{background:#5B91F2;display:grid;place-items:center}
.ai-cube .face-bottom{background:#163779}.chip-grid{width:48%;height:48%;border:1px solid #BAD5FF;box-shadow:0 0 0 4px #73A4F5,0 0 0 5px #C9DFFF66;border-radius:3px;background:#4078D8}
.po-document{transform:rotateX(-12deg) rotateY(-23deg) rotateZ(5deg)}
.po-document .face-front{background:#FFFFFF;padding:14% 13%;border-radius:3px;box-shadow:3px 3px 0 #C5D6F2,6px 6px 0 #7C9CCC}
.document-heading{display:flex;align-items:center;justify-content:space-between;color:var(--primary);margin-bottom:22%;font-size:clamp(8px,2.6cqw,12px)}
.document-heading .icon{width:28%;height:auto}.document-line{display:block;height:3px;width:100%;background:#C8D7ED;margin-top:12%;border-radius:3px}.document-line.short{width:59%}
.document-check{position:absolute;bottom:9%;right:12%;width:27%;aspect-ratio:1;display:grid;place-items:center;background:#E9F0FE;border-radius:50%;color:#245BDB}.document-check .icon{width:70%;height:70%;stroke-width:2.5}
.supply-caption{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:440px;margin:0 auto 23px;text-align:center;gap:6px;font-size:11px;font-weight:500;color:#D5E6FF;position:relative}
.band-dashboard{position:relative;background:linear-gradient(115deg,#1C3B65,#173258);box-shadow:0 14px 30px -23px #020D20}
.band-dashboard-head{font-size:12px}.band-metrics{margin-top:18px}.band-metrics strong{font-size:28px}.band-track{margin-top:18px}
@keyframes supply-float{0%,100%{transform:translateY(2px)}50%{transform:translateY(-7px)}}
@keyframes supply-shadow{0%,100%{opacity:.9;scale:1}50%{opacity:.55;scale:.85}}
@keyframes ai-orient{0%,100%{transform:rotateX(-17deg) rotateY(-29deg)}50%{transform:rotateX(-21deg) rotateY(-37deg)}}
@keyframes supply-signal{to{stroke-dashoffset:-240}}

/* Give the existing workflow illustration depth; keep all labels readable. */
.flow-visual{perspective:850px;padding:10px 5px 13px}
.data-column{perspective:700px;padding-right:2px}
.data-column b{position:relative;border-radius:7px;box-shadow:2px 3px 0 #DCE6F6,4px 6px 0 #EDF2FC,0 9px 13px -10px #10244740;transform:rotateY(-8deg);animation:workflow-card-float 7s ease-in-out infinite}
.data-column b:nth-of-type(2){animation-delay:-2.3s}.data-column b:nth-of-type(3){animation-delay:-4.6s}
.flow-core{background:linear-gradient(135deg,#F6F9FF,#DDE9FF);border:1px solid #ABC2E9;border-radius:13px;transform:rotateX(9deg) rotateY(-16deg);box-shadow:1px 1px 0 #B9CCEC,2px 2px 0 #B9CCEC,3px 3px 0 #B9CCEC,4px 4px 0 #B9CCEC,5px 5px 0 #B9CCEC,6px 6px 0 #B9CCEC,0 16px 22px -12px #245BDB45;animation:workflow-core-float 8s ease-in-out infinite}
.flow-visual[data-phase="1"] .flow-core{background:linear-gradient(135deg,#3676EE,#245BDB);color:white;border-color:#5C8BEC;box-shadow:1px 1px 0 #1749B6,2px 2px 0 #1749B6,3px 3px 0 #1749B6,4px 4px 0 #1749B6,5px 5px 0 #1749B6,6px 6px 0 #1749B6,0 16px 22px -12px #245BDB70}
.flow-wire{width:clamp(35px,5vw,70px)}
@keyframes workflow-card-float{0%,100%{transform:rotateY(-8deg) translateY(0)}50%{transform:rotateY(-8deg) translateY(-3px)}}
@keyframes workflow-core-float{0%,100%{transform:rotateX(9deg) rotateY(-16deg) translateY(0)}50%{transform:rotateX(9deg) rotateY(-16deg) translateY(-4px)}}

/* Pause controls, offscreen scenes and background tabs all stop the motion. */
.motion-asleep *,.motion-asleep *:before,.motion-asleep *:after,.document-hidden *,.document-hidden *:before,.document-hidden *:after{animation-play-state:paused!important}
.motion-paused .dashboard-stage,.document-hidden .dashboard-stage{transform:none;transition:none}
@media(max-width:1150px){.business-band{gap:30px;padding-inline:32px}.band-dashboard{padding:18px}.band-metrics strong{font-size:26px}.band-rule{flex-wrap:wrap;gap:6px 12px}.supply-caption{font-size:10px}.hero-visual{padding-left:0}}
@media(max-width:900px){.hero-visual{max-width:620px}.dashboard-stage{transform:rotateX(1deg) rotateY(-2deg)}.business-band{gap:22px}.band-metrics small{display:block}}
@media(max-width:820px){.business-band{grid-template-columns:1fr;gap:0;padding:25px 35px 66px;min-height:0}.band-copy{padding-bottom:10px}.band-visual{width:100%;max-width:560px;margin-inline:auto}.supply-stage{margin-top:0}.supply-caption{font-size:12px}.band-dashboard{padding:23px}.band-metrics strong{font-size:30px}.band-metrics small{display:inline}}
@media(max-width:580px){.hero-visual{padding-block:32px 38px}.dashboard-stage{transform:none}.layer-back{transform:translate3d(7px,13px,-24px) rotate(.75deg)}.layer-middle{transform:translate3d(4px,6px,-12px)}.hero-visual .floating-pill{font-size:9px}.hero-motion{font-size:10px;margin-top:6px}.business-band{padding:21px 23px 67px}.band-copy{padding-top:7px}.supply-caption{font-size:10px;margin-bottom:20px;gap:4px}.supply-stage{margin-bottom:-9px}.band-dashboard{padding:17px}.band-metrics{gap:8px}.band-metrics span{font-size:9px}.band-metrics strong{font-size:25px}.band-metrics small{display:block;font-size:9px}.band-dashboard-head{font-size:11px;gap:8px}.band-dashboard-head>b{font-size:7px}.band-rule{font-size:9px}.business-band .scene-controls{left:23px;right:23px;justify-content:space-between;gap:8px}.scene-controls>span{font-size:8px}.scene-controls button{font-size:9px;min-height:34px;flex-shrink:0}.flow-visual{padding:7px 0 14px}.data-column{min-width:0;flex:1;max-width:210px}.data-column b{font-size:10px;padding-inline:10px}.flow-core{flex:0 0 52px;height:52px}.flow-wire{width:30px;flex-shrink:0}}
@media(max-width:360px){.supply-caption{font-size:9px}.band-dashboard{padding:14px}.band-dashboard-head>span{gap:5px}.band-dashboard-head .icon{width:14px}.band-dashboard-head>b{letter-spacing:0;font-size:6px}.band-metrics strong{font-size:23px}.band-metrics span{min-height:26px}.business-band .scene-controls>span{max-width:124px;line-height:1.5}}
@media(hover:none),(pointer:coarse){.dashboard-stage{transform:none}}
@media(prefers-reduced-motion:reduce){.dashboard-stage{transform:none;transition:none}.object-float,.object-shadow,.ai-cube,.signal-stream,.data-column b,.flow-core,.hero-visual .floating-pill,.hero-visual .floating-result{animation:none!important}.signal-stream{stroke-dashoffset:0}.object-shadow{opacity:.75}}
@supports not (transform-style:preserve-3d){.cube-face:not(.face-front){display:none}.cuboid,.cube-face,.dashboard-stage{transform:none}.cube-face{left:0;top:0}.stock-pack-back{display:none}}