.app {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  min-block-size: 100dvh;
}

.app__main {
  display: flex;
  flex-direction: column;
  min-inline-size: 0;
  overflow-x: clip;
}

.app__content {
  flex: 1;
}

.view[hidden] {
  display: none;
}

.view > .section:first-child {
  border-block-start: 0;
}

.no-js .view + .view {
  border-block-start: 1px solid var(--color-line-soft);
}

@media (min-width: 940px) {
  .app {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
  }

  .app__main .container {
    max-inline-size: 1560px;
    margin-inline: auto;
    padding-inline: clamp(40px, 4.5vw, 80px);
  }
}

.app__content:focus,
.app__content:focus-visible {
  outline: none;
}