/* Two useful views per project, with the full screenshot available to inspect. */
body[data-page=conversion][data-design=network] .project-gallery{padding:28px 22px 18px;aspect-ratio:1.36;gap:22px;justify-content:space-between}
.project-gallery .project-browser,.project-emoney .project-gallery .project-browser{transform:none;width:100%;margin-block:auto;border:1px solid #ffffffa6;box-shadow:0 12px 28px -18px #20392966;border-radius:7px}
.project-gallery:is(:hover,:has(:focus-visible)) .project-browser{transform:none}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 .project-gallery .project-browser{transform:perspective(1200px) rotateY(-5deg) rotateX(3deg) rotateZ(-2deg);transition:transform .7s cubic-bezier(.2,.75,.3,1),box-shadow .7s ease}
 .project-emoney .project-gallery .project-browser{transform:perspective(1200px) rotateY(5deg) rotateX(3deg) rotateZ(2deg)}
 .studio-project .project-gallery:is(:hover,:has(:focus-visible)) .project-browser{transform:perspective(1200px) rotateY(0) rotateX(0) rotateZ(0) translateY(-4px);box-shadow:0 18px 34px -18px #20392966}
}
.project-gallery-images{background:#fff}
.project-gallery-panel[hidden],.project-gallery-controls[hidden],.project-gallery-expand[hidden]{display:none}
.project-gallery-shot{display:block;cursor:zoom-in}
.project-gallery-shot img{display:block;width:100%;height:auto;aspect-ratio:2.1;object-fit:contain;object-position:center;background:#fff}
.project-gallery-panel:not([hidden]){animation:project-image-in .55s cubic-bezier(.2,.75,.3,1)}
.project-gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
.project-gallery-caption{font:400 12px/1.4 Albert,sans-serif;color:#565365;padding-inline:2px}
.project-emoney .project-gallery-caption{color:#3c6054}
.project-gallery-expand{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;padding:0;border:1px solid #ffffff90;border-radius:50%;background:#ffffff40;color:#3f5344;cursor:zoom-in}
.project-gallery-expand svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5}
.project-gallery-expand:hover{background:#fbfcf9}
.project-gallery :is(a,button):focus-visible,.project-preview :is(a,button):focus-visible{outline:2px solid #52673e;outline-offset:3px}
body.project-preview-open{overflow:hidden}
dialog.project-preview{width:min(94vw,1600px);max-width:none;max-height:94dvh;padding:0;border:1px solid #d2dace;border-radius:14px;margin:auto;background:#f7f8f3;color:#25322b;overflow:auto;overscroll-behavior:contain;box-shadow:0 24px 100px #071b1740}
.project-preview::backdrop{background:#10241ddd;backdrop-filter:blur(8px)}
.project-preview-head{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 22px;border-bottom:1px solid #dce1d7}
.project-preview-head h2{font:500 17px/1.4 Albert,sans-serif;margin:0;letter-spacing:-.02em}
.project-preview-close{border:1px solid #d4ddce;background:transparent;border-radius:50%;width:36px;height:36px;flex:0 0 36px;font:24px/1 Albert,sans-serif;color:inherit;cursor:pointer}
.project-preview-media{padding:14px;background:#e9ede6}
.project-preview-media img{display:block;width:100%;height:auto;max-height:calc(94dvh - 156px);object-fit:contain;background:#fff}
.project-preview-foot{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 22px}
.project-preview-foot>a{font-size:13px;display:inline-flex;gap:18px;align-items:center}
.project-preview-navigation{display:flex;align-items:center;gap:16px}
.project-preview-navigation button{width:36px;height:36px;display:grid;place-items:center;padding:0;border:1px solid #cdd8c6;border-radius:50%;background:transparent;color:inherit;font-size:19px;cursor:pointer}
.project-preview button:hover{background:#e6ecd9}
.project-preview-count{font-size:12px;font-variant-numeric:tabular-nums;min-width:28px;text-align:center}
@keyframes project-image-in{from{opacity:.35;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}
@media(min-width:2000px){
 body[data-page=conversion][data-design=network] .project-gallery{padding:calc(28 * var(--wide-unit)) calc(22 * var(--wide-unit)) calc(18 * var(--wide-unit));gap:calc(22 * var(--wide-unit))}
 .project-gallery-caption{font-size:calc(12 * var(--wide-unit))}
 .project-gallery-expand{width:calc(38 * var(--wide-unit));height:calc(38 * var(--wide-unit));flex-basis:calc(38 * var(--wide-unit))}
 .project-gallery-expand svg{width:45%;height:45%}
}
@media(max-width:1000px){body[data-page=conversion][data-design=network] .project-gallery{padding:22px 14px 14px;gap:18px}.project-gallery-expand{flex-basis:34px;width:34px;height:34px}}
@media(max-width:760px){
 body[data-page=conversion][data-design=network] .project-gallery{aspect-ratio:1.3;padding:24px 14px 14px}
 .project-preview-head{padding:12px 14px;gap:12px}.project-preview-head h2{font-size:14px}
 .project-preview-media{padding:7px}.project-preview-foot{padding:12px 14px;gap:12px}
 .project-preview-foot>a{font-size:12px;gap:8px}.project-preview-navigation{gap:10px}
}
@media(prefers-reduced-motion:reduce){.project-gallery-panel:not([hidden]){animation:none}.project-preview::backdrop{backdrop-filter:none}}
