.pp-hero .pd-device{--pd-unit:calc((min(100vw - 2*var(--gutter),1360px) - 5vw)*.525/100)}.pp-demo .pd-device{--pd-unit:calc((min(100vw - 2*var(--gutter),1360px) - 5vw)*.61/100)}@media (width<=900px){.pp-hero .pd-device,.pp-demo .pd-device{--pd-unit:calc((100vw - 2*var(--gutter))/100)}}.pp-hero{padding-bottom:clamp(60px,7vw,100px)}.pp-hero-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:5vw;display:grid}.pp-hero h1{max-width:14ch;margin-bottom:24px;font-size:clamp(2.5rem,4.4vw,5rem)}.pp-name{font:600 clamp(1.1rem,1.6vw,1.5rem)/1 var(--display);letter-spacing:-.04em;color:#fff;margin:26px 0 18px}.pp-name em{color:var(--red);font-style:normal}.pp-hero-stage{position:relative}.pp-device{width:100%}.pp-device .pd-message,.pp-device .pd-inbox-row{opacity:1}.pp-demo{border-top:1px solid var(--line);background:linear-gradient(#08090b,#0b0c0f);position:relative}.pp-demo-sticky{padding:clamp(80px,9vw,120px) 0}.pp-demo-grid{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);align-items:center;gap:5vw;display:grid}.pp-demo-copy h2{margin-top:18px}.pp-steps{border-top:1px solid var(--line-2);margin:36px 0 0;padding:0;list-style:none}.pp-steps li{border-bottom:1px solid var(--line);transition:opacity .45s,transform .45s var(--ease);gap:22px;padding:20px 0;display:flex}.pp-steps li>span{font:500 .6rem var(--mono);letter-spacing:.12em;color:#ff5a5a;padding-top:6px}.pp-steps h3{margin:0 0 6px;font-size:clamp(1.15rem,1.6vw,1.45rem)}.pp-steps p{color:var(--muted);margin:0;font-size:.88rem;line-height:1.6}[data-demo-ready] .pp-steps li{opacity:.32}[data-demo-ready] .pp-steps li.is-active{opacity:1;transform:translate(8px)}@media (width>=901px) and (height>=620px){[data-demo-ready]{height:260svh}[data-demo-ready] .pp-demo-sticky{height:100svh;padding:calc(var(--ap-header-height) + 30px) 0 40px;align-items:center;display:flex;position:sticky;top:0;overflow:hidden}}.pp-next{border-top:1px solid var(--line)}.pp-next a{grid-template-columns:auto 1fr auto;align-items:baseline;gap:10px 34px;padding:46px 0;display:grid}.pp-next .number-label{grid-column:1/-1}.pp-next strong{font:500 clamp(2.4rem,5vw,5rem)/1 var(--display);letter-spacing:-.07em;transition:transform .45s var(--ease)}.pp-next small{color:var(--dim);font-size:.85rem}.pp-next i{color:#ff4040;transition:transform .35s var(--ease);font-size:1.6rem;font-style:normal}.pp-next a:hover strong{transform:translate(12px)}.pp-next a:hover i{transform:translate(4px,-4px)}@media (width<=900px){.pp-hero-grid,.pp-demo-grid{grid-template-columns:1fr}.pp-hero-stage{margin-top:20px}}@media (width<=700px){.pp-next a{grid-template-columns:1fr auto}.pp-next small{grid-column:1}}@media (prefers-reduced-motion:no-preference){.js .pp-hero .pd-device{--pp-entry-yaw:-28deg;--pp-rest-yaw:-8deg;will-change:transform;animation:1.4s cubic-bezier(.22,1,.36,1) .1s both pp-window-in}.js [data-product-page=play] .pp-hero .pd-device{--pp-entry-yaw:28deg;--pp-rest-yaw:8deg}.js .pp-hero .pd-message,.js .pp-hero .pd-inbox-row{animation:.6s cubic-bezier(.22,1,.36,1) .7s both pp-row-in}.js .pp-hero .pd-inbox-row:nth-of-type(2){animation-delay:.82s}.js .pp-hero .pd-inbox-row:nth-of-type(3){animation-delay:.94s}.js .pp-hero .pd-message-one{animation-delay:1.06s}.js .pp-hero .pd-message-two{animation-delay:1.18s}.js .pp-hero .pd-message-three{animation-delay:1.3s}.js .pp-hero .pd-track-progress{animation:2.4s cubic-bezier(.65,0,.35,1) .6s both pp-track-in}.js .pp-hero .pd-screen-reflection{animation:2.2s cubic-bezier(.65,0,.35,1) .5s both pp-reflection-in}}@keyframes pp-window-in{0%{transform:translateZ(-160px) rotateY(var(--pp-entry-yaw)) rotateX(12deg);opacity:0}to{transform:rotateY(var(--pp-rest-yaw)) rotateX(4deg);opacity:1}}@keyframes pp-row-in{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes pp-track-in{0%{transform:scaleX(.05)}to{transform:scaleX(.6)}}@keyframes pp-reflection-in{0%{transform:translate(-50%)}to{transform:translate(60%)}}@media (prefers-reduced-motion:reduce){[data-demo-ready]{height:auto}[data-demo-ready] .pp-demo-sticky{height:auto;padding:clamp(80px,9vw,120px) 0;position:relative;overflow:visible}[data-demo-ready] .pp-steps li{opacity:1}}
