/* Screenshots from existing Bareum projects; no invented customer work. */
.real-work{background:#e6eae7;border-bottom:1px solid #cdd5d0}
.real-work-link{display:block;position:relative;text-decoration:none;color:#132c36;background:#dde4df;overflow:hidden}
.real-work-bar{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;font-size:11px;font-weight:700;letter-spacing:.13em;border-bottom:1px solid #c5cfca;background:#eef1ed}
.real-work-preview{display:block;height:230px;overflow:hidden;background:#dce3de;padding:14px 14px 0}
.product-example.real-work .real-work-preview img{width:100%;height:auto;max-height:none;aspect-ratio:auto;display:block;object-fit:contain;box-shadow:0 4px 16px #122b351a;border:1px solid #d0d9d3;border-radius:5px 5px 0 0}
.real-work--card .real-work-preview img{width:73%;max-width:280px;margin:auto}
.real-work--start .real-work-preview{display:flex;align-items:center;padding-bottom:14px;background:#d8e1dd}
.real-work--start .real-work-preview img{border-radius:4px}
.real-work--image .real-work-preview img{transform:translateY(-28%)}
.real-work--reply .real-work-preview img{transform:translateY(-43%)}
.real-work-open{position:absolute;right:12px;bottom:12px;padding:7px 11px;background:#102b38;color:#fff;font-size:13px;font-weight:700;border-radius:4px;box-shadow:0 2px 8px #0003}
.product-example.real-work figcaption{padding:15px 18px 17px;font-size:16px;line-height:1.4;background:#f3f5f0;min-height:112px}
.product-example.real-work figcaption span{font-size:13px;line-height:1.5;color:#425b57;margin-top:7px}
.real-work-link:hover .real-work-open{background:#70531b}
.real-work-link:focus-visible{outline:3px solid #9b701f;outline-offset:-3px}
.work-viewer{width:min(1120px,94vw);max-width:94vw;max-height:94dvh;padding:20px;border:1px solid #869b91;border-radius:12px;background:#f5f5ef;color:#102b38;box-shadow:0 20px 100px #0006}
.work-viewer::backdrop{background:#081c2bea;backdrop-filter:blur(3px)}
.work-viewer-top{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:10px}
.work-viewer-top h2{font-size:22px;line-height:1.3;margin:0}
.work-viewer-close{flex-shrink:0;font:inherit;font-weight:700;color:#102b38;border:1px solid #a7b6ae;background:#fff;border-radius:6px;padding:10px 14px;cursor:pointer}
.work-viewer p{font-size:15px;line-height:1.5;margin:0 0 14px;max-width:90ch}
.work-viewer-scroll{max-height:67dvh;overflow:auto;overscroll-behavior:contain;background:#dce3de;border:1px solid #c7d1cb;border-radius:6px}
.work-viewer-scroll img{display:block;width:100%;height:auto;max-width:100%;margin:auto}
.work-viewer[data-kind="card"] .work-viewer-scroll img{max-width:460px}
.work-viewer-original{display:inline-block;margin-top:13px;font-size:14px;font-weight:700;color:#102b38}
html.work-viewer-open{overflow:hidden}
@media(min-width:1001px){.support-packages .real-work-preview{height:260px}}
@media(max-width:700px){.real-work-preview{height:250px}.product-example.real-work figcaption{min-height:0}.work-viewer{padding:14px}.work-viewer-top h2{font-size:19px}.work-viewer-close{padding:10px}.work-viewer-scroll{max-height:66dvh}}
