/* /learn-named-clinic-sources-internal: its own sheet, loaded after site.css.
   A reference page: the public sources behind the four clinic comparisons.
   One idea runs it: a clinic's name leads to the documents under it. The hero
   draws that as a contents list with a leader to each clinic's sources, and
   each row of the ledger carries a small drawing of the kind of document it
   is. Sister page: /learn-mexico-sources-claims-internal (same hand).
   Script: scripts/learn-named-clinic-sources-internal.js. With that script
   absent every part is visible, every link still jumps, and the row a link
   lands on is still marked (:target). */

html:has(body.nsrc) {
  --hc-nav-h: 64px;            /* fallback; the script sets the real header height */
  --hc-bar-h: 52px;
  /* every jump, anchor and Tab stop lands below the header and the bar */
  scroll-padding-top: calc(var(--hc-nav-h) + var(--hc-bar-h) + 12px);
}
.nsrc {
  --ns-ease: cubic-bezier(.16, 1, .3, 1);
  --ns-gut: clamp(20px, 4vw, 56px);
  --ns-pad: clamp(56px, 7vw, 104px);
  --ns-tint: rgba(45, 110, 177, .06);
}

/* ============ GROUND RULES ============ */
/* a part sliding in from the side never widens the page */
.nsrc main { overflow-x: clip; }
.ns-wrap { max-width: calc(1240px + 2 * var(--ns-gut)); margin-inline: auto; padding-inline: var(--ns-gut); }
/* text fills its column; the column sets the measure */
.nsrc main p { max-width: none; margin: 0; text-wrap: wrap; }
.nsrc main a:not(.btn) { border-bottom: 0; }
.nsrc main :is(h2, h3) { margin: 0; max-width: none; text-wrap: wrap; color: var(--ink); }
.nsrc main h2 { font-family: var(--font-display); font-weight: 300; font-size: clamp(1.9rem, 3.3vw, 3rem); line-height: 1.1; letter-spacing: -.01em; }
/* a heading that has to wrap breaks where the styling changes */
.nsrc main :is(h1, h2, h3) > :is(.h-lead, em) { display: inline-block; }
.nsrc main :is(h1, h2, h3) > em { color: var(--accent-blue); }
.nsrc main :is(a, button, summary):focus-visible { outline: 2px solid var(--accent-blue); outline-offset: 3px; border-radius: 4px; }
.nsrc .ns-end :is(a, summary):focus-visible { outline-color: var(--accent-ice); }
/* a part that receives focus after a jump is not itself a control */
.nsrc main [tabindex="-1"]:focus { outline: none; }
.ns-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* a link inside a sentence */
.nsrc main :is(p, li, div) > a:not([class]) { color: var(--accent-blue-hover); text-decoration: underline; text-decoration-color: rgba(45, 110, 177, .45); text-underline-offset: 3px; transition: color 200ms, text-decoration-color 200ms; }
.nsrc main :is(p, li, div) > a:not([class]):hover { color: var(--accent-blue); text-decoration-color: currentColor; }

.ns-lede { font-size: 18px; line-height: 1.7; color: var(--ink-soft); }

/* the onward link: the arrow leans the way it points */
.ns-go { position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 16px; font-weight: 600; color: var(--accent-blue-hover); text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 5px; transition: color 200ms, text-decoration-color 260ms; }
.ns-go > span[aria-hidden] { display: inline-block; transition: transform 360ms var(--ns-ease); }
.ns-go:hover { color: var(--accent-blue); text-decoration-color: currentColor; }
.ns-go:hover > span[aria-hidden] { transform: translateX(6px); }
.ns-go--back:hover > span[aria-hidden] { transform: translateX(-6px); }

/* native "Read more": a phone's fold. On a wide screen it is simply open. */
.ns-more > summary { display: none; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; list-style: none; font-size: 16px; font-weight: 600; color: var(--accent-blue-hover); transition: color 200ms; }
.ns-more > summary::-webkit-details-marker { display: none; }
.ns-more > summary::after { content: ""; width: 9px; height: 9px; margin-top: -4px; border-right: 2px solid; border-bottom: 2px solid; transform: rotate(45deg); transition: transform 360ms var(--ns-ease); }
.ns-more > summary:hover { color: var(--accent-blue); }
.ns-more > summary:hover::after { transform: translateY(3px) rotate(45deg); }
.ns-more[open] > summary::after { margin-top: 4px; transform: rotate(-135deg); }
.ns-more__shut, .ns-more[open] .ns-more__open { display: none; }
.ns-more[open] .ns-more__shut { display: inline; }

/* another clinic's own mark, as it publishes it: a wordmark sits on the page,
   a square icon keeps its own tile, a mark drawn for a dark page keeps a dark
   ground. The box hugs the mark and does the clipping. */
