@import url('https://fonts.googleapis.com/css2?family=Betania+Patmos&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Space+Grotesk:wght@300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap');

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  background: var(--main-background);
  scroll-behavior: smooth;
  scrollbar-width: thin;
  display: flex;
  flex-direction: column;
}

:root {
  --master-font: "Betania Patmos", cursive;
  --main-font: "Caveat", cursive;
  --secondary-font: "Patrick Hand", cursive;
  --base-font: "Inter", sans-serif;

  --primary-color: #040d29;
  --secondary-color: #fff;
  --base-color: #a8a8a8;
  --navbar-color: #0303031c;
  --shadow-color: #000;
  --projectbtn-hover-color: #081846;

  --main-background: linear-gradient(to bottom right,#040d299c,rgb(0, 0, 0));
}