:root {
  --terrakotta: #C07A57;
  --terrakotta-text: #9A5A3B;
  --knapp: #A5613F;
  --dammros: #D4A5A0;
  --dammros-ljus: #EBD3CF;
  --ockra: #CE9B57;
  --beige: #E5D3BC;
  --gradde: #F4EBDD;
  --gradde-ljus: #FBF6EE;
  --mull: #3B2C24;
  --mull-mjuk: #6B5644;
  --typsnitt-rubrik: 'Lora', serif;
  --typsnitt-text: 'Nunito Sans', sans-serif;
}

h1, h2, h3 {
  font-family: var(--typsnitt-rubrik);
  font-weight: 500;
  color: var(--mull);
}

h1 { font-size: 56px; }
h2 { font-size: 36px; }
h3 { font-size: 22px; }

@media (max-width: 1024px) {
  h1 { font-size: 44px; }
  h2 { font-size: 30px; }
  h3 { font-size: 20px; }
}

@media (max-width: 767px) {
  h1 { font-size: 36px; }
  h2 { font-size: 28px; }
  h3 { font-size: 20px; }
}

p {
  font-family: var(--typsnitt-text);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.65;
  color: var(--mull-mjuk);
}

button, .elementor-button {
  background-color: var(--knapp);
  color: var(--gradde-ljus);
  border-radius: 10px;
  padding: 13px 28px;
  font-family: var(--typsnitt-text);
  font-weight: 600;
  text-transform: none;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

button:hover, .elementor-button:hover {
  background-color: #8C5033;
}

.valv-ram {
  border-radius: 999px 999px 0 0;
}

.valv-dorr {
  border-radius: 85px 85px 10px 10px;
}