* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

:root {
  --black: #000000;
  --gray: #7b7b7b;
  --soft: #f1ece1;
  --brown: #bca669;
  --white: #ffffff;
  --warm: #d47d2d;
  --light-warm: #fff3e8;
  --dark-warm: #a76324;
  --red: #b20000;
  --light-red: #fc4a4a;
  --blue: #0038bb;
  --green: #2aff46;
  --background: #fafafa;
  --gray-border: #c9c9c9;
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--background);
  color: var(--black);
  font-family: "Inter";
}

header,
main,
footer,
section {
  width: 100%;
}

img {
  width: 100%;
  height: auto;
  display: block;
}

a {
  text-decoration: none;
  color: var(--black);
}

button {
  background: none;
  border: none;
  cursor: pointer;
}

ul,
li {
  list-style: none;
}

.md-show {
  display: none;
}

@media (max-width: 768px) {
  .md-show {
    display: block;
  }
  .md-hide {
    display: none;
  }
}