@use '../abstracts/functions' as fn;

$bg: #0C0C0C;
$color: #FFFFFF;
$color-opacity: 0.08;
$color-opacity-hover: 0.12;

:root {
  --content-max-width: 1320px;
  --content-gutter: 20px;

  --bg: #{$bg};
  --color: #{$color};

  --font: 'Atyp Text', sans-serif;
  --title: 'AKONY', sans-serif;
  --font2: 'Stapel', sans-serif;

  --bg-opacity: #{$color-opacity};
  --bg-opacity-hover: #{$color-opacity-hover};

  --gradient: linear-gradient(139deg, #f05 0%, #ff6200 100%);
}

html {
  font-family: var(--font);
  font-weight: normal;
  line-height: 1.25;
  // font-size: fn.fluid(12px, 16px);
  font-size: 1.125vw;
  background: var(--bg);
  color: var(--color);
}

body {
  min-width: 320px;
}

main {
  position: relative;
  z-index: 1;
}