:root{
  --primary-color: #ED3F08;
  --neutral-100: #0E0F14;
  --neutral-200: #15161C;
  --neutral-300: #2A2B34;
  --neutral-400: #40414A;
  --neutral-500: #575861;
  --neutral-600: #6F7078;
  --neutral-700: #A7A49B;
  --neutral-800: #F9F6EE;
  --neutral-900: #F9F9F9;
}

html, body {
  width: 100%;
  overflow-x: hidden;
}  
body{
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  color:var(--neutral-200);
}
h1, h2, h3, h4, .contact{
  font-family: "Montserrat", sans-serif;
  /* font-family: domine, serif; */
    font-optical-sizing: auto;
    font-style:normal;
    font-weight: 600;
    color: var(--neutral-200);
}
h1{
  font-size: clamp(2.5rem, 8vw, 5rem);
  font-weight: 700;
  color: var(--primary-color);
}
h3{
  font-size: clamp(1.5rem, 2.5vw, 3rem);
  font-weight: 400;
  color: var(--neutral-200);
}
h4{
  font-size: 20px;
  color: var(--primary-color);
}
span{
  color: var(--neutral-800);
}
button{
  padding:8px 16px;
  font-weight: 600;
  text-align: center;
  background: var(--primary-color);
  margin: 12px 0;
  color: var(--neutral-800);
  border: 0;
  border-radius: 8px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

button:hover{
  background-color: var(--neutral-200);
}
.container{
  width:100%;
  min-width:312px;
  padding:16px;
  max-width:1024px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.navbar{
  height: 72px;
  width: 100%;
  display: flex;
  background-color: var(--neutral-200);
  justify-content: space-between;
  align-items: center;
  padding: 0 32px;
}

P{
  line-height: 24px;
}
.spaced-ul{
  line-height: 24px;
  display:flex;
  flex-direction: column;
  gap: 16px;
}

@media (max-width: 830px) {

  .navbar{
    justify-content: center;
  }

}