/* Original device photography; native scroll surfaces follow the display geometry. */
.bxm-devices{position:relative;isolation:isolate;background:#000;color:#f5f7fb;overflow:hidden;padding:max(68px,calc(clamp(76px,6vw,112px) - 10px)) 0 24px}
.bxm-devices .bxm-about-shell{max-width:1800px;position:relative}
.bxm-devices__edge{position:absolute;top:0;left:0;width:100%;height:clamp(24px,3vw,48px);background:var(--about-bg,#fff);clip-path:polygon(0 0,100% 0,50% 100%);transform:scaleY(var(--device-fold,1));transform-origin:50% 0;pointer-events:none;z-index:2}
.bxm-devices__ambience{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 0 15%,#1b385c80,transparent 45%),radial-gradient(ellipse at 100% 8%,#25473a55,transparent 42%);opacity:.38}
.bxm-devices.is-playing .bxm-devices__ambience{animation:bxm-device-ambience 12s ease-in-out infinite alternate}
@keyframes bxm-device-ambience{to{opacity:.85;filter:hue-rotate(38deg)}}
.bxm-devices__heading{display:grid;grid-template-columns:1.2fr 1fr;gap:8%;align-items:start;margin-bottom:82px}
.bxm-devices__heading h2{font:300 clamp(44px,5.1vw,96px)/1.07 var(--bxm-font-family);letter-spacing:-.06em;margin:0;scroll-margin-top:160px}
.bxm-devices__heading em{font-style:normal;color:#8dbdff}
.bxm-devices__intro{max-width:52ch;justify-self:end}
.bxm-devices__intro h3{font-size:clamp(20px,1.5vw,28px);font-weight:600;line-height:1.4;margin:0 0 12px}
.bxm-devices__intro p{color:#bec8d2;font-size:var(--bxm-type-body);line-height:1.65;margin:0 0 22px}
.bxm-devices__stage{position:relative;aspect-ratio:2.22;margin:0 auto;max-width:1600px}
.bxm-device{position:absolute;aspect-ratio:var(--crop-w)/var(--crop-h);transform-origin:50% 75%;mix-blend-mode:lighten}
.bxm-device__photo{position:absolute;inset:0;overflow:hidden;pointer-events:none;mix-blend-mode:lighten;visibility:hidden}
.bxm-device__photo img{position:absolute;width:calc(5000 / var(--crop-w) * 100%);max-width:none;height:auto;left:calc(-1 * var(--crop-x) / var(--crop-w) * 100%);top:calc(-1 * var(--crop-y) / var(--crop-h) * 100%)}
.bxm-device--laptop{--crop-x:980;--crop-y:700;--crop-w:1350;--crop-h:1200;width:49%;left:1%;top:0;z-index:1;--entry-x:-90px;--entry-y:40px;--entry-r:-5deg;--delay:0s}
.bxm-device--tablet{--crop-x:2760;--crop-y:840;--crop-w:960;--crop-h:680;width:33%;right:1%;top:13%;--entry-x:90px;--entry-y:10px;--entry-r:7deg;--delay:.22s}
.bxm-device--phone{--crop-x:2360;--crop-y:1100;--crop-w:280;--crop-h:560;width:10%;left:53%;top:36%;z-index:3;--entry-x:0px;--entry-y:95px;--entry-r:-8deg;--delay:.4s}
.bxm-device--watch{--crop-x:2410;--crop-y:700;--crop-w:180;--crop-h:270;width:8.5%;left:53.6%;top:0;z-index:2;container-type:inline-size;--entry-x:0px;--entry-y:-70px;--entry-r:10deg;--delay:.6s}
.bxm-device__screen{position:absolute;overflow:hidden;background:#000}
.bxm-device--laptop .bxm-device__screen{left:2%;top:3.15%;width:95.15%;height:32.85%;background:transparent;overflow:visible}
/* Homography is applied to this whole viewport, not just a clipping mask. */
.bxm-device--laptop .bxm-device__viewport{transform-origin:0 0;transform:var(--device-perspective,none);border-radius:2px}
.bxm-devices:not(.is-enhanced) .bxm-device--laptop .bxm-device__viewport{clip-path:polygon(0 0,100% 0,93.5% 100%,6.6% 100%)}
.bxm-device--tablet .bxm-device__screen{left:4.5%;top:5%;width:91%;height:88%;border-radius:3%}
.bxm-device--phone .bxm-device__screen{left:6%;top:3%;width:88%;height:95.5%;border-radius:15% / 7%}
.bxm-device--phone .bxm-device__screen::after{content:"";position:absolute;width:30%;height:4%;top:2%;left:35%;border-radius:99px;background:#000;z-index:4;pointer-events:none}
.bxm-device__viewport{position:absolute;inset:0;overflow-x:hidden;overflow-y:auto;background:#000;opacity:0;scrollbar-width:none;cursor:grab;touch-action:pan-y;transition:opacity .8s,filter .8s}
.bxm-device__viewport::-webkit-scrollbar{display:none}
.bxm-device__viewport.is-dragging{cursor:grabbing;user-select:none}
.bxm-device__viewport img{display:block;width:100%;max-width:none;height:auto;pointer-events:none;user-select:none}
.bxm-device__viewport:focus-visible{outline:3px solid #8dbdff;outline-offset:-4px}
.bxm-device--watch .bxm-device__screen{left:16%;top:20%;width:70%;height:56%;border-radius:23%;color:white;padding:2% 0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1%;font:600 11cqw/1.05 var(--bxm-font-family);text-decoration:none;background:radial-gradient(ellipse at 50% 0,#18394a,#060b10 75%)}
.bxm-devices.is-enhanced:not(.is-lit) .bxm-device__viewport{opacity:0;filter:brightness(0)}
.bxm-devices.is-enhanced:not(.is-lit) .bxm-device__watch-face>*{opacity:0}
.bxm-devices.is-enhanced:not(.is-arrived) .bxm-device{opacity:0;transform:translate(var(--entry-x),var(--entry-y)) rotate(var(--entry-r)) scale(.96)}
.bxm-devices.is-arrived .bxm-device{animation:bxm-device-arrive 1.25s var(--delay) cubic-bezier(.16,1,.3,1) backwards}
@keyframes bxm-device-arrive{from{opacity:0;transform:translate(var(--entry-x),var(--entry-y)) rotate(var(--entry-r)) scale(.96)}to{opacity:1;transform:none}}
.bxm-devices__hint{font-size:14px;color:#aebaca;margin:0;max-width:44ch;line-height:1.6}
.bxm-devices button:focus-visible,.bxm-devices a:focus-visible{outline:2px solid #8dbdff;outline-offset:4px}
.bxm-devices [hidden]{display:none!important}
@media(max-width:1000px){.bxm-devices__hint{max-width:none;width:100%}.bxm-devices__heading{gap:5%}.bxm-devices__intro .bxm-action{font-size:14px}}
@media(max-width:760px){
 .bxm-devices{padding-top:64px}.bxm-devices__heading{grid-template-columns:1fr;gap:26px;margin-bottom:42px}.bxm-devices__heading h2{font-size:clamp(40px,9vw,65px);scroll-margin-top:110px}.bxm-devices__intro{justify-self:start}.bxm-devices__intro p{font-size:16px}
 .bxm-devices__stage{aspect-ratio:.61;margin-inline:-2%}
 .bxm-device--laptop{width:100%;left:0;top:0}
 .bxm-device--tablet{width:70%;left:0;right:auto;top:52%;z-index:2}
 .bxm-device--phone{width:24%;left:auto;right:0;top:51%}
 .bxm-device--watch{width:21%;left:18%;top:79%}
}
@media(prefers-reduced-motion:reduce){.bxm-devices *{animation:none!important;transition:none!important}.bxm-devices.is-enhanced:not(.is-arrived) .bxm-device{opacity:1;transform:none}}

/* Contextual cues belong to the photographed controls, never floating toolbars. */
.bxm-devices__sr{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.bxm-devices .bxm-devices__flow{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.bxm-devices .bxm-devices__top-flow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.bxm-devices__flow-bed{stroke:#7aa5d3;stroke-width:1;opacity:.15}
.bxm-devices__flow-pulse{stroke:#87c6ff;stroke-width:2;opacity:0;stroke-dasharray:32 968;filter:drop-shadow(0 0 5px #438afa)}
.bxm-devices.is-playing .bxm-devices__flow-pulse{opacity:.7}
.bxm-devices.is-playing .bxm-devices__flow-pulse path{animation:bxm-device-signal 10s linear infinite}
.bxm-devices.is-playing .bxm-devices__flow-pulse path:nth-child(2){animation-delay:-4.2s;stroke:#8ce1d9}
@keyframes bxm-device-signal{from{stroke-dashoffset:1000}to{stroke-dashoffset:-1000}}
.bxm-device__keys{position:absolute;inset:0;pointer-events:none}
.bxm-device__key{position:absolute;left:77%;width:4.8%;height:2.3%;min-height:14px;border:1px solid transparent;border-radius:2px;background:transparent;padding:0;cursor:pointer;pointer-events:auto;transition:background .2s,box-shadow .2s,transform .15s}
.bxm-device__key--up{top:73.6%}.bxm-device__key--down{top:76.2%}
.bxm-device__key:hover,.bxm-device__key:focus-visible{background:#8dbdff44;box-shadow:0 0 14px #69a9ff70}
.bxm-device__key:active{transform:translateY(1px);background:#8dbdff66}
.bxm-devices.is-playing .bxm-device__key{animation:bxm-device-key-hint 8s ease-in-out infinite}
.bxm-devices.is-playing .bxm-device__key--down{animation-delay:.35s}
@keyframes bxm-device-key-hint{0%,20%,100%{box-shadow:none}9%{box-shadow:0 0 11px #65acff90;background:#7eb8ff30}}
.bxm-device__note{position:absolute;color:#9fb6d0;font:400 16px/1.4 var(--bxm-font-family);pointer-events:none;white-space:nowrap}
.bxm-device__note svg{position:absolute;stroke:#9bbfee;stroke-width:1.15;stroke-linecap:round;stroke-linejoin:round;overflow:visible;opacity:.7}
.bxm-device__note--keys{left:42%;top:79%;width:42%;height:15%}
.bxm-device__note--keys>span{position:absolute;left:0;top:76%;transform:translateY(-50%)}
.bxm-device__note--keys svg{inset:0;width:100%;height:100%}
.bxm-device__note--call{left:100%;top:-9%;width:200%;height:100px}
.bxm-device__note--call>span{position:absolute;top:0;right:0}
.bxm-device__note--call svg{width:100%;height:100%;inset:0}
.bxm-device__watch-call{position:relative;width:65%;aspect-ratio:1;display:grid;place-items:center;color:#a7d3ff;transition:transform .25s,color .25s}
.bxm-device__watch-call svg{width:80%;height:80%;stroke-width:1.6}
.bxm-device__watch-call::after{content:"";position:absolute;inset:-8%;border:1px solid #9cccff70;border-radius:50%;opacity:0}
.bxm-devices.is-playing .bxm-device__watch-call::after{animation:bxm-device-call-pulse 6.8s ease-out infinite}
@keyframes bxm-device-call-pulse{0%,38%,100%{opacity:0;transform:scale(.7)}10%{opacity:.6}32%{opacity:0;transform:scale(1.2)}}
.bxm-device__watch-face:hover .bxm-device__watch-call{transform:rotate(-12deg) scale(1.12);color:#fff}
.bxm-device__drag-hint{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%);color:#a5bad2;font:400 14px/1.5 var(--bxm-font-family);white-space:nowrap;pointer-events:none;opacity:.6;transition:opacity .25s,transform .25s}
.bxm-device__drag-hint>span{display:inline-block;margin-left:7px;color:#9dc7ff}
.bxm-device:has(.bxm-device__viewport:hover) .bxm-device__drag-hint,.bxm-device:focus-within .bxm-device__drag-hint{opacity:1;transform:translate(-50%,-3px)}
.bxm-devices__guide{position:absolute;right:1%;bottom:3%;width:31%;display:grid;grid-template-columns:88px minmax(0,1fr);align-items:center;gap:12px;z-index:4}
.bxm-devices__guide-slot{width:88px;height:88px}
.bxm-devices__guide-tip{position:relative;padding:14px 18px;border:1px solid #8dbdff30;border-radius:16px;background:#142233d9;color:#b9cadd;font:400 14px/1.55 var(--bxm-font-family);opacity:0;transform:translateY(8px);transition:opacity .35s,transform .35s}
.bxm-devices__guide-tip::before{content:"";position:absolute;left:-6px;top:50%;width:10px;height:10px;transform:rotate(45deg);background:#142233;border-left:1px solid #8dbdff30;border-bottom:1px solid #8dbdff30}
.bxm-devices__guide-tip strong{display:block;color:#f0f6ff;font-weight:600;margin-bottom:4px}
.bxm-devices__guide-tip p{font:inherit;margin:0}
.bxm-devices__guide[data-active=true] .bxm-devices__guide-tip{opacity:1;transform:none}
@media(max-width:1000px) and (min-width:761px){.bxm-devices__stage{margin-bottom:124px}.bxm-devices__guide{width:44%;top:calc(100% + 16px);bottom:auto;grid-template-columns:64px minmax(0,1fr)}.bxm-devices__guide-slot{width:64px;height:64px}}
@media(max-width:760px){
 .bxm-devices__stage{margin-bottom:112px}
 .bxm-device__keys,.bxm-device__note--keys{display:none}
 .bxm-device__drag-hint{display:none}
 .bxm-device__note--call{top:14%;font-size:14px}
 .bxm-devices__guide{width:100%;right:0;top:calc(100% + 14px);bottom:auto;grid-template-columns:64px minmax(0,1fr);gap:12px}
 .bxm-devices__guide-slot{width:64px;height:64px;grid-column:1;grid-row:1}
 .bxm-devices__guide-tip{grid-column:2;grid-row:1;padding:14px;font-size:14px}
 .bxm-devices__guide-tip::before{left:-6px;right:auto;transform:rotate(45deg)}
 .bxm-devices .bxm-devices__flow{height:110%;opacity:.7}
}
@media(prefers-reduced-motion:reduce){.bxm-devices *, .bxm-devices *::after{animation:none!important;transition:none!important}}

/* A permanent matte covers the supplied photo before any screen can light up. */
.bxm-device__hardware{position:absolute;inset:0}
.bxm-devices.is-prepared .bxm-device__photo{visibility:visible}
.bxm-device__photo::after{content:"";position:absolute;left:var(--matte-x);top:var(--matte-y);width:var(--matte-w);height:var(--matte-h);background:#000;clip-path:var(--matte-clip,inset(0));border-radius:var(--matte-radius,0)}
.bxm-device--laptop{--matte-x:1.7%;--matte-y:2.75%;--matte-w:95.7%;--matte-h:33.7%;--matte-clip:polygon(0 0,100% 0,93.5% 100%,6.6% 100%)}
.bxm-device--tablet{--matte-x:4.2%;--matte-y:4.7%;--matte-w:91.6%;--matte-h:88.6%;--matte-radius:3%}
.bxm-device--phone{--matte-x:5.4%;--matte-y:2.5%;--matte-w:89.2%;--matte-h:96.5%;--matte-radius:15% / 7%}
.bxm-device--watch{--matte-x:15%;--matte-y:19%;--matte-w:72%;--matte-h:58%;--matte-radius:23%}
.bxm-device--laptop .bxm-device__screen::before{content:"";position:absolute;inset:0;background:#000;clip-path:polygon(0 0,100% 0,93.5% 100%,6.6% 100%)}
.bxm-device__viewport{z-index:1}
.bxm-devices.is-lit .bxm-device__viewport{opacity:1;filter:none}
.bxm-devices:not(.is-lit) .bxm-device__watch-face{background:#000}
.bxm-device__watch-call{opacity:0;transition:opacity .5s,transform .25s,color .25s}
.bxm-devices.is-lit .bxm-device__watch-call{opacity:1}
.bxm-devices.is-playing .is-cued .bxm-device__hardware{animation:bxm-device-nudge .85s .15s ease-in-out}
@keyframes bxm-device-nudge{0%,100%{transform:none}25%{transform:translateY(-5px) rotate(-1.3deg)}50%{transform:translateY(-2px) rotate(1deg)}75%{transform:translateY(-3px) rotate(-.4deg)}}
.bxm-devices.is-playing[data-device-cue="call"] .bxm-device__watch-call{animation:bxm-device-ring 2.8s ease-in-out infinite}
.bxm-devices.is-playing[data-device-phase="complete"] .bxm-device__watch-call{animation-duration:8s}
@keyframes bxm-device-ring{0%,65%,100%{transform:none}15%{transform:scale(1.16) rotate(-12deg);color:#fff}22%{transform:scale(1.16) rotate(10deg)}30%{transform:scale(1.12) rotate(-8deg)}42%{transform:scale(1.06) rotate(4deg)}}
.bxm-device__note .bxm-device__note-pulse{stroke:#d1e8ff;stroke-width:2;stroke-dasharray:12 88;opacity:0}
.bxm-devices.is-playing .bxm-device__note-pulse{animation:bxm-device-note-signal 7.8s linear infinite}
@keyframes bxm-device-note-signal{0%,65%,100%{opacity:0;stroke-dashoffset:100}10%{opacity:1}58%{opacity:0;stroke-dashoffset:-100}}
.bxm-devices.is-playing .bxm-device__note>span{animation:bxm-device-note-brighten 9s ease-in-out infinite}
@keyframes bxm-device-note-brighten{0%,35%,100%{color:#9fb6d0}15%{color:#f0f7ff;text-shadow:0 0 10px #7dbbff50}}
.bxm-devices.is-playing .bxm-devices__flow-pulse path:nth-child(3){animation-delay:-7s}
.bxm-devices.is-playing .bxm-devices__flow-pulse path:nth-child(4){animation-delay:-2.7s}
.bxm-devices.is-playing[data-device-phase="complete"] .bxm-device--phone .bxm-device__hardware{animation:bxm-device-idle-nudge 22s 6s ease-in-out infinite}
.bxm-devices.is-playing[data-device-phase="complete"] .bxm-device--tablet .bxm-device__hardware{animation:bxm-device-idle-nudge 29s 13s ease-in-out infinite}
@keyframes bxm-device-idle-nudge{0%,6%,100%{transform:none}2%{transform:translateY(-3px) rotate(-.65deg)}4%{transform:translateY(-1px) rotate(.5deg)}}
@media(max-width:1000px){.bxm-device__note{font-size:14px}.bxm-device__note--keys{left:30%;width:54%}}
@media(max-width:760px){
 .bxm-devices__flow-center{display:none}
}
/* Aim the existing articulated hand; no second robot or page-wide pose changes. */
.bxm-robot-guide[data-guide-page="about"][data-context="devices"][data-mode="chapter"]:not([data-flying="true"]):not([data-reaction="greet"]):not([data-reaction="celebrate"])[data-device-point="left"] .bxm-character{--bxmc-left-arm:var(--device-point-angle,132deg);--bxmc-right-arm:0deg}
.bxm-robot-guide[data-guide-page="about"][data-context="devices"][data-mode="chapter"]:not([data-flying="true"]):not([data-reaction="greet"]):not([data-reaction="celebrate"])[data-device-point="right"] .bxm-character{--bxmc-right-arm:var(--device-point-angle,-132deg);--bxmc-left-arm:0deg}
@media(prefers-reduced-motion:reduce){.bxm-devices *, .bxm-devices *::after{animation:none!important;transition:none!important}}