Card minimaliste sans image

<style>
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@400;500;600&display=swap');

.bn-card-min {
  --bn-card-min-accent: #E6E4DD;

  position: relative;
  overflow: hidden;

  max-width: 320px;
  padding: 1.75rem;
  font-family: 'Inter', sans-serif;

  background: #1D2324;
  border-radius: 4px;
}

/* Anneau décoratif discret, dans le style "cercle" de Blaig Nova */
.bn-card-min__ring {
  position: absolute;
  right: -30px;
  bottom: -30px;
  width: 110px;
  height: 110px;
  border-radius: 50%;
  border: 10px solid var(--bn-card-min-accent);
  opacity: 0.08;
}

.bn-card-min__kicker {
  position: relative;
  display: block;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #979793;
  margin-bottom: 0.5rem;
}

.bn-card-min__title {
  position: relative;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.7rem;
  letter-spacing: 0.02em;
  color: #E6E4DD;
  margin: 0 0 0.75rem;
}

.bn-card-min__text {
  position: relative;
  font-size: 0.85rem;
  color: #979793;
  line-height: 1.6;
  margin: 0 0 1.25rem;
  max-width: 220px;
}

.bn-card-min__link {
  position: relative;
  color: var(--bn-card-min-accent);
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 600;
}

.bn-card-min__link:hover {
  text-decoration: underline;
}

</style>

<article class="bn-card-min" data-fx-root>
  <span class="bn-card-min__ring" aria-hidden="true"></span>

  <span class="bn-card-min__kicker">Collection</span>
  <h3 class="bn-card-min__title">Signal</h3>
  <p class="bn-card-min__text">
    Une collection de pièces visuelles et sonores inspirées par l'invisible.
  </p>
  <a href="#" class="bn-card-min__link">Découvrir →</a>
</article>