.ns-mark { display: block; width: fit-content; max-width: 100%; overflow: hidden; }
.ns-mark img[width][height] { display: block; height: 48px; width: auto; max-width: 100%; object-fit: contain; object-position: left center; }
.ns-mark--chip { border-radius: 8px; }
.ns-mark--chip img[width][height] { padding: 12px 16px; background: var(--ink); box-sizing: border-box; }
.ns-mark--sq { border-radius: 10px; }
.ns-mark--sq img[width][height] { width: 48px; }
/* a wordmark is sized by its width; every mark's box is the same height, so a column of them lines up */
.ns-mark--wide img[width][height] { width: 216px; }
.ns-mark--wide img[src*="bioxcellerator"][width][height] { width: 192px; }

/* the small drawings: one stroke weight, one size, everywhere */
.ns-badge { flex: none; width: 48px; height: 48px; border: 1.5px solid var(--border-strong); border-radius: 50%; display: grid; place-items: center; background: #fff; }
.ns-badge svg { display: block; width: 28px; height: 28px; overflow: visible; }
.ns-badge :is(path, rect, circle) { fill: none; stroke: var(--ink); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }

/* ============ REVEALS ============
   Hidden only once the script has said it is running (ns-js on <html>), so
   with no script nothing is ever hidden. Each part comes in its own way. */
.ns-js [data-r] { transition: opacity 620ms ease, transform 820ms var(--ns-ease); }
.ns-js [data-r]:not(.is-in) { opacity: 0; transform: translateY(18px); }
.ns-js [data-r="left"]:not(.is-in) { transform: translateX(-28px); }
.ns-js [data-r="right"]:not(.is-in) { transform: translateX(28px); }
/* these hold still and move their own parts instead */
.ns-js :is([data-r="grp"], [data-r="kinds"], [data-r="status"]):not(.is-in) { opacity: 1; transform: none; }

@keyframes ns-up { from { opacity: 0; transform: translateY(22px); } }
@keyframes ns-fade { from { opacity: 0; } }
@keyframes ns-pop { from { transform: scale(0); opacity: 0; } 70% { transform: scale(1.18); opacity: 1; } }
@keyframes ns-unfold { from { opacity: 0; transform: translateY(-8px); } }
@keyframes ns-found { from { background-color: rgba(45, 110, 177, .2); } to { background-color: rgba(45, 110, 177, .06); } }
@keyframes ns-lead { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes ns-rule { from { transform: scaleY(0); } }
@keyframes ns-turn { from { transform: rotate(-300deg); opacity: 0; } 25% { opacity: 1; } }
@keyframes ns-slide { from { opacity: 0; transform: translateX(-16px); } }
@keyframes ns-nudge { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(5px); } }

/* ============ HERO ============ */
.ns-hero { padding-block: clamp(36px, 5vw, 72px) clamp(48px, 6vw, 88px); }
.ns-hero__h1 { font-family: var(--font-display); font-weight: 300; font-size: clamp(2.1rem, 4.3vw, 3.9rem); line-height: 1.06; letter-spacing: -.015em; color: var(--ink); margin: 0 0 clamp(28px, 4vw, 56px); max-width: none; text-wrap: wrap; }
.ns-hero__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.ns-hero__answer { font-size: clamp(1.12rem, 1.5vw, 1.32rem); line-height: 1.6; color: var(--ink); }
.ns-hero__answer strong { font-weight: 600; }
.ns-back { margin-top: 14px !important; }
.ns-back[hidden] { display: none; }

/* the contents list: a clinic, a leader, and what stands behind it */
.ns-index ol { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border-strong); }
.nsrc main .ns-index__a { position: relative; display: grid; grid-template-columns: 216px minmax(24px, 1fr) auto 22px; align-items: center; column-gap: 18px; min-height: 86px; padding-block: 14px; border-bottom: 1px solid var(--border); color: var(--ink); transition: background-color 240ms, padding 360ms var(--ns-ease); }
.ns-index__lead { --dot: var(--border-strong); height: 3px; background: radial-gradient(circle, var(--dot) 1.2px, transparent 1.5px) 0 50% / 9px 3px repeat-x; }
.ns-index__who { text-align: right; }
.ns-index__name { display: block; font-family: var(--font-display); font-size: 21px; line-height: 1.2; }
.ns-index__n { display: block; margin-top: 2px; font-size: 14px; color: var(--ink-muted); }
.ns-index__go { font-size: 20px; line-height: 1; color: var(--accent-blue); justify-self: end; transition: transform 360ms var(--ns-ease); }
.nsrc main .ns-index__a:hover { background: var(--ns-tint); padding-inline: 12px; }
.ns-index__a:hover .ns-index__lead { --dot: var(--accent-blue); }
.ns-index__a:hover .ns-index__go { transform: translateY(5px); }
/* the comparison the reader has just come from */
.ns-index__a.is-from { box-shadow: inset 3px 0 0 var(--accent-blue); padding-inline: 14px 0; background: var(--ns-tint); }
.ns-index__a.is-from .ns-index__lead { --dot: var(--accent-blue); }
.ns-js .ns-index__a.is-from .ns-index__go { animation: ns-nudge 1400ms var(--ns-ease) 2200ms 2; }

