:root {
  --color-bg: #f4efe6;
  --color-text: #152a35;
  --color-accent: #ff5a36;
  --color-button: #00838f;
  --color-highlight: #ffd24a; /* second bright highlight */
  --font-display: "Segoe UI", system-ui, sans-serif;
  --font-body: Georgia, "Times New Roman", serif;
}

a {
  color: var(--color-button);
}

a:hover {
  color: var(--color-accent);
}

.button,
button[type="submit"] {
  background: var(--color-button);
  color: #fff;
  border: none;
  padding: 0.75rem 1.35rem;
  border-radius: 0.35rem;
}

.button:hover,
button[type="submit"]:hover {
  background: color-mix(in srgb, var(--color-button) 82%, #000);
}

.button-accent {
  background: var(--color-accent);
}

.button-accent:hover {
  background: color-mix(in srgb, var(--color-accent) 85%, #000);
}