/* /learn-why-leave-us, the section page for "Why patients leave the U.S.".
   Loaded after site.css by learn-why-leave-us.html only. The page's idea is a
   line you are on one side of: a border crossed once in the hero, one dashed
   line down the four rules with what is allowed on its left and what is not
   on its right, two roads to the same vial, four figures drawn to scale, three
   vials that hold what their paragraphs say, five links out, five refusals
   struck through. Every part holds its end state with scripts off, reduced
   motion and print. */

/* On the root, because scroll-padding-top (below) is read there. */
html:has(body.why-leave) {
  --lv-max: 1240px;
  --lv-gut: clamp(20px, 4vw, 56px);
  --hc-nav-h: 64px;            /* fallback; scripts/learn-why-leave-us.js sets the real header height */
  --hc-bar-h: 52px;
  --lv-ease: cubic-bezier(.16, 1, .3, 1);
  /* 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) + 20px);
}
body.why-leave { background: var(--white); }

/* colors_and_type.css caps every bare <p> at 42rem and underlines every <a> */
.why-leave main { overflow-x: clip; }
.why-leave main p { max-width: none; }
.why-leave main a:not(.btn) { border-bottom: 0; }
.why-leave main :is(h1, h2, h3) { text-wrap: wrap; margin: 0; }
/* a heading that has to wrap breaks where the styling changes */
.why-leave .h-lead, .why-leave main h1 > em { display: inline-block; text-wrap: balance; }
.why-leave main h1 > em { color: var(--accent-blue); font-style: italic; }
.why-leave main h2 {
  font-size: clamp(1.9rem, 3.1vw, 2.85rem); line-height: 1.1; font-weight: 300;
  margin: 0 0 clamp(20px, 2.6vw, 36px);
}
.lv-wrap { max-width: var(--lv-max); margin: 0 auto; padding: 0 var(--lv-gut); }

/* a part that receives focus after a jump is not itself a control */
.why-leave main [tabindex="-1"]:focus { outline: none; }
.why-leave main :is(a, summary):focus-visible { outline: 2px solid var(--accent-blue); outline-offset: 3px; border-radius: 3px; }
.why-leave .lv-numbers a:focus-visible { outline-color: var(--accent-ice); }

/* the static twin of a number that counts up, for a screen reader */
.lv-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* a glossary term: dotted, so it reads as something to look up */
.lv-term, .lv-ref {
  color: inherit; text-decoration: underline; text-decoration-style: dotted;
  text-decoration-color: var(--accent-blue); text-underline-offset: 3px; text-decoration-thickness: 1.5px;
  padding-block: 6px; transition: color 200ms, text-decoration-color 200ms;
}
/* a link to another page or another part: solid, in the accent */
.lv-ref { color: var(--accent-blue-hover); text-decoration-style: solid; }
:is(.lv-term, .lv-ref):hover { color: var(--accent-blue); text-decoration-style: solid; }
.lv-numbers .lv-term { text-decoration-color: var(--accent-ice); }
.lv-numbers .lv-term:hover { color: var(--accent-ice); }

/* a glossary term explains itself: its plain definition, from the glossary, beside the word */
.lv-peek {
  position: fixed; z-index: 60; width: min(340px, calc(100vw - 24px)); box-sizing: border-box; padding: 14px 16px 15px;
  background: var(--ink); color: rgba(255, 255, 255, .92); border-radius: 6px; box-shadow: 0 12px 32px rgba(11, 29, 58, .22);
  font-family: var(--font-body); font-size: 14.5px; line-height: 1.55; animation: lv-peek 220ms var(--lv-ease) both;
}
.lv-peek[hidden] { display: none; }
.lv-peek strong { display: block; margin-bottom: 4px; font-family: var(--font-display); font-weight: 400; font-size: 1.15rem; line-height: 1.2; color: var(--white); }
@keyframes lv-peek { from { opacity: 0; transform: translateY(4px); } }

/* "you are here": a short rule drawn under the heading a jump arrives at */
.why-leave main h2.lv-here { position: relative; }
.why-leave main h2.lv-here::after {
  content: ""; position: absolute; left: 0; bottom: -10px; width: 72px; height: 2px; background: var(--accent-blue);
  transform-origin: left; animation: lv-here 2200ms var(--lv-ease) both;
}
.why-leave .lv-numbers h2.lv-here::after { background: var(--accent-ice); }
@keyframes lv-here { 0% { transform: scaleX(0); opacity: 1; } 30%, 75% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1); opacity: 0; } }

/* the arrow on a button leans the way it points */
.lv-arr { display: inline-block; transition: transform 320ms var(--lv-ease); }
a:hover > .lv-arr, a:focus-visible > .lv-arr { transform: translateX(4px); }
a:hover > .lv-arr--down, a:focus-visible > .lv-arr--down { transform: translateY(4px); }

/* ============ HERO: the question, its answer, and one flight ============
   Pure CSS, from the first paint: the question rises in two halves, the
   answer follows, the ground is drawn, the house and the hospital stand up
   on it, and one plane leaves the house, crosses the border and comes down
   at the hospital, whose cross answers. Then the contents step in. */
.lv-hero { padding: clamp(20px, 3.4vw, 40px) 0 clamp(48px, 6vw, 80px); }
.lv-hero__h1 { font-size: clamp(2.2rem, 3.9vw, 3.5rem); line-height: 1.06; font-weight: 300; }
.lv-hero__h1 > * { animation: lv-rise 900ms var(--lv-ease) both; }
.lv-hero__h1 > em { animation-delay: 140ms; }
.lv-hero__row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(24px, 4vw, 64px);
  align-items: end; margin-top: clamp(22px, 3vw, 40px);
}
.lv-hero__row > * { animation: lv-rise 900ms var(--lv-ease) both; }
.lv-hero__answer {
  margin: 0; font-family: var(--font-display); font-weight: 300;
  font-size: clamp(1.28rem, 1.85vw, 1.62rem); line-height: 1.38; color: var(--ink);
  animation-delay: 260ms;
}
.lv-hero__actions { animation-delay: 400ms; }