/* first paint: the heading, the answer, then each clinic and the line out to its sources */
.ns-js .ns-hero__h1 > * { animation: ns-up 900ms var(--ns-ease) both; }
.ns-js .ns-hero__h1 > em { animation-delay: 110ms; }
.ns-js .ns-hero__answer { animation: ns-up 900ms var(--ns-ease) 240ms both; }
.ns-js .ns-index ol { animation: ns-fade 500ms ease 300ms both; }
.ns-js .ns-index .ns-mark { animation: ns-slide 700ms var(--ns-ease) calc(420ms + var(--i) * 130ms) both; }
.ns-js .ns-index__lead { animation: ns-lead 800ms var(--ns-ease) calc(700ms + var(--i) * 130ms) both; }
.ns-js .ns-index__who { animation: ns-fade 600ms ease calc(1150ms + var(--i) * 130ms) both; }
.ns-js .ns-index__go { animation: ns-pop 460ms var(--ns-ease) calc(1400ms + var(--i) * 130ms) both; }

/* ============ THE BAR THAT FOLLOWS THE READER ============ */
.nsrc .hc-bar {
  /* under the phone menu's sheet (55) and backdrop (50), over the page */
  position: fixed; left: 0; right: 0; top: var(--hc-nav-h); z-index: 49;
  height: var(--hc-bar-h);
  background: rgba(255, 255, 255, .94);
  -webkit-backdrop-filter: saturate(180%) blur(12px); backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--border);
  transform: translateY(-8px); opacity: 0; visibility: hidden;
  transition: opacity 260ms, transform 360ms var(--ns-ease), visibility 0s 360ms;
}
.nsrc .hc-bar.is-on { transform: none; opacity: 1; visibility: visible; transition: opacity 260ms, transform 360ms var(--ns-ease); }
body.nsrc.nav-open .hc-bar { opacity: 0; visibility: hidden; }
.nsrc .hc-bar__track {
  max-width: calc(1240px + 2 * var(--ns-gut)); margin: 0 auto; padding: 0 var(--ns-gut);
  height: 100%; display: flex; align-items: stretch; gap: clamp(18px, 2.4vw, 32px);
  overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; scroll-padding-inline: 28px;
}
.nsrc .hc-bar__track::-webkit-scrollbar { display: none; }
.nsrc .hc-bar__track a {
  position: relative; flex: none; display: flex; align-items: center; justify-content: center; min-width: 44px;
  font-size: 14px; font-weight: 500; color: var(--ink-muted); white-space: nowrap;
  border-bottom: 0; transition: color 200ms;
}
.nsrc .hc-bar__track a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: var(--accent-blue); transform: scaleX(0); transform-origin: left;
  transition: transform 360ms var(--ns-ease);
}
.nsrc .hc-bar__track a:hover, .nsrc .hc-bar__track a[aria-current] { color: var(--ink); }
.nsrc .hc-bar__track a:hover::after { transform: scaleX(.35); }
.nsrc .hc-bar__track a[aria-current]::after { transform: scaleX(1); }
.nsrc .hc-bar__track a:focus-visible { outline: 2px solid var(--accent-blue); outline-offset: -4px; border-radius: 4px; }
/* the clinic whose comparison the reader came from keeps a mark as the bar follows them */
.nsrc .hc-bar__track a.is-from { padding-left: 13px; }
.nsrc .hc-bar__track a.is-from::before { content: ""; position: absolute; left: 0; top: 50%; width: 7px; height: 7px; margin-top: -3.5px; border-radius: 50%; background: var(--accent-blue); }
/* the four clinics, then the rest of the page */
.nsrc .hc-bar__track a.hc-bar__rest { margin-left: clamp(8px, 1.6vw, 24px); }
.nsrc .hc-bar__track a.hc-bar__rest::before { content: ""; position: absolute; left: calc(-1 * clamp(13px, 2vw, 28px)); top: 16px; bottom: 16px; border-left: 1px solid var(--border-strong); }
.nsrc .hc-bar__progress {
  position: absolute; left: 0; top: 0; height: 2px; width: 100%;
  background: var(--accent-ice); transform-origin: left; transform: scaleX(var(--hc-p, 0));
}

