/* ==========================================================================
   Text links  (.pf-link)
   Figma default: serif SemiBold, underlined, ink — pink only on hover.
   Modifiers: --accent (pink from rest, AA), --quiet (underline on hover only).
   ========================================================================== */

.pf-link {
  font-family: var(--pf-font-body);
  font-weight: var(--pf-weight-strong);
  color: var(--pf-link); /* ink, always — links are never pink */
  text-decoration: underline;
  text-decoration-color: currentColor; /* ink underline at rest */
  text-decoration-thickness: from-font;
  text-underline-offset: 0.15em;
  transition: text-decoration-color var(--pf-dur) var(--pf-ease),
    text-decoration-thickness var(--pf-dur) var(--pf-ease);
}
/* The pink moment: the underline turns pink on hover. Text stays ink. */
.pf-link:hover,
.pf-link:focus-visible {
  text-decoration-color: var(--pf-accent);
  text-decoration-thickness: 2px;
}

/* Quiet — no underline until interaction (use for nav-ish inline links) */
.pf-link--quiet {
  text-decoration: none;
}
.pf-link--quiet:hover,
.pf-link--quiet:focus-visible {
  text-decoration: underline;
  text-decoration-color: var(--pf-accent);
}