@layer reset {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  body,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  figure,
  blockquote,
  dl,
  dd,
  ol,
  ul {
    margin: 0;
  }

  ol[class],
  ul[class] {
    padding: 0;
    list-style: none;
  }

  img,
  picture,
  svg,
  video {
    display: block;
    max-width: 100%;
  }

  input,
  button,
  textarea,
  select {
    font: inherit;
    color: inherit;
  }

  /* Chrome's UA sheet gives a button `padding: 1px 6px`. Zeroing background and
     border but not padding left every <button> styled as a link carrying 12px of
     inline padding no author wrote: the three .fh-menu__trigger nav items sat
     6px further from their neighbours than the <a> links beside them, so the
     bar's label rhythm measured 16/22/33/39/40px against a flex gap that was a
     constant 16px. Reset the padding here, not at the call site, so the next
     <button> does not inherit the same invisible offset. */
  button {
    padding: 0;
    background: none;
    border: 0;
    cursor: pointer;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
  }

  a {
    color: inherit;
  }

  /* A skip link that is genuinely reachable. 21 of 37 live pages currently
     have no h1 and none has a skip link; this is where that stops. */
  .fh-skip {
    position: absolute;
    left: var(--l-gutter);
    top: 0;
    z-index: calc(var(--l-z-nav) + 1);
    padding: 0.625rem 1rem;
    background: var(--l-gold);
    color: var(--l-on-gold);
    font-family: var(--l-face-data);
    font-size: var(--l-fs-data);
    text-decoration: none;
    transform: translateY(-120%);
  }

  .fh-skip:focus {
    transform: translateY(0);
  }

  .fh-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
  }
}