/* Homepage preview shares the feature demos' minimal white phone frames. */
.project-image.planning-home-preview{position:relative;background:#343b29;isolation:isolate}
/* The cooking photo scales independently of the phone demos. */
.planning-home-preview::before{content:"";position:absolute;inset:0;background:url("assets/planning/home-cooking-background.jpg.webp") center / cover no-repeat;transform:scale(1);transform-origin:center;transition:transform .35s ease;pointer-events:none}
.project:hover .planning-home-preview::before{transform:scale(1.025)}
@media(prefers-reduced-motion:reduce){.project:hover .planning-home-preview::before{transform:none}.planning-home-preview::before{transition:none}}
.planning-home-phone{position:absolute;left:18%;top:4%;width:28%;aspect-ratio:423/856;transform:translateY(0);animation:planningHomeFloat 7s ease-in-out infinite;animation-play-state:paused}
.planning-home-phone:last-child{left:54%;top:12%;transform:translateY(0);animation-duration:8s}
.planning-home-phone iframe{display:block;position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;color-scheme:light;pointer-events:none}
.planning-home-preview.is-playing .planning-home-phone{animation-play-state:running}
@keyframes planningHomeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(prefers-reduced-motion:reduce){.planning-home-phone{animation:none}}

/* Figma 2876:44103; original animated thumbnail saved in work/backups. */
.project-image.planning-figma-preview{position:relative;aspect-ratio:680/469;background:#000;isolation:isolate}
.project .planning-figma-preview .planning-figma-cooking{position:absolute;width:111.470588%;height:102.558635%;right:-10.294118%;top:0;object-fit:cover;transform:none;transition:none}
.project .planning-figma-preview .planning-figma-glow{position:absolute;width:114.705882%;height:165.884861%;left:-50.588235%;top:-80.597015%;transform:none;transition:none}
.planning-figma-pasta{position:absolute;width:92.205882%;height:100%;left:-31.470588%;top:0;mask-image:url('assets/planning/thumbnail-figma/mask.svg');mask-repeat:no-repeat;mask-size:41.307815% 100%;mask-position:58.152174% 0}
.project .planning-figma-pasta img{width:100%;height:100%;object-fit:fill;transform:none;transition:none}
.planning-figma-pasta::after{content:"";position:absolute;inset:0;background:#0003}

/* Keep the top of the photo, cropping the packaging along the bottom. */
.project-image.planning-photo-preview{position:relative;aspect-ratio:680/469;overflow:hidden}
.project .planning-photo-preview img{position:absolute;top:0;left:50%;width:112%;height:auto;max-width:none;transform:translateX(-50%) scale(1);transition:transform .35s ease}
.project:hover .planning-photo-preview img{transform:translateX(-50%) scale(1.025)}
@media(prefers-reduced-motion:reduce){.project .planning-photo-preview img{transition:none}.project:hover .planning-photo-preview img{transform:translateX(-50%)}}

/* Slightly richer color and deeper blacks for the cooking thumbnail. */
.project .planning-photo-preview img{filter:saturate(1.14) contrast(1.09) brightness(.98)}

/* Local highlight reduction over the bright upper-left cabinet. */
.planning-photo-preview::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 40% 76% at 8% 10%,rgba(28,35,40,.19) 0%,rgba(28,35,40,.14) 48%,rgba(28,35,40,0) 100%)}