:root {
  --container: 1118px;
  --text: #102639;
  --gray-bg: #576f7e;
  --brand-green: #93c134;
  --hero-bg-top: #89aeca;
  --main-bg: #CAE0E9;
  --hero-bg-bottom: #bfd6e7;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  color: var(--text);
  background: var(--main-bg);
  font-family: "Open Sans", Arial, sans-serif;
  line-height: 1.5;
}

.container {
  width: min(var(--container), calc(100% - 48px));
  margin-inline: auto;
}

.front-title {
  margin: 0 0 56px;
  font-family: "Rubik", sans-serif;
  text-transform: uppercase;
  font-weight: 800;
  font-size: 45px;
  color: #ffffff;
  line-height: 1;
  text-shadow:
    0.3px 0.3px 0 #000000ab,
    1px 1px 2.3px #00000045;
}


@media (max-width: 760px) {
  .container {
    width: min(var(--container), calc(100% - 28px));
  }
}