.demo-page{background:#fff;min-height:100vh}.demo-page .demo-bar{justify-content:space-between;align-items:center;max-width:1300px;margin:0 auto;padding:20px 40px;display:flex}.demo-page .demo-logo{font-family:var(--display);align-items:center;gap:9px;font-weight:800;display:flex}.demo-page .demo-back{color:var(--muted);font-size:13px;font-weight:600}.demo-page .demo-back:hover{color:var(--purple)}.demo-page .demo-hero{padding:40px 0 64px}.demo-page .demo-hero h1{letter-spacing:-2.8px;font-size:64px}.demo-page .demo-hero .hero-description{max-width:480px}.demo-page .demo-hero .hero-description b{color:var(--ink);font-weight:600}.demo-page .demo-shot{position:relative}.demo-page .demo-shot .app-frame{transform:rotate(.6deg)}.demo-page .demo-shot-note{text-align:center;letter-spacing:.4px;color:var(--muted);text-transform:uppercase;margin-top:14px;font:500 11px/1.4 IBM Plex Mono,monospace}.demo-page .demo-try{padding:36px 0 24px}.demo-page .demo-try-grid{grid-template-columns:repeat(3,1fr);gap:22px;display:grid}.demo-page .demo-try-card{border:1px solid var(--line);background:#fff;border-radius:18px;flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex;overflow:hidden}.demo-page .demo-try-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px #4a2c7c18}.demo-page .demo-try-shot{background:var(--paper);border-bottom:1px solid var(--line);height:164px;overflow:hidden}.demo-page .demo-try-shot img{object-fit:cover;object-position:left top;width:100%;height:100%}.demo-page .demo-try-body{padding:22px 22px 26px}.demo-page .demo-try-icon{background:var(--lilac);width:40px;height:40px;color:var(--purple);border-radius:11px;place-items:center;margin-bottom:14px;display:grid}.demo-page .demo-try-body h3{letter-spacing:-.4px;margin-bottom:9px;font-size:20px}.demo-page .demo-try-body p{color:var(--muted);font-size:14.5px;line-height:1.6}.demo-page .demo-final{max-width:1300px;margin:36px auto 72px;padding:0 40px}.demo-page .demo-final-inner{background:var(--night);color:#fff;border-radius:24px;padding:52px 54px}.demo-page .demo-final h2{letter-spacing:-1.4px;font-size:38px}.demo-page .demo-final p{color:#c7bbdd;max-width:520px;margin-top:14px;font-size:16px;line-height:1.6}.demo-page .demo-final-actions{flex-wrap:wrap;gap:12px;margin-top:28px;display:flex}.demo-page .demo-final-actions .btn-outline{color:#fff;background:0 0;border-color:#ffffff47}.demo-page .demo-final-actions .btn-outline:hover{background:#ffffff14}.demo-page .demo-honesty{color:#aa9dc4;max-width:560px;margin-top:20px;font-size:12px}@media (max-width:920px){.demo-page .demo-hero .hero-grid{grid-template-columns:1fr;gap:36px}.demo-page .demo-hero h1{letter-spacing:-2px;font-size:52px}.demo-page .demo-try-grid{grid-template-columns:1fr}.demo-page .demo-try-card{flex-direction:row}.demo-page .demo-try-shot{border-bottom:none;border-right:1px solid var(--line);width:40%;height:auto}}@media (max-width:650px){.demo-page .demo-bar{padding:16px 20px}.demo-page .demo-hero{padding:24px 0 44px}.demo-page .demo-hero h1{letter-spacing:-1.4px;font-size:40px}.demo-page .demo-hero .hero-actions{flex-wrap:wrap}.demo-page .demo-try-card{flex-direction:column}.demo-page .demo-try-shot{border-right:none;border-bottom:1px solid var(--line);width:100%;height:150px}.demo-page .demo-final{padding:0 16px}.demo-page .demo-final-inner{border-radius:20px;padding:36px 26px}.demo-page .demo-final h2{font-size:30px}}