.card
  width: 85%
  margin: 0 auto
  margin-bottom: 60px

  @media only screen and (max-width: 680px)
    width: 90%

.brand
  text-align: center

.logo
  width: 500px
  max-width: 100%

.version
  font-size: 2em

.about-chunks
  max-width: 860px
  margin: 80px auto
  display: grid
  grid-template-columns: 1fr 1fr
  grid-gap: 16px

  @media only screen and (max-width: 650px)
    grid-template-columns: 1fr

.chunk
  background-color: var(--bg-color)
  margin: 0
  padding: 18px
  border-radius: 8px
  display: grid
  grid-template: "icon title" auto "icon content" 1fr / auto 1fr
  justify-content: start
  align-items: start
  grid-gap: 6px 14px
  word-break: break-word
  box-shadow: 0px 1px 4px -1px rgba(0, 0, 0, 0.5)

  @each $area in icon title content
    .#{$area}
      grid-area: $area

  .icon
    font-size: 24px

  .title
    margin: 0
