/* Generated transparent hardware; all display content remains live DOM. */
.device{background:transparent;padding:3.1%;border-radius:15% / 7.1%;box-shadow:none}
.device:before,.side-key,.device-island{display:none}
.device:after{content:'';position:absolute;inset:0;z-index:20;background:url('assets/hero-titanium-frame.png') center/100% 100% no-repeat;pointer-events:none}
.screen{border:0;border-radius:12.5% / 5.9%;background:#08090b}
.device-shadow{filter:blur(25px);opacity:.72}
.studio-sample{padding:0;aspect-ratio:.475;border:0;border-radius:15% / 7.1%;background:transparent;overflow:visible;box-shadow:none}
.studio-sample:after{content:'';position:absolute;inset:0;z-index:2;background:url('assets/hero-titanium-frame.png') center/100% 100% no-repeat;pointer-events:none}
.studio-sample>img{position:absolute;left:5.5%;top:2.7%;width:89%;height:94.6%;border-radius:12% / 5.7%;object-fit:cover}
.studio-sample figcaption{position:absolute;z-index:1;bottom:2.7%;left:5.5%;width:89%;padding:25px 12px 16px;background:linear-gradient(transparent,#08090be8 35%);border-radius:0 0 12% 12% / 0 0 22% 22%}
.hero-copy a{pointer-events:auto}
/* Fade the entire departing hero stage, including its rectangular room light. */
.feed-stage{opacity:var(--device-opacity,1)}