/* =========================================================
   FAIR FUTURE – TOKENS & UTILITAIRES (ne casse rien)
   ========================================================= */

:root {
  /* Couleurs principales */
  --fff-blue:        #4267b2;
  --fff-blue-dark:   #314c8a;
  --fff-blue-soft:   #e5ecfb;
  --fff-blue-pale:   #eff4ff;

  /* Texte */
  --fff-text-main:   #111827;
  --fff-text-body:   #4b5563;
  --fff-text-muted:  #6b7280;

  /* Bordures / fonds */
  --fff-border-soft: #e5e7eb;
  --fff-border-mid:  #d1d5db;
  --fff-bg-card:     #ffffff;

  /* Rayons */
  --fff-radius-sm:   4px;
  --fff-radius-pill: 9999px;

  /* Ombres */
  --fff-shadow-card:       0 10px 22px rgba(15, 23, 42, 0.06);
  --fff-shadow-card-hover: 0 16px 30px rgba(15, 23, 42, 0.12);

  /* Durées */
  --fff-transition-fast:   0.15s ease;
  --fff-transition-card:   0.18s ease;
}

/* Carte standard réutilisable */
.fff-card {
  background-color: var(--fff-bg-card);
  border-radius: var(--fff-radius-sm);
  border: 1px solid var(--fff-border-soft);
  box-shadow: var(--fff-shadow-card);
  padding: 1rem;
  transition:
    transform var(--fff-transition-card),
    box-shadow var(--fff-transition-card),
    border-color var(--fff-transition-card),
    background-color var(--fff-transition-card);
}

.fff-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--fff-shadow-card-hover);
  border-color: rgba(66, 103, 178, 0.45);
}

/* Bouton bleu générique (si besoin) */
.fff-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 1.4rem;
  border-radius: var(--fff-radius-pill);
  border: 1px solid var(--fff-blue);
  background-color: var(--fff-blue);
  color: #ffffff;
  font-size: 0.88rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition:
    background-color var(--fff-transition-fast),
    box-shadow var(--fff-transition-fast),
    transform var(--fff-transition-fast);
}

.fff-btn-primary:hover {
  background-color: var(--fff-blue-dark);
  transform: translateY(-1px);
}