/* ============ THE LEDGER ============ */
.ns-led { padding-block: var(--ns-pad); border-top: 1px solid var(--border); }
.ns-led__intro { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 16px clamp(32px, 5vw, 88px); margin-top: clamp(20px, 3vw, 36px); }
.ns-led__intro p { font-size: 17px; line-height: 1.7; color: var(--ink-soft); }
.ns-heads, .ns-grp { display: grid; grid-template-columns: 284px minmax(0, 1fr); column-gap: clamp(24px, 3.4vw, 56px); }
.ns-heads__r, .ns-row { display: grid; grid-template-columns: 48px minmax(0, 5fr) minmax(0, 6fr) 24px; column-gap: 20px; }
.ns-heads { margin-top: clamp(32px, 4vw, 56px); padding-bottom: 12px; border-bottom: 2px solid var(--ink); font-size: 14px; font-weight: 500; color: var(--ink-muted); }
.ns-grp { position: relative; padding-block: 30px 28px; border-bottom: 1px solid var(--border-strong); scroll-margin-top: 4px; }
.nsrc main .ns-grp h3 { font-family: var(--font-display); font-weight: 400; font-size: 27px; line-height: 1.2; margin-top: 16px; }
.ns-grp__where { margin-top: 4px !important; font-size: 15px; line-height: 1.5; color: var(--ink-soft); }
.ns-grp__n { margin-top: 2px !important; font-size: 14px; line-height: 1.5; color: var(--ink-muted); }
.ns-grp__head .ns-go { margin-top: 6px; font-size: 15px; }
.ns-rows { list-style: none; margin: -14px 0 0; padding: 0; }
/* on a wide screen a clinic's sources are simply there; a phone folds them under their count */
.ns-fold > summary { display: none; list-style: none; }
.ns-fold > summary::-webkit-details-marker { display: none; }
.ns-row { position: relative; align-items: start; padding: 16px 12px 18px; margin-inline: -12px; border-radius: 10px; scroll-margin-top: 12px; transition: background-color 240ms; }
.ns-row + .ns-row::before { content: ""; position: absolute; left: 12px; right: 12px; top: 0; border-top: 1px solid var(--border); }
.ns-row__src { font-size: 15px; line-height: 1.5; color: var(--ink-soft); overflow-wrap: anywhere; }
.ns-row__src strong { display: block; font-family: var(--font-display); font-weight: 400; font-size: 21px; line-height: 1.25; color: var(--ink); margin-bottom: 3px; overflow-wrap: normal; }
.ns-row__use { padding-top: 3px; }
.ns-row__use p { font-size: 16px; line-height: 1.6; color: var(--ink); }
.ns-row__out { align-self: start; margin-top: 6px; width: 22px; height: 22px; color: var(--accent-blue); transition: transform 360ms var(--ns-ease); }
.ns-row__out svg { display: block; width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* a row with one link is that link, edge to edge */
.ns-row--link .ns-row__src a::after { content: ""; position: absolute; inset: 0; border-radius: 10px; }
.nsrc main .ns-row--link .ns-row__src a:focus-visible { outline: none; }
.ns-row--link .ns-row__src a:focus-visible::after { outline: 2px solid var(--accent-blue); outline-offset: -2px; }
.ns-row--link:hover { background: var(--ns-tint); }
.ns-row--link:hover .ns-row__out { transform: translate(3px, -3px); }
.ns-row--link:hover .ns-badge { border-color: var(--accent-blue); }
.ns-row--link .ns-badge { transition: border-color 240ms; }
/* the row or the clinic a link has just brought the reader to */
.ns-row.is-target, html:not(.ns-js) .ns-row:target { background-color: var(--ns-tint); box-shadow: inset 3px 0 0 var(--accent-blue); animation: ns-found 1800ms ease both; }
.ns-grp.is-target::after, html:not(.ns-js) .ns-grp:target::after { content: ""; position: absolute; left: -16px; top: 30px; bottom: 28px; width: 3px; border-radius: 2px; background: var(--accent-blue); transform-origin: top; animation: ns-rule 700ms var(--ns-ease) both; }
/* a clinic's rows come in one after another, and each drawing draws itself */
.ns-js [data-r="grp"] .ns-grp__head { transition: opacity 620ms ease, transform 820ms var(--ns-ease); }
.ns-js [data-r="grp"]:not(.is-in) .ns-grp__head { opacity: 0; transform: translateX(-24px); }
.ns-js [data-r="grp"] .ns-row { transition: opacity 560ms ease calc(120ms + var(--i) * 110ms), transform 760ms var(--ns-ease) calc(120ms + var(--i) * 110ms), background-color 240ms; }
.ns-js [data-r="grp"]:not(.is-in) .ns-row { opacity: 0; transform: translateY(14px); }
.ns-js [data-r="grp"] .ns-badge :is(path, rect, circle) { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 900ms var(--ns-ease) calc(260ms + var(--i) * 110ms); }
.ns-js [data-r="grp"].is-in .ns-badge :is(path, rect, circle) { stroke-dashoffset: 0; }

/* ============ THE RULE, AND THE KINDS OF SOURCE ============ */
.ns-std { padding-block: var(--ns-pad); }
.ns-std__grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(28px, 4vw, 56px) clamp(32px, 5vw, 88px); align-items: start; }
.ns-std__grid > h2 { grid-column: 1 / -1; }
.ns-std__text p { font-size: 18px; line-height: 1.7; color: var(--ink-soft); }
.ns-std__text p + p { margin-top: 18px !important; }
.ns-std__text strong { color: var(--ink); font-weight: 600; }
.nsrc main .ns-kinds h3 { font-family: var(--font-body); font-size: 17px; line-height: 1.4; font-weight: 600; letter-spacing: 0; }
.ns-kinds ul { list-style: none; margin: 14px 0 0; padding: 0; border-top: 2px solid var(--ink); }
.ns-kinds li { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; column-gap: 18px; align-items: center; padding-block: 16px; border-bottom: 1px solid var(--border); }
.ns-kinds .ns-badge { width: 56px; height: 56px; }
.ns-kinds .ns-badge svg { width: 32px; height: 32px; }
.ns-kinds b { display: block; font-family: var(--font-display); font-weight: 400; font-size: 21px; line-height: 1.25; color: var(--ink); }
.ns-kinds small { display: block; margin-top: 2px; font-size: 15px; line-height: 1.5; color: var(--ink-soft); }
.ns-kinds i { font-style: normal; font-size: 14px; font-weight: 500; color: var(--ink-muted); }
.ns-js [data-r="kinds"] li { transition: opacity 560ms ease calc(var(--i) * 130ms), transform 760ms var(--ns-ease) calc(var(--i) * 130ms); }
.ns-js [data-r="kinds"]:not(.is-in) li { opacity: 0; transform: translateY(14px); }
.ns-js [data-r="kinds"] .ns-badge :is(path, rect, circle) { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1000ms var(--ns-ease) calc(200ms + var(--i) * 130ms); }
.ns-js [data-r="kinds"].is-in .ns-badge :is(path, rect, circle) { stroke-dashoffset: 0; }

