/*
  What the design system's reference pages wrote inline (style="…"), as
  classes, so pages need no inline styles (the page policy allows none).
  Only the design system's tokens; nothing new is invented here.
*/

/* Without JavaScript, content that would fade in is simply shown. */
html:not(.js) .is-reveal { opacity: 1; transform: none; }

/* Skip link: hidden until it gets keyboard focus. */
.is-skip-link {
  position: absolute; left: var(--space-4); top: calc(-1 * var(--space-9)); z-index: calc(var(--z-header) + 1);
  padding: var(--space-3) var(--space-5);
  background: var(--is-signal); color: var(--is-dusk);
  font-weight: var(--weight-semibold); text-decoration: none;
}
.is-skip-link:focus { top: var(--space-4); }

/* Footer: the current page underlined. */
.is-site-footer .is-nav__link[aria-current="page"] { text-decoration: underline; text-underline-offset: .3em; }

/* The language link uses the language select's look. */
a.is-lang { text-decoration: none; }

/* Stack gaps the reference sets inline. */
.is-stack--4 { --stack-gap: var(--space-4); }
.is-stack--6 { --stack-gap: var(--space-6); }
.is-stack--7 { --stack-gap: var(--space-7); }
.is-stack--8 { --stack-gap: var(--space-8); }

/* Vertical spacers between blocks. */
.is-spacer-section { height: var(--space-section); }
.is-spacer-9 { height: var(--space-9); }

/* A heading kept to a readable width. */
.is-measure-wide { max-width: 20em; }

/* Body text at the regular weight and body size where the reference sets it. */
.is-weight-regular { font-weight: var(--weight-regular); }
.is-copy--body, .is-caption--body { font-size: var(--text-body); }
.is-caption--body { color: var(--color-text); }
.is-strong-lg { font-weight: var(--weight-bold); font-size: var(--text-body-lg); }
