.official-demo{color:#f7f7fb;background:#090a10;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,sans-serif}.demo-header{border-bottom:1px solid #ffffff12;justify-content:space-between;align-items:center;height:72px;padding:0 clamp(20px,5vw,72px);display:flex}.demo-brand{align-items:center;gap:10px;display:flex}.demo-brand>span{color:#ff6545;place-items:center;width:34px;height:34px;display:grid}.demo-brand svg{width:28px}.demo-brand b{letter-spacing:-.03em;font-size:18px}.demo-header>div{align-items:center;gap:24px;display:flex}.demo-header a{color:#b7b8c2;font-size:14px}.demo-live{color:#b7b8c2;letter-spacing:.08em;align-items:center;gap:8px;font-size:12px;font-weight:800;display:flex}.demo-live i,.demo-status i{background:#54d595;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 5px #54d5951c}.demo-intro{justify-content:space-between;align-items:end;gap:40px;max-width:1400px;margin:auto;padding:64px clamp(20px,5vw,72px) 36px;display:flex}.demo-intro>div:first-child{max-width:820px}.demo-intro small{color:#9f91ff;letter-spacing:.13em;font-weight:850}.demo-intro h1{letter-spacing:-.06em;margin-top:14px;font-size:clamp(38px,5.2vw,72px);line-height:.98}.demo-intro h1 span{color:#ff6b53}.demo-intro>div>p{color:#a9aab5;max-width:760px;margin-top:22px;font-size:18px;line-height:1.6}.demo-promise{background:#62dca40c;border:1px solid #62dca43b;border-radius:16px;gap:12px;max-width:390px;padding:16px;display:flex}.demo-promise svg{color:#62dca4;flex:none;width:22px}.demo-promise p{gap:4px;display:grid;margin:0!important;font-size:13px!important}.demo-promise b{color:#e8fff4}.demo-promise span{color:#9ead9f}.demo-stage{grid-template-columns:330px minmax(0,1fr);gap:16px;max-width:1400px;margin:auto;padding:0 clamp(20px,5vw,72px);display:grid}.demo-timeline,.demo-product{background:#11131b;border:1px solid #ffffff14;border-radius:22px;box-shadow:0 30px 80px #00000052}.demo-timeline{padding:22px}.demo-progress{background:#ffffff10;border-radius:99px;height:5px;overflow:hidden}.demo-progress i{border-radius:inherit;background:linear-gradient(90deg,#6f58ff,#ff684d);height:100%;transition:width .35s;display:block}.demo-timeline>p{color:#777986;margin:12px 0 18px;font-size:12px}.demo-timeline ol{gap:5px;display:grid}.demo-timeline li{opacity:.42;border-radius:12px;gap:11px;padding:10px;transition:all .2s;display:flex}.demo-timeline li.active{opacity:1;background:#6b55f51b}.demo-timeline li.done{opacity:.78}.demo-timeline li>span{color:#9f91ff;background:#191b24;border:1px solid #ffffff12;border-radius:9px;flex:none;place-items:center;width:30px;height:30px;display:grid}.demo-timeline li.active>span{color:#fff;background:#6952f5}.demo-timeline svg{width:15px}.demo-timeline li div{gap:3px;display:grid}.demo-timeline li b{font-size:13px}.demo-timeline li small{color:#8a8c98;font-size:11px;line-height:1.35}.demo-product{min-width:0;overflow:hidden}.demo-appbar{border-bottom:1px solid #ffffff12;justify-content:space-between;align-items:center;height:62px;padding:0 20px;display:flex}.demo-appbar>div{align-items:center;gap:10px;display:flex}.demo-appbar>div span{background:#6952f5;border-radius:10px;place-items:center;width:32px;height:32px;font-weight:850;display:grid}.demo-appbar em,.demo-status{color:#8fcaad;align-items:center;gap:8px;font-size:12px;font-style:normal;display:flex}.demo-workspace{grid-template-columns:190px minmax(0,1fr);min-height:610px;display:grid}.demo-workspace>nav{border-right:1px solid #ffffff0e;flex-direction:column;gap:6px;padding:18px 12px;display:flex}.demo-workspace nav button{color:#828591;text-align:left;border-radius:9px;align-items:center;gap:9px;padding:10px;font-size:12px;display:flex}.demo-workspace nav button.active{color:#dcd7ff;background:#6952f521}.demo-workspace nav svg{width:16px}.demo-workspace>section{min-width:0;padding:26px}.demo-workspace section>header{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.demo-workspace section>header small{color:#9f91ff;letter-spacing:.12em;font-size:10px;font-weight:850}.demo-workspace h2{letter-spacing:-.04em;margin-top:5px;font-size:30px}.demo-workspace section>header p{color:#898b96;margin-top:4px;font-size:13px}.demo-status{background:#54d5950b;border:1px solid #54d5952c;border-radius:999px;padding:8px 10px}.demo-kpis{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:24px;display:grid}.demo-kpis article{background:#161821;border:1px solid #ffffff0f;border-radius:14px;gap:9px;padding:16px;display:grid}.demo-kpis span{color:#7e818c;font-size:11px}.demo-kpis b{font-size:24px}.demo-action-card{background:linear-gradient(110deg,#6952f518,#ff67460a);border:1px solid #9f91ff36;border-radius:16px;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;margin-top:12px;padding:18px;display:grid}.demo-action-icon{color:#fff;background:#6952f5;border-radius:13px;place-items:center;width:45px;height:45px;display:grid}.demo-action-icon svg{width:21px}.demo-action-card small{color:#a99eff;letter-spacing:.1em;font-size:10px;font-weight:850}.demo-action-card h3{margin-top:3px;font-size:16px}.demo-action-card p{color:#8d8f99;margin-top:4px;font-size:12px}.demo-action-card>span{border-radius:999px;padding:7px 9px;font-size:10px;font-weight:800}.demo-action-card .approval{color:#ffc66d;background:#ffb84d1c}.demo-action-card .complete{color:#69dda4;background:#54d59517}.demo-log{background:#0e1017;border:1px solid #ffffff0f;border-radius:16px;margin-top:12px;padding:4px 16px}.demo-log>header,.demo-log>div{border-bottom:1px solid #ffffff0b;align-items:center;gap:12px;padding:12px 0;display:flex}.demo-log>header{justify-content:space-between}.demo-log>header span{color:#777986;font-size:11px}.demo-log>div:last-child{border-bottom:0}.demo-log>div>span{color:#61d99f;background:#54d59514;border-radius:50%;place-items:center;width:24px;height:24px;display:grid}.demo-log svg{width:13px}.demo-log p{flex:1;gap:2px;display:grid}.demo-log p b{font-size:12px}.demo-log p small,.demo-log time{color:#747681;font-size:10px}.demo-controls{justify-content:flex-end;gap:10px;max-width:1400px;margin:auto;padding:22px clamp(20px,5vw,72px) 50px;display:flex}.demo-controls button,.demo-controls a{border-radius:12px;justify-content:center;align-items:center;gap:8px;min-height:46px;padding:0 18px;font-size:13px;font-weight:800;display:flex}.demo-controls svg{width:16px}.demo-controls .secondary{color:#b8bac4;border:1px solid #ffffff1b}.demo-controls .secondary:disabled{opacity:.3}.demo-controls .primary{color:#fff;background:linear-gradient(110deg,#7159ff,#5a43ef);box-shadow:0 12px 28px #6952f52c}@media (max-width:900px){.demo-intro{padding-top:42px;display:grid}.demo-promise{max-width:none}.demo-stage{grid-template-columns:1fr}.demo-timeline ol{grid-template-columns:repeat(4,1fr)}.demo-timeline li{display:grid}.demo-timeline li small{display:none}}@media (max-width:640px){.demo-header{height:62px}.demo-header>div>a,.demo-live{font-size:0}.demo-live:after{content:"DÉMO";font-size:11px}.demo-intro{padding-top:34px}.demo-intro h1{font-size:42px}.demo-intro>div>p{font-size:16px}.demo-timeline ol{display:flex;overflow:auto}.demo-timeline li{min-width:52px;padding:8px}.demo-timeline li div{display:none}.demo-workspace{grid-template-columns:1fr}.demo-workspace>nav{display:none}.demo-workspace>section{padding:17px}.demo-workspace section>header{display:grid}.demo-status{width:max-content}.demo-kpis{grid-template-columns:1fr 1fr}.demo-kpis article:last-child{display:none}.demo-action-card{grid-template-columns:auto 1fr}.demo-action-card>span{grid-column:1/-1;width:max-content}.demo-log>div:nth-of-type(n+5){display:none}.demo-controls{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#090a10e8;position:sticky;bottom:0}.demo-controls>*{flex:1}}