:root {
  /* FONTS */
  --font-default: 16px;
  --font-medium: 24px;

  /* PALLETE */
  --color-lime-light: #d4fa6f;
  --color-dark-charcoal: #1e1e1e;
  --color-black: #000000;
  --color-white: #ffffff;
  --color-gray-medium: #777777;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Instrument Sans", sans-serif;
}

.wrap {
  display: block;
  padding: 25px 0;
}

.container {
  margin: 0 auto;
  max-width: 960px;
  width: 100%;
}

.main-header {
  display: block;
  padding: 25px 0;
  width: 100%;
}

.logo {
  font-size: var(--font-default);
  font-weight: 700;

  .logo--mobile {
    display: none;
  }
}

.section-title,
.section-subtitle {
  font-size: var(--font-medium);
  font-weight: 700;
}

.section-title {
  margin-bottom: 40px;
}

.section-subtitle {
  font-weight: 500;
  margin-bottom: 30px;
}

footer {
  background: var(--color-black);
  display: block;
  padding: 100px 0 32px;
  width: 100%;
}

footer h2 {
  display: block;
  text-align: center;
  color: var(--color-gray-medium);
  font-size: var(--font-default);
  font-weight: 500;
}

@media screen and (max-width: 959px) {
  .logo {
    .logo--mobile {
      display: block;
    }

    .logo--desktop {
      display: none;
    }
  }

  .container {
    padding: 0 20px;
  }
}

@media screen and (max-width: 759px) {
  .logo {
    .logo--mobile {
      display: block;
    }

    .logo--desktop {
      display: none;
    }
  }

  .container {
    padding: 0 20px;
  }
}