.demo-product .demo-layout{grid-template-columns:1.1fr 1fr;min-height:calc(100svh - 80px)}.demo-product .demo-story{background:radial-gradient(ellipse at 15% 75%,#496e6560,transparent 70%),#12343c;padding:55px 4.5vw 60px}.demo-product .demo-story-content{max-width:680px}.demo-product .demo-story h1{font-size:clamp(44px,4.7vw,72px);margin:25px 0}.demo-product .demo-story h1 em{color:#cbd6bb}.demo-product .demo-lead{font-size:14px;margin-bottom:30px}.demo-product .demo-story-link{font-size:10px;margin-top:20px;padding-top:18px;border-top:1px solid #a3c5b631;display:flex;flex-wrap:wrap;gap:12px}.demo-product .demo-form-panel{padding:55px 4vw;max-width:none}.demo-product .demo-form-heading h2{font-size:clamp(34px,3vw,48px);max-width:450px}.demo-product .demo-form-heading p{font-size:12px}.demo-product-route{display:flex;gap:25px;justify-content:space-between;margin-top:25px;font:9px Consolas,monospace;color:#b5cdbf}.demo-technical-note{font-size:10px!important;color:#b2c9bf!important;line-height:1.8!important;margin:18px 0 0!important}.demo-topics{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:25px}.demo-topics button{font:10px 'Recupero Manrope',sans-serif;border:1px solid #a2b8ab;background:transparent;padding:10px 12px;color:#345e58;cursor:pointer;border-radius:3px}.demo-topics button[aria-pressed=true]{background:#2c635e;color:#eff2e5;border-color:#2c635e}.demo-product .product-workspace{box-shadow:0 24px 50px #021b2938;transform:rotate(-1deg)}.demo-product .product-workspace h3{color:#1c4145}.demo-product .product-workspace p{margin:0}.demo-product .product-workspace .workspace-event p{font-size:10px;line-height:1.8;color:#527266}.demo-product .product-workspace .workspace-event h4{color:#214747;margin:9px 0;font-size:18px}.demo-product .demo-progress{margin-top:30px}.demo-product .demo-form-foot{flex-wrap:wrap;gap:15px}
@media(max-width:1050px){.demo-product .demo-layout{grid-template-columns:1fr 1fr}.demo-product .demo-story{padding:45px 28px}.demo-product .demo-form-panel{padding:45px 28px}.demo-product .demo-story h1{font-size:48px}.demo-product .workspace-body>aside{display:none}.demo-product .workspace-detail{padding:20px}.demo-product .workspace-person>b{display:none}.demo-product .form-grid{grid-template-columns:1fr}}
@media(max-width:800px){.demo-product .demo-layout{grid-template-columns:1fr}.demo-product .demo-story{padding:42px 24px}.demo-product .demo-story-content{max-width:620px;margin:auto}.demo-product .demo-story h1{font-size:49px}.demo-product .demo-story .product-workspace{max-width:600px;transform:none}.demo-product .demo-form-panel{padding:45px 28px}.demo-product .demo-form-heading h2{font-size:40px}.demo-product .form-grid{grid-template-columns:1fr 1fr}.demo-product-route{font-size:8px;gap:13px}.demo-product .workspace-person>b{display:block}}
@media(max-width:520px){.demo-product .demo-story{padding:38px 24px}.demo-product .demo-story h1{font-size:46px}.demo-product .demo-lead{font-size:12px;line-height:1.8}.demo-product .workspace-person>b{display:none}.demo-product .demo-form-panel{padding:38px 24px}.demo-product .demo-form-heading h2{font-size:38px}.demo-product .form-grid{grid-template-columns:1fr}.demo-product .demo-topics button{font-size:10px;padding:12px}.demo-product .demo-product-route{display:none}.demo-product .workspace-event{min-height:148px}}
@media(prefers-reduced-motion:reduce){.demo-product .product-workspace{transform:none}}