/* HSRMed shared header for pages outside the main template (clinicians, demo pages).
   Scoped under .hsrnav so it does not affect or depend on assets/hsr-brand.css.
   Matches the hsrmed.com home page header: navy #00283a, top bar #012232, lime #92c500. */
.hsrnav, .hsrnav * { box-sizing: border-box; }
.hsrnav { position: sticky; top: 0; z-index: 1000; width: 100%; margin: 0; padding: 0;
  font-family: "Open Sans", Arial, Helvetica, sans-serif; line-height: 1.4; text-align: left;
  border-bottom: 4px solid rgba(0, 40, 58, 0.53); background: #00283a; }
html[lang="ar"] .hsrnav { font-family: "Noto Sans Arabic", "Open Sans", Tahoma, sans-serif; }
.hsrnav a { text-decoration: none; }
.hsrnav ul { list-style: none; margin: 0; padding: 0; }
.hsrnav-wrap { max-width: 1140px; margin: 0 auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }

/* Top bar */
.hsrnav-top { background: #012232; border-bottom: 1px solid #001925; }
.hsrnav-top .hsrnav-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; min-height: 34px; padding-block: 4px; }
.hsrnav-contact { margin: 0; color: rgba(255,255,255,0.7); font-size: 12px; }
.hsrnav-contact a, .hsrnav-contact a:visited { color: #fff; font-weight: 600; }
.hsrnav-contact a:hover { color: #92c500; }
.hsrnav-tools { display: flex; align-items: center; gap: 10px; }
.hsrnav-demo, .hsrnav-demo:visited { color: #92c500; border: 1px solid #92c500; border-radius: 3px; padding: 1px 10px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.hsrnav-demo:hover { background: #92c500; color: #00283a; }
.hsrnav-globe { width: 16px; height: 16px; opacity: 0.7; flex: none; }
.hsrnav select { background: #00283a; color: #fff; border: 1px solid #2a4d5e; border-radius: 3px; font: inherit; font-size: 13px; height: 26px; padding: 0 6px; margin: 0; width: auto; max-width: 140px; }

/* Main bar */
.hsrnav-main .hsrnav-wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.hsrnav-logo { display: block; padding: 8px 0; direction: ltr; flex: none; }
.hsrnav-logo img { display: block; height: 66px; width: auto; max-width: 100%; }
.hsrnav-toggle { display: none; background: none; border: 0; color: #fff; font: inherit; font-size: 17px; cursor: pointer; padding: 10px 14px; align-items: center; gap: 8px; }
.hsrnav-toggle svg { width: 18px; height: 18px; }
.hsrnav-menu { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.hsrnav-menu a, .hsrnav-menu a:visited { display: block; color: #fff; font-size: 13px; font-weight: 600; text-transform: uppercase; padding: 29px 13px 31px; border-top: 2px solid transparent; transition: color 0.2s linear, border-color 0.2s linear; }
.hsrnav-menu a:hover, .hsrnav-menu .is-active a { color: #92c500; border-top-color: #92c500; }
.hsrnav-menu .is-demo a { color: #92c500; }
.hsrnav a:focus-visible, .hsrnav select:focus-visible, .hsrnav button:focus-visible { outline: 2px solid #92c500; outline-offset: 2px; }

/* Page sub-navigation (keeps each page's own section links) */
.hsrnav-sub { background: #f3f6f8; border-top: 1px solid #00283a; }
.hsrnav-sub .hsrnav-wrap { display: flex; flex-wrap: wrap; gap: 4px 22px; padding-block: 8px; }
.hsrnav-sub a, .hsrnav-sub a:visited { color: #00283a; font-size: 13px; font-weight: 600; padding: 2px 0; border-bottom: 2px solid transparent; }
.hsrnav-sub a:hover { color: #6f9600; border-bottom-color: #92c500; }

@media (max-width: 1100px) and (min-width: 769px) {
  .hsrnav-logo img { height: 54px; }
  .hsrnav-menu a, .hsrnav-menu a:visited { font-size: 11.5px; padding: 26px 7px 28px; }
}
@media (max-width: 768px) {
  .hsrnav { position: relative; }
  .hsrnav-top .hsrnav-wrap { justify-content: center; text-align: center; }
  .hsrnav-main .hsrnav-wrap { flex-direction: column; gap: 0; }
  .hsrnav-logo { padding: 10px 0 4px; }
  .hsrnav-logo img { height: 60px; }
  .hsrnav-toggle { display: inline-flex; }
  .hsrnav-menu { display: none; width: 100%; flex-direction: column; padding-bottom: 8px; }
  .hsrnav.is-open .hsrnav-menu { display: flex; }
  .hsrnav-menu a, .hsrnav-menu a:visited { padding: 11px 16px; border-top: 1px solid #0b3a50; background: #05374e; text-align: center; }
  .hsrnav-sub .hsrnav-wrap { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { .hsrnav * { transition: none !important; } }
/* keep in-page anchors (#why, #science...) clear of the sticky header */
@media (min-width: 769px) { html { scroll-padding-top: 170px; } }
/* guard against generic rules in the page stylesheet (nav a, header, ul, select) */
.hsrnav a, .hsrnav p, .hsrnav nav, .hsrnav ul, .hsrnav li { margin: 0; }
.hsrnav nav { padding: 0; }
.hsrnav .hsrnav-sub { background: #f3f6f8; }
@media (max-width: 768px) { .hsrnav-main nav { width: 100%; } }
/* the page stylesheet (assets/hsr-brand.css) styles .lang-switch as a pill without an arrow; restore the home-page look */
.hsrnav select.lang-switch { appearance: auto; -webkit-appearance: menulist; border-radius: 3px; padding: 0 6px; height: 26px; min-height: 0; background: #00283a; color: #fff; border: 1px solid #2a4d5e; font-size: 13px; }