:root{--cobalt:#1538C5;--white:#FFFFFF;--ink:#101827;--muted:#586477;--surface:#F3F5FA;--blue-soft:#E4EAFF;--navy:#101D38;--line:#E1E6EF;--font:Manrope,Arial,sans-serif;--page:clamp(24px,3.34vw,64px);--radius:6px;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px;color-scheme:light}body{margin:0;background:var(--white);color:var(--ink);font:16px/1.65 var(--font);-webkit-font-smoothing:antialiased}::selection{background:var(--blue-soft);color:var(--navy)}a{color:inherit;text-decoration:none;text-underline-offset:.2em}button{font:inherit;color:inherit;cursor:pointer}a,button,summary{touch-action:manipulation;-webkit-tap-highlight-color:#1538C51A}a,button{transition:color .18s,background-color .18s}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--cobalt);outline-offset:5px}button:disabled{opacity:.5;cursor:default}h1,h2,p,figure{margin:0}h1,h2{text-wrap:balance}svg{vertical-align:middle;flex-shrink:0}img{display:block;max-width:100%;height:auto}section,div{min-width:0}[hidden]{display:none!important}.skip{position:absolute;left:24px;top:-100px;padding:12px 18px;background:var(--cobalt);color:#FFF;z-index:50}.skip:focus{top:10px}
.masthead{max-width:1600px;margin:auto;padding:0 var(--page);height:92px;display:flex;align-items:center;gap:42px}.brand{width:89px;flex-shrink:0}.brand>span{display:block;height:38px;width:100%;background:var(--cobalt);mask:url('/brand/rubi-light-lettering.png') center/contain no-repeat}.desktop-nav{display:flex;align-items:center;gap:32px;margin:auto;font-size:14px;letter-spacing:.01em}.desktop-nav>a,.integrations-menu>summary{padding-block:12px}.desktop-nav a:hover,.integrations-menu summary:hover{color:var(--cobalt)}.integrations-menu{position:relative}.integrations-menu summary{list-style:none;display:flex;align-items:center;gap:7px;cursor:pointer}.integrations-menu summary::-webkit-details-marker{display:none}.integrations-menu>div{position:absolute;top:45px;left:-20px;width:210px;border:1px solid var(--line);background:#FFF;padding:10px;z-index:20;border-radius:8px;box-shadow:0 12px 35px -12px #10182726}.integrations-menu>div>a{display:block;padding:10px;border-radius:4px}.integrations-menu>div>a:hover{background:var(--surface)}.nav-action{display:flex;align-items:center;gap:25px;min-height:44px;border:1px solid var(--line);padding:10px 15px;font-size:13px;border-radius:var(--radius);letter-spacing:.01em}.nav-action:hover{background:var(--cobalt);color:#FFF;border-color:var(--cobalt)}.menu-button{display:none}.mobile-menu{padding:10px var(--page) 20px;background:var(--surface)}.mobile-menu a{display:block;padding-block:12px}
.hero{text-align:center;max-width:1520px;margin:auto;padding:64px var(--page) 46px}.hero h1{font-size:clamp(48px,4.72vw,72px);line-height:1.15;letter-spacing:-.012em;font-weight:500;max-width:1280px;margin:auto}.hero-description{max-width:820px;margin:25px auto 0;font-size:18px;line-height:1.7;letter-spacing:0;text-wrap:balance;color:var(--muted)}.hero-actions{margin-top:28px;display:flex;justify-content:center;align-items:center;gap:27px}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;min-height:52px;padding:14px 20px;border-radius:6px;background:var(--cobalt);color:#FFF;font-size:14px;font-weight:600;letter-spacing:.005em}.primary:hover{background:var(--navy)}.secondary{display:inline-flex;align-items:center;gap:13px;min-height:44px;font-size:14px;font-weight:500;letter-spacing:.005em}.secondary:hover{color:var(--cobalt)}.offer{max-width:900px;margin:18px auto 0;font-size:13px;line-height:1.7;color:var(--muted);letter-spacing:.005em}
.showcase{position:relative;height:430vh;min-height:3200px;scroll-margin-top:20px}.showcase-stage{position:sticky;top:0;height:100svh;min-height:760px;max-height:1150px;max-width:1720px;margin:auto;isolation:isolate;overflow:clip}.scene-surface{position:absolute;left:5%;top:18px;width:90%;height:calc(100% - 88px);max-height:930px;background:var(--surface);border:1px solid #E9EDF5;border-radius:22px;z-index:-1}.scene-heading{position:absolute;left:calc(var(--page) + 16px);top:27px;max-width:720px;opacity:0;transform:translateY(8px)}.scene-heading h2{font-size:30px;font-weight:500;line-height:1.24;letter-spacing:-.01em}.scene-heading p{font-size:13px;color:var(--muted);letter-spacing:.01em;margin-top:8px}.source-window{position:absolute;left:0;top:0;width:1180px;background:#FFF;border:1px solid #D7DEEA;border-radius:12px;box-shadow:0 24px 75px -30px #10182740;overflow:hidden;transform-origin:top left;contain:layout paint}.main-window{height:745px;left:calc(50% - 590px);top:54px}.context-window,.action-window{opacity:0;pointer-events:none;left:60%;top:190px;z-index:3}.context-window{width:600px;height:365px}.action-window{width:440px;height:475px}.window-bar{height:35px;display:flex;align-items:center;gap:17px;padding:0 14px;background:#FCFDFE;color:#586477;font-size:11px;letter-spacing:.01em;border-bottom:1px solid var(--line);position:relative;z-index:2}.window-dots{display:flex;gap:5px}.window-dots i{display:block;width:6px;height:6px;border:1px solid #A6B2C5;border-radius:50%}.window-demo{margin-left:auto;font-size:10px;color:#6E7A8D}.window-screen{position:absolute;inset:35px 0 0;overflow:hidden;background:#F5F6FA}.window-screen iframe{position:absolute;left:0;top:0;border:0;display:block;width:1440px;height:1000px;max-width:none;transform-origin:top left;pointer-events:none}.main-window iframe{transform:scale(.81944) translateY(-74px)}.row-shade{position:absolute;left:0;width:100%;background:#F3F5FA;opacity:0;pointer-events:none}.row-shade-top{top:0}.row-shade-bottom{bottom:0}.annotations{position:absolute;inset:0;pointer-events:none;z-index:10}.connector{position:absolute;inset:0;width:100%;height:100%;color:#6F89B0;overflow:visible}.hotspot{position:absolute;width:44px;height:44px;display:grid;place-items:center;padding:0;border:0;background:transparent;pointer-events:auto}.hotspot>span{display:grid;place-items:center;width:25px;height:25px;border:2px solid #FFF;border-radius:50%;background:var(--cobalt);color:#FFF;font-size:12px;font-weight:600;box-shadow:0 3px 12px #10182725}.hotspot:hover>span,.hotspot[aria-expanded=true]>span{background:var(--navy)}.hotspot-note{position:absolute;width:330px;padding:15px 18px;border:1px solid #D3DDF6;border-radius:8px;background:#FFF;color:var(--ink);box-shadow:0 9px 30px -15px #10182736;font-size:14px;line-height:1.55;pointer-events:auto}.hotspot-note p:first-child{font-weight:600}.hotspot-detail{font-size:13px;line-height:1.6;color:var(--muted);margin-top:8px}.scene-foot{position:absolute;bottom:24px;left:var(--page);right:var(--page);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;letter-spacing:.01em;color:var(--muted)}.scene-foot a{min-height:44px;display:inline-flex;align-items:center;gap:10px;color:var(--ink)}.scene-foot a:hover{color:var(--cobalt)}.scene-progress{position:absolute;bottom:12px;left:var(--page);right:var(--page);height:2px;background:#E1E6EF;overflow:hidden}.scene-progress i{display:block;width:100%;height:100%;background:var(--cobalt);transform:scaleX(0);transform-origin:left}.accessible-story{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.source-error{position:absolute;left:50%;top:35%;transform:translateX(-50%);background:#FFF;border:1px solid var(--line);padding:25px 30px;border-radius:8px;z-index:12;max-width:90%}.source-error a{color:var(--cobalt);display:inline-block;min-height:44px;padding-top:12px}.next-section{max-width:1280px;margin:auto;padding:75px var(--page) 60px;display:flex;justify-content:space-between;align-items:center;gap:55px}.next-section h2{font-size:42px;font-weight:500;line-height:1.2;letter-spacing:-.01em}.next-section>p{max-width:370px;color:var(--muted);font-size:16px}footer{max-width:1600px;margin:auto;padding:35px var(--page);display:flex;align-items:center;gap:40px;font-size:13px;color:var(--muted)}footer>div{margin-left:auto;display:grid;gap:6px}.footer-brand{font-size:28px;font-weight:700;letter-spacing:0;color:var(--ink)}footer>a:last-child{min-height:44px;display:inline-flex;align-items:center}.prototype-note{max-width:1600px;margin:auto;padding:0 var(--page) 35px;font-size:12px;color:var(--muted)}.prototype-note summary{cursor:pointer;min-height:44px;padding-block:12px}.prototype-note p{max-width:100ch;line-height:1.7}.noscript-message{padding:30px var(--page)}
@media(min-width:701px){.mobile-menu{display:none}}
@media(max-width:1100px) and (min-width:701px){.masthead{gap:25px}.desktop-nav{gap:20px}.nav-action{gap:12px}.hero{padding-top:45px}.hero h1{font-size:53px}.hero-description{font-size:17px}.scene-heading h2{font-size:26px}.scene-heading{max-width:440px;left:32px}.scene-foot{font-size:11px}.hotspot-note{font-size:13px;width:280px}}
@media(max-width:700px){:root{--page:24px}.masthead{height:78px;gap:20px}.brand{width:76px}.brand>span{height:33px}.desktop-nav,.nav-action{display:none}.menu-button{display:grid;place-items:center;margin-left:auto;width:44px;height:44px;border:0;background:transparent}.hero{padding-top:34px;padding-bottom:23px}.hero h1{font-size:36px;line-height:1.17;letter-spacing:-.008em;max-width:100%}.desktop-break{display:none}.hero-description{font-size:16px;line-height:1.7;max-width:100%;margin-top:23px}.hero-actions{flex-direction:column;gap:3px;align-items:stretch;margin-top:24px}.primary{width:100%;min-height:52px}.secondary{justify-content:center;min-height:48px}.offer{font-size:12px;line-height:1.7;margin-top:10px;letter-spacing:.005em}.showcase{height:450svh;min-height:3000px}.showcase-stage{height:100svh;min-height:740px;max-height:1000px}.scene-surface{left:8px;top:4px;width:calc(100% - 16px);height:calc(100% - 66px);border-radius:15px}.main-window{left:16px;top:24px;width:calc(100% - 32px);height:660px;border-radius:9px}.window-bar{height:32px;font-size:10px;padding:0 10px;gap:10px}.window-dots{gap:4px}.window-dots i{width:5px;height:5px}.window-demo{font-size:10px}.window-screen{top:32px}.scene-heading{top:20px;left:24px;max-width:calc(100% - 48px)}.scene-heading h2{font-size:25px;line-height:1.22;letter-spacing:-.005em}.scene-heading p{font-size:12px;line-height:1.6;margin-top:7px;max-width:330px}.hotspot-note{font-size:13px;line-height:1.55;padding:12px 14px;border-radius:7px;max-width:calc(100% - 48px)}.hotspot-detail{font-size:12px}.scene-foot{left:24px;right:24px;bottom:18px;font-size:10px;gap:12px;align-items:center}.scene-foot>span{max-width:185px;line-height:1.5}.scene-foot a{font-size:11px;white-space:nowrap}.scene-progress{left:24px;right:24px;bottom:8px}.context-window,.action-window{border-radius:9px}.next-section{display:block;padding-top:48px;padding-bottom:30px}.next-section h2{font-size:33px;line-height:1.2}.next-section>p{font-size:15px;margin-top:23px}footer{display:grid;gap:20px;padding-top:30px}footer>div{margin:0}.prototype-note{font-size:12px}}
.reduced .showcase{height:auto!important;min-height:0!important}.reduced .showcase-stage{position:relative;height:auto;min-height:0;max-height:none;padding:34px var(--page) 70px;overflow:visible}.reduced .scene-surface{inset:8px;height:calc(100% - 16px);width:calc(100% - 16px)}.reduced .scene-heading{position:relative;left:auto;top:auto;opacity:1;transform:none;margin:0 0 28px}.reduced .source-window{position:relative;left:auto!important;top:auto!important;transform:none!important;opacity:1!important;margin:0 auto 36px;max-width:100%}.reduced .main-window{height:700px}.reduced .context-window,.reduced .action-window{z-index:auto}.reduced .scene-foot{position:relative;inset:auto;margin-top:18px}.reduced .scene-progress,.reduced .annotations,.reduced .row-shade{display:none}.reduced .accessible-story{position:relative;left:auto;width:auto;height:auto;overflow:visible;max-width:1000px;margin:auto;padding:24px var(--page);font-size:15px;color:var(--muted)}
.showcase{height:100svh;min-height:760px}.scroll-ready .showcase{height:430vh;min-height:3200px}
@media(max-width:700px){.showcase{min-height:740px}.scroll-ready .showcase{height:450svh;min-height:3000px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.window-demo{font-size:11px;color:var(--muted)}@media(max-width:700px){.scene-foot{font-size:11px}}