/* One geometry for both states: 5px inset/gaps, 42px actions, 52px bar.
   Compact: 10 + 38 + 5 + 82 + 5 + 82 = 222px. Expanded adds 248px links. */
body.ramos-home .nav,body.ref-page .nav{
 --nav-ease:cubic-bezier(.4,0,.2,1);--nav-time:560ms;
 box-sizing:border-box;position:fixed;left:50%;right:auto;top:14px;
 display:flex;align-items:center;justify-content:flex-start;gap:0;
 width:470px;max-width:calc(100% - 28px);height:52px;padding:5px;
 border:0;border-radius:14px;background:#1c1c1c;color:#fff;
 transform:translateX(-50%);box-shadow:0 12px 30px #00000020,inset 0 0 0 1px #ffffff10;
 transition:width var(--nav-time) var(--nav-ease);
}
/* Dynamic pages use the ref-page body class, so explicitly reset browser link decoration here. */
body.ref-page .nav a,body.ref-page .mobile-menu a{color:inherit;text-decoration:none}
body.ramos-home .nav.is-compact,body.ref-page .nav.is-compact{width:222px;height:52px}
body.ramos-home .nav .brand,body.ref-page .nav .brand{display:grid;place-items:center;flex:0 0 38px;width:38px;height:42px;margin:0;padding:0;gap:0}
body.ramos-home .nav .brand img,body.ref-page .nav .brand img{display:block;width:32px;height:32px;transform:none}
.nav .brand>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
body.ramos-home .nav .nav-links,body.ref-page .nav .nav-links{
 position:static;left:auto;display:flex;flex:0 0 auto;align-items:center;justify-content:center;
 width:248px;min-width:0;height:42px;gap:18px;margin:0;padding:0;background:none;border-radius:0;
 overflow:hidden;opacity:1;visibility:visible;transform:none;
 transition:width var(--nav-time) var(--nav-ease),opacity 180ms ease 190ms,visibility 0s;
}
body.ramos-home .nav.is-compact .nav-links,body.ref-page .nav.is-compact .nav-links{width:0;opacity:0;visibility:hidden;pointer-events:none;transition:width var(--nav-time) var(--nav-ease),opacity 130ms ease,visibility 0s 130ms}
body.ramos-home .nav-links a,body.ref-page .nav-links a{flex-shrink:0;padding:8px 0;color:#bdbdbd;font-size:13px;line-height:20px;white-space:nowrap}
body .nav-links a:hover,body .nav-links a.active{color:#fff}
body.ramos-home .nav .nav-shortcut,body.ref-page .nav .nav-shortcut,
body.ramos-home .nav .nav-cta,body.ref-page .nav .nav-cta{
 box-sizing:border-box;display:grid;place-items:center;flex:0 0 82px;width:82px;min-width:82px;height:42px;
 margin:0 0 0 5px;padding:0;border:0;border-radius:9px;overflow:hidden;
 font:400 12px/20px Urbanist,Arial,sans-serif;letter-spacing:0;white-space:nowrap;
 opacity:1;visibility:visible;pointer-events:auto;transform:none!important;
 transition:background-color 200ms ease,color 200ms ease;
}
body .nav .nav-shortcut{background:#343434;color:#fff}
body .nav .nav-shortcut:hover,body .nav .nav-shortcut.active{background:#ffda26;color:#171717}
body.ramos-home .nav .nav-cta,body.ref-page .nav .nav-cta{background:#ff4b23;color:white}
body.ramos-home .nav .nav-cta:hover,body.ref-page .nav .nav-cta:hover{background:#e73d19}
.nav-roll{display:block;height:20px;line-height:20px;overflow:hidden;text-align:center}
.nav-roll-inner{display:block;transition:transform .3s ease}
.nav-roll-inner>span{display:block;height:20px;line-height:20px}
.nav a:hover .nav-roll-inner,.nav a:focus-visible .nav-roll-inner{transform:translateY(-20px)}
.nav a:focus-visible{outline:2px solid #ffda26;outline-offset:2px}
body .nav .nav-cta .nav-roll,body .nav .nav-shortcut .nav-roll{width:100%;margin:0;color:inherit}
/* Legacy page styles hid CTA spans and offset nested labels. Reset every layer. */
body.ramos-home .nav .nav-cta span,body.ref-page .nav .nav-cta span{display:block;margin:0;padding:0;color:inherit;text-align:center}
body .nav .menu-toggle{display:none}
main{overflow-x:clip}
[data-motion-scene]{transform:translate3d(var(--motion-x,0),var(--motion-y,0),0) rotate(var(--motion-r,0deg)) scale(var(--motion-s,1));opacity:var(--motion-o,1);will-change:transform,opacity;transform-origin:center center}
[data-word-motion]{transform-origin:left bottom;will-change:transform,opacity}
@media(max-width:650px){
 body.ramos-home .nav,body.ref-page .nav,body.ramos-home .nav.is-compact,body.ref-page .nav.is-compact{width:calc(100% - 28px);height:54px;padding:6px 10px;border-radius:14px}
 body.ramos-home .nav .nav-links,body.ref-page .nav .nav-links,body.ramos-home .nav .nav-shortcut,body.ref-page .nav .nav-shortcut,body.ramos-home .nav .nav-cta,body.ref-page .nav .nav-cta{display:none}
 body .nav .menu-toggle{display:flex;flex-shrink:0;margin-left:auto}
}
@media(prefers-reduced-motion:reduce){[data-motion-scene]{transform:none!important;opacity:1!important}body .nav,body .nav *{transition:none!important}}