/* CSS MOBILE – La Crevette Rose
   Règles chargées seulement sur les écrans de 767px ou moins.
   Ce fichier complète le style général : tes changements ici n'affectent pas l'ordinateur. */

/* Décompte des trois coups clairement visible sur smartphone */
.compte-mobile{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:120;min-width:110px;min-height:110px;display:grid;place-items:center;border-radius:60px;background:#17101ae8;color:#fff;font:900 4.5rem/1 'Fraunces',serif;text-shadow:0 2px 10px #000;box-shadow:0 0 0 4px #e0a73c,0 15px 40px #0009;pointer-events:none}
/* Fenêtre photo adaptée au téléphone */
.photo-dialog-contenu{padding:48px 37px 15px}
.photo-dialog img{max-height:calc(90vh - 110px)}
.photo-dialog .photo-precedente{left:0}.photo-dialog .photo-suivante{right:0}
.accroche {
    font-size: clamp(1.2rem, 6vw, 4.8rem);
    font-weight: 900;
    margin-bottom: 18px;
}
.accroche em {
    color: var(--rose);
    font-style: italic;
    display: inline-block;
    animation: wob 3s ease-in-out infinite;
}
.reveal.lead.rich-content.vu {
    padding: 36px 9vw;
}
section {
    padding: 20px 6vw;
    position: relative;
}
.actualites-grille {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 26px;
    margin-top: 25px;
}

/* Cartes de la troupe : hauteur adaptée au texte */
#liste-troupe .carte {
  height: auto !important;
  min-height: 360px;
}

#liste-troupe .carte .in {
  display: grid;
  height: auto !important;
  min-height: 360px;
}

#liste-troupe .carte .face {
  position: relative;
  grid-area: 1 / 1;
  height: 100%;
  box-sizing: border-box;
}

#liste-troupe .carte .face.ar {
  padding: 22px 18px;
}
/* Biographies de la troupe sur téléphone */
@media (max-width: 767px) {
  #liste-troupe .carte .face.ar .rich-content {
    font-size: 13px !important;
    line-height: 1.45 !important;
  }

  #liste-troupe .carte .face.ar .rich-content p {
    font-size: inherit !important;
    line-height: inherit !important;
    margin: 0 0 10px !important;
  }
}
#retour-haut {
  display:none;
    position: fixed;
    right: 20px;
    bottom: 70px;
    z-index: 75;
    width: 46px;
    height: 46px;
    border: 2px solid var(--noir);
    border-radius: 50%;
    background: var(--rose);
    color: #fff;
    box-shadow: 0 4px 12px #0003;
    font: bold 1.6rem sans-serif;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(12px);
    transition: opacity .2s, transform .2s;
}
#mascotte {
  display:none;
    position: fixed;
    right: 10px;
    bottom: 0;
    z-index: 70;
    background: none;
    border: 0;
    cursor: pointer;
    transform: translateY(40%);
    transition: transform .5s cubic-bezier(.3, 1.6, .5, 1);
}
span.bs-affiche-zoom {
    display: none !important;
}
#prologue .bandeau-wrap {
    display: block;
    width: 100vw !important;
    max-width: 100vw !important;
    margin: 0 0 30px calc(50% - 50vw) !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    overflow: hidden;
}
p.crevette {
    font-size: 18px;
    font-weight: 900;
    margin-top: -60px;
}
#contact .reveal.lead.rich-content.vu {
    /* display: none; */
    margin-top: -70px;
}
form#form {
    margin-top: -10px;

  .actualites-carrousel .actualite-carte {
    box-sizing: border-box;
    flex: 0 0 calc((100% - 48px) / 3);
    min-width: 0;
    scroll-snap-align: start;
}