/* ============================================================
   NONSTOP UP — shared site navbar
   Same layout as the index.html navbar (Bootstrap navbar +
   offcanvas), without needing Bootstrap. Everything is scoped
   to #nupNav so it can't affect the rest of a page.

   Colours are CSS variables. Defaults = index.html (blue).
   A page can override them on #nupNav, e.g.
     #nupNav{--nn-pill-active-bg:#F26B1D}
   Used by: nonstop-navdeep.html, nonstop-bulldozer.html,
            ongroundevents.html  (index.html keeps Bootstrap)
   ============================================================ */
#nupNav{
  --nn-bar:#fff;                 /* desktop bar */
  --nn-bar-mobile:#042462;       /* bar at <=768px */
  --nn-brand-bg:#fff;            /* white logo plate */
  --nn-pill-bg:#E1E5F2;
  --nn-pill-border:#D9DDEA;
  --nn-pill-color:#112F5A;
  --nn-pill-active-bg:#112F5A;
  --nn-pill-active-border:#DEE2EF;
  --nn-pill-active-color:#fff;
  --nn-cta-bg:#FF6B00;
  --nn-cta-border:#FFCEAA;
  --nn-cta-shadow:rgba(255,135,48,.35);
  --nn-booklet-color:#FF6B00;
  --nn-booklet-border:#FFCEAA;
  --nn-booklet-hover-bg:#FFF1E9;
  --nn-booklet-hover-color:#D95700;
  --nn-toggler:rgba(255,255,255,.7);     /* menu icon on mobile bar */
  --nn-toggler-mid:#042462;              /* menu icon 769-991px (white bar) */
  --nn-menu-color:#0a1a4a;
  --nn-menu-active-bg:#E1E5F2;
  --nn-menu-active-color:#112F5A;
  --nn-menu-accent:#112F5A;
  --nn-badge:#ff6500;
}
#nupNav,#nupNav *{font-family:"Mukta",sans-serif;font-weight:700;box-sizing:border-box;letter-spacing:normal;text-transform:none}
#nupNav{position:relative;z-index:60;line-height:1.5;color:#212529;font-size:16px;text-align:left}
#nupNav ul,#nupNav li{margin:0;padding:0;list-style:none}
#nupNav a{text-decoration:none}
#nupNav img{display:inline;vertical-align:middle;max-width:none;height:auto;width:auto;background:none;border-radius:0;padding:0;margin:0;box-shadow:none}
#nupNav svg{vertical-align:middle;display:inline-block}
#nupNav button{cursor:pointer;margin:0;font-family:inherit;line-height:inherit;text-transform:none}

/* bar */
#nupNav .navbar{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:0;margin:0;width:100%;background:var(--nn-bar);box-shadow:1px 1px 4px #000;z-index:60;transition:box-shadow 180ms ease,backdrop-filter 180ms ease}
#nupNav .navbar::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,rgba(0,0,0,.12),rgba(0,0,0,0));pointer-events:none}
#nupNav .navbar.scrolled{box-shadow:0 6px 18px rgba(2,6,23,.25);backdrop-filter:blur(6px)}
#nupNav .navbar.fixed-fallback{position:fixed;top:0;left:0;right:0}
#nupNav .container-fluid{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between;width:100%;max-width:none;padding:0;margin:0 auto}

/* logo */
#nupNav .navbar-brand{display:inline-block;width:17%;flex-shrink:0;margin:0;padding:0;background-color:var(--nn-brand-bg);border-bottom-right-radius:999px;font-size:1.25rem;color:#000;white-space:nowrap}
#nupNav .navbar-brand img{max-width:72%;padding:2%;margin-left:8%}

/* menu (hamburger) button */
#nupNav .navbar-toggler{padding:.5rem .75rem;margin:.5rem;font-size:1.25rem;line-height:1;background-color:transparent;border:1px solid rgba(0,0,0,.15);border-radius:.375rem;transition:box-shadow .15s ease-in-out}
#nupNav .navbar-toggler:focus{outline:0;box-shadow:0 0 0 .25rem rgba(0,0,0,.15)}
#nupNav .navbar-toggler-icon{display:inline-block;width:1.3em;height:1.3em;vertical-align:middle;background-color:var(--nn-toggler);
  -webkit-mask:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") center/100% no-repeat;
          mask:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") center/100% no-repeat}

/* desktop links */
#nupNav .navbar-collapse{flex-basis:100%;flex-grow:1;align-items:center;display:none}
#nupNav .navbar-nav{display:flex;flex-direction:column;margin:0 auto .5rem;padding:0}
#nupNav .nav-item{margin:0 .5rem}
#nupNav .nav-link{display:block;white-space:nowrap;border-radius:100px;border:1px solid var(--nn-pill-border);background:var(--nn-pill-bg);padding:6px 16px;color:var(--nn-pill-color);font-family:Poppins,"Mukta",sans-serif;font-size:12px;font-style:normal;font-weight:500;line-height:normal;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}
#nupNav .nav-link:hover,#nupNav .nav-link.active{border-color:var(--nn-pill-active-border);background:var(--nn-pill-active-bg);color:var(--nn-pill-active-color);font-weight:700}

