.demo-page{background:#071827;color:#fff}
.demo-hero{padding:58px 0 50px;background:radial-gradient(circle at 80% 0,#123a43 0,#081d2b 48%,#06151f 100%);border-bottom:1px solid #284651}
.demo-hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:72px;align-items:end}
.demo-hero .eyebrow{color:var(--mint)}
.demo-hero h1{font-size:clamp(42px,5vw,72px);line-height:1.02;max-width:780px;margin-top:18px}
.demo-hero p{font-size:18px;line-height:1.65;color:#bfd2da;max-width:560px}
.demo-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:24px;color:var(--mint);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.demo-meta span+span::before{content:"·";margin-right:22px;color:#688b91}
.demo-page .vision-demo{padding-top:54px}
.demo-page .vision-demo-frame iframe{height:min(780px,calc(100svh - 110px))}
@media(max-width:800px){.demo-hero{padding:38px 0 34px}.demo-hero-grid{grid-template-columns:1fr;gap:24px}.demo-hero h1{font-size:42px}.demo-hero p{font-size:16px}.demo-page .vision-demo{padding-top:34px}}
@media(max-width:600px){.demo-hero h1{font-size:36px}.demo-meta{gap:6px 12px;font-size:11px}.demo-meta span+span::before{margin-right:12px}.demo-page .vision-demo{padding-block:28px}.demo-page .vision-demo-heading h2{font-size:28px}}
