/* FAQ SARL Senez : accordéons inspirés du rendu de référence, adaptés aux couleurs du site. */

.faq-grid{align-items:start!important}
.faq-grid>div:first-child{position:static!important;top:auto!important;align-self:start!important;transform:none!important}

.faq-list{
  display:grid!important;
  gap:16px!important;
  border:0!important;
  margin:0!important;
  align-self:start!important;
}

.faq-list details{
  position:relative!important;
  margin:0!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #e6e2cb!important;
  border-radius:22px!important;
  box-shadow:0 8px 24px rgba(24,28,33,.07)!important;
  transform:none!important;
  transition:border-color .24s ease,box-shadow .24s ease!important;
}
.faq-list details:hover{border-color:#dfd29b!important;box-shadow:0 11px 28px rgba(24,28,33,.09)!important}
.faq-list details.is-open{
  border-color:#dfc84f!important;
  box-shadow:0 12px 24px rgba(24,28,33,.09),0 20px 20px -18px rgba(24,28,33,.34)!important;
}

/* L'en-tête devient une vraie carte au-dessus du corps de réponse, comme sur la référence. */
.faq-list summary{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  min-height:94px!important;
  margin:-1px -1px 0!important;
  padding:24px 30px 24px 32px!important;
  border:1px solid #e5e1ca!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 2px 0 rgba(32,34,38,.015)!important;
  list-style:none!important;
  cursor:pointer!important;
  color:#24272b!important;
  font-size:1.08rem!important;
  font-weight:750!important;
  line-height:1.35!important;
  letter-spacing:-.015em!important;
  transition:color .2s ease,border-color .22s ease,box-shadow .22s ease!important;
}
.faq-list summary::-webkit-details-marker{display:none!important}
.faq-list details:hover summary{border-color:#ddd3a5!important}
.faq-list details.is-open summary{
  color:#5f4b00!important;
  border-color:#dec94f!important;
  box-shadow:0 6px 16px rgba(65,55,10,.08)!important;
}

/* Bouton rond et vrai chevron symétrique, parfaitement centré. */
.faq-list summary>span{
  position:relative!important;
  display:block!important;
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:50%!important;
  background:#f5ce19!important;
  color:#202226!important;
  box-shadow:none!important;
  font-size:0!important;
  transform:none!important;
  transition:background .22s ease,color .22s ease!important;
}
.faq-list summary>span::before,
.faq-list summary>span::after{
  content:'';
  position:absolute;
  top:50%;
  width:8px;
  height:2px;
  border-radius:999px;
  background:currentColor;
  transition:transform .28s cubic-bezier(.2,.75,.25,1);
}
.faq-list summary>span::before{
  left:11px;
  transform:translateY(-1px) rotate(45deg);
  transform-origin:right center;
}
.faq-list summary>span::after{
  right:11px;
  transform:translateY(-1px) rotate(-45deg);
  transform-origin:left center;
}
.faq-list details.is-open summary>span{background:#202226!important;color:#f5ce19!important}
.faq-list details.is-open summary>span::before{transform:translateY(-1px) rotate(-45deg)}
.faq-list details.is-open summary>span::after{transform:translateY(-1px) rotate(45deg)}

/* L'enveloppe extérieure est réellement à 0 px fermée. Tout l'espacement vit dans le conteneur intérieur. */
.faq-list details>div{
  position:relative!important;
  z-index:1!important;
  box-sizing:border-box!important;
  height:0;
  min-height:0!important;
  overflow:hidden!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:#fff!important;
  color:#4e565f!important;
  font-size:.98rem!important;
  line-height:1.72!important;
  opacity:0;
  transform:translateY(-4px);
  animation:none!important;
}
.faq-answer-inner{
  position:relative;
  box-sizing:border-box;
  padding:18px 34px 28px 52px;
}
.faq-answer-inner::before{
  content:'';
  position:absolute;
  left:32px;
  top:20px;
  bottom:30px;
  width:2px;
  border-radius:999px;
  background:#f5ce19;
  opacity:.7;
}
.faq-answer-inner p{margin:0 0 10px!important}
.faq-answer-inner p:last-child{margin-bottom:0!important}
.faq-answer-inner a{font-weight:700;color:#5f4b00}

.faq-list details.faq-js-ready>div{display:block!important}
.faq-list details.is-faq-animating>div{will-change:height,opacity,transform}

/* Même langage visuel sur la page FAQ complète. */
.legal-page:has(.faq-list) .faq-list{margin-top:32px!important}
.legal-page:has(.faq-list) .container.narrow{max-width:1040px!important}

@media(max-width:760px){
  .faq-list{gap:12px!important}
  .faq-list details,.faq-list summary{border-radius:17px!important}
  .faq-list summary{
    min-height:76px!important;
    padding:18px 16px 18px 19px!important;
    gap:15px!important;
    font-size:.96rem!important;
  }
  .faq-list summary>span{
    flex-basis:32px!important;
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
  }
  .faq-list summary>span::before,.faq-list summary>span::after{width:7px}
  .faq-list summary>span::before{left:9px}
  .faq-list summary>span::after{right:9px}
  .faq-answer-inner{
    padding:15px 18px 22px 36px;
    font-size:.91rem!important;
  }
  .faq-answer-inner::before{left:20px;top:17px;bottom:24px}
}

@media(prefers-reduced-motion:reduce){
  .faq-list details,.faq-list summary,.faq-list summary>span,.faq-list summary>span::before,.faq-list summary>span::after{transition:none!important}
}
