/* =====================================================================
   CRAFT & EFFECT — TEXT LINKS
   One rule for every inline link in running copy, loaded by every page.

   It lives in its own file rather than in styles.css or shell.css because
   the landing page and the document pages share no stylesheet: the landing
   page is a pinned GSAP stage with its own reset, the document pages have
   shell.css. A link has to look the same on all of them, so the rule has
   to sit somewhere all of them can reach.

   Size is deliberately NOT set here. A link takes the size of the copy it
   sits in, which is the only thing allowed to vary between locations.
   ===================================================================== */

.textlink {
  color: var(--text-primary);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  /* from-font rather than a fixed thickness: at 0.78rem in the form's fine
     print and at 1rem in a paragraph, one hardcoded value is wrong at one
     of the two sizes. */
  text-decoration-thickness: from-font;
  /* Colour and rule move together, so the underline never lags behind the
     word it belongs to. --dur-fast is the same 180ms the buttons use; this
     is a hover response, and MASTER §4 holds UI to 150-300ms. */
  transition: color var(--dur-fast) var(--ease-io),
              text-decoration-color var(--dur-fast) var(--ease-io);
}
.textlink:hover,
.textlink:focus-visible { color: var(--accent); }

/* On the orange field the accent would vanish into the ground, so the hover
   goes to ink's opposite instead. Nothing uses this yet; it is here so the
   first link dropped onto an orange section does not arrive broken. */
.signals .textlink, .sitefoot .textlink { color: var(--text-on-orange); }
.signals .textlink:hover, .sitefoot .textlink:hover,
.signals .textlink:focus-visible, .sitefoot .textlink:focus-visible { color: var(--text-on-ink); }

@media (prefers-reduced-motion: reduce) {
  .textlink { transition: none; }
}
