/* Journey to Recovery site header, for pages outside the main build (Training Center).
   Loaded with jtr-fonts.css. Styles only #jtr-top. */
:root{
  --jtr-navy:#1D3358;--jtr-navy-2:#2A4574;--jtr-navy-3:#152745;
  --jtr-gold:#E0A85A;--jtr-gold-2:#E8B66E;--jtr-gold-ink:#8A5E15;
  --jtr-teal:#1072BA;--jtr-coral:#E76F51;
  --jtr-ink:#15181D;--jtr-white:#F7F9FC;--jtr-tint:#EEF2F7;--jtr-line:#E2E6EC;
  --jtr-r:16px;--jtr-rs:10px;
  --jtr-h:'Poppins',system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --jtr-b:'Inter',system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --jtr-gutter:clamp(20px,4vw,48px);
}
/* 2. New header */
#jtr-top,#jtr-top *,#jtr-foot,#jtr-foot *{box-sizing:border-box}
#jtr-top{position:relative;z-index:9999;background:#fff;border-bottom:1px solid var(--jtr-line);font:400 16px/1.5 var(--jtr-b);color:var(--jtr-ink)}
body.admin-bar #jtr-top{top:32px}
@media (max-width:782px){body.admin-bar #jtr-top{top:0}}
#jtr-top .wrap,#jtr-foot .wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 var(--jtr-gutter)}
@media (min-width:1600px){#jtr-top .wrap,#jtr-foot .wrap{max-width:1400px}}
#jtr-top .navbar{display:flex;align-items:center;gap:32px;min-height:72px}
#jtr-top .lockup{display:block;line-height:0}
#jtr-top .lockup img{height:40px;width:auto;max-width:none}
#jtr-top .nav{margin-left:auto;display:flex;align-items:center;gap:6px clamp(18px,1.6vw,30px);flex-wrap:wrap;flex:1 1 auto;justify-content:center}
#jtr-top .navbtn{font:500 16px/1.2 var(--jtr-b);color:var(--jtr-ink);text-decoration:none;padding:10px 0;border-bottom:2px solid transparent;white-space:nowrap}
#jtr-top .navbtn:hover{border-bottom-color:var(--jtr-gold);color:var(--jtr-ink)}
#jtr-top .menubtn{display:none}
#jtr-top .btn{display:inline-flex;align-items:center;justify-content:center;border-radius:var(--jtr-rs);border:2px solid var(--jtr-gold);background:var(--jtr-gold);color:var(--jtr-ink);font:500 14px/1.2 var(--jtr-h);text-decoration:none;min-height:42px;padding:10px 18px;flex:0 0 auto}
#jtr-top .btn:hover{background:var(--jtr-gold-2);border-color:var(--jtr-gold-2);color:var(--jtr-ink)}
#jtr-top .hdrcta .short{display:none}
#jtr-top .dd{position:relative;display:flex;align-items:center}
#jtr-top .ddbtn{display:inline-grid;place-items:center;width:20px;height:28px;margin:0 0 0 1px;padding:0;border:0;background:none;color:var(--jtr-ink);cursor:pointer;border-radius:6px;min-height:0;box-shadow:none}
#jtr-top .ddbtn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}
#jtr-top .ddpanel{position:absolute;top:calc(100% + 10px);left:-14px;z-index:60;min-width:270px;background:#fff;border:1px solid var(--jtr-line);border-top:4px solid var(--jtr-gold);border-radius:12px;box-shadow:0 18px 40px -16px rgba(20,24,31,.28);padding:10px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .15s,transform .15s,visibility .15s}
#jtr-top .ddpanel::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
#jtr-top .ddpanel.right{left:auto;right:-14px}
#jtr-top .ddpanel ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
#jtr-top .ddpanel li{margin:0;padding:0;list-style:none}
#jtr-top .ddpanel.wide{min-width:480px}
#jtr-top .ddpanel.wide ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:8px}
#jtr-top .ddpanel a{display:block;padding:10px 12px;border-radius:8px;font:500 14px/1.3 var(--jtr-b);color:var(--jtr-ink);text-decoration:none}
#jtr-top .ddpanel a:hover{background:var(--jtr-tint)}
#jtr-top .ddfoot{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;padding-top:8px;border-top:1px solid var(--jtr-line)}
#jtr-top .ddfoot a{font-weight:600;color:var(--jtr-navy)}
@media (min-width:1102px){#jtr-top .dd:hover .ddpanel,#jtr-top .dd:focus-within .ddpanel,#jtr-top .dd.open .ddpanel{opacity:1;visibility:visible;transform:none}#jtr-top .dd:hover .ddbtn svg,#jtr-top .dd.open .ddbtn svg{transform:rotate(180deg)}}
@media (min-width:1102px) and (max-width:1600px){#jtr-top .nav{gap:6px clamp(14px,1.6vw,26px)}#jtr-top .navbtn{font-size:14px}#jtr-top .hdrcta .long{display:none}#jtr-top .hdrcta .short{display:inline}#jtr-top .navbar{gap:20px}}
@media (min-width:1102px) and (max-width:1240px){#jtr-top .nav{gap:6px 10px}#jtr-top .navbtn{font-size:14px}#jtr-top .ddbtn{width:16px}#jtr-top .navbar{gap:14px}#jtr-top .lockup img{height:34px}#jtr-top .hdrcta{padding:8px 14px}}
@media (max-width:1100px){
  #jtr-top .navbar{flex-wrap:wrap;justify-content:flex-start;gap:10px;padding-top:12px;padding-bottom:12px;min-height:0}
  #jtr-top .lockup{order:1;margin-right:auto}
  #jtr-top .hdrcta{order:2;min-height:40px;padding:8px 14px;font-size:14px}
  #jtr-top .menubtn{order:3;display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--jtr-line);border-radius:var(--jtr-rs);padding:10px 12px;font:600 14px/1 var(--jtr-b);color:var(--jtr-ink);cursor:pointer;min-height:40px}
  #jtr-top .menubtn .bars{display:flex;flex-direction:column;gap:4px}#jtr-top .menubtn .bars span{width:18px;height:2px;background:var(--jtr-ink);border-radius:2px;display:block}
  #jtr-top .nav{order:4;display:none;flex:0 0 100%;flex-direction:column;align-items:stretch;gap:0;margin:2px 0 0;border-top:1px solid var(--jtr-line)}
  #jtr-top .nav.open{display:flex}
  #jtr-top .navbtn{padding:14px 4px;border-bottom:1px solid var(--jtr-line);font-size:16px}
  #jtr-top .dd{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;border-bottom:1px solid var(--jtr-line)}
  #jtr-top .dd .navbtn{border-bottom:0}
  #jtr-top .ddbtn{width:44px;height:44px}
  #jtr-top .ddpanel{position:static;grid-column:1/-1;display:none;opacity:1;visibility:visible;transform:none;min-width:0;box-shadow:none;border:0;border-radius:10px;background:var(--jtr-tint);padding:6px;margin:0 0 10px}
  #jtr-top .ddpanel::before{display:none}
  #jtr-top .ddpanel.wide{min-width:0}#jtr-top .ddpanel.wide ul{grid-template-columns:minmax(0,1fr)}
  #jtr-top .dd.open .ddpanel{display:block}
}
@media (max-width:520px){#jtr-top .lockup img{height:34px}#jtr-top .hdrcta .long{display:none}#jtr-top .hdrcta .short{display:inline}#jtr-top .menubtn .mtxt{display:none}}


/* On the Training Center pages the course bar below is the sticky one */
#jtr-top{position:relative;top:auto!important}
#jtr-top a{box-shadow:none}
#jtr-top .wrap{box-sizing:border-box}
#jtr-top nav{background:none;border:0;box-shadow:none}

/* menu: dropdown footers stack straight down; even spacing between top-menu words */
#jtr-top .ddfoot{flex-direction:column;gap:2px}
#jtr-top .ddpanel a{white-space:nowrap}
@media (min-width:1102px){#jtr-top .ddbtn{width:16px;margin-left:2px;margin-right:-4px}}

.skip{position:absolute;left:12px;top:-60px;z-index:100000;background:#1D3358;color:#fff;padding:10px 14px;border-radius:8px;font:600 14px/1 Poppins,sans-serif;text-decoration:none}
.skip:focus{top:12px;outline:4px solid #E0A85A}
#jtr-top a:focus-visible,#jtr-top button:focus-visible{outline:4px solid #E0A85A;outline-offset:2px}

.promobar{background:#F3F6FA;border-bottom:1px solid #E3E8EF;font:500 14px/1.3 var(--font-b);color:#1D3358}
.promobar .wrap{display:flex;align-items:center;justify-content:center;gap:24px;padding-top:10px;padding-bottom:10px;flex-wrap:wrap}
.promobar a{color:#1D3358;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.promobar .tb-cta{text-decoration:none;background:#284C86;color:#fff;border-radius:999px;padding:6px 14px;font-size:13px;white-space:nowrap}
.promobar .tb-cta:hover{background:#1D3358}
@media (max-width:640px){.promobar .tb-txt{display:none}.promobar .wrap{justify-content:center}}
/* navy header, matches the static site */
#jtr-top{background:#284C86;border-bottom:0}
#jtr-top .navbar .navbtn,#jtr-top .navbtn{color:#fff}
#jtr-top .navbtn:hover,#jtr-top .navbtn[aria-current="page"]{border-bottom-color:var(--jtr-gold)}
#jtr-top .ddbtn{color:#fff}#jtr-top .ddbtn:hover{background:rgba(255,255,255,.14)}
#jtr-top .menubtn{color:#fff;background:transparent;border-color:rgba(255,255,255,.35)}#jtr-top .menubtn .bars span{background:#fff}
#jtr-top .nav{border-top-color:rgba(255,255,255,.18)}
@media (max-width:1101px){#jtr-top .navbtn{border-bottom-color:rgba(255,255,255,.14)}}
#jtr-top .promobar{background:#F3F6FA;border-bottom:1px solid #E3E8EF;font:500 14px/1.3 var(--jtr-b);color:#1D3358}
#jtr-top .promobar .wrap{display:flex;align-items:center;justify-content:center;gap:24px;padding-top:10px;padding-bottom:10px;flex-wrap:wrap;min-height:0}
#jtr-top .promobar a{color:#1D3358;font-weight:600;text-decoration:underline;text-underline-offset:2px;min-height:0;padding:0;border:0;background:none;font-size:14px}
#jtr-top .promobar .tb-cta{text-decoration:none;background:#284C86;color:#fff;border-radius:999px;padding:6px 14px;font-size:13px;white-space:nowrap}
#jtr-top .promobar .tb-cta:hover{background:#1D3358}
@media (max-width:640px){#jtr-top .promobar .tb-txt{display:none}}
/* mobile audit: kit header and Training Center pages */
#jtr-top .promobar .tb-short{display:none}
#jtr-top .nav .mhome{display:none}
@media (max-width:1101px){
  #jtr-top{position:sticky;top:-40px;z-index:9999}
  #jtr-top .promobar{height:40px;overflow:hidden}
  #jtr-top .promobar .wrap{height:40px;padding-top:0;padding-bottom:0;flex-wrap:nowrap;gap:0}
  #jtr-top .promobar .tb-cta{display:none}
  #jtr-top .promobar .tb-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #jtr-top .nav .mhome{display:flex;align-items:center}
  #jtr-top .nav.open{max-height:calc(100vh - 72px);max-height:calc(100dvh - 72px);overflow-y:auto;overscroll-behavior:contain}
  #jtr-top .lockup{display:inline-flex;align-items:center;min-height:44px}
  #jtr-top .menubtn{min-width:44px;min-height:44px;justify-content:center}
  #jtr-top .hdrcta{min-height:44px}
  #jtr-top .ddpanel a{min-height:44px;display:flex;align-items:center}
  html{scroll-padding-top:76px}
  header.topbar{position:static!important}
}
@media (max-width:640px){
  #jtr-top .promobar .tb-txt{display:none}
  #jtr-top .promobar .tb-short{display:inline-flex;align-items:center;min-height:40px;font-weight:600;color:#1D3358;text-decoration:underline;text-underline-offset:2px;font-size:14px}
  /* Training sub-bar: one row of links, no stacked label */
  header.topbar:has(nav.mainnav) .wrap{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;height:auto!important;padding-top:0!important;padding-bottom:0!important;gap:0!important}
  header.topbar:has(nav.mainnav) .brand{display:none!important}
  header.topbar nav.mainnav{display:flex!important;width:100%;justify-content:space-around;gap:0!important;margin:0!important;flex-wrap:nowrap!important}
  header.topbar nav.mainnav a{min-height:48px;display:inline-flex!important;align-items:center;padding:0 6px!important;font-size:14px!important;white-space:nowrap}
  /* course pages: back link and player controls */
  .backbar a{display:inline-flex;align-items:center;min-height:44px;font-size:15px}
  header.topbar:not(:has(nav.mainnav)) .wrap{flex-wrap:wrap!important;height:auto!important;padding-top:8px!important;padding-bottom:8px!important;gap:6px 8px!important}
  #jtrHome,#allBtn,#homeBtn{min-height:40px}
  header.topbar .prog-pill,header.topbar .spacer{display:none!important}
  header.topbar:not(:has(nav.mainnav)) .wrap{justify-content:center!important}
  header.topbar nav.mainnav a.ext{display:none!important}
  .pspeed{font-size:16px!important;padding:2px 0!important;max-width:64px}
  #player .wrap{min-width:0;gap:6px!important}
  #pCur,#pDur{font-size:13px!important}
  footer a[href*="journeytorecovery.com"]{display:inline-flex;align-items:center;min-height:44px}
  .now-open-lbl,.lbl,.open-tag,.soon,.n,.num,.badge,.lab,.ctc{font-size:13px!important}
}
#jtr-foot .legal .lnks a,footer .legal .lnks a{text-transform:none}
@media (min-width:1102px){#jtr-top .dd:focus-within:not(.open):not(:hover) .ddpanel{opacity:0;visibility:hidden}}