:root{
  --rehost-primary: #15678d;
  --rehost-secondary: #885a87;
  --rehost-accent: #f399b3;

  --rehost-ink: #0f172a;
  --rehost-bg: #ffffff;
  --rehost-surface: #f8fafc;
  --rehost-border: #e2e8f0;

  --rehost-primary-contrast: #ffffff;
  --rehost-focus: #f399b3;
}

body{
  color: var(--rehost-ink);
  background: var(--rehost-bg);
}

a{
  color: var(--rehost-primary);
}

a:hover{
  color: var(--rehost-secondary);
}

.btn,
.button,
a.btn,
button{
  background: var(--rehost-primary) !important;
  color: var(--rehost-primary-contrast) !important;
  border-color: var(--rehost-primary) !important;
}

.btn:hover,
.button:hover,
a.btn:hover,
button:hover{
  background: var(--rehost-secondary) !important;
  border-color: var(--rehost-secondary) !important;
}

.btn-outline,
.button-outline{
  background: transparent !important;
  color: var(--rehost-primary) !important;
  border-color: var(--rehost-primary) !important;
}

.btn-outline:hover,
.button-outline:hover{
  background: var(--rehost-primary) !important;
  color: var(--rehost-primary-contrast) !important;
}

.card,
.panel,
.box,
.pricing-card,
.feature-box{
  background: var(--rehost-surface) !important;
  border-color: var(--rehost-border) !important;
}

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

.card,
.panel,
.box{
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08);
}