/* Shared by the portfolio and its hosted tools. */
:root {
  --link-hover: var(--accent, var(--orange));
}

a, .link, .hint summary {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: currentColor;
  text-underline-offset: .22em;
}
a:is(:hover, :focus-visible),
.link:is(:hover, :focus-visible),
.hint summary:is(:hover, :focus-visible) {
  text-decoration-color: var(--link-hover);
  text-decoration-thickness: 1px;
}

/* Underline a card's title/action, leaving its supporting copy readable. */
.case-study-card-link, .additional-work a, .note-row, .writing-title-link {
  text-decoration: none;
}
.case-study-card-link h3, .additional-work-title, .note-row h2, .writing-title {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .22em;
}
:is(.case-study-card-link, .additional-work a, .note-row, .writing-title-link):is(:hover, :focus-visible)
  :is(h3, .additional-work-title, h2, .writing-title) {
  text-decoration-color: var(--link-hover);
}

/* Button styling supplies the affordance without an underlined label. */
.btn, .project-tool-action { text-decoration: none; }

/* Navigation stays unadorned, including its active state. */
.site-header a, .canvas-header a { text-decoration: none; }
.site-header nav a:is(:hover, :focus-visible, [aria-current]) { color: var(--link-hover); }

/* Plain text actions use their label and underline alone.
   Large homepage navigation arrows remain a separate treatment. */
a:is(:hover, :focus-visible) :is(.case-study-arrow, .row-arrow),
.arrow-link:is(:hover, :focus-visible) { color: var(--link-hover); }

/* The large stand-alone navigation arrows retain their existing scale. */
.arrow-link { text-decoration: none; transition: color .2s; }