/* Depth belongs to the interface preview; copy remains still and readable. */
.work-depth{perspective:1300px;--depth-x:0deg;--depth-y:0deg;--shadow-x:0px}
.work-depth>img,.work-depth>.motion-project-image{transform:rotateX(var(--depth-y)) rotateY(var(--depth-x))!important;transform-origin:center;box-shadow:var(--shadow-x) 18px 38px -22px #18254d66;transition:none!important;backface-visibility:hidden}
.motion-project[data-selected-work] .motion-project-visual{background:radial-gradient(ellipse at 20% 20%,#ffffff 0,transparent 65%),linear-gradient(140deg,#dfe6d7,#dddff0);padding:18px}
.motion-project[data-selected-work] .motion-project-image{inset:22px;border-radius:12px;border:1px solid #ffffffc9;background:#f9f9f4;overflow:hidden}
.motion-project[data-selected-work] .work-depth>.motion-project-image{top:50%;bottom:auto;aspect-ratio:var(--preview-aspect,1.5);height:auto;max-height:calc(100% - 44px);transform:translateY(-50%) rotateX(var(--depth-y)) rotateY(var(--depth-x))!important}
.motion-project[data-selected-work] .motion-project-image img{background:transparent}
.work-tile-image.work-depth{overflow:visible;border:0;background:transparent}
.work-tile-image.work-depth img{border-radius:16px;box-shadow:var(--shadow-x) 18px 38px -22px #18254d66}
.work-tile-image>span{z-index:2}
.work-demo-button{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;border:1px solid #1c2948;background:#1c2948;color:#fff;font:500 14px/1.35 var(--font-body,sans-serif);padding:13px 18px;border-radius:30px;cursor:pointer;min-height:44px;text-align:start;white-space:normal;transition:background .2s,box-shadow .2s}
.work-demo-button:hover{background:#30426a;box-shadow:0 5px 18px #1c294825}.work-play{font-size:20px;line-height:1}.work-demo-button:focus-visible,.work-demo-dialog button:focus-visible{outline:3px solid #739123;outline-offset:4px}
.work-tile-footer{flex-wrap:wrap;justify-content:flex-start;gap:1rem 1.5rem}.work-tile-footer>span{flex-basis:100%}.work-demo-invite{display:flex;align-items:center;justify-content:space-between;gap:2rem;margin:-1rem 0 4rem;padding:2rem;border:1px solid #1c294821;border-radius:20px;background:linear-gradient(120deg,#f1f4df,#edf1fa)}.work-demo-invite h2{font:400 clamp(1.8rem,3vw,2.5rem)/1.1 var(--font-display);margin:.5rem 0}.work-demo-invite p{font-size:16px;line-height:1.6;max-width:45ch}.work-demo-invite .work-demo-button{flex-shrink:0}
.work-demo-dialog{padding:0;border:1px solid #fff8;border-radius:18px;background:#f8f8f4;color:#1c2948;width:min(1500px,96vw);height:94dvh;max-height:96dvh;max-width:96vw;box-shadow:0 36px 140px #0006;overflow:hidden}
.work-demo-dialog[open]{display:flex;flex-direction:column}.work-demo-dialog::backdrop{background:#131d37b8;backdrop-filter:blur(9px)}.work-demo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:16px 22px;border-bottom:1px solid #1c294820}.work-demo-toolbar h2{font:400 20px/1.2 var(--font-display);margin:4px 0 0}.work-demo-toolbar>div>span{font:500 12px/1.4 var(--font-body);text-transform:uppercase;letter-spacing:.08em}.work-demo-toolbar button,.work-demo-controls button{border:1px solid #1c294831;background:transparent;color:inherit;padding:8px 13px;border-radius:25px;font:500 14px/1.3 var(--font-body);min-height:40px;cursor:pointer}.work-demo-close{white-space:nowrap}.work-demo-close span{font-size:21px;margin-inline-start:5px}
.work-demo-controls{display:flex;align-items:center;gap:12px;padding:9px 22px;flex-wrap:wrap}.work-demo-controls [role=group]{display:flex;gap:4px;margin-inline-end:auto}.work-demo-controls button[aria-pressed=true]{background:#d7ff59;border-color:#b6d74b}.work-demo-controls a{font:500 14px/1.4 var(--font-body);text-decoration:underline;text-underline-offset:4px}.work-demo-notice{margin:0;padding:4px 22px 12px;color:#586073;font:400 13px/1.5 var(--font-body)}.work-demo-viewport{position:relative;background:radial-gradient(ellipse at center,#e5e9f0,#c7cdd4);min-height:0;flex:1;display:flex;justify-content:center;padding:14px;overflow:hidden}.work-demo-viewport iframe{display:block;position:relative;width:100%;height:100%;border:0;border-radius:8px;background:#fff;box-shadow:0 8px 30px #14274420;transition:width .3s ease}.work-demo-viewport[data-size=mobile] iframe{width:min(390px,100%)}.work-demo-loading{position:absolute;inset:0;display:grid;place-items:center;z-index:2;pointer-events:none;color:#293955;background:#f2f3eee8}.work-demo-loading[hidden]{display:none}
@media(max-width:700px){.work-demo-invite{flex-direction:column;align-items:flex-start;padding:1.4rem;gap:.5rem}.work-demo-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;border:0;margin:0}.work-demo-toolbar{padding:12px 14px}.work-demo-toolbar h2{font-size:18px}.work-demo-controls{padding:8px 14px;gap:8px}.work-demo-controls [role=group]{display:none}.work-demo-notice{padding:2px 14px 9px;font-size:12px}.work-demo-viewport{padding:0}.work-demo-viewport iframe{border-radius:0}.work-demo-invite{margin-bottom:2rem}.motion-project[data-selected-work] .motion-project-image{inset:12px}}
@media(prefers-reduced-motion:reduce){.work-depth>img,.work-depth>.motion-project-image{transform:none!important}.work-demo-viewport iframe,.work-demo-button{transition:none}}
.portfolio-motion-paused .work-depth>img,.portfolio-motion-paused .work-depth>.motion-project-image{transform:none!important}
.portfolio-motion-paused .motion-project[data-selected-work] .work-depth>.motion-project-image{transform:translateY(-50%)!important}
@media(prefers-reduced-motion:reduce){.motion-project[data-selected-work] .work-depth>.motion-project-image{transform:translateY(-50%)!important}}
.work-demo-route{display:flex;align-items:center;gap:8px;max-width:100%;font:500 13px/1.4 var(--font-body)}.work-demo-route>span{color:#5a6574}.work-demo-route select{max-width:250px;min-height:40px;border:1px solid #1c294833;border-radius:12px;background:#fffdf7;color:#1c2948;font:500 14px/1.3 var(--font-body);padding:8px 30px 8px 12px;cursor:pointer}.work-demo-route select:focus-visible{outline:3px solid #739123;outline-offset:3px}.work-demo-controls{flex-shrink:0}.work-demo-toolbar,.work-demo-notice{flex-shrink:0}
@media(max-width:700px){.work-demo-controls{gap:6px 14px}.work-demo-route{flex-basis:100%;justify-content:space-between}.work-demo-route select{flex:1;max-width:none;min-width:0}.work-demo-controls a,.work-demo-controls>button{font-size:12px}.work-demo-toolbar>div{min-width:0}.work-demo-toolbar h2{font-size:17px}.work-demo-notice{font-size:11px}}
