.demoStage{position:relative;isolation:isolate;width:100%;container-type:inline-size}.demoCameraGlow{position:absolute;z-index:-1;inset:6% 4%;pointer-events:none;background:var(--glow) center / cover no-repeat;filter:blur(90px) saturate(1.25);opacity:.45;transform:scale(1.08)}.demoCameraGlow canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .9s var(--landing-spring)}.demoCameraGlow canvas[data-live]{opacity:1}.demoHero .demoCameraGlow{inset:0;filter:blur(150px) saturate(1.18);transform:scale(1.14);opacity:.72}.demoCamera{--bar: var(--desktop-bar);aspect-ratio:var(--desktop-aspect);max-width:var(--desktop-width);position:relative;width:100%;margin-inline:auto;overflow:clip;border-radius:12px;background:#000;box-shadow:0 0 0 1px #f6f5f21a,0 40px 90px -36px #000000d9}@container (width < 379.68px){.demoCamera{aspect-ratio:390 / 694;max-width:390px;--bar: calc(34 / 694 * 100%)}}@container (width < 537.6px){.demoStage[data-wide] .demoCamera{aspect-ratio:390 / 694;max-width:390px;--bar: calc(34 / 694 * 100%)}}.demoStage[data-compact] .demoCamera{border-radius:10px}.demoWindow{position:absolute;top:0;left:0;transform-origin:0 0;transition:transform .8s cubic-bezier(.22,1,.36,1)}.demoWindowBar{position:relative;display:flex;height:34px;align-items:center;justify-content:center;background:#161616;border-bottom:1px solid rgb(255 255 255 / .06)}.demoWindowAddress{min-width:300px;padding:5px 16px;border-radius:7px;background:#ffffff0f;color:#f6f5f28c;font:500 12px/1 ui-sans-serif,system-ui,-apple-system,sans-serif;text-align:center}.demoWindowStill{position:absolute;inset:0;container-type:inline-size}.demoWindowStill .demoWindowBar{height:var(--bar)}.demoWindowStill .demoWindowAddress{min-width:23.4375cqw;padding:calc(5 / 1280 * 100cqw) 1.25cqw;border-radius:calc(7 / 1280 * 100cqw);font-size:calc(12 / 1280 * 100cqw)}.demoPosterStill{display:block;width:100%;height:calc(100% - var(--bar))}.demoWindowBody{position:relative;overflow:hidden;background:#000}.demoPoster,.demoCameraFrame{position:absolute;top:0;left:0;display:block;border:0}.demoPoster{width:100%;height:100%}.demoCameraFrame{opacity:0;transition:opacity .42s ease}.demoStage[data-ready] .demoCameraFrame{opacity:1}.demoStage[data-ready] .demoPoster{visibility:hidden;transition:visibility 0s .42s}.demoNotice{position:absolute;z-index:2;left:50%;bottom:16px;margin:0;padding:9px 16px;border:1px solid rgb(246 245 242 / .14);border-radius:999px;background:#0f0f0fe0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--landing-text);font-size:14px;white-space:nowrap;transform:translate(-50%);animation:demoNoticeIn .26s var(--landing-spring)}.demoNotice a,.demoNotice button{margin-left:6px;color:var(--landing-text);text-decoration:underline;text-underline-offset:3px}.demoNotice button{padding:0;border:0;background:none;font:inherit;cursor:pointer}@keyframes demoNoticeIn{0%{opacity:0;transform:translate(-50%,6px)}}.demoStage[data-phone] .demoCamera{display:flex;flex-direction:column;justify-content:flex-end}.demoStage[data-phone] .demoNotice{position:sticky;left:auto;bottom:calc(16px + env(safe-area-inset-bottom,0px));align-self:center;max-width:calc(100% - 24px);box-sizing:border-box;margin-bottom:16px;border-radius:16px;white-space:normal;text-align:center;transform:none;animation-name:demoNoticeInPhone}@keyframes demoNoticeInPhone{0%{opacity:0;transform:translateY(6px)}}@media(prefers-reduced-motion:reduce){.demoCameraFrame,.demoWindow,.demoCameraGlow canvas{transition:none}}.media-feature-grid{width:min(1104px,calc(100vw - 64px));margin:0 auto 164px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;row-gap:89px}.media-feature-card{min-width:0}.media-feature-copy{margin-top:25px;padding-top:25px;border-top:1px solid rgba(246,245,242,.14)}.media-feature-copy h2{margin:0;color:var(--landing-text, #f6f5f2);font-size:24px;line-height:26.4px;letter-spacing:0;font-weight:400}.media-feature-copy p{margin:13px 0 0;color:var(--landing-muted, rgba(246, 245, 242, .64));font-size:16px;line-height:24px;letter-spacing:0}@media(max-width:1180px){.media-feature-grid{width:calc(100vw - 48px)}}@media(max-width:760px){.media-feature-grid{width:calc(100vw - 32px);margin-bottom:110px;grid-template-columns:1fr;row-gap:64px}}
