/* Components: buttons
 * Rôle: styles des CTA réutilisables (.btn, .btn-primary, .btn-secondary).
 * Dépendances: tokens.css pour couleurs et rayons.
 * Note: garder des interactions légères pour limiter le coût au scroll.
 */
.btns{display:flex; gap:14px; flex-wrap:wrap; margin-top:26px}

.btn{
  display:inline-block;
  padding:14px 22px;
  border-radius:16px;
  font-weight:700;
  font-size:14px;
  text-decoration:none;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
}

.btn:hover{transform:translateY(-1px)}

.btn-primary{
  background:linear-gradient(90deg, var(--accent), var(--accent2));
  color:#172338;
  border:1px solid transparent;
}

.btn-secondary{
  background:rgba(255,255,255,.04);
  color:var(--text);
  border:1px solid rgba(127,208,210,.18);
}