/* ===== Hover demos for list titles (html[data-hvd]) — 2026-10-14 =====
   hv.js wraps each title's text in .hv-t and marks its link .hv-a; the browser's underline is turned off */
:root[data-hvd] .hv-a .hv-t { text-decoration: none !important; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
:root[data-hvd] .hv-x, :root[data-hvd] .hv-a:hover .hv-x, :root[data-hvd] .hv-a:focus-visible .hv-x, :root[data-hvd] .hv-a:hover .hv-t { text-decoration: none !important; }

/* 1 Line + blue: a 1px line draws from the left while the title turns brand blue */
:root[data-hvd="1"] .hv-t {
  background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
  padding-bottom: 5px;
  transition: background-size .55s cubic-bezier(.2, .7, .2, 1), color .35s ease;
}
:root[data-hvd="1"] .hv-a:hover .hv-t, :root[data-hvd="1"] .hv-a:focus-visible .hv-t { color: #2448e6; background-size: 100% 1px; }

/* 2 Gradient: the light gradient (blue, teal, violet) sweeps through the letters; no line */
:root[data-hvd="2"] .hv-t {
  color: transparent;
  background-image: linear-gradient(90deg, #2448e6 0%, #1fb5a8 22%, #7b5cff 44%, var(--hv-c, #111) 50%, var(--hv-c, #111) 100%);
  background-size: 205% 100%; background-position: 100% 0;
  -webkit-background-clip: text; background-clip: text;
  transition: background-position .8s cubic-bezier(.2, .7, .2, 1);
}
:root[data-hvd="2"] .hv-a:hover .hv-t, :root[data-hvd="2"] .hv-a:focus-visible .hv-t { background-position: 0 0; }

/* 3 Marker: a pale band of the light gradient rises behind the lower half of the title, which deepens to navy */
:root[data-hvd="3"] .hv-t {
  background: linear-gradient(90deg, rgba(36, 72, 230, .16), rgba(31, 181, 168, .16) 55%, rgba(123, 92, 255, .16)) 0 88% / 0 42% no-repeat;
  transition: background-size .6s cubic-bezier(.2, .7, .2, 1), color .35s ease;
}
:root[data-hvd="3"] .hv-a:hover .hv-t, :root[data-hvd="3"] .hv-a:focus-visible .hv-t { color: #1a2a8c; background-size: 100% 42%; }

@media (prefers-reduced-motion: reduce) { :root[data-hvd] .hv-t { transition: none !important; } }