:root{--ink:#172235;--muted:#6f7b8d;--blue:#3159df;--line:#dfe5ee;--navy:#101a2a}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#f4f7fb}.demoGate{min-height:100vh;display:flex;flex-direction:column;overflow:hidden;position:relative}.demoGate:before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:linear-gradient(90deg,#3159df,#6f87ed 55%,#b9c7fb)}.demoNav{height:80px;display:flex;align-items:center;justify-content:space-between;width:min(1180px,calc(100% - 48px));margin:0 auto}.demoBrand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-size:17px}.demoBrand>span{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(145deg,#6681f2,#3159dd);color:#fff;font-size:19px;font-weight:900;box-shadow:0 10px 28px #3159df28}.workspaceLink{color:#5d6980;text-decoration:none;font-size:13px;font-weight:750;padding:9px 12px;border-radius:9px}.workspaceLink:hover{background:#e9eef8;color:#3159df}.demoHero{width:min(1180px,calc(100% - 48px));margin:auto;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.72fr);gap:74px;align-items:center;padding:48px 0 66px}.demoStory{max-width:680px}.demoEyebrow{font-size:11px;font-weight:900;letter-spacing:.15em;color:#3159df;margin-bottom:18px}.demoStory h1{font-size:clamp(42px,5.4vw,72px);line-height:1.02;letter-spacing:-3px;margin:0 0 24px;max-width:760px}.demoStory>p{font-size:18px;line-height:1.65;color:var(--muted);max-width:640px;margin:0}.workflowPreview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:42px}.workflowPreview>div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;min-height:148px;box-shadow:0 12px 34px rgba(25,40,72,.05)}.workflowPreview span{display:block;color:#3159df;font-size:11px;font-weight:900;margin-bottom:19px}.workflowPreview b{display:block;font-size:14px;margin-bottom:7px}.workflowPreview small{display:block;color:#7a8697;font-size:11px;line-height:1.5}.accessCard{background:#fff;border:1px solid #dbe3ef;border-radius:22px;padding:32px;box-shadow:0 30px 80px rgba(24,38,70,.14);position:relative}.accessCard:after{content:"";position:absolute;inset:10px -10px -10px 10px;border:1px solid #dce4f3;border-radius:22px;z-index:-1;background:#eaf0fb}.sampleBadge{display:inline-flex;align-items:center;gap:8px;background:#eff4ff;color:#3159df;border-radius:999px;padding:7px 10px;font-size:9px;font-weight:900;letter-spacing:.08em}.sampleBadge i{width:7px;height:7px;border-radius:50%;background:#3159df;box-shadow:0 0 0 4px #3159df18}.accessCard h2{font-size:28px;letter-spacing:-.7px;margin:20px 0 10px}.accessCard>p{color:#6f7b8d;font-size:13px;line-height:1.65;margin:0}.accessCard ul{list-style:none;padding:0;margin:24px 0;display:grid;gap:12px}.accessCard li{display:flex;align-items:center;gap:10px;color:#4f5d70;font-size:12px;font-weight:650}.accessCard li span{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;background:#eaf7f1;color:#16815b;font-size:11px;font-weight:900}.enterDemo{height:52px;border-radius:11px;background:linear-gradient(180deg,#4167e9,#3158dc);color:#fff;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;font-weight:850;box-shadow:0 13px 28px #3158dc2e}.enterDemo:hover{filter:brightness(1.04)}.exploreDemo{display:block;text-align:center;color:#53647e;font-size:11px;font-weight:750;text-decoration:none;margin-top:15px}.exploreDemo:hover{color:#3159df}.accessNote{display:block;text-align:center;color:#9aa4b1;font-size:9px;margin-top:18px}.demoGate footer{width:min(1180px,calc(100% - 48px));margin:0 auto;padding:22px 0 28px;border-top:1px solid #dfe5ee;display:flex;justify-content:space-between;color:#8b96a5;font-size:10px;font-weight:650}
@media(max-width:900px){.demoHero{grid-template-columns:1fr;gap:38px;padding:36px 0 54px}.demoStory{max-width:none}.demoStory h1{font-size:48px;letter-spacing:-2px}.accessCard{max-width:560px;width:100%;margin:auto}}
@media(max-width:600px){.demoNav,.demoHero,.demoGate footer{width:calc(100% - 30px)}.demoNav{height:68px}.workspaceLink{font-size:11px}.demoHero{padding:24px 0 42px}.demoEyebrow{font-size:9px}.demoStory h1{font-size:38px;letter-spacing:-1.5px}.demoStory>p{font-size:15px}.workflowPreview{grid-template-columns:1fr;margin-top:28px}.workflowPreview>div{min-height:0;padding:16px}.workflowPreview span{margin-bottom:10px}.accessCard{padding:24px 20px;border-radius:18px}.accessCard h2{font-size:24px}.demoGate footer{align-items:flex-start;flex-direction:column;gap:5px}}