/* Keep the green artwork at rest; the shared effect-bubba rules own the hover. */
.grid figure.lounge-project{aspect-ratio:16/9;background:#9e5406;isolation:isolate}
.grid .lounge-project .project-artwork{position:absolute;inset:0;background:linear-gradient(120deg,#f2f5e9,#dce8d2);text-align:left;opacity:1;transition:opacity .35s;overflow:hidden}
.grid .lounge-project .project-artwork:before,.grid .lounge-project .project-artwork:after{content:'';position:absolute;width:95%;aspect-ratio:1;border:1px solid #bed0b1;border-radius:50%;right:-30%;top:-30%}
.grid .lounge-project .project-artwork:after{top:0;right:-40%}
.grid .lounge-project .project-phones{position:absolute;inset:0;pointer-events:none}
.grid .lounge-project .project-phones img{position:absolute;min-height:0;max-width:none;height:auto;opacity:1;border:3px solid #142d24;border-radius:12px;box-shadow:5px 12px 20px #16372733}
.grid .lounge-project img.project-phone-light{width:28%;right:22%;top:18%;transform:rotate(-10deg)}
.grid .lounge-project img.project-phone-dark{width:31%;right:1%;top:8%;transform:rotate(9deg)}
.grid .lounge-project .project-intro{position:absolute;inset:0 auto 0 0;width:51%;padding:7% 0 6% 7%;color:#122d28;font-family:Arial,sans-serif;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;transition:opacity .35s}
.grid .lounge-project .project-kicker{font-size:clamp(7px,.55vw,9px);font-weight:700;letter-spacing:1.2px;line-height:1.4;margin-bottom:10px;white-space:nowrap}
.grid .lounge-project .project-title{font-size:clamp(23px,2.1vw,32px);letter-spacing:-1px;line-height:1.02;margin:0 0 10px;font-weight:400}
.grid .lounge-project .project-title span{font-family:Georgia,serif;font-style:italic;font-weight:400}
.grid .lounge-project .project-summary{font-size:clamp(9px,.72vw,12px);line-height:1.5;margin:0 0 10px}
.grid .lounge-project .project-open{font-size:clamp(7px,.6vw,10px);padding-bottom:3px;border-bottom:1px solid #799268;line-height:1.4}
.grid .lounge-project .project-open>span{margin-left:8px}
.grid .lounge-project figcaption{opacity:0;transition:opacity .35s}
.grid a:is(:hover,:focus-visible) .lounge-project .project-artwork{opacity:.4}
.grid a:is(:hover,:focus-visible) .lounge-project .project-intro{opacity:0}
.grid a:is(:hover,:focus-visible) .lounge-project figcaption{opacity:1}
/* Extend the existing mouse treatment to keyboard focus without changing its graphics. */
.grid a:focus-visible .lounge-project figcaption:before,.grid a:focus-visible .lounge-project figcaption:after{opacity:1;transform:scale(1)}
.grid a:focus-visible .lounge-project h2,.grid a:focus-visible .lounge-project p{opacity:1;transform:translate3d(0,0,0)}
@media(max-width:767px){.grid .lounge-project .project-kicker{font-size:9px}.grid .lounge-project .project-title{font-size:32px}.grid .lounge-project .project-summary{font-size:12px}.grid .lounge-project .project-open{font-size:10px}}
@media(prefers-reduced-motion:reduce){.grid .lounge-project *,.grid .lounge-project :before,.grid .lounge-project :after{transition:none}}