$-base-path: '/fonts/' !default;

@font-face {
  font-family: Urbanist;
  font-style: normal;
  font-weight: 800;
  src: local('Urbanist ExtraBold'), local('Urbanist-ExtraBold'),
    url('#{$-base-path}/Urbanist-ExtraBold.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: Urbanist;
  font-style: normal;
  font-weight: 600;
  src: local('Urbanist Bold'), local('Urbanist-Bold'),
    url('#{$-base-path}/Urbanist-Bold.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: Urbanist;
  font-style: normal;
  font-weight: 500;
  src: local('Urbanist Medium'), local('Urbanist-Medium'),
    url('#{$-base-path}/Urbanist-Medium.woff2') format('woff2');
  font-display: swap;
}

@font-face {
  font-family: Urbanist;
  font-style: normal;
  font-weight: 400;
  src: local('Urbanist Regular'), local('Urbanist-Regular'),
    url('#{$-base-path}/Urbanist-Regular.woff2') format('woff2');
  font-display: swap;
}

body {
  font-family: Urbanist, sans-serif;
}

iframe {
  border-radius: 6px;
}

#main-title {
  background: linear-gradient(315deg, #de4b7a 25%, #4162f0);
  background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

:root {
  --c-brand: #de4b7a;
  --c-brand-light: hsl(341deg 64% 61%);
}

html.dark {
  --c-brand: #de4b7a;
  --c-brand-light: #b83e65;
}
