.main {
  background-color: var(--Base-Surface-Primary-light-Normal);
  display: grid;
  gap: var(--Spacing-x5);
  grid-template-areas: "header" "booking";
  margin: 0 auto;
  min-height: 100dvh;
  padding-top: var(--Spacing-x5);
  width: var(--max-width-page);
}

@media screen and (min-width: 1367px) {
  .main {
    grid-template-areas:
      "header  receipt"
      "booking receipt";
    grid-template-columns: 1fr 340px;
    grid-template-rows: auto 1fr;
    padding-top: var(--Spacing-x9);
  }
}