:root {
  --dh-primary: #2b59c3;
  --dh-accent: #17a2b8;
  --dh-bg: #f7f9fc;
  --dh-text: #1b1f24;
}

body {
  color: var(--dh-text);
  background-color: #fff;
}
.hero-bg {
  background: linear-gradient(180deg, var(--dh-bg), #ffffff);
}
.btn-primary,
.card-header.bg-primary {
  background-color: var(--dh-primary) !important;
  border-color: var(--dh-primary) !important;
}
.btn-outline-primary {
  color: var(--dh-primary);
  border-color: var(--dh-primary);
}
.btn-outline-primary:hover {
  background-color: var(--dh-primary);
  color: #fff;
}
a {
  color: var(--dh-primary);
}
a:hover {
  color: #1f4091;
}

details {
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  background: #fff;
}
details[open] {
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.05);
}

.card {
  border-radius: 0.75rem;
}
.navbar-brand {
  letter-spacing: 0.2px;
}

:focus-visible {
  outline: 3px solid var(--dh-accent);
  outline-offset: 2px;
}