:root{
  --page-bg:#394a61;
  --nav-bg:#132f50;
  --nav-text:#fff;
  --accent:#f1aa35;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--page-bg);font-family:Arial,Helvetica,sans-serif}
body{min-height:100vh}
.site-shell{width:100%;max-width:1191px;margin:0 auto;background:var(--page-bg)}
.page-art{position:relative;width:100%;line-height:0}
.page-art img{display:block;width:100%;height:auto}
.sticky-nav{position:sticky;top:0;z-index:1000;background:var(--nav-bg);box-shadow:0 2px 7px rgba(0,0,0,.18)}
.nav-inner{height:64px;display:flex;align-items:center;justify-content:center;gap:0;overflow-x:auto;white-space:nowrap;padding:0 28px;scrollbar-width:thin}
.nav-inner a{color:var(--nav-text);text-decoration:none;text-transform:uppercase;font-size:15px;line-height:1;font-weight:400;letter-spacing:.1px;padding:24px 13px;flex:0 0 auto}
.nav-inner a+ a::before{content:"•";color:#fff;margin-right:13px}
.nav-inner a.active{color:var(--accent)}
.nav-inner a:hover{color:var(--accent)}
.hotspot{position:absolute;display:block;background:transparent;text-decoration:none;z-index:20}
.hotspot:focus-visible{outline:3px solid #f3b33b;outline-offset:2px;border-radius:4px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:900px){
  .nav-inner{justify-content:flex-start;height:54px;padding:0 8px}
  .nav-inner a{font-size:12px;padding:20px 9px}
  .nav-inner a+ a::before{margin-right:9px}
}
@media (max-width:520px){
  .nav-inner{height:48px}
  .nav-inner a{font-size:10.5px;padding:18px 7px}
  .nav-inner a+ a::before{margin-right:7px}
}