/* booklet + pledge buttons */
#nupNav .navbar-action-buttons{display:flex;align-items:center;flex-shrink:0;gap:12px;margin-right:1rem}
#nupNav .pledge_button_nav{border-radius:100px;border:3px solid var(--nn-cta-border);background:var(--nn-cta-bg);box-shadow:0 0 10px 0 var(--nn-cta-shadow);padding:12px 54px;color:#FFF;font-family:Poppins,"Mukta",sans-serif;font-size:16px;white-space:nowrap;font-style:normal;font-weight:800;line-height:normal}
#nupNav .nonstop-booklet-button{display:inline-flex;align-items:center;justify-content:center;border:3px solid var(--nn-booklet-border);border-radius:100px;background:#FFF;box-shadow:0 0 10px 0 rgba(255,135,48,.2);padding:3px 10px;color:var(--nn-booklet-color);font-family:Poppins,"Mukta",sans-serif;font-size:15px;font-weight:800;line-height:normal;white-space:nowrap}
#nupNav .nonstop-booklet-button:hover,#nupNav .nonstop-booklet-button:focus{background:var(--nn-booklet-hover-bg);color:var(--nn-booklet-hover-color)}
#nupNav .booklet-download-icon{flex-shrink:0;margin-right:7px}
#nupNav .mobile-booklet-download{display:none}

/* slide-in mobile menu */
#nupNav .offcanvas{position:fixed;top:0;bottom:0;left:0;z-index:99999;display:flex;flex-direction:column;width:78%;max-width:320px;visibility:hidden;background-color:#fff;background-clip:padding-box;outline:0;border-right:1px solid rgba(0,0,0,.175);transform:translateX(-100%);transition:transform .3s ease-in-out,visibility .3s}
#nupNav .offcanvas.show{transform:none;visibility:visible}
#nupNav .offcanvas-header{display:flex;align-items:flex-start;justify-content:space-between;padding:16px 16px 12px;border-bottom:1px solid #eee}
#nupNav .offcanvas-logo{max-width:150px}
#nupNav .offcanvas-body{flex-grow:1;padding:0;overflow-y:auto}
#nupNav .btn-close-custom{background:none;border:none;padding:4px;line-height:0;cursor:pointer;color:var(--nn-menu-color)}
#nupNav .mobile-nav-list .mobile-nav-item a{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;color:var(--nn-menu-color);font-weight:700;font-size:16px;border-bottom:1px solid #f2f2f2}
#nupNav .mobile-nav-item.active a{background:var(--nn-menu-active-bg);color:var(--nn-menu-active-color);box-shadow:inset 4px 0 0 var(--nn-menu-accent)}
#nupNav .mobile-nav-item .chevron{flex-shrink:0}
#nupNav .mobile-nav-item .chevron path,#nupNav .btn-close-custom path{stroke:currentColor}
#nupNav .mobile-nav-item.active a .chevron path{stroke:var(--nn-menu-accent)}
#nupNav .new-badge{display:inline-block;margin-left:6px;padding:2px 10px;border:1px solid var(--nn-badge);border-radius:999px;color:var(--nn-badge);font-size:11px;font-weight:700;vertical-align:middle;line-height:1.5}
.nup-offcanvas-backdrop{position:fixed;inset:0;z-index:99998;background:#000;opacity:0;transition:opacity .15s linear;pointer-events:none}
.nup-offcanvas-backdrop.show{opacity:.5;pointer-events:auto}

/* ---------- desktop (>=992px) ---------- */
@media (min-width:992px){
  #nupNav .navbar{flex-wrap:nowrap;justify-content:flex-start}
  #nupNav .navbar-toggler,#nupNav .d-lg-none{display:none}
  #nupNav .navbar-collapse{display:flex;flex-basis:auto}
  #nupNav .navbar-nav{flex-direction:row;margin-bottom:0}
  #nupNav .navbar-nav .nav-link{padding-left:.5rem;padding-right:.5rem}
  #nupNav .offcanvas,.nup-offcanvas-backdrop{display:none}
}
/* small laptops: tighten so all links stay on one line */
@media (min-width:992px) and (max-width:1299.98px){
  #nupNav .nav-item{margin:0 .2rem}
  #nupNav .navbar-nav .nav-link{padding-left:.45rem;padding-right:.45rem;font-size:11px}
  #nupNav .navbar-action-buttons{gap:8px;margin-right:.6rem}
  #nupNav .pledge_button_nav{padding:10px 30px;font-size:15px}
  #nupNav .nonstop-booklet-button{font-size:13px;padding:3px 8px}
}
@media (min-width:992px) and (max-width:1149.98px){
  #nupNav .navbar-brand{width:13%}
  #nupNav .nav-item{margin:0 .12rem}
  #nupNav .navbar-nav .nav-link{padding-left:.35rem;padding-right:.35rem;font-size:10px}
  #nupNav .nonstop-booklet-button span{display:none}
  #nupNav .nonstop-booklet-button .booklet-download-icon{margin-right:0}
  #nupNav .pledge_button_nav{padding:9px 20px;font-size:14px}
}
/* ---------- tablet / mobile ---------- */
@media (min-width:769px) and (max-width:991.98px){
  #nupNav .navbar-toggler-icon{background-color:var(--nn-toggler-mid)}
}
@media (max-width:991.98px){
  #nupNav .container-fluid{position:relative}
  #nupNav .mobile-booklet-download{position:absolute;top:50%;right:16px;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;transform:translateY(-50%);border:2px solid var(--nn-booklet-border);border-radius:50%;background:var(--nn-booklet-hover-bg);color:var(--nn-booklet-color);box-shadow:0 2px 8px rgba(255,107,0,.18)}
  #nupNav .mobile-booklet-download .booklet-download-icon{margin-right:0}
}
@media (max-width:768px){
  #nupNav .navbar{background:var(--nn-bar-mobile)}
  #nupNav .navbar-brand{position:absolute;left:29%;top:0;width:45%;margin:0 auto;background-color:var(--nn-brand-bg);border-bottom-right-radius:900px;border-bottom-left-radius:900px}
  #nupNav .navbar-brand img{max-width:56%;padding:0 0 2%;margin-left:22%;height:62px}
  #nupNav .nav-link{margin-top:10px;margin-bottom:10px}
}