.showcase{isolation:isolate;background:radial-gradient(ellipse 55% 65% at 50% 56%,#1b4952 0%,#10292f 45%,var(--ink) 78%);color:var(--on-dark);padding-block:40px 104px;position:relative;overflow:hidden}.showcase-lines{z-index:-1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.showcase-lines path{fill:none;stroke:#e9d6c30f}.showcase-lines .showcase-cut{stroke:#c97a564d}.showcase-grid{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:56px;display:grid}.showcase-copy .showcase-title{margin-top:56px}.showcase-title{letter-spacing:-.045em;text-transform:uppercase;margin-top:22px;font-size:clamp(40px,4.4vw,70px);line-height:1}.showcase-title span{display:block}.showcase-title span+span{color:var(--sand);font-weight:600}.showcase .lead{max-width:24em;margin-top:24px}.phone-scene{perspective:1500px;justify-items:center;padding-block:28px 46px;display:grid;position:relative}.phone{--w:clamp(250px,22vw,318px);width:var(--w);aspect-ratio:71.6/149.6;padding:calc(var(--w) * .036);border-radius:calc(var(--w) * .19);box-shadow:inset 0 0 0 1.5px #fff3,inset 0 0 0 calc(var(--w) * .014) #15181a,0 60px 90px -36px #000c,0 22px 36px -22px #000000b3;transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));background:linear-gradient(145deg,#6b7176 0%,#2e3337 16%,#1b1e21 48%,#30353a 84%,#767c81 100%);position:relative}.phone:before{content:"";inset:calc(var(--w) * .016);border-radius:calc(var(--w) * .176);background:#030405;position:absolute}.phone-key{background:linear-gradient(90deg,#2b2f33,#6d7378 60%,#3a3f43);border-radius:2px;width:3px;position:absolute}.phone-key-action{height:5%;top:17%;left:-2px}.phone-key-up{height:9%;top:26%;left:-2px}.phone-key-down{height:9%;top:37%;left:-2px}.phone-key-power{height:14%;top:28%;right:-2px}.phone-screen{z-index:1;isolation:isolate;border-radius:calc(var(--w) * .155);background:#000;height:100%;position:relative;overflow:hidden}.phone-island{z-index:3;top:calc(var(--w) * .066);width:calc(var(--w) * .3);height:calc(var(--w) * .088);pointer-events:none;background:#000;border-radius:999px;position:absolute;left:50%;transform:translate(-50%)}.phone-glare{z-index:4;inset:calc(var(--w) * .036);border-radius:calc(var(--w) * .155);pointer-events:none;background:linear-gradient(118deg,#ffffff29 0%,#ffffff0d 24%,#0000 40% 72%,#ffffff0f 100%);position:absolute}.phone-shadow{pointer-events:none;background:radial-gradient(closest-side,#000000b3,#0000);border-radius:50%;width:62%;height:30px;position:absolute;bottom:4px}.phone-column{justify-items:center;display:grid}.phone-credit{text-align:center;max-width:22em;color:var(--on-dark-muted);margin-top:-14px;font-size:15px;line-height:1.5}.phone-home{z-index:0;transform-origin:50%;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.phone-wallpaper{background:repeating-linear-gradient(45deg,#e9d6c309 0 1px,#0000 1px 26px),radial-gradient(110% 60% at 15% 8%,#2d6e78 0%,#0000 58%),radial-gradient(90% 55% at 95% 98%,#c97a5699,#0000 62%),linear-gradient(165deg,#163e46 0%,#0b1519 72%);position:absolute;inset:0}.phone-status{top:calc(var(--w) * .078);left:calc(var(--w) * .12);font-size:calc(var(--w) * .046);letter-spacing:-.01em;color:#fff;font-weight:700;position:absolute}.phone-apps{gap:calc(var(--w) * .07);margin:0;padding:0;list-style:none;display:flex;position:relative}.phone-app{align-items:center;gap:calc(var(--w) * .028);color:#fff;border-radius:18px;flex-direction:column;display:flex}.phone-app:focus-visible{outline:3px solid var(--sand);outline-offset:6px}.phone-icon{width:calc(var(--w) * .21);aspect-ratio:1;transition:transform .3s var(--ease),box-shadow .3s;border-radius:22.5%;display:block;overflow:hidden;box-shadow:0 12px 22px -10px #0009,0 0 0 .5px #ffffff1f}.phone-icon img{object-fit:cover;width:100%;height:100%}.phone-label{font-size:calc(var(--w) * .04);text-shadow:0 1px 5px #00000073;font-weight:600}.phone[data-active=pictoss] [data-launch=pictoss] .phone-icon,.phone[data-active=velyr] [data-launch=velyr] .phone-icon,.phone[data-active=blipcam] [data-launch=blipcam] .phone-icon{transform:translateY(-3px)scale(1.06);box-shadow:0 18px 26px -10px #000000b3,0 0 0 1.5px #e9d6c38c}.phone-hint{left:10%;right:10%;bottom:calc(var(--w) * .2);font-size:calc(var(--w) * .04);text-align:center;color:#ffffffc7;line-height:1.45;position:absolute}.phone-indicator{left:50%;bottom:calc(var(--w) * .03);background:#ffffffd9;border-radius:9px;width:36%;height:5px;position:absolute;transform:translate(-50%)}.launch{z-index:2;background:var(--launch-color,#0b1519);clip-path:inset(50%);position:absolute;inset:0;overflow:hidden}.launch-icon{border-radius:22.5%;width:96px;height:96px;margin:-48px 0 0 -48px;position:absolute;top:50%;left:50%}.launch-shot{object-fit:cover;opacity:0;width:100%;height:100%;position:absolute;inset:0}.launch-veil{z-index:80;background:var(--launch-color,#0b1519);opacity:0;visibility:hidden;pointer-events:none;position:fixed;inset:0}.launch-veil.is-active{visibility:visible}.phone.is-launching .phone-hint{opacity:0;transition:opacity .2s}@media (prefers-reduced-motion:no-preference){.phone{animation:phone-in 1.1s .1s var(--ease) backwards}.phone-shadow{animation:shadow-in 1.1s .1s var(--ease) backwards}.phone-app{animation:.6s cubic-bezier(.2,1.25,.4,1) .7s backwards icon-in}.phone-apps li:nth-child(2) .phone-app{animation-delay:.78s}.phone-apps li:nth-child(3) .phone-app{animation-delay:.86s}.phone-hint{animation:.6s 1.1s both fade}}@keyframes phone-in{0%{opacity:0;transform:translateY(70px)rotateX(16deg)scale(.94)}}@keyframes shadow-in{0%{opacity:0;transform:scaleX(.6)}}@keyframes icon-in{0%{opacity:0;transform:scale(.6)}}@media (width<=1180px){.showcase-grid{grid-template-columns:1fr;gap:40px}.showcase-copy .showcase-title{margin-top:40px}}@media (width<=760px){.showcase{padding-block:28px 72px}.showcase-grid{grid-template-columns:1fr;gap:24px}.phone{--w:min(76vw,290px)}.phone-scene{padding-block:12px 40px}}