:root{--menu-hover:#deedf5;--footer-hover:#bce8ed}
/* Navigation states — shared by all pages. Demo classes only pin states in the style guide. */
.site-header nav>a:not(.button),.service-nav>summary{position:relative;transition:color .16s ease}
.site-header nav>a:not(.button)::after,.service-nav>summary::after{content:'';position:absolute;left:0;right:0;bottom:3px;height:2px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .16s ease}
.site-header nav>a:not(.button):is(:hover,:focus-visible,.is-demo-hover),.service-nav>summary:is(:hover,:focus-visible,.is-demo-hover){color:var(--mid)}
.site-header nav>a:not(.button):is(:hover,:focus-visible,.is-demo-hover)::after,.service-nav>summary:is(:hover,:focus-visible,.is-demo-hover)::after,.service-nav[open]>summary::after{transform:scaleX(1)}
.flow-header .service-nav[open]>.flow-mega{box-shadow:0 16px 55px #2b479c22}
.menu-shortcuts a,.menu-existing .link-group a,.all-services,.site-footer a{position:relative;transition:background-color .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease}
.menu-shortcuts a:is(:hover,:focus-visible,.is-demo-hover){background:var(--menu-hover);color:var(--navy);box-shadow:0 0 0 6px var(--menu-hover);border-radius:3px;text-decoration:none}
.menu-shortcuts a svg,.all-services svg,.button svg{transition:transform .16s ease}
.menu-shortcuts a:is(:hover,:focus-visible,.is-demo-hover) svg,.all-services:is(:hover,:focus-visible,.is-demo-hover) svg,.button:is(:hover,:focus-visible,.is-demo-hover) svg{transform:translateX(4px)}
.menu-existing .link-group a:is(:hover,:focus-visible,.is-demo-hover){background:var(--pale);color:var(--navy);box-shadow:0 0 0 5px var(--pale);border-radius:3px;text-decoration:underline;text-decoration-color:var(--cyan);text-underline-offset:5px}
.all-services:is(:hover,:focus-visible,.is-demo-hover){color:var(--mid)}
.site-footer a:is(:hover,:focus-visible,.is-demo-hover){opacity:1;color:var(--footer-hover);background:#ffffff12;box-shadow:0 0 0 5px #ffffff12;border-radius:3px;text-decoration:underline;text-decoration-color:var(--footer-hover);text-decoration-thickness:1px;text-underline-offset:4px;transform:translateX(3px)}
.site-footer a:focus-visible,.site-footer a.is-demo-focus{outline:2px solid var(--footer-hover);outline-offset:5px;opacity:1;color:white}
.button:is(:hover,.is-demo-hover){transform:translateY(-2px);box-shadow:0 10px 24px #2b479c4d;filter:brightness(1.04)}
.button.outline:is(:hover,.is-demo-hover){background:var(--pale);box-shadow:none;filter:none}
.button:focus-visible,.button.is-demo-focus{outline:3px solid var(--navy);outline-offset:4px}
.button:active{transform:translateY(0);filter:brightness(.97)}
.interaction-guide{background:#f7f9fc;padding:64px 0 90px}.interaction-guide>.container{max-width:1208px}.interaction-guide h1{font-size:32px}.interaction-guide .guide-intro{color:var(--muted);font-size:13px;margin-top:14px}.state-section{margin-top:44px}.state-section>h2{font-size:21px;margin-bottom:10px}.state-section>p{font-size:13px;color:var(--muted);margin-bottom:20px}.state-samples{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.state-sample{padding:26px;background:white;border:1px solid var(--line);border-radius:6px}.state-sample>p{font:600 11px Montserrat;color:var(--muted);margin-bottom:24px}.state-sample .button{font-size:12px;padding:12px 18px;gap:16px;min-height:50px}.guide-header{position:relative;z-index:1}.guide-header .site-header{position:relative}.guide-menu{position:relative;background:var(--pale);height:540px;border:1px solid var(--line);border-radius:6px}.guide-menu .flow-header{position:relative}.guide-menu .flow-header .flow-mega{left:0;right:0;top:52px;max-width:100%;grid-template-columns:340px 1fr}.guide-menu .header-inner{padding:0 20px}.guide-menu .menu-existing{gap:18px;padding:30px 24px}.guide-menu .menu-existing .link-group h4{font-size:11px}.guide-menu .menu-ai{padding:26px}.guide-menu .site-header nav{gap:26px}.guide-footer{border-radius:6px;overflow:hidden}.guide-footer .container{padding-left:32px;padding-right:32px}.guide-footer .footer-grid{gap:28px}
@media(max-width:900px){.service-nav>summary::after{right:auto;width:72px}.state-samples{grid-template-columns:1fr}.guide-menu{height:auto}.guide-menu .flow-header .flow-mega{grid-template-columns:1fr}.guide-menu .header-inner{display:block;height:auto;padding:0}.guide-menu .header-inner>a{height:52px;padding-left:24px}.guide-menu .site-header{height:auto}.guide-menu .site-header nav{display:flex;position:static;max-height:none;padding:24px}.guide-menu .nav-toggle{display:none}.guide-header .site-header{height:auto}.interaction-guide h1{font-size:25px}}
@media(prefers-reduced-motion:reduce){.site-footer a,.menu-shortcuts a,.button,.button svg{transition:none;transform:none!important}}