.lv-horizon {
  --lv-tilt: 20deg;
  position: relative; height: clamp(124px, 15vw, 196px); margin-top: clamp(28px, 4vw, 52px);
}
/* the ground, which is also the rule the contents hang from */
.lv-horizon::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--ink);
  transform-origin: left; animation: lv-rule 1100ms 500ms var(--lv-ease) both;
}
.lv-horizon svg { display: block; overflow: visible; }
.lv-horizon :is(.lv-horizon__home, .lv-horizon__hosp) { position: absolute; bottom: 0; height: auto; }
.lv-horizon :is(.lv-horizon__home, .lv-horizon__hosp) path { fill: var(--white); stroke: var(--ink); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.lv-horizon__home { left: 4%; width: clamp(44px, 5.4vw, 72px); animation: lv-up 900ms 760ms var(--lv-ease) both; }
.lv-horizon__hosp { right: 4%; width: clamp(58px, 7vw, 92px); animation: lv-up 900ms 980ms var(--lv-ease) both; }
.lv-horizon .lv-horizon__hosp .lv-horizon__cross {
  fill: none; stroke: var(--accent-blue); stroke-width: 4.5;
  transform-box: fill-box; transform-origin: center; animation: lv-beat 800ms 3900ms ease-in-out both;
}
.lv-horizon__border {
  position: absolute; left: 50%; bottom: 0; height: 96%; width: 0; border-left: 2px dashed var(--border-strong);
  transform-origin: bottom; animation: lv-drop 800ms 900ms var(--lv-ease) both;
}
/* the sky the plane crosses: from the house's roof to the hospital's */
.lv-horizon__sky { position: absolute; left: 7%; right: 8.5%; top: 9%; bottom: 33%; container-type: size; }
.lv-horizon__trail { width: 100%; height: 100%; animation: lv-wipe 2600ms 1300ms linear both; }
.lv-horizon__trail path { fill: none; stroke: var(--ink-muted); stroke-width: 1.8; stroke-linecap: round; stroke-dasharray: 1 8; }
/* at rest (reduced motion, print) the plane is over the border, mid-flight */
.lv-plane { position: absolute; left: 0; bottom: 0; width: 0; height: 0; transform: translateX(50cqw); animation: lv-fly-x 2600ms 1300ms linear both; }
.lv-plane__lift { display: block; transform: translateY(-100cqh); animation: lv-fly-y 2600ms 1300ms both; }
.lv-plane svg { width: 30px; height: 30px; margin: -15px 0 0 -15px; animation: lv-fly-r 2600ms 1300ms linear both; }
.lv-plane path { fill: var(--accent-blue); }

/* Contents: the page's own headings, as links. */
.lv-toc__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(24px, 4vw, 64px);
}
.lv-toc__list li { animation: lv-rise 800ms var(--lv-ease) both; animation-delay: calc(1100ms + var(--i, 0) * 70ms); }
.lv-toc__list li:nth-child(2) { --i: 1; } .lv-toc__list li:nth-child(3) { --i: 2; } .lv-toc__list li:nth-child(4) { --i: 3; }
.lv-toc__list li:nth-child(5) { --i: 4; } .lv-toc__list li:nth-child(6) { --i: 5; }
.lv-toc__list a {
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px;
  min-height: 44px; padding: 15px 0; border-bottom: 1px solid var(--border);
  font-family: var(--font-display); font-size: clamp(1.12rem, 1.45vw, 1.3rem); line-height: 1.25; color: var(--ink);
  transition: color 220ms, padding 320ms var(--lv-ease);
}
.lv-toc__list a::after {
  content: "\2193"; flex: none; font-family: var(--font-body); font-size: 18px; color: var(--accent-blue);
  opacity: .35; transform: translateY(-4px); transition: transform 320ms var(--lv-ease), opacity 220ms;
}
.lv-toc__list a:hover, .lv-toc__list a:focus-visible { color: var(--accent-blue); padding-left: 8px; }
.lv-toc__list a:hover::after, .lv-toc__list a:focus-visible::after { opacity: 1; transform: translateY(2px); }

@keyframes lv-rise { from { opacity: 0; transform: translateY(18px); } }
@keyframes lv-rule { from { transform: scaleX(0); } }
@keyframes lv-up { from { opacity: 0; transform: translateY(22px); } }
@keyframes lv-drop { from { transform: scaleY(0); } }
@keyframes lv-beat { 50% { transform: scale(1.35); } }
@keyframes lv-wipe { from { clip-path: inset(-20px 100% -20px 0); } to { clip-path: inset(-20px 0 -20px 0); } }
@keyframes lv-fly-x { 0% { transform: translateX(0); opacity: 0; } 5%, 93% { opacity: 1; } 100% { transform: translateX(100cqw); opacity: 0; } }
/* a parabola: quadratic ease-out up to the top, quadratic ease-in back down */
@keyframes lv-fly-y {
  0% { transform: translateY(0); animation-timing-function: cubic-bezier(.333, .667, .667, 1); }
  50% { transform: translateY(-100cqh); animation-timing-function: cubic-bezier(.333, 0, .667, .333); }
  100% { transform: translateY(0); }
}
@keyframes lv-fly-r { from { transform: rotate(calc(var(--lv-tilt) * -1)); } to { transform: rotate(var(--lv-tilt)); } }

