message: make the section explore responsive.
diff: border-radius: 4rem;
  box-shadow: var(--shadow);
  + @media (max-width: 768px) {
  + flex-direction: column;
  + }
  +
  &__text {
  - padding: 0 var(--x-large);
  + padding: 0 var(--large);
  flex: 0 0 45%;
  +
  + @media (max-width: 768px) {
  + padding: var(--micro) var(--xx-small);
  + }
  }
  &__paragraph {
  margin-bottom: var(--x-small);
  +
  + @media (max-width: 768px) {
  + font-size: var(--p-large);
  + }
  }
  &__illustration {
  flex: 1;
  border-radius: inherit;
  + .small {
  + display: none;
  + }
  +
  img {
  border-radius: inherit;
  }
  +
  + @media (max-width: 1020px) {
  + img {
  + display: none;
  + }
  +
  + .small {
  + display: block;
  + padding: var(--small);
  + }
  + }
  +
  + @media (max-width: 768px) {
  + .small {
  + padding: var(--macro) var(--x-small) var(--x-small);
  + }
  + }
  }
  }
  </div>
  <div class="explore__illustration">
  <img src="/explore-illustration.png" alt="Gitpod in a Nutshell" />
  + <img src="/illustration.png" class="small" alt="Gitpod in a Nutshell" />
  </div>
  </div>
  </Section>
  