.btn-container { display: flex; flex-wrap: wrap; align-items: center; gap: var(--button-gap); }
.btn {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    min-height: 58px;
    max-width: 100%;
    padding: 17px 27px;
    border: 1px solid transparent;
    border-radius: 0;
    text-align: center;
    font-family: var(--sans-font-family);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .02em;
    cursor: pointer;
    transition: background var(--transition-medium), color var(--transition-medium), border-color var(--transition-medium);
}
.btn--primary { background: var(--color-primary); border-color: var(--color-primary); color: #1c251f; }
.btn--primary:hover { background: var(--color-primary-light); border-color: var(--color-primary-light); }
#VaultBtn:hover { background: transparent; border-color: #c6a667; color: var(--color-white); }
.btn--secondary { background: transparent; border-color: #ffffff6b; color: var(--color-white); }
.btn--secondary:hover { background: var(--color-white); border-color: var(--color-white); color: var(--color-black); }
.btn--dark { background: var(--color-black); color: var(--color-white); border-color: var(--color-black); }
.btn--dark:hover { background: #36413a; border-color: #36413a; }
.btn--nav { min-height: 44px; padding: 12px 18px; background: transparent; border-color: #ffffff73; color: white; }
.btn--nav:hover { background: #c6a667; border-color: #c6a667; color: var(--color-black); }
.text-link { display: inline-flex; align-items: center; justify-content: center; gap: 18px; min-height: 44px; font-size: 14px; font-weight: 500; border-bottom: 1px solid currentColor; padding: 8px 0; transition: color var(--transition-fast); }
.text-link:hover { color: #8a692f; }
.arrow { width: 18px; height: 18px; flex: 0 0 18px; }
@media (max-width: 600px) {
    .btn-container { align-items: stretch; }
    .btn-container > .btn { width: 100%; }
}