/* ============ CONTENTS BAR (follows the reader) ============ */
.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(--lv-ease), visibility 0s 360ms;
}
.hc-bar.is-on { transform: none; opacity: 1; visibility: visible; transition: opacity 260ms, transform 360ms var(--lv-ease); }
body.nav-open .hc-bar { opacity: 0; visibility: hidden; }
.hc-bar__track {
  max-width: var(--lv-max); margin: 0 auto; padding: 0 var(--lv-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;
}
.hc-bar__track::-webkit-scrollbar { display: none; }
.hc-bar__track a {
  position: relative; flex: none; display: flex; align-items: center;
  font-size: 14px; font-weight: 500; color: var(--ink-muted); white-space: nowrap; transition: color 200ms;
}
.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(--lv-ease);
}
.hc-bar__track a:hover, .hc-bar__track a[aria-current] { color: var(--ink); }
.hc-bar__track a:hover::after { transform: scaleX(.3); }
.hc-bar__track a[aria-current]::after { transform: scaleX(1); }
.why-leave .hc-bar__track a:focus-visible { outline: 2px solid var(--accent-blue); outline-offset: -4px; border-radius: 4px; }
.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 FOUR RULES: one line, two sides ============ */
.lv-rules { padding: clamp(40px, 5vw, 72px) 0 clamp(64px, 8vw, 112px); border-top: 1px solid var(--border); }
.lv-rules__intro { margin: 0; font-size: clamp(1.1rem, 1.4vw, 1.25rem); line-height: 1.65; color: var(--ink-soft); }
.lv-rules__intro strong { font-weight: 600; color: var(--ink); }
.lv-line { --lv-gap: clamp(28px, 5vw, 80px); position: relative; margin-top: clamp(28px, 3.6vw, 48px); }
.lv-line__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
/* the line itself, down the middle of the drawings: dashed where it has not been read, solid where it has */
.lv-line__rail {
  position: absolute; z-index: 1; top: 0; bottom: 0; right: calc((100% - var(--lv-gap)) * 5 / 24); width: 2px; margin-right: -1px;
  background: repeating-linear-gradient(to bottom, var(--border-strong) 0 6px, transparent 6px 13px);
}
.lv-line__rail i { position: absolute; inset: 0; background: var(--accent-blue); transform-origin: top; transform: scaleY(var(--lv-p, 1)); }
.lv-line__rail b {
  position: absolute; left: -6px; top: -7px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--accent-blue); box-shadow: 0 0 0 4px var(--white); transform: translateY(var(--lv-y, 0px)); opacity: 0;
}
.lv-rule {
  display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--lv-gap); align-items: center;
  padding: clamp(28px, 3.4vw, 44px) 0; border-bottom: 1px solid var(--border);
}
.lv-rule h3 { font-size: clamp(1.6rem, 2.5vw, 2.2rem); line-height: 1.14; font-weight: 300; }
.lv-rule__text p { margin: 12px 0 0; font-size: clamp(1.02rem, 1.2vw, 1.12rem); line-height: 1.7; color: var(--ink-soft); }
.lv-rule__text p strong { font-weight: 600; color: var(--ink); }
.lv-rule__text p em { font-style: italic; color: var(--ink); }
.lv-rule__text .lv-rule__cite { margin-top: 18px; font-size: 14px; line-height: 1.4; }
/* inline, so the 14px of padding above and below widen the target to 44px without adding a line */
.lv-rule__cite a {
  padding-block: 14px; color: var(--ink-muted); font-weight: 500;
  text-decoration: underline; text-decoration-color: var(--border-strong); text-underline-offset: 3px; transition: color 200ms, text-decoration-color 200ms;
}
.lv-rule__cite a:hover { color: var(--accent-blue); text-decoration-color: var(--accent-blue); }
.lv-rule__cite a::after { content: "\2197"; display: inline-block; margin-left: 6px; transition: transform 320ms var(--lv-ease); }
.lv-rule__cite a:hover::after { transform: translate(2px, -2px); }

