/* Font families */
:root {
  --font-primary: "Roboto", Arial, sans-serif;
  --font-secondary: "Montserrat", Arial, sans-serif;
}

/* Tipografia */
:root {
  --font-size-xs: 0.75rem; /* 12px */
  --font-size-sm: 0.875rem; /* 14px */
  --font-size-base: 1rem; /* 16px */
  --font-size-lg: 1.125rem; /* 18px */
  --font-size-xl: 1.25rem; /* 20px */
  --font-size-2xl: 1.5rem; /* 24px */
  --font-size-3xl: 1.875rem; /* 30px */
  --font-size-4xl: 2.25rem; /* 36px */
  --font-size-6xl: 3rem; /* 48px */
}

/* Fonte global do site */
html {
  font-family: var(--font-primary);
  font-size: var(--font-size-base);
  line-height: 1.5;
}

p {
  font-family: var(--font-secondary);
  font-size: var(--font-size-base);
  line-height: 1.6;
  margin: 0 0 1rem 0;
}

.ul .li {
  font-family: var(--font-secondary);
  font-size: var(--font-size-base);
  line-height: 1.6;
}

a {
  font-family: inherit;
  text-decoration: none;
  color: inherit;
}

[data-i18n] {
  white-space: pre-line;
}

:root {
  --content-horizontal-padding: 5vw;
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
}

main {
  padding-bottom: 40px;
}

@media (max-width: 800px) {
  * {
    box-sizing: border-box;
  }

  body {
    overflow-x: hidden;
    max-width: 100vw;
  }

  main,
  section {
    max-width: 100vw;
    overflow-x: hidden;
  }

  h1,
  h2,
  h3 {
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
  }
}
