.motion-guide{background:#fbfaf6}.motion-hero{grid-template-columns:1.2fr 1fr;align-items:center;gap:48px;padding:48px 0 32px;display:grid}.motion-hero h1{letter-spacing:-2px;margin:20px 0;font-size:clamp(36px,5vw,60px);line-height:1.2}.motion-hero figure{justify-self:end;max-width:430px}.motion-hero img{border-radius:20px;width:100%;display:block}.motion-hero figcaption,.motion-result figcaption{color:#687166;margin-top:10px;font-size:12px}.motion-lead{font-size:20px}.motion-result{justify-self:center;width:100%;max-width:350px}.motion-result img,.motion-result video{object-fit:contain;background:#e8e7e0;border-radius:12px;width:100%;max-height:530px;display:block}.motion-guide .hf2-prompt pre{font-size:14px}.motion-setup{margin:25px 0}.motion-setup summary{cursor:pointer;padding:16px 0;font-weight:600}.motion-setup video{background:#111;border-radius:12px;width:100%;max-height:500px}.motion-guide h2{line-height:1.4}.motion-guide .hf2-actions>a:not(.hf2-button){text-underline-offset:5px;font-size:14px}.motion-guide .hf2-example-heading code{white-space:normal;overflow-wrap:anywhere}@media (max-width:700px){.motion-hero{grid-template-columns:1fr;gap:24px;padding:20px 0}.motion-hero figure{justify-self:center;max-width:300px}.motion-hero h1{font-size:38px}.motion-lead{font-size:18px}.motion-guide .hf2-example-copy>p,.motion-guide .hf2-steps p,.motion-guide .hf2-faq p{font-size:14px}.motion-guide .hf2-example-heading{flex-wrap:wrap}.motion-guide .hf2-example-heading code{font-size:12px}.motion-guide .hf2-prompt pre{font-size:13px}.motion-guide .hf2-section{scroll-margin-top:20px}.motion-guide .hf2-quick{gap:10px}.motion-result{max-width:290px}}
