@import "./desktop.css" screen and (min-width: 1401px);
@import "./mobile.css" screen and (max-width: 1400px);

:root {
  --bg-body: #000;
  --bg-secondary: #090a0b;
  --bg-border: #c7cacc;
  --bg-border-muted: #4a4a4a;
  --bg-tertiary: #16191d;
  --bg-light: #191816;
  --bg-gray: #efefef;
  --bg-green: #4fff03;
  --bg-blue: #0274ff;
  --fg-body: #fff;
  --fg-secondary: #090a0b;
}

.theme-inverted {
  --bg-body: #fff;
  --bg-secondary: #fff;
  --bg-border: #c7cacc;
  --bg-tertiary: #eee;

  --fg-body: #000;
  --fg-secondary: #fff;

  background-color: var(--bg-secondary);
  color: var(--fg-body);
}

* {
  box-sizing: border-box;
  scrollbar-width: thin;
  word-wrap: break-word;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  padding: 0;
  margin: 0;
}

a.link-styled {
  text-decoration: none;
  font-weight: 700;
  color: inherit;
  vertical-align: top;
}

a.link-styled {
  background-image: linear-gradient(#ffffff00 50%, #006aeb 50%);
  background-size: auto 175%;
  transition: background 0.3s ease-in-out;
}

a.link-styled:hover {
  background-position-y: 100%;
}

p {
  margin: 1rem 0;
}

body {
  width: 100vw;

  padding: 0;
  margin: 0;

  background-color: var(--bg-body);
  color: var(--fg-body);
  overflow-x: hidden;
}

@font-face {
  font-family: "Source Sans Bold";
  src:
    local("Source Sans"),
    local("Source Sans Bold"),
    url("./fonts/SourceSans3-Bold.ttf.woff") format("woff"),
    url("./fonts/SourceSans3-Bold.ttf.woff2") format("woff2");
}

@font-face {
  font-family: "Source Sans SemiBold";
  src:
    local("Source Sans"),
    local("Source Sans Semibold"),
    url("./fonts/SourceSans3-Semibold.ttf.woff") format("woff"),
    url("./fonts/SourceSans3-Semibold.ttf.woff2") format("woff2");
}

@font-face {
  font-family: "Source Sans Regular";
  src:
    local("Source Sans"),
    local("Source Sans Regular"),
    url("./fonts/SourceSans3-Regular.ttf.woff") format("woff"),
    url("./fonts/SourceSans3-Regular.ttf.woff2") format("woff2");
}

@font-face {
  font-family: "Source Sans Light";
  src:
    local("Source Sans"),
    local("Source Sans Light"),
    url("./fonts/SourceSans3-Light.ttf.woff") format("woff"),
    url("./fonts/SourceSans3-Light.ttf.woff2") format("woff2");
}

.font-body-lg-bold {
  font-family: "Source Sans Bold", sans-serif;
  font-size: 23px;
  font-style: normal;
  font-weight: 700;
  line-height: 29.9px; /* 130% */
  letter-spacing: -0.115px;
}

.font-body-lg-semibold {
  font-family: "Source Sans SemiBold", sans-serif;
  font-size: 23px;
  font-style: normal;
  font-weight: 600;
  line-height: 29.9px; /* 130% */
  letter-spacing: -0.115px;
}

.font-body-lg {
  font-family: "Source Sans Regular", sans-serif;
  font-size: 23px;
  font-style: normal;
  font-weight: 400;
  line-height: 29.9px; /* 130% */
  letter-spacing: -0.115px;
}

.font-xxl {
  font-family: "Source Sans Bold", sans-serif;
  font-size: 64px;
  font-style: normal;
  font-weight: 700;
  line-height: 70.4px; /* 110% */
  letter-spacing: -1.28px;
}

.font-xl {
  font-family: "Source Sans Bold", sans-serif;
  font-size: 52px;
  font-style: normal;
  font-weight: 700;
  line-height: 57.2px; /* 110% */
  letter-spacing: -1.04px;
}

.font-s {
  font-family: "Source Sans Regular", sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 400;
  line-height: 36.4px; /* 130% */
  letter-spacing: -0.42px;
}

.font-m {
  font-family: "Source Sans Regular", sans-serif;
  font-size: 34px;
  font-style: normal;
  font-weight: 400;
  line-height: 44.2px; /* 130% */
  letter-spacing: -0.68px;
}

.font-m-light {
  font-family: "Source Sans Light", sans-serif;
  font-size: 34px;
  font-style: normal;
  font-weight: 300;
  line-height: 44.2px; /* 130% */
  letter-spacing: -0.68px;
}

.font-m-semibold {
  font-family: "Source Sans SemiBold", sans-serif;
  font-size: 34px;
  font-style: normal;
  font-weight: 600;
  line-height: 44.2px; /* 130% */
  letter-spacing: -0.68px;
}

.font-l {
  font-family: "Source Sans SemiBold", sans-serif;
  font-size: 42px;
  font-style: normal;
  font-weight: 600;
  line-height: 46.2px; /* 110% */
  letter-spacing: -0.84px;
}

.font-body {
  font-family: "Source Sans Regular", sans-serif;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 25.5px; /* 150% */
  letter-spacing: 0.085px;
}

.font-xl {
  font-family: "Source Sans Bold", sans-serif;
  font-size: 52px;
  font-style: normal;
  font-weight: 700;
  line-height: 57.2px; /* 110% */
  letter-spacing: -1.04px;
}

.font-caption {
  font-family: "Source Sans Regular", sans-serif;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 22.5px; /* 150% */
  letter-spacing: 0.075px;
}

.font-caption-sm {
  font-family: "Source Sans Regular", sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 19.2px; /* 160% */
  letter-spacing: 0.12px;
}

.text-center {
  text-align: center;
}

.text-nowrap {
  white-space: nowrap;
}

.centered {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  margin-left: auto;
  margin-right: auto;
}
