@layer base {
  html {
    font-size: 62.5%;
    scroll-behavior: smooth;
  }

  body {
    font-family: var(--font-family-base);
    font-weight: var(--font-weight-normal);
    font-size: 1.6rem;
    color: var(--color-text);
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-weight: var(--font-weight-bold);
    line-height: 1.2;
    font-feature-settings: "palt" 1;
  }

  p {
    line-height: 1.8;
    margin-top: 0;
    margin-bottom: 1.2em;

    &+p {
      margin-top: 0;
    }
  }

  ul,
  ol,
  dl,
  details {
    line-height: 1.45;
  }

  img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
  }

  a {
    transition: 0.2s;
  }

  @media screen and (max-width: 480px) {
    body {
      font-size: 1.4rem;
    }
  }
}