/* The office site's navigation bar, down the left of every page. The page's
   content sits to its right (body > main); on a phone the bar is a drawer
   off the menu button in a slim top strip. */
:root{ --side: 232px; --side-bg:#3E4A5C; --side-ink:#fff; --side-dim:rgba(255,255,255,.8); --side-line:rgba(255,255,255,.12); --side-orange:#E85B34; }
html.side-collapsed{ --side: 64px; }
#sideNav{ position:fixed; left:0; top:0; bottom:0; width:var(--side); background:var(--side-bg); color:var(--side-ink); z-index:60; display:flex; flex-direction:column; box-shadow:2px 0 0 var(--side-orange); font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif; transition:width .15s ease; }
body > main{ margin-left:var(--side) !important; max-width:none !important; transition:margin-left .15s ease; }
.side-brand{ display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--side-line); text-decoration:none; color:var(--side-ink); min-height:70px; }
.side-brand img{ width:48px; height:auto; flex:none; filter:drop-shadow(0 2px 4px rgba(0,0,0,.35)); }
.side-brand-name{ font-weight:700; font-size:14px; line-height:1.15; }
.side-nav{ flex:1; overflow-y:auto; overflow-x:hidden; padding:8px 0; }
.side-head{ display:flex; align-items:center; gap:10px; width:100%; padding:9px 14px; background:transparent; border:0; color:var(--side-ink); font:inherit; font-weight:400; font-size:14px; text-align:left; cursor:pointer; text-decoration:none; border-radius:8px; margin:1px 8px; width:calc(100% - 16px); }
.side-head:hover{ background:rgba(255,255,255,.08); }
.side-icon{ width:22px; text-align:center; font-size:15px; opacity:.9; flex:none; }
.side-label{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.side-caret{ font-size:11px; opacity:.7; transition:transform .15s; }
.side-group.open > .side-head .side-caret{ transform:rotate(90deg); }
/* the heading that is open is orange; the current page's heading, when another is open, keeps an orange edge */
.side-group.open > .side-head, .side-head.on{ background:transparent; color:#fff; font-weight:700; box-shadow:inset 4px 0 0 var(--side-orange); }
.side-head.on{ color:#fff; }
.side-group.on:not(.open) > .side-head{ box-shadow:inset 3px 0 0 rgba(232,91,52,.5); font-weight:600; }
.side-items{ display:none; padding:4px 0 6px 0; margin:2px 0 4px 25px; border-left:2px solid rgba(255,255,255,.15); }
.side-group.open > .side-items{ display:block; }
.side-item{ display:block; padding:6px 10px 6px 21px; font-size:13.5px; color:var(--side-dim); text-decoration:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.side-item:hover{ color:#fff; background:rgba(255,255,255,.06); }
.side-item{ position:relative; }
.side-item.on{ color:#fff; font-weight:700; box-shadow:none; }
.side-item.on::before{ content:'\203A'; position:absolute; left:8px; top:50%; transform:translateY(-52%); color:var(--side-orange); font-size:17px; font-weight:800; line-height:1; }
.side-sub{ margin:4px 0; }
.side-sub-label{ padding:6px 10px 2px 21px; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.55); }
.side-sub .side-item{ padding-left:32px; }
.side-foot{ border-top:1px solid var(--side-line); padding:8px 8px 10px; display:flex; flex-direction:column; gap:4px; }
.side-version{ font-size:12px; color:rgba(255,255,255,.75); padding:6px 12px 0; letter-spacing:.02em; }
.side-version .side-icon{ display:none; font-size:10px; }
.side-nav.collapsed .side-version .side-label{ display:none; }
.side-nav.collapsed .side-version .side-icon{ display:block; text-align:center; }
.side-collapse{ display:flex; align-items:center; gap:10px; background:transparent; border:0; color:var(--side-dim); font:inherit; font-size:12.5px; padding:6px; cursor:pointer; border-radius:6px; width:100%; text-align:left; }
.side-collapse:hover{ background:rgba(255,255,255,.08); color:#fff; }
.side-site{ color:rgba(255,255,255,.6); font-size:11.5px; text-decoration:none; padding:2px 6px; }
.side-site:hover{ color:#fff; }
/* collapsed: icons only */
html.side-collapsed #sideNav .side-label, html.side-collapsed #sideNav .side-caret, html.side-collapsed #sideNav .side-brand-name, html.side-collapsed #sideNav .side-items, html.side-collapsed #sideNav .side-site{ display:none; }
html.side-collapsed #sideNav .side-head{ justify-content:center; padding:10px 0; }
html.side-collapsed #sideNav .side-brand{ justify-content:center; padding:12px 6px; }
html.side-collapsed #sideNav .side-collapse{ justify-content:center; }
html.side-collapsed #sideNav .side-collapse .side-icon{ transform:rotate(180deg); }
/* the top strip and drawer on a phone */
.side-top{ display:none; }
.side-backdrop{ display:none; }
@media (max-width:820px){
  :root{ --side: 0px; }
  html.side-collapsed{ --side: 0px; }
  #sideNav{ width:260px; transform:translateX(-100%); transition:transform .18s ease; box-shadow:none; }
  html.side-drawer #sideNav{ transform:none; box-shadow:2px 0 0 var(--side-orange), 0 0 40px rgba(0,0,0,.4); }
  html.side-collapsed #sideNav .side-label, html.side-collapsed #sideNav .side-caret, html.side-collapsed #sideNav .side-brand-name, html.side-collapsed #sideNav .side-items{ display:revert; }
  html.side-collapsed #sideNav .side-group.open > .side-items{ display:block; }
  html.side-collapsed #sideNav .side-head{ justify-content:flex-start; padding:9px 14px; }
  #sideNav .side-foot .side-collapse{ display:none; }
  .side-top{ display:flex; align-items:center; gap:10px; position:sticky; top:0; z-index:55; background:var(--side-bg); color:#fff; padding:8px 12px; border-bottom:2px solid var(--side-orange); }
  .side-burger{ background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.35); color:#fff; border-radius:8px; width:40px; height:36px; font-size:18px; cursor:pointer; }
  .side-top-brand{ display:flex; align-items:center; gap:8px; color:#fff; text-decoration:none; font-weight:700; font-size:14px; }
  .side-top-brand img{ width:34px; height:auto; filter:drop-shadow(0 2px 4px rgba(0,0,0,.35)); }
  html.side-drawer .side-backdrop{ display:block; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:59; }
  body > main{ margin-left:0 !important; }
  /* ---- the drawer on a phone: plain, like the website - a white list, no icons, the open page in orange */
  #sideNav{ width:min(300px, 86vw); background:#fff; color:var(--ink, #26242A); }
  #sideNav .side-brand{ background:#3E4A5C; padding:14px 16px; }
  #sideNav .side-brand-name{ font-size:15px; }
  #sideNav .side-icon{ display:none !important; }
  #sideNav .side-head{ color:#26242A; font-size:15.5px; padding:13px 18px; border-bottom:1px solid #EEEDF0; border-radius:0; margin:0; gap:0; }
  #sideNav .side-head:hover{ background:#FAFAFB; }
  #sideNav .side-caret{ color:#8B8790; font-size:12px; }
  #sideNav .side-group.open > .side-head, #sideNav .side-head.on{ background:#fff; color:#B8361A; font-weight:700; box-shadow:inset 4px 0 0 #E85B34; }
  #sideNav .side-group.on:not(.open) > .side-head{ box-shadow:none; color:#B8361A; }
  #sideNav .side-items{ margin:0; padding:0 0 4px; border-left:0; background:#FAFAFB; border-bottom:1px solid #EEEDF0; }
  #sideNav .side-item{ color:#565259; font-size:14.5px; padding:10px 18px 10px 34px; white-space:normal; }
  #sideNav .side-item.on{ color:#B8361A; font-weight:700; box-shadow:none; }
  #sideNav .side-item.on::before{ content:'\203A'; position:absolute; left:20px; color:#E85B34; font-size:19px; }
  #sideNav .side-sub-label{ color:#8B8790; padding:8px 18px 2px 34px; font-size:11px; letter-spacing:.06em; text-transform:uppercase; }
  #sideNav .side-sub .side-item{ padding-left:46px; }
  #sideNav .side-foot{ border-top:1px solid #EEEDF0; background:#fff; }
  #sideNav .side-version{ color:#8B8790; }
  html.side-drawer #sideNav{ box-shadow:0 0 40px rgba(0,0,0,.35); }
  .side-top{ background:#3E4A5C; }
  .side-burger{ background:transparent; border:1px solid rgba(255,255,255,.5); }
}

/* the page title, moved onto the first card's heading line */
body > main > h1.page-title-moved, body > main .page-title.page-title-moved{ display:none !important; }
.page-crumb{ font-family:"Cormorant Garamond",Georgia,serif; font-weight:600; font-size:inherit; color:var(--muted, #8B8790); margin-right:10px; white-space:nowrap; }
.page-crumb::after{ content:' \00b7'; margin-left:6px; color:#C9C6D2; }
.page-crumb.in-bar{ font-size:22px; color:#8B8790; align-self:center; }
.page-crumb.alone{ color:#B8361A; }
.page-crumb.alone::after{ content:none; }
.page-crumb-row{ font-family:"Cormorant Garamond",Georgia,serif; font-size:22px; margin:0 0 10px; }
.page-crumb-row .page-crumb{ margin-right:0; }
.page-crumb-row .page-crumb::after{ content:none; }
body > main{ padding-top:14px !important; }
.page-crumb:only-child, h2.only-crumb .page-crumb{ color:#B8361A; }
h2.only-crumb .page-crumb::after{ content:none; margin:0; }
