/* Default / Primary Button */

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


.button--primary {
    background-color:var(--trust);
    border-color:var(--trust);
    color:var(--attitude);
}
.button--primary:hover {
    background-color:var(--trust-300);
    border-color:var(--trust-300);
    color:var(--attitude-300);
}
.button--primary:focus,
.button--primary:focus-visible{
    background-color:var(--trust-300);
    border-color:var(--accent);
}
.button--primary:active {
    background-color:var(--attitude);
    border-color:var(--trust-300);
}

/* Secondary Button */

.button--secondary {
    background-color:var(--ambience);
    border-color:var(--ambience);
    color:var(--trust);
}
.button--secondary:hover {
    background-color:var(--ambience-500);
    border-color:var(--ambience);
}
.button--secondary:focus,
.button--secondary:focus-visible{
    background-color:var(--ambience-500);
    border-color:var(--accent);
}
.button--secondary:active {
    background-color:var(--ambience-500);
    border-color:var(--trust);
}




.hero-section--content_dark .button__container {
    .button {
        background-color:var(--trust-300);
        border-color:var(--trust-300);
    }
    .button:hover {
        background-color:var(--trust-200);
        border-color:var(--trust-200);
    }
    .button:focus,
    .button:focus-visible{
        background-color:var(--trust-300);
        border-color:var(--accent);
    }
    .button:active {
        background-color:var(--trust-100);
        border-color:var(--trust-100);
    }
}