.lv-rule__fig { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 3vw, 44px); }
.lv-side { text-align: center; }
.lv-side--ok { color: var(--accent-blue); }
.lv-side--no { color: var(--ink-muted); }
.lv-side svg { display: block; width: 100%; max-width: 190px; height: auto; margin: 0 auto; overflow: visible; }
.lv-side .lv-s { fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lv-side .lv-f { fill: currentColor; opacity: .85; }
.lv-side .lv-f--soft { opacity: .16; }
.lv-side :is(.lv-grow, .lv-inside) circle { fill: currentColor; }
.lv-side .lv-bone path { fill: none; stroke: currentColor; stroke-width: 9; stroke-linecap: round; }
.lv-side .lv-bone circle { fill: currentColor; }
.lv-side .lv-fat circle { fill: var(--white); stroke: currentColor; stroke-width: 2.2; }
.lv-side .lv-add path { fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.lv-side .lv-person :is(circle, path) { fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.lv-side .lv-person--other :is(circle, path) { stroke-dasharray: 4 5; }
.lv-side :is(.lv-spin, .lv-grow circle, .lv-add, .lv-go) { transform-box: fill-box; transform-origin: center; }
.lv-side .lv-spin { transform-box: view-box; transform-origin: 75px 52px; }
.lv-side__cap { display: block; margin-top: 10px; font-size: 14.5px; font-weight: 500; line-height: 1.3; color: var(--ink-soft); }
.lv-side__cap::before { content: "\2713"; margin-right: 6px; font-weight: 700; color: var(--accent-blue); }
.lv-side--no .lv-side__cap::before { content: "\2715"; color: var(--ink-muted); }

.lv-rules__note {
  margin: clamp(32px, 4vw, 56px) 0 0; font-family: var(--font-display); font-weight: 300;
  font-size: clamp(1.3rem, 1.95vw, 1.7rem); line-height: 1.4; color: var(--ink);
}
.lv-rules__note strong { display: block; margin-bottom: 6px; font-weight: 300; font-style: italic; color: var(--accent-blue); }

/* ============ IS THE FDA THE PROBLEM: the one tinted band; two questions, two roads ============ */
.lv-case { padding: clamp(64px, 8vw, 112px) 0; background: var(--accent-wash); }
.lv-case__lead { margin: 0; font-family: var(--font-display); font-weight: 300; font-size: clamp(1.3rem, 1.95vw, 1.7rem); line-height: 1.4; color: var(--ink); }
.lv-pair {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(4, auto);
  column-gap: clamp(32px, 6vw, 96px); margin-top: clamp(32px, 4vw, 56px);
}
.lv-q { display: grid; grid-row: span 4; grid-template-rows: subgrid; border-top: 1px solid var(--ink); padding-top: clamp(18px, 2.2vw, 26px); }
.lv-q p { margin: 0; }
.lv-q__pre { align-self: end; font-size: clamp(1.02rem, 1.2vw, 1.12rem); line-height: 1.6; color: var(--ink-soft); }
.lv-road { display: block; width: 100%; max-width: 460px; height: auto; margin: clamp(16px, 2vw, 24px) 0; overflow: visible; }
.lv-road :is(path, circle, ellipse) { fill: none; stroke: var(--ink); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.lv-road .lv-road__from path:first-child { fill: var(--white); }
.lv-road .lv-road__plus { stroke: var(--accent-blue); stroke-width: 3.4; }
.lv-road .lv-road__way { stroke: var(--accent-blue); stroke-width: 2.2; stroke-dasharray: 1; stroke-dashoffset: 0; }
.lv-road .lv-road__clock circle, .lv-road .lv-road__coins ellipse { fill: var(--accent-wash); }
.lv-road .lv-road__hand { transform-box: view-box; transform-origin: 163px 34px; }
.lv-road .lv-road__vial path:first-child { fill: var(--white); }
.lv-road .lv-road__fill { fill: var(--accent-blue); stroke: none; }
.lv-road .lv-road__dot { fill: var(--accent-blue); stroke: var(--accent-wash); stroke-width: 3; offset-rotate: 0deg; offset-distance: 100%; opacity: 0; }
.lv-q--slow .lv-road__dot { offset-path: path("M58 62C86 8 112 8 130 52S172 96 196 50S240 6 264 50S302 92 332 60S356 52 366 56"); }
.lv-q--quick .lv-road__dot { offset-path: path("M62 56H366"); }
.lv-q__q { font-family: var(--font-display); font-weight: 300; font-size: clamp(1.55rem, 2.5vw, 2.25rem); line-height: 1.2; color: var(--accent-blue-hover); }
.lv-q__q em { font-style: italic; }
.lv-q .lv-q__a { margin-top: clamp(14px, 1.6vw, 20px); font-size: clamp(1.02rem, 1.2vw, 1.12rem); line-height: 1.7; color: var(--ink-soft); }
.lv-case__after { margin-top: clamp(32px, 4vw, 56px); padding-top: clamp(22px, 2.6vw, 32px); border-top: 1px solid var(--border-strong); }
.lv-case__after p { margin: 0 0 .9em; font-size: clamp(1.08rem, 1.35vw, 1.22rem); line-height: 1.65; color: var(--ink); }
.lv-case__after p:last-child { margin-bottom: 0; }

/* ============ FOLDS (native details) ============
   Every fold ships open. On a phone the script closes the ones a reader can
   skip and the summary becomes a 44px "Read more"; on a desk there is no
   summary and nothing is hidden. In-page search and print open them. */
.lv-fold > summary { display: none; list-style: none; }
.lv-fold > summary::-webkit-details-marker { display: none; }
.lv-fold__less, .lv-fold[open] > summary .lv-fold__more { display: none; }
.lv-fold[open] > summary .lv-fold__less { display: inline; }
.lv-chev { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform 320ms var(--lv-ease); }
.lv-fold[open] > summary .lv-chev { transform: rotate(180deg); }
@keyframes lv-unfold { from { opacity: 0; transform: translateY(-8px); } }

/* ============ FOUR NUMBERS: the one navy band; each figure beside a picture of itself ============ */
.lv-numbers { padding: clamp(64px, 8vw, 112px) 0; background: var(--navy-brand); color: var(--white); }
.why-leave .lv-numbers h2 { color: var(--white); margin-bottom: clamp(8px, 1.4vw, 16px); }
.lv-nums { list-style: none; margin: 0; padding: 0; }
.lv-num {
  display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 5fr); gap: clamp(20px, 3.4vw, 56px); align-items: center;
  padding: clamp(26px, 3.2vw, 44px) 0; border-bottom: 1px solid rgba(124, 169, 209, .3);
}
.lv-num:last-child { border-bottom: 0; padding-bottom: 0; }
.lv-num p { margin: 0; }
.lv-num__n { font-family: var(--font-display); font-weight: 300; font-size: clamp(3.6rem, 7.4vw, 6.4rem); line-height: .95; color: var(--white); font-variant-numeric: lining-nums tabular-nums; }
.lv-num__n sup { font-size: .32em; margin-left: .12em; vertical-align: top; position: relative; top: .5em; color: var(--accent-ice); }
.lv-num__say p { font-size: clamp(1.02rem, 1.25vw, 1.14rem); line-height: 1.6; color: rgba(255, 255, 255, .92); }
.lv-num__say .lv-num__cite { margin-top: 8px; font-size: 14px; line-height: 1.5; color: var(--accent-ice); }
.lv-num__cite a { padding-block: 15px; color: var(--accent-ice); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(124, 169, 209, .5); transition: color 200ms, text-decoration-color 200ms; }
.lv-num__cite a:hover { color: var(--white); text-decoration-color: var(--white); }
/* empty places: one per condition, one per payor */
.lv-slots { display: flex; gap: clamp(6px, .8vw, 10px); }
.lv-slots i { flex: 1 1 0; max-width: 58px; aspect-ratio: 1; border: 1.5px dashed var(--accent-ice); border-radius: 4px; }
/* one dot per clinic location: a pattern until the script draws the real count */
.lv-field { height: clamp(92px, 9vw, 124px); background: radial-gradient(circle, var(--accent-ice) 1.1px, transparent 1.5px) 0 0 / 5px 5px; }
.lv-field canvas { display: block; width: 100%; height: 100%; }
.lv-field.is-drawn { background: none; }
/* eleven years, one block each */
.lv-years { display: flex; gap: clamp(3px, .5vw, 6px); }
.lv-years i { flex: 1 1 0; height: clamp(22px, 2.4vw, 30px); border-radius: 2px; background: var(--accent-ice); transform-origin: left; }

/* ============ IN THE VIAL: three vials, each holding what its paragraph says ============ */
.lv-vial { padding: clamp(64px, 8vw, 112px) 0; }
.lv-vial__intro { margin: 0; font-size: clamp(1.1rem, 1.4vw, 1.25rem); line-height: 1.65; color: var(--ink-soft); }
.lv-jars {
  list-style: none; margin: clamp(32px, 4vw, 56px) 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto auto; column-gap: clamp(24px, 4vw, 64px);
}
.lv-jar { display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: clamp(16px, 2vw, 24px); }
.lv-jar svg { display: block; width: clamp(96px, 10vw, 132px); height: auto; overflow: visible; }
.lv-jar p { margin: 0; padding-top: clamp(16px, 2vw, 22px); border-top: 1px solid var(--ink); font-size: clamp(1.02rem, 1.2vw, 1.1rem); line-height: 1.7; color: var(--ink-soft); }
.lv-jar p strong { font-weight: 600; color: var(--ink); }
.lv-jar__cap { fill: var(--ink); }
.lv-jar__glass { fill: none; stroke: var(--ink); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.lv-jar__liquid { fill: var(--accent-wash); }
/* cells that did not survive the freezer: outlines, nothing inside */
.lv-jar__cells circle { fill: var(--accent-blue); fill-opacity: 0; stroke: var(--ink-muted); stroke-width: 1.8; stroke-dasharray: 3 4; }
/* vesicles: far smaller than a cell */
.lv-jar__specks circle { fill: var(--accent-blue); }
/* a mixed fraction, and the one kind in it that is a stem cell */
.lv-jar__bits path { fill: none; stroke: var(--ink-muted); stroke-width: 1.6; stroke-linejoin: round; }
.lv-jar__one { fill: var(--accent-blue); transform-box: fill-box; transform-origin: center; }
.lv-vial__verdict {
  margin: clamp(36px, 4.6vw, 64px) 0 0; font-family: var(--font-display); font-weight: 300;
  font-size: clamp(1.3rem, 1.95vw, 1.7rem); line-height: 1.4; color: var(--ink);
}
.lv-vial__verdict em { font-style: italic; color: var(--accent-blue); }

/* ============ FOUR ARTICLES: the first across the top, three below; each one link ============ */
.lv-arts { padding: clamp(64px, 8vw, 112px) 0; border-top: 1px solid var(--border); }
.lv-arts__head { margin-bottom: clamp(24px, 3vw, 40px); }
.why-leave .lv-arts__head h2 { margin-bottom: clamp(10px, 1.4vw, 16px); }
.lv-arts__head p { margin: 0; font-size: 17px; line-height: 1.6; color: var(--ink-soft); }
.lv-arts__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(24px, 4vw, 64px); }
.lv-arts__first { grid-column: 1 / -1; }
/* an odd card left over at the end takes the whole row, rather than sitting beside a gap */
.lv-arts__list > li:last-child:nth-child(even) { grid-column: 1 / -1; }
.lv-art {
  position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr) 24px; column-gap: clamp(16px, 2vw, 26px); row-gap: 6px;
  align-items: start; align-content: start; height: 100%; box-sizing: border-box; padding: clamp(20px, 2.4vw, 30px) 0; border-top: 1px solid var(--border); color: var(--ink);
}
.lv-arts__first .lv-art { border-top-color: var(--ink); }
/* a rule that runs out along the top of the card under the pointer */
.lv-art::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--accent-blue); transform: scaleX(0); transform-origin: left; transition: transform 480ms var(--lv-ease); }
.lv-art:hover::before, .lv-art:focus-visible::before { transform: none; }
.lv-art__ic { grid-row: 1 / span 2; display: block; width: 48px; height: 48px; overflow: visible; }
.lv-art__ic path { fill: none; stroke: var(--ink); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: stroke 220ms; }
.lv-art__title { grid-column: 2; font-family: var(--font-display); font-weight: 300; font-size: clamp(1.4rem, 2vw, 1.75rem); line-height: 1.16; transition: color 220ms; }
.lv-art__text { grid-column: 2; font-size: 16px; line-height: 1.62; color: var(--ink-soft); }
.lv-arts__first .lv-art { grid-template-columns: 72px minmax(0, 1fr) 28px; padding-block: clamp(26px, 3.2vw, 40px); }
.lv-arts__first .lv-art__ic { width: 72px; height: 72px; }
.lv-arts__first .lv-art__title { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.lv-arts__first .lv-art__text { font-size: clamp(1.05rem, 1.3vw, 1.18rem); }
.lv-art__go { grid-column: 3; grid-row: 1; align-self: center; display: block; width: 24px; height: 24px; fill: none; stroke: var(--accent-blue); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: .5; transition: transform 360ms var(--lv-ease), opacity 220ms; }
.lv-arts__first .lv-art__go { width: 28px; height: 28px; }
.lv-art:hover, .lv-art:focus-visible { color: var(--ink); }
.lv-art:hover .lv-art__title, .lv-art:focus-visible .lv-art__title { color: var(--accent-blue); }
.lv-art:hover .lv-art__ic path, .lv-art:focus-visible .lv-art__ic path { stroke: var(--accent-blue); stroke-dasharray: 200; animation: lv-draw 900ms var(--lv-ease) both; }
.lv-art:hover .lv-art__ic path[stroke-dasharray], .lv-art:focus-visible .lv-art__ic path[stroke-dasharray] { stroke-dasharray: 2 4; animation: none; }
.lv-art:hover .lv-art__go, .lv-art:focus-visible .lv-art__go { opacity: 1; transform: translateX(6px); }
@keyframes lv-draw { from { stroke-dashoffset: 200; } to { stroke-dashoffset: 0; } }
/* back from an article: the card that was opened is marked for a moment */
.lv-art.is-back::before { transform: none; }
.lv-art.is-back .lv-art__title { color: var(--accent-blue); }

/* ============ WHAT IT WILL NOT DO: five refusals, each struck as it is read ============ */
.lv-limits { padding: clamp(64px, 8vw, 112px) 0; border-top: 1px solid var(--border); }
.lv-limits__head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(20px, 3vw, 44px); align-items: center; margin-bottom: clamp(24px, 3vw, 40px); }
.why-leave .lv-limits__head h2 { margin-bottom: clamp(10px, 1.4vw, 16px); }
.lv-limits__head p { margin: 0; font-size: 17px; line-height: 1.6; color: var(--ink-soft); }
/* a sheet of five lines, every one of them crossed out */
.lv-sheet { display: block; width: clamp(72px, 8vw, 104px); height: auto; overflow: visible; }
.lv-sheet path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.lv-sheet__page { stroke: var(--ink); stroke-width: 1.8; }
.lv-sheet__row { stroke: var(--border-strong); stroke-width: 5; }
.lv-sheet__cut { stroke: var(--accent-blue); stroke-width: 2.2; stroke-dasharray: 1; stroke-dashoffset: 0; }
.lv-limits__head p em { font-style: italic; }
.lv-limits__list { list-style: none; margin: 0; padding: 0; }
.lv-limits .lv-wrap > .lv-limits__list { border-top: 1px solid var(--ink); }
.lv-limit { padding: clamp(20px, 2.4vw, 30px) 0; border-bottom: 1px solid var(--border); }
.lv-limit h3 { font-size: clamp(1.4rem, 2vw, 1.8rem); line-height: 1.3; font-weight: 300; color: var(--ink); }
/* the strike: one line through each line of the heading, drawn left to right */
.lv-strike {
  background: linear-gradient(var(--accent-blue), var(--accent-blue)) no-repeat 0 58% / 100% 1.5px;
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
.lv-limit p { margin: 10px 0 0; font-size: 16.5px; line-height: 1.68; color: var(--ink-soft); }
.lv-limit p strong { font-weight: 600; color: var(--ink); }
.lv-limit p em { font-style: italic; }

/* ============ CLOSING: narrow and centred on purpose ============ */
.lv-end { padding: clamp(72px, 9vw, 120px) var(--lv-gut); text-align: center; border-top: 1px solid var(--border); }
.lv-end__inner { max-width: 720px; margin: 0 auto; }
.why-leave .lv-end h2 { margin-bottom: 16px; }
.lv-end p { margin: 0; font-size: 17px; line-height: 1.65; color: var(--ink-soft); }
.lv-end__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 28px; }

