.xa{min-width:0;padding:0;position:relative}.xa-stage{aspect-ratio:1100 / 820;margin-right:calc(-1*max(var(--wf-gutter),(100vw - var(--wf-max)) / 2 + var(--wf-gutter)));perspective:1800px;position:relative}.xa-screen{left:0;position:absolute;top:6%;transform-origin:0 50%;transition:transform .8s var(--wf-ease),opacity .6s,filter .6s;width:94%}.xa-screen .wf-browser{box-shadow:0 0 0 1px #ffffff24,0 50px 100px -40px #000c}.xa-screen video,.xa-screen img{display:block;height:auto;width:100%}.xa-screen[data-slot="0"]{opacity:1;transform:none;z-index:4}.xa-screen[data-slot="1"]{filter:brightness(.6);opacity:.85;transform:translate3d(9%,-7%,-140px) rotateY(-8deg);z-index:3}.xa-screen[data-slot="2"]{filter:brightness(.45);opacity:.6;transform:translate3d(17%,-13%,-280px) rotateY(-10deg);z-index:2}.xa-screen[data-slot="3"]{filter:brightness(.35);opacity:.35;transform:translate3d(24%,-18%,-420px) rotateY(-12deg);z-index:1}.xa-screen:not(.is-front){pointer-events:none}.xa-cut{animation:xa-in .7s var(--wf-ease) .2s both;bottom:-4%;left:-6%;position:absolute;width:min(300px,46%);z-index:6}@keyframes xa-in{0%{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}.xa-cut-label{background:#3ddc97;border-radius:99px;color:#04261a;display:inline-block;font-size:11.5px;font-weight:800;letter-spacing:.08em;margin:0 0 8px;padding:4px 10px;text-transform:uppercase}.xa-piece{background:#fffaf4;border-radius:18px;box-shadow:0 0 0 1px #fff3,0 30px 60px -20px #000000b3;color:#2b1d14;display:flex;flex-direction:column;gap:12px;padding:18px}.xa-piece b{align-items:center;display:flex;font-size:15px;gap:8px}.xa-piece b svg{color:#1470e8}.xa-row{display:flex;gap:8px}.xa-row i{border:1px solid #ead9c8;border-radius:8px;color:#6e5848;flex:1;font-size:13px;font-style:normal;padding:7px 0;text-align:center}.xa-row i.is-on{background:#1470e8;border-color:#1470e8;color:#fff}.xa-products{display:grid;gap:10px;grid-template-columns:1fr 1fr}.xa-products i{display:flex;flex-direction:column;font-size:13px;font-style:normal;gap:4px}.xa-products .cafe-art{aspect-ratio:16 / 10;border-radius:10px;display:block;height:auto;width:100%}.xa-products small{color:#1470e8;font-size:13px;font-weight:800}.xa-chat{background:transparent;box-shadow:none;gap:8px;padding:0}.xa-q,.xa-a{border-radius:16px;box-shadow:0 20px 40px -18px #000000b3;font-size:14.5px;line-height:1.4;max-width:90%;padding:10px 14px}.xa-q{align-self:flex-end;background:#3b2416;border-bottom-right-radius:4px;color:#fff}.xa-a{align-self:flex-start;background:#fff;border-bottom-left-radius:4px;color:#2b1d14}.xa-hub{align-items:center;display:flex;gap:10px}.xa-hub>i{background:#e6f0ff;border-radius:50%;color:#1470e8;display:grid;flex:0 0 auto;font-size:13px;font-style:normal;font-weight:800;height:38px;place-items:center;width:38px}.xa-hub span{font-size:15px;font-weight:700}.xa-hub small{color:#6e5848;display:block;font-size:13px;font-weight:500}.xa-due{align-self:flex-start;background:#fff1c7;border-radius:99px;color:#6b4b00;font-size:12.5px;font-style:normal;font-weight:800;padding:4px 10px}.xa-caption{color:var(--wf-on-dark-3);margin:18px 0 0}.xa-caption a{color:#9de2ff;font-weight:700;margin-left:4px;text-decoration:none;white-space:nowrap}.xa-caption a:hover{color:#fff}.xa-caption a svg{vertical-align:-2px}.xs .xs-item.is-focus{border-color:#9de2ffb3;box-shadow:0 0 0 1px #9de2ff59}@media(max-width:1000px){.xa-stage{aspect-ratio:1100 / 900;margin-right:0}.xa-screen{width:86%}.xa-cut{left:0;width:min(260px,62%)}}@media(max-width:560px){.xa-cut-label{font-size:11px}.xa-piece{padding:12px;gap:8px}.xa-piece b{font-size:13.5px}.xa-row i{font-size:12px;padding:5px 0}.xa-q,.xa-a{font-size:13px;padding:8px 11px}}@media(prefers-reduced-motion:reduce){.xa-screen,.xa-cut{animation:none;transition:none}}@media(min-width:1001px){.xa-caption{margin-top:52px;padding-left:40%}}@media(max-width:560px){.xa-stage{margin-bottom:64px}.xa-cut{bottom:-18%;left:auto;right:0;width:58%}.xa-hub span{font-size:13.5px}.xa-hub small{font-size:11.5px}.xa-hub>i{height:30px;width:30px;font-size:11px}.xa-products i,.xa-products small{font-size:11.5px}}@media(max-width:560px){.xa-cut-label{font-size:10px;letter-spacing:.05em;white-space:nowrap}}@media(max-width:760px){.xa-cut{display:none}.xa-stage{margin-bottom:0}}
