*:has(> *[class*="txt-c"]) {
      text-align: center;
    }

    *:has(> *[class*="txt-r"]) {
      text-align: right;
    }

		html, body {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
}

.page-wrapper {
  flex: 1;
}

.content-wrapper {
  max-width: 100%;
  padding: 0rem;

}

.row {
  margin: 0 auto;
  display:flex;
  flex-wrap: wrap;
}

.col {
  position: relative;
  max-width: 100%;
  flex-basis:100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  align-items: flex-start;
  align-content: flex-start;
}


@media screen and (min-width: 800px) {
  .col{
    flex: var(--span)
  }
}

.block {
  width: 100%;
  height: fit-content;
}

.block + .block {
  margin-top: 1rem;
}
^