/**
 * C2S — Bouton minimal (texte + character stagger hover uniquement)
 *
 * Pas de background, pas d'icône, pas de cercle directionnel.
 * Juste le texte avec l'animation Osmo character stagger au hover.
 *
 * HTML requis :
 *   <a href="#" class="c2s-btn-min">
 *       <span data-button-animate-chars class="c2s-btn-min__label">Texte</span>
 *   </a>
 *
 * JS : bouton.js (initButtonCharacterStagger) gère le split des caractères.
 */


/* ============================================
   Base
   ============================================ */
.c2s-btn-min {
    cursor: pointer;
    text-decoration: none;
    color: var(--color-heading);
    display: inline-flex;
    align-items: center;
    position: relative;
}


/* ============================================
   Label
   ============================================ */
.c2s-btn-min__label {
    white-space: nowrap;
    font-size: var(--16px-size);
    font-weight: 500;
    line-height: 1.2;
    padding-bottom: .05em;
}


/* ============================================
   Character stagger (même système que c2s-btn)
   ============================================ */
.c2s-btn-min [data-button-animate-chars] {
    overflow: hidden;
    position: relative;
    display: inline-block;
}

.c2s-btn-min [data-button-animate-chars] span {
    display: inline-block;
    position: relative;
    text-shadow: 0px 1.3em currentColor;
    transform: translateY(0em) rotate(0.001deg);
    transition: transform 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}

@media (hover: hover) and (pointer: fine) {
    .c2s-btn-min:hover [data-button-animate-chars] span {
        transform: translateY(-1.3em) rotate(0.001deg);
    }
}

/* Mobile / tactile / ≤ 991px : pas d'effet hover possible donc le
   text-shadow 1.3em reste visible et duplique chaque caractère. On le coupe. */
@media (hover: none),
       (pointer: coarse),
       not all and (hover: hover),
       screen and (max-width: 991px) {
    .c2s-btn-min [data-button-animate-chars] span {
        text-shadow: none !important;
    }
}