/* Top menu, identical to the home page (index.html).
   Used by the blog articles: <nav class="site-nav"> plus a link to this file.
   Selectors start with nav.site-nav so they win over each article's own older
   nav rules without having to remove them. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

nav.site-nav{position:fixed;top:0;left:0;right:0;z-index:200;background:rgba(15,30,99,0.97);backdrop-filter:blur(12px);height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid rgba(255,255,255,0.08);font-family:'Inter',sans-serif;box-sizing:border-box}
nav.site-nav *{box-sizing:border-box}
nav.site-nav .nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
nav.site-nav .nav-logo img{height:60px;width:auto;object-fit:contain;background:white;border-radius:5px;padding:1px}
nav.site-nav .nav-links{display:flex;align-items:center;gap:32px;list-style:none;margin:0;padding:0}
nav.site-nav .nav-links li{margin:0;padding:0;list-style:none}
nav.site-nav .nav-links a{color:rgba(255,255,255,0.75);text-decoration:none;font-size:14px;font-weight:500;transition:color .2s;white-space:nowrap}
nav.site-nav .nav-links a:hover,nav.site-nav .nav-links a.active{color:#fff}
@media (max-width:1200px) and (min-width:961px){nav.site-nav .nav-links{gap:18px}nav.site-nav .nav-links a{font-size:13px}nav.site-nav .nav-cta{padding:8px 14px!important}}
nav.site-nav .nav-dropdown{position:relative}
nav.site-nav .nav-dropdown>a::after{content:'';display:inline-block;width:6px;height:6px;margin-left:6px;margin-bottom:2px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
nav.site-nav .dropdown-menu{list-style:none;position:absolute;top:100%;left:0;margin-top:10px;background:#0F1E63;border:1px solid rgba(255,255,255,0.1);border-radius:10px;padding:8px;min-width:190px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .2s,visibility .2s;box-shadow:0 16px 36px rgba(0,0,0,.28)}
nav.site-nav .nav-dropdown:hover .dropdown-menu,nav.site-nav .nav-dropdown:focus-within .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
nav.site-nav .dropdown-menu a{display:block;padding:10px 12px;border-radius:6px;white-space:nowrap}
nav.site-nav .dropdown-menu a:hover{background:rgba(255,255,255,.08)}
nav.site-nav .nav-cta{background:#008A8A!important;color:#fff!important;padding:9px 20px!important;border-radius:8px!important;font-weight:600!important;transition:background .2s!important}
nav.site-nav .nav-cta:hover{background:#006f6f!important}
nav.site-nav .nav-mobile-btn{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:4px}
nav.site-nav .nav-mobile-btn span{display:block;width:24px;height:2px;background:white;border-radius:2px;transition:.3s}
@media(max-width:960px){
  nav.site-nav{padding:0 4%}
  nav.site-nav .nav-links{display:none}
  nav.site-nav .nav-links.open{display:flex;flex-direction:column;align-items:flex-start;position:fixed;top:76px;left:0;right:0;background:#0F1E63;padding:20px 5%;gap:16px;border-bottom:1px solid rgba(255,255,255,.1);z-index:199}
  nav.site-nav .nav-mobile-btn{display:flex}
  nav.site-nav .nav-dropdown{position:static}
  nav.site-nav .nav-dropdown>a::after{display:none}
  nav.site-nav .dropdown-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;background:transparent;border:none;padding:0 0 0 16px;margin-top:12px;min-width:0;display:flex;flex-direction:column;gap:12px}
  nav.site-nav .dropdown-menu a{padding:0;font-size:13px;color:rgba(255,255,255,.6)}
}

/* Phone menu: tidy list, left-aligned, one row per item, sub-items indented */
@media(max-width:960px){
  nav.site-nav .nav-links.open{align-items:stretch;text-align:left;gap:0;padding:6px 5% 18px;max-height:calc(100vh - 76px);overflow-y:auto;box-shadow:0 16px 30px rgba(0,0,0,.3)}
  nav.site-nav .nav-links.open>li{width:100%;border-bottom:1px solid rgba(255,255,255,.08)}
  nav.site-nav .nav-links.open>li>a{display:block;padding:14px 2px;font-size:15px;color:rgba(255,255,255,.88)}
  nav.site-nav .nav-links.open>li>a.active{color:#fff;font-weight:600}
  nav.site-nav .nav-links.open .nav-dropdown>a{font-weight:600;color:#fff;padding-bottom:8px}
  nav.site-nav .nav-links.open .dropdown-menu{margin:0 0 12px 2px;padding:0 0 0 14px;border-left:2px solid rgba(255,255,255,.18);gap:0}
  nav.site-nav .nav-links.open .dropdown-menu a{display:block;padding:9px 4px;font-size:14px;color:rgba(255,255,255,.7)}
  nav.site-nav .nav-links.open>li:last-child{border-bottom:none;padding-top:16px}
  nav.site-nav .nav-links.open .nav-cta{display:block;text-align:center;padding:13px 20px!important;font-size:15px}
}

/* Pages without a fixed top bar: the menu scrolls into a sticky bar instead */
nav.site-nav.site-nav--sticky{position:sticky}
/* Wellness Check-in: the menu sits inside the sticky <header class="site-header"> */
nav.site-nav.site-nav--inline{position:relative}
header.site-header.has-site-nav{background:none;border:0;backdrop-filter:none}