.a15 .refresh-example{display:grid;grid-template-columns:minmax(0,500px) minmax(0,640px);justify-content:center;gap:36px;align-items:center;max-width:1256px;padding:78px 40px 35px;margin-inline:auto}
.a15 .refresh-copy{max-width:500px;text-align:center}.a15 .refresh-copy h2{margin:16px 0 21px}.a15 .refresh-copy>p:not(.kicker){font-size:16px;line-height:1.7;max-width:340px;color:var(--muted);margin-inline:auto}
.a15 .refresh-copy .text-button{font-size:14px;margin:10px auto 0}.a15 .refresh-copy .text-button span{margin-left:10px}.a15 .refresh-figure{margin:0;min-width:0}.refresh-window{border:1px solid #cbbde3;border-radius:14px;overflow:hidden;box-shadow:0 22px 42px -28px #4d398366;background:#faf6ff}
.refresh-browser{height:31px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;background:#f4efff;border-bottom:1px solid #d8cdea;font:10px "DM Sans",sans-serif;color:#76658e;letter-spacing:.15px}.refresh-dots{letter-spacing:3px;color:#b3a4d0;font-size:8px}
.refresh-stage{position:relative;aspect-ratio:1040/650;isolation:isolate;overflow:hidden}.refresh-layer{position:absolute;inset:0;pointer-events:none}.refresh-layer svg{display:block;width:100%;height:100%}.refresh-before{clip-path:inset(0 calc(100% - var(--split)) 0 0);z-index:1}.refresh-after{clip-path:inset(0 0 0 var(--split));z-index:0}
.refresh-label{position:absolute;top:13px;display:block;border-radius:30px;padding:8px 14px;font:600 13px/1 "DM Sans",sans-serif;letter-spacing:.1px;box-shadow:0 2px 5px #0001}.refresh-label-before{left:12px;color:#fff;background:#5b487e}.refresh-label-after{right:12px;color:#372c75;background:#ece2ff}.refresh-label[hidden]{display:none}
.refresh-divider{position:absolute;z-index:2;left:var(--split);top:0;bottom:0;width:2px;transform:translateX(-50%);background:#fff;box-shadow:0 0 0 1px #5c468530;pointer-events:none}.refresh-grip{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);height:46px;width:46px;border-radius:50%;background:#faf6ff;color:#372c75;box-shadow:0 2px 12px #372c7533;display:flex;align-items:center;justify-content:center;font:700 24px/1 Georgia,serif;border:1px solid #cbbde3;white-space:nowrap}
.refresh-range{position:absolute!important;inset:0;z-index:3;width:100%!important;height:100%!important;padding:0!important;margin:0!important;opacity:0;cursor:ew-resize;touch-action:pan-y;direction:ltr}.refresh-window:focus-within{outline:3px solid #745daf;outline-offset:5px}
.a15 .refresh-controls{display:flex;gap:4px;justify-content:center;margin:14px 0 9px}.a15 .refresh-controls button{border:1px solid transparent;border-radius:20px;font:500 13px/1.2 "DM Sans",sans-serif;padding:9px 16px;color:#76658e;background:transparent;cursor:pointer;min-height:40px}.a15 .refresh-controls button[aria-pressed="true"]{background:#f4efff;color:#372c75;border-color:#cbbde3}.a15 .refresh-controls button:focus-visible{outline:2px solid #745daf;outline-offset:2px}.a15 .refresh-figure figcaption{font:11px/1.5 "DM Sans",sans-serif;text-align:center;color:#76658e;margin:0}
@media(max-width:1100px){.a15 .refresh-example{grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr);gap:28px;padding-inline:30px}}
@media(max-width:900px){.a15 .refresh-example{grid-template-columns:1fr;gap:24px;padding:50px 22px 20px}.a15 .refresh-copy{max-width:500px;justify-self:center}.a15 .refresh-copy>p:not(.kicker){max-width:430px}.a15 .refresh-figure{width:100%;max-width:640px;justify-self:center}.refresh-label{top:10px;padding:8px 12px;font-size:12px}.refresh-label-before{left:9px}.refresh-label-after{right:9px}}
@media(prefers-reduced-motion:reduce){.refresh-example *{scroll-behavior:auto}}