/* Shared destination navigation for the Journal, guides, and experiences. */
.site-header{position:fixed;z-index:60;top:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:18px;width:min(1200px,calc(100% - 48px));min-height:72px;padding:10px 12px 10px 20px;box-sizing:border-box;border:1px solid #ffffff2e;border-radius:999px;background:#141614ed;backdrop-filter:blur(22px) saturate(130%);box-shadow:0 14px 42px #111b1820;color:#fff;font:500 14px/1.4 "DM Sans",system-ui,sans-serif}
.site-header *{box-sizing:border-box}
.site-header a{text-decoration:none;color:inherit}
.site-header button{font:inherit;cursor:pointer}
.site-header :focus-visible{outline:3px solid #a3d5b9;outline-offset:3px}
.site-brand{display:flex;align-items:center;flex-shrink:0;gap:10px;margin-right:auto;min-height:44px}
.site-brand img{width:30px;height:28px;object-fit:contain;filter:brightness(0) invert(1)}
.site-brand b{display:block;font:600 21px/1.15 "Manrope",system-ui,sans-serif;letter-spacing:-.035em;white-space:nowrap}
.site-brand small{display:block;margin-top:4px;font-size:9px;line-height:1.3;letter-spacing:.06em;text-transform:uppercase;color:#d5d8d4;white-space:nowrap}
.site-links{display:flex;align-items:center;gap:3px;min-width:0}
.site-links a,.site-shortcuts a,.site-menu-toggle{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 12px;border:0;border-radius:999px;white-space:nowrap;font-size:14px;line-height:1.4;color:#e5e9e6;background:transparent}
.site-links a:hover,.site-shortcuts a:hover,.site-menu-toggle:hover{background:#ffffff18;color:#fff}
.site-links a[aria-current="page"],.site-shortcuts a[aria-current="page"]{color:#171a17;background:#f7f7f4;font-weight:600}
.site-links .site-venwed{border:1px solid #ffffff40;margin-left:5px}
.site-shortcuts{display:none}
.site-menu-toggle svg{width:18px;height:18px;flex-shrink:0}
.site-menu-toggle[aria-expanded="true"]{background:#f7f7f4;color:#171a17}
.site-header .nav-actions,.site-header .nav-actions:has(.profile-btn.signed-in){display:flex!important;align-items:center!important;flex:0 0 auto;width:auto!important;min-width:0!important;max-width:none!important;gap:6px!important;margin:0!important;padding:0!important;border:0!important;background:transparent!important}
.site-header .nav-actions>.icon-btn,.site-header .nav-actions:has(.profile-btn.signed-in) .notification-btn{position:relative!important;inset:auto!important;display:grid!important;place-items:center;flex:0 0 44px!important;width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;margin:0!important;padding:0!important;border:1px solid #ffffff40!important;border-radius:50%;background:#ffffff0d!important;color:#fff;transform:none!important}
.site-header .nav-actions>.icon-btn svg{width:20px;height:20px}
.site-header .nav-actions .profile-btn{width:auto!important;min-width:62px!important;height:44px!important;min-height:44px!important;padding:0 17px!important;border:0!important;border-radius:999px!important;background:#f7f7f4;color:#171a17;font-size:14px!important;font-weight:600}
.site-header .nav-actions:has(.profile-btn.signed-in) .profile-btn.signed-in,.site-header .profile-btn.signed-in .nav-profile-avatar,.site-header .profile-btn.signed-in .nav-profile-avatar img{flex:0 0 44px!important;width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;overflow:hidden}
.site-header .profile-btn.signed-in .nav-profile-name{display:none!important}
.site-header .notification-popover{top:calc(100% + 10px);right:0;width:min(380px,calc(100vw - 24px))}
.site-header [hidden]{display:none!important}
.site-header .nav-actions:has(.profile-btn.signed-in) .notification-btn[hidden]{display:none!important}
.site-header--guides{position:sticky;left:auto;transform:none;margin:20px auto 0}
/* Seven destinations and the account buttons share one row from 1248px, where the header reaches its full width. */
@media(min-width:1248px){.site-header:has(.nav-actions) .site-links a{padding-inline:8px}}
@media(max-width:1247px){
 .site-header{flex-wrap:wrap;gap:12px;border-radius:28px}
 .site-links{flex:1 0 100%;display:grid;grid-template-columns:1fr 1fr;gap:6px;padding-top:8px}
 .site-links a{justify-content:flex-start;padding:13px 16px;border-radius:12px}
 .site-links .site-venwed{margin:0}
 .site-header.nav-ready .site-shortcuts{display:flex;gap:3px;align-items:center;padding:3px;border-radius:999px;background:#ffffff0c}
 .site-header.nav-ready .site-links{position:absolute;top:calc(100% + 10px);right:0;display:none;width:min(420px,100%);max-height:calc(100dvh - 120px);overflow:auto;padding:12px;border:1px solid #ffffff2e;border-radius:22px;background:#181e1b;box-shadow:0 20px 50px #111b1830;grid-template-columns:1fr;overscroll-behavior:contain}
 .site-header.nav-ready[data-menu-open] .site-links{display:grid}
 .site-header.nav-ready .site-links>a:is([href="/"],[href="/community"],[href="/community/"]){display:none}
 .site-menu-toggle{border:1px solid #ffffff30}
}
@media(max-width:640px){
 .site-header{top:max(10px,env(safe-area-inset-top));width:calc(100% - 24px);min-height:120px;padding:10px 12px;gap:8px 10px;border-radius:24px}
 .site-brand{gap:8px}
 .site-brand b{font-size:19px}
 .site-brand small{font-size:8px}
 .site-brand img{width:27px;height:26px}
 .site-header.nav-ready .site-shortcuts{order:3;display:grid;grid-template-columns:1fr 1fr 1fr;flex:1 0 100%;padding:0;background:transparent}
 .site-shortcuts a,.site-menu-toggle{padding:9px 8px}
 .site-header .nav-actions{margin-left:auto!important}
 .site-header.nav-ready .site-links{max-height:calc(100dvh - 160px)}
 .site-header .notification-popover{max-height:calc(100dvh - 160px)}
 .site-header--guides{margin-top:10px}
}
@media(max-width:360px){
 .site-header{padding-inline:10px;column-gap:6px}
 .site-brand{gap:6px}
 .site-brand img{width:23px;height:24px}
 .site-brand b{font-size:16px}
 .site-brand small{font-size:7px;letter-spacing:0}
 .site-header .nav-actions,.site-header .nav-actions:has(.profile-btn.signed-in){gap:4px!important}
 .site-header .nav-actions .profile-btn{min-width:58px!important;padding:0 13px!important}
 .site-header .nav-actions:has(.profile-btn.signed-in) .profile-btn.signed-in{min-width:44px!important;padding:0!important}
}