/* ---------- WRAPPER RITUEL + DESCRIPTION (panneau commun) ---------- */
.capsule-wrapper-rituel-description {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  align-items: stretch;              /* les deux colonnes prennent toute la hauteur */
  justify-content: center;
  padding: var(--cap-pad-lg) var(--cap-pad-md);
  border-radius: var(--cap-radius-lg);
  background: var(--glass-sm);       /* le grand panneau de fond */
  backdrop-filter: var(--blur-lg);
  -webkit-backdrop-filter: var(--blur-lg);
  box-shadow: var(--cap-shadow-soft);
}

.capsule-rituel-col {
  flex: 0 0 32%;
  min-width: 260px;
}

.capsule-description-col {
  flex: 1 1 0;
  min-width: 320px;
  align-self: stretch;               /* colonne droite = pleine hauteur du wrapper */
}

/* Intérieur RITUEL : on garde le petit carton à gauche */
.capsule-rituel {
  margin: 0;
  padding: var(--cap-pad-md);
  background: var(--glass-xs);
  border-radius: var(--cap-radius-md);
  font-style: italic;
  text-align: center;
}

.capsule-rituel-text {
  font-size: 1.2rem;
  line-height: 1.7;
  color: var(--cap-ink-soft);
  margin: 0 auto;
  max-width: 60ch;
}


/* Intérieur DESCRIPTION : le texte occupe toute la colonne droite */
.capsule-description {
  margin: 0;
  padding: 0;                        /* le wrapper gère déjà le gros padding */
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-radius: 0;
  font-size: 1.1rem;
  color: var(--cap-ink);
  text-align: center;
}

.capsule-description-text {
  /* le texte prend la pleine largeur de la colonne */
  width: 100%;
  max-width: none;                   /* on enlève la limite en ch */
  margin: 0 auto;
  padding: var(--cap-pad-md) var(--cap-pad-lg);
}
/* Colonne DESCRIPTION = conteneur flex qui centre son contenu */
.capsule-wrapper-rituel-description .capsule-description-col {
  flex: 1 1 0;
  min-width: 320px;
  display: flex;
  justify-content: center;
}

/* Le bloc description occupe toute la colonne */
.capsule-wrapper-rituel-description .capsule-description {
  width: 100%;
  margin: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-radius: 0;
}

/* Texte de description plus large et vraiment centré dans la section */
.capsule-wrapper-rituel-description .capsule-description-text {
  width: 100%;
  max-width: 60vw !important;           /* ton souhait: largeur liée au viewport */
  margin-left: auto !important;
  margin-right: auto !important;
  padding: var(--cap-pad-md) var(--cap-pad-lg);
  text-align: center;
}
