/*
  defines fonts, paragraphs and headings

  links
  headings
*/



@layer common-styling {

  /* links
  ============================================================================ */
  a {
    color: var(--pos-color-interactive);

    transition: color .1s linear;
  }

  a:hover {
    color: var(--pos-color-interactive-hover);
  }

  a:active {
    color: var(--pos-color-interactive-active)
  }

  a:focus-visible {
    color: var(--pos-color-interactive-hover);
  }


  /* headings
  ============================================================================ */
  .pos-heading-1 {

  }

  .pos-heading-2 {
    display: block;

    font-family: var(--pos-font-heading);
    font-size: 2rem;
    font-weight: 500;
  }

}