/* ============ WHAT WE DO, AND WHAT WE DON'T ============ */
.ns-rules { padding-block: var(--ns-pad); border-top: 1px solid var(--border); }
.ns-rules > .ns-wrap > .ns-lede { margin-top: clamp(16px, 2vw, 24px) !important; }
.ns-pairs { margin-top: clamp(36px, 5vw, 64px); }
.ns-pairs__heads, .ns-pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: clamp(32px, 5vw, 88px); }
.ns-pairs__head { display: flex; align-items: center; gap: 14px; font-size: 17px; font-weight: 600; color: var(--ink); padding-bottom: 18px; }
.ns-tick { flex: none; width: 48px; height: 48px; }
.ns-tick svg { display: block; width: 100%; height: 100%; }
.ns-tick :is(circle, path) { fill: none; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; stroke: var(--accent-blue); }
.ns-pairs__head--dont .ns-tick :is(circle, path) { stroke: var(--ink-muted); }
.ns-js .ns-pairs__heads .ns-tick path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 700ms var(--ns-ease) 300ms; }
.ns-js .ns-pairs.is-seen .ns-tick path { stroke-dashoffset: 0; }
.ns-js .ns-pairs.is-seen .ns-tick path + path { transition-delay: 520ms; }
.ns-rule { padding: 22px 0 26px 20px; border-top: 1px solid var(--border); border-left: 3px solid var(--accent-blue); }
.ns-rule--dont { border-left-color: var(--border-strong); }
.nsrc main .ns-rule h3 { font-family: var(--font-display); font-weight: 400; font-size: 23px; line-height: 1.25; margin-bottom: 8px; }
.ns-rule p { font-size: 16px; line-height: 1.65; color: var(--ink-soft); }
.ns-js .ns-rule--dont[data-r] { transition-delay: 120ms; }

