.layout {
  display: grid;
  gap: var(--space-xx-large);
  padding-inline: var(--space-large);
  position: relative;
}

.layout__headline {
  display: grid;
  gap: var(--space-xx-large);
}

.layout__content {
  display: grid;
}



.layout--index {
  gap: normal;
}



@media(min-width: 64em) {

  .layout {
    padding-inline: var(--space-xx-large);
  }

  .layout--index {
    padding-inline: var(--space-xxxx-large);
  }

  .layout--left .layout__headline .logo {
    justify-self: start;
  }

  .layout--left .layout__headline .headline header,
  .layout--left .layout__headline .headline article {
    margin-inline: initial;
    text-align: left;
  }

  .layout--pricing {
    gap: var(--space-xx-large) 4em;
    grid-template-columns: repeat(20, 1fr);
  }

  .layout--pricing .layout__headline {
    align-content: start;
    grid-column: span 9;
  }

  .layout--pricing .layout__content {
    align-content: start;
    grid-column: 10 / span 11;
  }

}