/* PublicSiteNav owns its geometry, controls and responsive layout on every public page. */
.nav{--nav-link-gap:24px;--nav-action-gap:10px;position:fixed;top:0;left:0;right:0;z-index:50;transition:background .4s var(--ease),border-color .4s,backdrop-filter .4s}
.nav [hidden]{display:none!important}
.nav.scrolled{background:color-mix(in srgb,var(--paper) 82%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav .nav-inner{max-width:1200px;margin:0 auto;padding:16px 32px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.nav .brand{flex-shrink:0;display:flex;align-items:baseline;gap:10px}
.nav .brand .cn{font-family:var(--serif);font-weight:600;font-size:23px;letter-spacing:.04em;white-space:nowrap}
.nav .brand .en{font-family:var(--latin);font-style:italic;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.nav .nav-links{display:flex;align-items:center;gap:var(--nav-link-gap)}
.nav .nav-links>a{flex-shrink:0}
.nav .nav-links a:not(.btn){font-size:14.5px;color:var(--ink-2);position:relative;transition:color .25s;white-space:nowrap}
/* The shared component selects the layout from measured content, not viewport breakpoints. */
.nav:not(.is-collapsed) .nav-links{flex:1}
.nav:not(.is-collapsed) .nav-links a.btn-ghost{margin-left:auto}
.nav:not(.is-collapsed) .nav-links a.btn-primary{margin-left:calc(var(--nav-action-gap) - var(--nav-link-gap))}
.nav:not(.is-collapsed) .nav-links a.btn-primary.nav-cta-right{margin-left:auto}
.nav .nav-links a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:1.5px;background:var(--gold-deep);transition:width .3s var(--ease)}
.nav .nav-links a:not(.btn):hover{color:var(--ink)}
.nav .nav-links a:not(.btn):hover::after{width:100%}
.nav .nav-links a.active{color:var(--ink);font-weight:500}
.nav .nav-links a.active::after{width:100%;background:var(--gold)}
.nav .nav-tools{flex-shrink:0;display:flex;align-items:center;gap:8px}
.nav .icon-btn{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink-2);cursor:pointer;transition:color .25s,background-color .25s,border-color .25s;font-family:var(--sans);font-size:13px;font-weight:600}
.nav .icon-btn:hover{border-color:var(--ink-3);color:var(--ink);background:var(--card)}
.nav .icon-btn.lang-seg{width:auto;padding:3px;border-radius:999px;display:inline-flex;align-items:center;gap:0}
.nav .icon-btn.lang-seg i{font-style:normal;font-size:11.5px;font-weight:600;line-height:1.2;padding:5px 9px;border-radius:999px;color:var(--ink-3);transition:color .25s,background-color .25s}
.nav .icon-btn.lang-seg i.on{background:var(--ink);color:var(--paper)}
.nav .btn{display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:500;padding:9px 18px;border-radius:999px;transition:all .25s var(--ease);white-space:nowrap;cursor:pointer}
.nav .btn-primary{background:var(--ink);color:var(--paper)}
.nav .btn-primary:hover{background:var(--gold-deep);color:var(--paper);transform:translateY(-1px);box-shadow:0 8px 22px -8px var(--gold-deep)}
.nav .btn-ghost{border:1px solid var(--line);color:var(--ink)}
.nav .btn-ghost:hover{border-color:var(--ink);background:var(--card)}
.nav #lf-nav-av{display:inline-flex;align-items:center;min-width:36px;min-height:36px}
.nav .menu-btn{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}
.nav .menu-btn span{width:22px;height:2px;background:var(--ink);transition:.3s;border-radius:2px}

/* Keep desktop auto margins out of the stacked mobile menu. */
.nav.is-collapsed .nav-links{position:fixed;inset:0 0 auto 0;flex-direction:column;background:var(--paper);padding:88px 32px 40px;gap:20px;align-items:flex-start;transform:translateY(-100%);visibility:hidden;transition:transform .4s var(--ease),visibility .4s;box-shadow:0 20px 50px -20px var(--shadow);border-bottom:1px solid var(--line);max-height:100dvh;overflow-y:auto}
.nav.is-collapsed .nav-links.open{transform:none;visibility:visible}
.nav.is-collapsed .menu-btn{display:flex;z-index:60}
@media(max-width:680px){
  .nav .nav-inner{padding:13px 22px;gap:12px}
}
@media(max-width:480px){
  .nav .brand .en{display:none}
}
.nav a:focus-visible,.nav button:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}
@media(prefers-reduced-motion:reduce){
  .nav,.nav *{transition:none!important}
}