/* Boutons partagés hors home (la home garde .button de hero.css). Hauteur unique --btn-height. */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: var(--btn-height); padding: 0 28px; border-radius: var(--r-control);
  font-family: var(--font-sans); font-size: var(--fs-base); font-weight: 600; line-height: 1.2; text-align: center; cursor: pointer; border: 1.5px solid transparent;
  transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.btn--primary { background: var(--color-ember); color: var(--color-paper); }
.btn--primary:hover { background: var(--color-ember-dark); }
.btn--secondary { background: var(--color-forest); color: var(--color-paper); }
.btn--secondary:hover { background: var(--color-forest-dark); }
.btn--outline { background: transparent; color: var(--color-ink); border-color: var(--color-ink); }
.btn--outline:hover { background: var(--color-ink); color: var(--color-paper); }
.btn:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.btn[disabled], .btn[aria-disabled="true"] { background: var(--color-border); color: var(--color-text-muted); border-color: transparent; cursor: not-allowed; }
.btn.is-loading { position: relative; cursor: progress; }
.btn.is-loading::before { content: ""; width: 16px; height: 16px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: btn-spin 700ms linear infinite; }
@keyframes btn-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .btn.is-loading::before { animation-duration: 2s; } }