:root {
  --color-tan: #734b34;
  --color-teracota: #a67458;
  --color-ivory: #fcfcfcff;
  --color-teal: #729a94;
  --color-lagoon: #3e5f5c;
  --color-sand: #e6d5c3;
  --color-navy: #011b2f;
  --color-gold: #ffb915;
  --color-bg-hero: #734b348a;
}
.clip-diagonal {
  clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
}
.card {
  padding-top: 10px;
  background-color: var(--color-teal);
  border: 2px solid var(--color-teal);
}
.treatment {
  color: var(--color-ivory);
  padding: 10px 3px 3px 3px;
  background: var(--color-teal);
  border: 1px solid var(--color-teal);
  border-radius: 23% 3% 23% 3%;
}
.treatment:hover {
  background: var(--color-lagoon);
  transform: scale(1.05);
  border: 1px solid var(--color-lagoon);
}

.treatment div {
  border: 1px solid var(--color-black);
  border-radius: 25% 3% 25% 3%;
}
ul {
  list-style-type: disc;
  list-style-position: outside;
  margin: 25px;
}
ol {
  list-style-type: decimal;
  list-style-position: outside;
  margin: 25px;
}

nav ul {
  list-style-type: none;
  margin: 2px;
}

footer ul {
  list-style-type: none;
}
margin: 2px;