.snippet-showcases{width:min(1240px,calc(100% - 64px));margin:120px auto 140px}.snippet-showcases .showcase{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:center;gap:clamp(36px,6vw,88px);margin:0;padding:80px 0;border:0}.snippet-showcases .showcase:nth-child(2n){grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)}.snippet-showcases .showcase:nth-child(2n) .showcase-copy{order:2}.snippet-showcases .showcase-copy{max-width:440px}.snippet-showcases .showcase-copy h2{margin:15px 0 22px;font-size:clamp(32px,3.5vw,48px);font-weight:550;line-height:1.14;letter-spacing:-.025em}.snippet-showcases .showcase-copy p{margin:0;color:#969da8;font-size:17px;line-height:1.7}.snippet-showcases .showcase-copy .snippet-hint{margin-top:24px;color:#c0c6ce;font-size:13px}.snippet-example{min-width:0;margin:0}.snippet-frame{position:relative;height:525px;border:1px solid #25292d;border-radius:17px;overflow:hidden;background:#080909}.snippet-frame iframe{display:block;width:100%;height:100%;border:0;background:#080909}.snippet-frame:before{content:"Loading preview…";position:absolute;inset:0;display:grid;place-items:center;color:#87909a;font-size:13px;pointer-events:none}.snippet-frame[data-ready=true]:before{display:none}.snippet-frame[data-failed=true]:before{content:"Preview unavailable. Try Reset."}.snippet-example figcaption{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:40px;padding:10px 3px 0;color:#6f7781;font-size:11px}.snippet-example figcaption span{line-height:1.5}.snippet-reset{display:inline-flex;gap:6px;align-items:center;padding:5px 0 5px 10px;border:0;background:transparent;color:#a5aeb9;cursor:pointer;font:inherit;font-size:11px}.snippet-reset svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8}.snippet-reset:hover{color:#fff}.snippet-reset:focus-visible{outline:2px solid #5296f3;outline-offset:4px;border-radius:2px}.snippet-example[data-demo=locker] .snippet-frame{height:560px}.snippet-example[data-demo=sync] .snippet-frame{height:555px}@media(max-width:900px){.snippet-showcases{width:min(680px,calc(100% - 40px));margin:55px auto 70px}.snippet-showcases .showcase,.snippet-showcases .showcase:nth-child(2n){grid-template-columns:minmax(0,1fr);gap:30px;padding:55px 0}.snippet-showcases .showcase:nth-child(2n) .showcase-copy{order:0}.snippet-showcases .showcase-copy{max-width:550px}.snippet-showcases .showcase-copy h2{max-width:440px}}@media(max-width:480px){.snippet-showcases{width:calc(100% - 28px)}.snippet-showcases .showcase-copy h2{font-size:34px}.snippet-showcases .showcase-copy p{font-size:15px}.snippet-frame{height:520px;border-radius:12px}}
