.section {
  align-items: center;
  display: grid;
  margin: 0 auto;
  width: 100%;
}

.form {
  display: grid;
  height: 100%;
}

@media screen and (max-width: 767px) {
  .section {
    max-width: var(--max-width-page);
  }

  .form {
    align-self: flex-start;
  }
}

@media screen and (min-width: 768px) {
  .default {
    border-radius: var(--Corner-radius-md);
  }
}

@media screen and (min-width: 1367px) {
  .default {
    padding: var(--Spacing-x-one-and-half) var(--Spacing-x2)
      var(--Spacing-x-one-and-half) var(--Spacing-x1);
  }

  .full {
    padding: var(--Spacing-x1) 0;
  }

  .form {
    width: 100%;
    max-width: var(--max-width-page);
    margin: 0 auto;
  }

  .compact {
    padding: var(--Spacing-x-one-and-half) var(--Spacing-x2)
      var(--Spacing-x-one-and-half) var(--Spacing-x1);
    white-space: nowrap;
  }
}
