@import url('https://indestructibletype.com/fonts/Jost.css');

html {
  font-size: 62.5%;

  @media (min-width: 360px) {
    font-size: 68.75%;
  }
  @media (min-width: 420px) {
    font-size: 81.25%;
  }
  @media (min-width: 500px) {
    font-size: 87.5%;
  }
}

body {
  margin: 0;
  background-color: $background-body;
  background-image: url('ice.svg');
  color: $color-main;
  font-family: 'Jost', sans-serif;
  font-size: 1.6em;
  text-align: center;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  white-space: nowrap;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

@mixin stretch {
  flex-basis: 0;
  flex-grow: 1;
}

@import url('https://indestructibletype.com/fonts/Jost.css');

html {
  font-size: 62.5%;

  @media (min-width: 360px) {
    font-size: 68.75%;
  }
  @media (min-width: 420px) {
    font-size: 81.25%;
  }
  @media (min-width: 500px) {
    font-size: 87.5%;
  }
}

body {
  margin: 0;
  padding-bottom: 1rem;
  background-color: $background-body;
  background-image: url('ice.svg');
  color: $color-main;
  font-family: 'Jost', sans-serif;
  font-size: 1.6em;
  text-align: center;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: auto;
  margin: 0;
  padding: 0;
  border: 0;
  white-space: nowrap;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

@mixin stretch {
  flex-basis: 0;
  flex-grow: 1;
}

Add a little bottom padding to body
Add a little bottom padding to body

This moves the bottom of the content above the horizontal bar in full
screen iOS Safari.
