/* Public product view; uses the same tokens and components as the studio. */
html body .avatar-hero{gap:48px;grid-template-columns:1.1fr 1fr;overflow:visible;padding-block:48px;align-items:center}
html body .avatar-hero h1{font-size:clamp(44px,5.2vw,76px);line-height:1.08;letter-spacing:-.045em}
html body .avatar-hero .lead{font-size:16px;line-height:1.7;max-width:510px}
html body .avatar-hero .hero-meta{font-size:12px;flex-wrap:wrap;gap:16px;margin-top:24px}
html body .landing-demo{padding:0;overflow:hidden;width:100%;max-width:500px;justify-self:end}
.demo-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;border-bottom:1px solid var(--q-border)}
.demo-badge{font-size:12px;color:var(--q-muted)}
.demo-stage{position:relative;height:380px;background:var(--q-soft)}
#landing-avatar{display:block;width:100%;height:100%}
#landing-demo-status{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:24px;color:var(--q-muted);font-size:14px;margin:0;pointer-events:none}
#landing-demo-status[hidden]{display:none}
.demo-footer{padding:16px 24px 24px}.demo-footer>p{font-size:12px;color:var(--q-muted);margin:0 0 12px}
.demo-words{display:flex;gap:8px;flex-wrap:wrap}.demo-words>span{font-size:14px;border:1px solid var(--q-border);padding:8px 12px;border-radius:var(--q-radius-small);color:var(--q-ink);transition:background 140ms,border-color 140ms}
.demo-words>span[aria-current=true]{background:var(--q-success-soft);border-color:var(--q-success);color:var(--q-success)}
.demo-controls{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.demo-controls>a{font-size:12px;color:var(--q-ink);text-decoration:underline;text-underline-offset:4px}
html body .dictionary-intro{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px;padding-block:64px}.dictionary-intro h2{font-size:32px;margin:16px 0}.dictionary-intro p{color:var(--q-muted);max-width:480px;font-size:16px;line-height:1.7}
.workflow-line{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;font-size:12px;color:var(--q-muted)}
html body .landing-faq{display:grid;grid-template-columns:.65fr 1fr;gap:48px;padding-block:64px}.landing-faq h2{font-size:32px;margin-top:16px}.faq-items details{border-bottom:1px solid var(--q-border);padding:0}.faq-items summary{font-size:16px;line-height:1.5;font-weight:600;cursor:pointer;padding:20px 32px 20px 0;list-style:none;position:relative}.faq-items summary::-webkit-details-marker{display:none}.faq-items summary:after{content:'+';position:absolute;right:4px;color:var(--q-muted);font-size:24px;font-weight:400;top:15px}.faq-items details[open] summary:after{content:'−'}.faq-items details p{margin:0;padding:0 32px 24px 0;color:var(--q-muted);font-size:14px;line-height:1.8}.faq-items summary:focus-visible{outline:2px solid var(--q-focus);outline-offset:3px;border-radius:8px}
@media(max-width:740px){html body .avatar-hero,html body .dictionary-intro,html body .landing-faq{grid-template-columns:1fr;gap:32px;padding-block:32px}html body .landing-demo{justify-self:center;max-width:500px}.demo-stage{height:340px}html body .avatar-hero .hero-copy{text-align:left}html body .avatar-hero .hero-actions,html body .avatar-hero .hero-meta{justify-content:flex-start}.demo-heading,.demo-footer{padding-inline:16px}html body .landing-faq{gap:8px}.workflow-line{gap:8px}}
@media(prefers-reduced-motion:reduce){.demo-words>span{transition:none}}

.use-cases-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.use-case h3{font-size:24px;margin:24px 0 16px}.use-case p{font-size:14px;line-height:1.7;color:var(--q-muted);margin:0}.use-case .card-number{font-size:12px;color:var(--q-muted)}
@media(max-width:740px){.use-cases-grid{grid-template-columns:1fr;gap:16px}.use-case h3{margin-top:16px}}