:root{
    /* Brand blue, matched to the logo mark: #42B4FF = hsl(204,100%,63%) */
    --base-h: 204;
    --base-s: 100%;
    --base-l: 63%;
}

/* Buttons: use the brand blue exactly (not the darkened --base-d-200 shade),
   and keep text black — white on #42B4FF is only 2.3:1 and fails contrast. */
.btn--base{
    background: hsl(var(--base)) !important;
    color: hsl(var(--black)) !important;
}
.btn--base:hover,
.btn--base:active,
.btn--base:focus{
    background: hsl(var(--base-d-100)) !important;  /* 10% darker for hover feedback */
    color: hsl(var(--black)) !important;
}