/* ============ LIMITS, AND WHEN WE CHECK ============ */
.ns-limits { padding-block: var(--ns-pad); border-top: 1px solid var(--border); }
.ns-limits__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 56px) clamp(32px, 5vw, 88px); align-items: start; }
.ns-limits__grid > :is(h2, .ns-lede) { grid-column: 1 / -1; }
.ns-limits__grid > .ns-lede { margin-top: calc(-1 * clamp(12px, 2vw, 24px)) !important; }
.nsrc main .ns-limits__h3 { font-family: var(--font-body); font-size: 17px; line-height: 1.4; font-weight: 600; letter-spacing: 0; }
.ns-limits__list { list-style: none; margin: 14px 0 0; padding: 0; border-top: 2px solid var(--ink); }
.ns-limits__list li { padding-block: 22px; border-bottom: 1px solid var(--border); font-size: 17px; line-height: 1.7; color: var(--ink-soft); }
.ns-limits__list strong { display: block; font-family: var(--font-display); font-weight: 400; font-size: 24px; line-height: 1.25; color: var(--ink); margin-bottom: 6px; }
.ns-js .ns-limits__list li:nth-child(2) { transition-delay: 110ms; }
.ns-status { background: var(--accent-wash); border-radius: var(--radius-lg); padding: clamp(24px, 3vw, 40px); scroll-margin-top: 12px; }
.ns-cal { margin: 0 0 22px; width: 148px; }
.ns-cal svg { display: block; width: 100%; height: auto; overflow: visible; }
.ns-cal :is(rect, path, circle) { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ns-cal rect.ns-cal__body { fill: #fff; }
.ns-cal .ns-cal__m rect { stroke: var(--border-strong); stroke-width: 1.6; transform-box: fill-box; transform-origin: center; }
/* the month the sources were last checked */
.ns-cal .ns-cal__m rect.is-may { fill: var(--accent-blue); stroke: var(--accent-blue); }
.ns-cal .ns-cal__disc { fill: var(--ink); stroke: var(--accent-wash); stroke-width: 4; }
.ns-cal .ns-cal__turn { transform-box: view-box; transform-origin: 140px 128px; }
.ns-cal .ns-cal__turn path { stroke: #fff; stroke-width: 2.4; }
.ns-js [data-r="status"]:not(.is-in) :is(.ns-cal__m rect, .ns-cal__turn) { opacity: 0; }
.ns-js [data-r="status"].is-in .ns-cal__m rect { animation: ns-pop 380ms var(--ns-ease) calc(150ms + var(--i) * 70ms) both; }
.ns-js [data-r="status"].is-in .ns-cal__turn { animation: ns-turn 1400ms var(--ns-ease) 1100ms both; }
.nsrc main .ns-status h3 { font-family: var(--font-display); font-weight: 300; font-size: clamp(1.5rem, 2.4vw, 2.1rem); line-height: 1.15; margin-bottom: 14px; }
.ns-status p { font-size: 17px; line-height: 1.7; color: var(--ink-soft); }
.ns-status p + p { margin-top: 14px !important; }
.ns-status strong { color: var(--ink); font-weight: 600; }

/* ============ THE SHORT VERSION ============ */
.ns-end { background: var(--ink); color: #fff; padding-block: var(--ns-pad); }
.ns-end__grid { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.ns-seal { margin: 0; }
.ns-seal svg { display: block; width: 100%; height: auto; overflow: visible; }
.ns-seal :is(path, rect, circle) { fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ns-seal .ns-seal__text path { stroke: rgba(255, 255, 255, .4); stroke-width: 5; }
.ns-seal .ns-seal__disc { fill: var(--ink); stroke: var(--accent-ice); }
.ns-seal .ns-seal__check { stroke: var(--accent-ice); stroke-width: 3; }
/* the sheet is drawn, its lines are written, and then it is checked */
.ns-js .ns-end .ns-seal__page { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1100ms var(--ns-ease); }
.ns-js .ns-end .ns-seal__text path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 700ms var(--ns-ease) calc(500ms + var(--i) * 120ms); }
.ns-js .ns-end .ns-seal__disc { transform-box: fill-box; transform-origin: center; transform: scale(0); transition: transform 520ms var(--ns-ease) 1200ms; }
.ns-js .ns-end .ns-seal__check { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 600ms var(--ns-ease) 1550ms; }
.ns-js .ns-end.is-seen :is(.ns-seal__page, .ns-seal__text path, .ns-seal__check) { stroke-dashoffset: 0; }
.ns-js .ns-end.is-seen .ns-seal__disc { transform: none; }
.nsrc main .ns-end h2 { color: #fff; font-size: clamp(1.9rem, 3vw, 2.7rem); }
.nsrc main .ns-end h2 > em { color: var(--accent-ice); }
.nsrc main .ns-end__label { font-size: 15px; line-height: 1.4; font-weight: 500; color: rgba(255, 255, 255, .76); margin-bottom: 10px; }
.ns-end__text p:not(.ns-end__label) { font-size: 18px; line-height: 1.7; color: rgba(255, 255, 255, .82); margin-top: 18px !important; }

/* ============ THE COMPARISONS, AND THE WAY BACK UP ============ */
.ns-on { padding-block: var(--ns-pad); }
.ns-on__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 1.8vw, 24px); margin-top: clamp(28px, 4vw, 48px); }
/* each card is one link: the link at its foot is stretched over it */
.ns-card { position: relative; display: grid; grid-template-rows: subgrid; grid-row: span 4; row-gap: 0; padding: clamp(20px, 2vw, 28px); border: 1px solid var(--border); border-radius: 8px; background: #fff; transition: border-color 260ms, box-shadow 420ms var(--ns-ease), transform 420ms var(--ns-ease); }
.ns-card:hover, .ns-card:focus-within { border-color: var(--accent-blue); box-shadow: 0 18px 40px -26px rgba(11, 29, 58, .4); transform: translateY(-3px); }
.ns-card .ns-mark { margin-bottom: 18px; }
.nsrc main .ns-card h3 { font-family: var(--font-display); font-weight: 400; font-size: 23px; line-height: 1.2; }
.ns-card p { margin-top: 8px !important; font-size: 16px; line-height: 1.6; color: var(--ink-soft); }
.ns-card .ns-go { align-self: end; justify-self: start; margin: 10px 0 -8px; font-size: 15px; position: static; }
.ns-card .ns-go::after { content: ""; position: absolute; inset: 0; border-radius: 8px; }
.nsrc main .ns-card .ns-go:focus-visible { outline: none; }
.ns-card .ns-go:focus-visible::after { outline: 2px solid var(--accent-blue); outline-offset: 2px; }
.ns-card:hover .ns-go { color: var(--accent-blue); text-decoration-color: currentColor; }
.ns-card:hover .ns-go > span[aria-hidden] { transform: translateX(6px); }
.ns-js .ns-on__grid .ns-card[data-r] { transition: opacity 620ms ease calc(var(--i) * 90ms), transform 820ms var(--ns-ease) calc(var(--i) * 90ms), border-color 260ms, box-shadow 420ms var(--ns-ease); }
.ns-js .ns-on__grid .ns-card[data-r].is-done { transition: border-color 260ms, box-shadow 420ms var(--ns-ease), transform 420ms var(--ns-ease); }
.ns-on__up { display: flex; flex-wrap: wrap; gap: 4px 36px; margin-top: clamp(24px, 3vw, 40px); padding-top: 16px; border-top: 1px solid var(--border); }
@supports not (grid-template-rows: subgrid) {
  .ns-card { display: flex; flex-direction: column; }
  .ns-card .ns-go { margin-top: auto; }
}

/* ============ NARROWER ============ */
@media (max-width: 1180px) {
  .ns-heads, .ns-grp { grid-template-columns: 236px minmax(0, 1fr); }
  .ns-mark--wide img[width][height] { width: 200px; }
  .ns-mark--wide img[src*="bioxcellerator"][width][height] { width: 176px; }
  .nsrc main .ns-index__a { grid-template-columns: 200px minmax(16px, 1fr) auto 22px; }
}
@media (max-width: 1000px) {
  .nsrc .hc-bar__track { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(90deg, transparent 0, #000 16px, #000 calc(100% - 28px), transparent); }
  .ns-hero__grid, .ns-std__grid, .ns-limits__grid { grid-template-columns: minmax(0, 1fr); }
  .ns-limits__grid > .ns-lede { margin-top: -8px !important; }
}
@media (max-width: 820px) {
  .ns-led__intro, .ns-end__grid { grid-template-columns: minmax(0, 1fr); }

  /* the ledger: a clinic, then its sources as a list; each row says what it is used for */
  .ns-heads { display: none; }
  .ns-led__groups { border-top: 2px solid var(--ink); margin-top: 28px; }
  .ns-grp { grid-template-columns: minmax(0, 1fr); padding-block: 26px 4px; }
  .ns-grp__n { display: none; }
  .ns-fold > summary { display: flex; align-items: center; justify-content: space-between; min-height: 48px; margin-top: 6px; padding-right: 6px; cursor: pointer; font-size: 16px; font-weight: 600; color: var(--accent-blue-hover); border-top: 1px solid var(--border); transition: color 200ms; }
  .ns-fold > summary::after { content: ""; width: 9px; height: 9px; margin-top: -4px; border-right: 2px solid; border-bottom: 2px solid; transform: rotate(45deg); transition: transform 360ms var(--ns-ease); }
  .ns-fold > summary:hover { color: var(--accent-blue); }
  .ns-fold > summary:hover::after { transform: translateY(3px) rotate(45deg); }
  .ns-fold[open] > summary::after { margin-top: 4px; transform: rotate(-135deg); }
  .ns-js .ns-fold[open] > .ns-rows { animation: ns-unfold 420ms var(--ns-ease); }
  .ns-rows { margin-top: 0; border-top: 1px solid var(--border); }
  .ns-row { grid-template-columns: 48px minmax(0, 1fr) 22px; column-gap: 14px; padding: 16px 10px 18px; margin-inline: -10px; }
  .ns-row .ns-badge { grid-row: 1 / span 2; }
  .ns-row__src { grid-column: 2; }
  .ns-row__out { grid-column: 3; grid-row: 1; }
  .ns-row__use { grid-column: 2 / -1; padding-top: 10px; }
  .ns-row__use .ns-sr { position: static; display: block; width: auto; height: auto; margin: 0 0 1px; clip-path: none; font-size: 14px; color: var(--ink-muted); }
  .ns-row + .ns-row::before { left: 10px; right: 10px; }
  .ns-grp.is-target::after, html:not(.ns-js) .ns-grp:target::after { left: -11px; top: 26px; bottom: auto; height: 132px; }

  /* the two columns become one list; each rule says which kind it is */
  .ns-pairs__heads { column-gap: 16px; }
  .ns-pairs__head { font-size: 15px; gap: 10px; }
  .ns-pair { grid-template-columns: minmax(0, 1fr); }
  .ns-rule h3::before { content: ""; display: inline-block; width: 18px; height: 18px; margin-right: 10px; vertical-align: -1px; background: var(--accent-blue); -webkit-mask: var(--ns-glyph) center / contain no-repeat; mask: var(--ns-glyph) center / contain no-repeat; }
  .ns-rule--do { --ns-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5.5 5.5L20 6.5'/%3E%3C/svg%3E"); }
  .ns-rule--dont { --ns-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E"); }
  .ns-rule--dont h3::before { background: var(--ink-muted); }
  .ns-js .ns-rule[data-r]:not(.is-in) { transform: translateY(18px); }
  .ns-more > summary { display: inline-flex; margin-top: 8px; }
  .ns-js .ns-more[open] > :not(summary) { animation: ns-unfold 420ms var(--ns-ease); }

  .ns-seal { width: 112px; }
  .ns-cal { width: 124px; }
}
@media (max-width: 640px) {
  .ns-on__grid { grid-template-columns: minmax(0, 1fr); }
  /* the contents list: the mark on its own line, then who it is and how many */
  .nsrc main .ns-index__a { grid-template-columns: minmax(0, 1fr) 22px; row-gap: 10px; padding-block: 16px; }
  .ns-index__lead { display: none; }
  .ns-index .ns-mark { grid-column: 1 / -1; }
  .ns-index__who { text-align: left; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
  .ns-index__name { font-size: 20px; }
  .ns-kinds li { grid-template-columns: 48px minmax(0, 1fr); column-gap: 14px; }
  .ns-kinds .ns-badge { width: 48px; height: 48px; grid-row: 1 / span 2; align-self: start; }
  .ns-kinds .ns-badge svg { width: 28px; height: 28px; }
  .ns-kinds i { grid-column: 2; margin-top: 4px; }
}
@media (max-width: 560px) {
  html:has(body.nsrc) { --hc-bar-h: 48px; }
  .nsrc .hc-bar__track { gap: 22px; }
}

/* ============ STILL ============
   Reduced motion: every drawing holds its finished state and nothing moves. */
@media (prefers-reduced-motion: reduce) {
  .nsrc main *, .nsrc main *::before, .nsrc main *::after { animation: none !important; transition: none !important; }
  .ns-js [data-r]:not(.is-in), .ns-js [data-r]:not(.is-in) :is(.ns-grp__head, .ns-row, li) { opacity: 1 !important; transform: none !important; }
  .ns-js :is(.ns-badge, .ns-tick, .ns-seal) :is(path, rect, circle) { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }
  .ns-js .ns-end .ns-seal__disc { transform: none !important; }
  .ns-js :is(.ns-cal__m rect, .ns-cal__turn) { opacity: 1 !important; }
  .nsrc .hc-bar { transition: none !important; }
  .ns-go:hover > span[aria-hidden], .ns-index__a:hover .ns-index__go, .ns-row--link:hover .ns-row__out, .ns-card:hover { transform: none; }
}
@media print {
  .nsrc .hc-bar, .ns-back, .ns-index__go, .ns-row__out, .ns-more > summary, .ns-fold > summary { display: none !important; }
  .ns-grp__n { display: block !important; }
  .ns-js [data-r], .ns-js [data-r] * { opacity: 1 !important; transform: none !important; animation: none !important; transition: none !important; }
  .ns-js :is(.ns-badge, .ns-tick, .ns-seal) :is(path, rect, circle) { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }
  .ns-js .ns-hero *, .ns-js .ns-index * { animation: none !important; clip-path: none !important; }
  .ns-hero, .ns-led, .ns-std, .ns-rules, .ns-limits, .ns-end, .ns-on { padding-block: 22px; }
  .ns-end { background: #fff; color: var(--ink); border-top: 1px solid var(--border); }
  .nsrc main .ns-end :is(h2, p, em) { color: var(--ink) !important; }
  .ns-seal, .ns-cal { display: none; }
  .ns-status { background: none; padding: 0; }
  .ns-row, .ns-row.is-target { background: none !important; box-shadow: none !important; }
  .ns-grp.is-target::after { content: none; }
  /* on paper a link is its address */
  .ns-row__src a[href^="http"]::before { content: none; }
  .ns-row__src a[href^="http"] { text-decoration: none !important; }
  .ns-row__src a[href^="http"]::after { content: " (" attr(href) ")"; position: static !important; font-size: 13px; color: var(--ink-soft); }
  /* a source is never split across two sheets, and a clinic's name stays with its rows */
  .ns-row, .ns-rule, .ns-kinds li, .ns-limits__list li, .ns-card, .ns-status { break-inside: avoid; }
  .ns-grp__head, .nsrc main :is(h2, h3) { break-after: avoid; }
  .ns-on__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Paper is taken the instant the print dialog opens: nothing may still be fading or sliding in. */
@media print {
  main *, main *::before, main *::after { animation: none !important; transition: none !important; }
}
