*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;

  --color-bg: #f6f3ee;
  --color-action-primary: #4e6378;
  --color-text: #ecf0f1;

  --border-radius-medium: 0.65rem;
}

* {
  line-height: calc(1em + 0.5rem);
}

body {
  background-color: var(--color-bg);
  background-position:
    0px 0px,
    50px 50px;
  background-size: 30px 30px;
  background-repeat: repeat;
  background-image: radial-gradient(rgba(0, 0, 0, 0.23) 5%, transparent 5%);
  font-family: "Source Sans Pro", system-ui, sans-serif;
  display: flex;
  flex-direction: column;
  max-width: 75%;
  margin: 0 auto;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}