@layer shell {
  body {
    font-family: "InterVariable", serif;
    margin: 0;
    padding: 0;
    background-color: #FAFAFA;

    min-height: 100%;
    display: flex;
    flex-direction: column;

    #main {
      flex: 1;

      /* STATIC PAGES CONTENT */

      .fgd-spc-title {
        --neutral-darker: #262626;

        font-size: 1.75rem;
        color: var(--neutral-darker);
        font-weight: 600;
        margin-block: 20px;
      }

      .fgd-spc-body {
        --neutral-darker: #262626;

        margin-block-end: 40px;

        h2 {
          font-size: 1.25rem;
          color: var(--neutral-darker);
          font-weight: 600;
          margin-block: 4px;
        }

        h3 {
          font-size: 1rem;
          color: var(--neutral-darker);
          font-weight: 600;
        }

        ul, ol {
          padding-inline-start: 1.15rem;
          margin-block-end: 0.5rem;
        }

        p {
          margin-block-end: 0.5rem;
        }

        dl {
          display: grid;
          grid-template-columns: auto 1fr;
          margin-block-end: 1rem;

          dt {
            font-size: 1rem;
            color: var(--neutral-darker);
            font-weight: 600;
            margin-inline-end: 8px;
          }

          dd {
          }
        }
      }
    }
  }

  .fgd-container-fluid {
    width: clamp(300px, 100%, 1260px);
    margin: 0 auto;
    padding-inline: 20px;
  }
}