/* Screens from delivered work; the frame keeps different products consistent. */
.work-preview{display:block;position:relative;padding:24px 24px 0;background:linear-gradient(140deg,#e7f0f8,#f6faff 58%,#e2edf8);text-decoration:none;color:inherit}
.work-preview:focus-visible{outline:3px solid #227dcc;outline-offset:-4px}
.work-preview__frame{display:block;overflow:hidden;border-radius:9px 9px 0 0;border:1px solid #ceddea;border-bottom:0;box-shadow:0 12px 32px #25476616;transition:transform .5s cubic-bezier(.22,1,.36,1),box-shadow .5s}
.work-preview__bar{height:31px;padding:0 12px;display:flex;align-items:center;gap:5px;background:#fff;border-bottom:1px solid #e4ebf0}
.work-preview__bar i{display:block;width:5px;height:5px;border-radius:50%;background:#c2d2df}
.work-preview__bar span{font:9px/1 var(--font-en);letter-spacing:.1em;color:#6b8194;margin-left:9px}
.work-preview__screen{display:block;aspect-ratio:1.48;overflow:hidden;background:#fff}
.work-preview__screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
.work-preview--notion .work-preview__screen{background:#191919}
.work-preview--notion .work-preview__screen img{object-fit:contain}
.work-preview__enlarge{position:absolute;right:35px;bottom:13px;display:flex;gap:10px;align-items:center;padding:8px 12px;border:1px solid #d0e0ed;border-radius:5px;background:#fffffff2;color:#284d6b;font-size:11px;box-shadow:0 3px 14px #1a425414;transition:background .25s}
.work-preview__enlarge svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.4}
.work-screenshot-caption{display:flex;align-items:flex-start;gap:8px;min-height:47px;margin:0;padding:14px 25px 12px;background:#f8fbfd;border-bottom:1px solid #e1ebf3;font-size:11px;line-height:1.7;color:#577084}
.work-screenshot-caption::before{content:'';flex:none;width:4px;height:4px;border-radius:50%;background:#659cc7;margin-top:7px}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.work-preview:hover .work-preview__frame{transform:translateY(-4px);box-shadow:0 18px 34px #25476624}.work-preview:hover .work-preview__enlarge{background:#fff}}
@media(max-width:800px){.work-preview{padding:17px 17px 0}.work-preview__bar{height:26px;padding:0 9px}.work-preview__bar span{font-size:8px}.work-preview__enlarge{right:25px;font-size:10px;padding:7px 10px}.work-screenshot-caption{padding:12px 19px;font-size:10px;min-height:43px}}
@media(max-width:600px){.work-preview__screen{aspect-ratio:1.4}.work-preview__enlarge{bottom:12px}.work-preview__screen img{object-fit:cover}.work-preview--notion .work-preview__screen img{object-fit:contain}}