/* ============ ARRIVALS (only once the script has said it is running) ============
   Each part comes in its own way, once. A box that keeps its size is a box
   the observer can see, so nothing is clipped to no area. */
.lv-js [data-r] { opacity: 0; transition: opacity 700ms var(--lv-ease), transform 900ms var(--lv-ease); }
.lv-js [data-r].is-in { opacity: 1; }
.lv-js :is(.lv-rules__intro, .lv-case__lead, .lv-vial__intro)[data-r] { transform: translateY(14px); }
.lv-js :is(.lv-rules__intro, .lv-case__lead, .lv-vial__intro)[data-r].is-in { transform: none; }

/* a rule: its words rise, and its two drawings come in from their own sides of the line */
.lv-js .lv-rule[data-r] { opacity: 1; }
.lv-js .lv-rule[data-r] .lv-rule__text { opacity: 0; transform: translateY(14px); transition: opacity 700ms var(--lv-ease), transform 900ms var(--lv-ease); }
.lv-js .lv-rule[data-r] .lv-side { opacity: 0; transition: opacity 600ms 200ms var(--lv-ease), transform 900ms 200ms var(--lv-ease); }
.lv-js .lv-rule[data-r] .lv-side--ok { transform: translateX(-26px); }
.lv-js .lv-rule[data-r] .lv-side--no { transform: translateX(26px); transition-delay: 380ms; }
.lv-js .lv-rule[data-r].is-in :is(.lv-rule__text, .lv-side) { opacity: 1; transform: none; }
/* and then each drawing does the one thing it is a drawing of */
.lv-js .lv-rule.is-in .lv-spin { animation: lv-spin 1500ms 600ms cubic-bezier(.3, 0, .2, 1) both; }
.lv-js .lv-rule[data-r]:not(.is-in) .lv-grow circle:nth-child(n + 2) { transform: scale(0); }
.lv-js .lv-rule.is-in .lv-grow circle:nth-child(n + 2) { animation: lv-pop 520ms var(--lv-ease) both; animation-delay: calc(900ms + var(--k, 0) * 150ms); }
.lv-grow circle:nth-child(3) { --k: 0; } .lv-grow circle:nth-child(4) { --k: 2; } .lv-grow circle:nth-child(5) { --k: 2; }
.lv-grow circle:nth-child(6) { --k: 4; } .lv-grow circle:nth-child(7) { --k: 4; }
.lv-js .lv-rule.is-in .lv-go { animation: lv-nudge 900ms 800ms var(--lv-ease) both; }
.lv-js .lv-rule[data-r]:not(.is-in) .lv-add { transform: scale(0); }
.lv-js .lv-rule.is-in .lv-add { animation: lv-pop 600ms 1000ms var(--lv-ease) both; }
.lv-loop { stroke-dasharray: 120; stroke-dashoffset: 0; }
.lv-js .lv-rule.is-in .lv-loop { animation: lv-draw-loop 1100ms 700ms var(--lv-ease) both; }
@keyframes lv-spin { to { transform: rotate(360deg); } }
@keyframes lv-pop { 0% { transform: scale(0); } 60% { transform: scale(1.25); } 100% { transform: none; } }
@keyframes lv-nudge { 0% { transform: translateX(-10px); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes lv-draw-loop { from { stroke-dashoffset: 120; } to { stroke-dashoffset: 0; } }
/* the marker rides the line while the rules are being read */
.lv-js .lv-line.is-live .lv-line__rail b { opacity: 1; transition: opacity 300ms; }

/* the corollary is uncovered from the left, like a line being read out */
.lv-js .lv-rules__note[data-r] { opacity: 1; clip-path: inset(0 100% 0 0); transition: clip-path 1500ms var(--lv-ease); }
.lv-js .lv-rules__note[data-r].is-in { clip-path: inset(0 0 0 0); }

/* two roads: each is drawn, then something travels it at its own pace */
.lv-js .lv-q[data-r] { transform: translateY(18px); }
.lv-js .lv-q--quick[data-r] { transition-delay: 160ms; }
.lv-js .lv-q[data-r].is-in { transform: none; }
.lv-js .lv-q[data-r]:not(.is-in) .lv-road__way { stroke-dashoffset: 1; }
.lv-js .lv-q[data-r].is-in .lv-road__way { animation: lv-trace 1200ms 300ms var(--lv-ease) both; }
.lv-js .lv-q .lv-road__fill { opacity: 0; }
.lv-js .lv-q:not(.is-go) .lv-road__coins ellipse { opacity: 0; }
.lv-js .lv-q.is-go .lv-road__dot { animation: lv-travel var(--lv-trip) linear both; }
.lv-js .lv-q.is-go .lv-road__fill { animation: lv-fade 500ms var(--lv-trip) both; }
.lv-q--slow { --lv-trip: 7200ms; }
.lv-q--quick { --lv-trip: 1300ms; }
.lv-js .lv-q--slow.is-go .lv-road__hand { animation: lv-spin 2400ms linear 3; }
.lv-js .lv-q--slow.is-go .lv-road__coins ellipse { animation: lv-fade 400ms both; animation-delay: calc(2600ms + var(--k, 0) * 900ms); }
.lv-road__coins ellipse:nth-child(2) { --k: 1; } .lv-road__coins ellipse:nth-child(3) { --k: 2; }
@keyframes lv-trace { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes lv-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes lv-travel { 0% { offset-distance: 0%; opacity: 1; } 100% { offset-distance: 100%; opacity: 1; } }
.lv-js .lv-case__after p[data-r] { transform: translateY(12px); }
.lv-js .lv-case__after p[data-r].is-in { transform: none; }

/* the figures: the number steps in from the left; its picture is built the way it counts */
.lv-js .lv-num[data-r] { opacity: 1; }
.lv-js .lv-num[data-r] .lv-num__n { opacity: 0; transform: translateX(-24px); transition: opacity 700ms var(--lv-ease), transform 900ms var(--lv-ease); }
.lv-js .lv-num[data-r] .lv-num__say { opacity: 0; transition: opacity 700ms 250ms var(--lv-ease); }
.lv-js .lv-num[data-r].is-in :is(.lv-num__n, .lv-num__say) { opacity: 1; transform: none; }
.lv-js .lv-num[data-r] .lv-slots i { opacity: 0; transform: scale(.6); transition: opacity 400ms, transform 600ms var(--lv-ease); transition-delay: calc(200ms + var(--i, 0) * 60ms); }
.lv-js .lv-num[data-r].is-in .lv-slots i { opacity: 1; transform: none; }
.lv-js .lv-num[data-r] .lv-years i { transform: scaleX(0); transition: transform 320ms linear; transition-delay: calc(200ms + var(--i, 0) * 130ms); }
.lv-js .lv-num[data-r].is-in .lv-years i { transform: none; }
.lv-js .lv-num[data-r] .lv-field { opacity: 0; transition: opacity 400ms; }
.lv-js .lv-num[data-r].is-in .lv-field { opacity: 1; }

/* the vials: each arrives, then shows what became of what is in it */
.lv-js .lv-jar[data-r] { transform: translateY(20px); transition-delay: calc(var(--i, 0) * 140ms); }
.lv-js .lv-jar[data-r].is-in { transform: none; }
.lv-js .lv-jar--ghosts.is-in .lv-jar__cells circle { animation: lv-thaw 1600ms 700ms ease-out both; }
.lv-js .lv-jar--specks[data-r]:not(.is-in) .lv-jar__specks circle { opacity: 0; }
.lv-js .lv-jar--specks.is-in .lv-jar__specks circle { animation: lv-settle 900ms var(--lv-ease) both; animation-delay: calc(500ms + var(--k, 0) * 60ms); }
.lv-jar__specks circle:nth-child(3n + 1) { --k: 1; } .lv-jar__specks circle:nth-child(3n + 2) { --k: 4; } .lv-jar__specks circle:nth-child(3n) { --k: 7; }
.lv-js .lv-jar--mix[data-r]:not(.is-in) .lv-jar__one { transform: scale(0); }
.lv-js .lv-jar--mix.is-in .lv-jar__one { animation: lv-pop 700ms 1100ms var(--lv-ease) both; }
@keyframes lv-thaw { 0% { fill-opacity: 1; stroke-dasharray: 80 0; stroke: var(--accent-blue); } 55% { fill-opacity: 1; stroke-dasharray: 80 0; stroke: var(--accent-blue); } 100% { fill-opacity: 0; } }
@keyframes lv-settle { from { opacity: 0; transform: translateY(-14px); } }
.lv-js .lv-vial__verdict[data-r] { transform: translateY(14px); }
.lv-js .lv-vial__verdict[data-r].is-in { transform: none; }

/* the cards come up from the rule they hang on, one after another */
.lv-js .lv-arts__list li[data-r] { transform: translateY(22px); transition-delay: calc(var(--i, 0) * 80ms); }
.lv-js .lv-arts__list li[data-r].is-in { transform: none; }

/* each refusal is struck as it arrives */
.lv-js .lv-sheet[data-r] { opacity: 1; }
.lv-js .lv-sheet[data-r]:not(.is-in) .lv-sheet__cut { stroke-dashoffset: 1; }
.lv-js .lv-sheet[data-r].is-in .lv-sheet__cut { animation: lv-trace 420ms ease-out both; animation-delay: calc(300ms + var(--k, 0) * 200ms); }
.lv-sheet__cut:nth-of-type(5) { --k: 1; } .lv-sheet__cut:nth-of-type(6) { --k: 2; } .lv-sheet__cut:nth-of-type(7) { --k: 3; } .lv-sheet__cut:nth-of-type(8) { --k: 4; }
.lv-js .lv-limit[data-r] { opacity: 1; }
.lv-js .lv-limit[data-r] p { opacity: 0; transform: translateY(10px); transition: opacity 600ms 350ms var(--lv-ease), transform 800ms 350ms var(--lv-ease); }
.lv-js .lv-limit[data-r].is-in p { opacity: 1; transform: none; }
.lv-js .lv-limit[data-r] .lv-strike { background-size: 0% 1.5px; transition: background-size 900ms 250ms cubic-bezier(.6, 0, .2, 1); }
.lv-js .lv-limit[data-r].is-in .lv-strike { background-size: 100% 1.5px; }

/* the closing call steps forward */
.lv-js .lv-end__inner[data-r] { transform: scale(.96); }
.lv-js .lv-end__inner[data-r].is-in { transform: none; }

/* ============ TABLET AND PHONE ============ */
@media (max-width: 900px) {
  .why-leave main h2 { text-wrap: balance; }
  .lv-hero__row, .lv-toc__list, .lv-rule, .lv-arts__list { grid-template-columns: minmax(0, 1fr); }
  .lv-limits__head { align-items: start; }
  .lv-hero__row { align-items: start; }
  /* the line runs between each rule's own two drawings instead */
  .lv-line__rail { display: none; }
  .lv-rule { gap: 22px; }
  .lv-rule__fig { position: relative; max-width: 460px; }
  .lv-rule__fig::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: repeating-linear-gradient(to bottom, var(--border-strong) 0 6px, transparent 6px 13px); }
  .lv-pair { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: clamp(32px, 6vw, 48px); }
  .lv-q { display: block; }
  .lv-num { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .lv-slots i { max-width: 46px; }
  .lv-jars { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: 32px; }
  .lv-jar { display: grid; grid-row: auto; grid-template-rows: none; grid-template-columns: 76px minmax(0, 1fr); column-gap: 18px; align-items: start; }
  .lv-jar svg { width: 76px; }
  .lv-jar p { padding-top: 14px; }

  /* the folds a reader can skip become "Read more" */
  .lv-fold > summary {
    display: inline-flex; align-items: center; gap: 6px; min-height: 44px; cursor: pointer;
    font-size: 15px; font-weight: 600; color: var(--accent-blue-hover); -webkit-tap-highlight-color: transparent;
  }
  .lv-fold[open] > .lv-fold__body { animation: lv-unfold 360ms var(--lv-ease) both; }
  /* the bar's edges fade wherever its track can be wider than the window */
  .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); }
}

@media (max-width: 600px) {
  html:has(body.why-leave) { --hc-bar-h: 48px; }
  .hc-bar__track { gap: 22px; }
  .lv-horizon { --lv-tilt: 34deg; }
  .lv-plane svg { width: 24px; height: 24px; margin: -12px 0 0 -12px; }
  .lv-hero__actions .btn, .lv-end__actions .btn { width: 100%; }
  .lv-art, .lv-arts__first .lv-art { grid-template-columns: 48px minmax(0, 1fr); }
  .lv-arts__first .lv-art__ic { width: 48px; height: 48px; }
  .lv-art__go { display: none; }
}

/* ============ REDUCED MOTION: hold every end state ============
   The script adds no lv-js class under reduced motion, so nothing is ever
   hidden; this only stops what the sheet itself would move. The plane rests
   over the border, mid-flight. */
@media (prefers-reduced-motion: reduce) {
  .why-leave main *, .why-leave main *::before, .why-leave main *::after { animation: none !important; transition: none !important; }
  .lv-js [data-r], .lv-js [data-r] :is(div, p, h3, span, i) { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .lv-js .lv-strike { background-size: 100% 1.5px !important; }
  html { scroll-behavior: auto; }
}

/* ============ PRINT: no scrolling, so nothing waits to be revealed ============ */
@media print {
  .why-leave main *, .why-leave main *::before, .why-leave main *::after { animation: none !important; transition: none !important; }
  .lv-js [data-r], .lv-js [data-r] :is(div, p, h3, span, i) { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .lv-js :is(.lv-road__fill, .lv-road__coins ellipse) { opacity: 1 !important; }
  .lv-js .lv-road__way { stroke-dashoffset: 0 !important; }
  .lv-js .lv-strike { background-size: 100% 1.5px !important; }
  .lv-js .lv-line__rail i { transform: none !important; }
  .hc-bar, .lv-fold > summary, .lv-plane, .lv-line__rail b, .lv-road__dot, .lv-peek { display: none !important; }
  .lv-numbers { background: none; color: var(--ink); }
  .why-leave .lv-numbers h2, .lv-num__n, .lv-num__say p, .lv-num__say .lv-num__cite, .lv-num__cite a { color: var(--ink); }
  .lv-slots i { border-color: var(--ink-muted); }
  .lv-years i { background: var(--ink-muted); }
}