/* ============================================================
   Firmin — conseiller virtuel (voir assets/js/conseiller.js)
   Discret : un disque de 58 px en bas à droite, la fenêtre
   ne s'ouvre qu'à la demande. Couleurs de la charte (site.css).
   ============================================================ */
.firmin{
  --firmin-bas:0px;
  position:fixed;right:clamp(12px,2.4vw,24px);bottom:calc(var(--firmin-bas) + clamp(12px,2.4vw,22px));
  z-index:880;
  display:flex;flex-direction:column;align-items:flex-end;gap:12px;
  font-family:"Montserrat","Segoe UI",Helvetica,Arial,sans-serif;
  transition:bottom .3s ease;
  pointer-events:none;
}
.firmin[hidden]{display:none}
.firmin>*{pointer-events:auto}
.firmin-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- le lanceur ---------- */
.firmin-lanceur{
  width:58px;height:58px;padding:0;border-radius:50%;cursor:pointer;
  background:var(--ground-2,#FCFBF7);
  border:2px solid var(--emerald,#1F4D3A);
  box-shadow:0 2px 4px rgba(20,63,36,.12),0 10px 24px -10px rgba(20,63,36,.45);
  display:grid;place-items:center;overflow:hidden;
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease;
}
.firmin-lanceur:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 3px 6px rgba(20,63,36,.14),0 14px 30px -10px rgba(20,63,36,.5)}
.firmin-lanceur:focus-visible{outline:3px solid var(--focus,#ED674F);outline-offset:3px}
.firmin-lanceur .firmin-tete{width:54px;height:54px;margin-top:-3px}
.firmin.is-ouvert .firmin-lanceur{transform:scale(.92)}

/* ---------- le visage vit un peu ---------- */
.firmin-tete .f-tete,
.firmin-tete .f-yeux,
.firmin-tete .f-sourcils,
.firmin-tete .f-paille{transform-box:fill-box}
.firmin-tete .f-tete{transform-origin:50% 90%;transition:transform .3s ease}
.firmin-tete .f-regard{transition:transform .18s ease-out}
.firmin-tete .f-yeux{transform-origin:50% 50%;animation:firmin-cligne 6.2s infinite}
.firmin-tete .f-sourcils{transition:transform .25s ease}
.firmin-tete .f-paille{transform-origin:0% 50%;animation:firmin-paille 7.5s ease-in-out infinite}
.firmin-lanceur:hover .f-sourcils,.firmin-lanceur:focus-visible .f-sourcils{transform:translateY(-1.3px)}
.firmin.is-hoche .firmin-lanceur .f-tete{animation:firmin-hoche 1.3s ease-in-out}
.firmin.is-pense .firmin-avatar .f-regard{transform:translate(-1.2px,-1.4px)}
.firmin.is-pense .firmin-avatar .f-sourcils{transform:translateY(-1px)}
@keyframes firmin-cligne{0%,93%,100%{transform:scaleY(1)}95.5%{transform:scaleY(.12)}}
@keyframes firmin-paille{0%,100%{transform:rotate(0)}45%{transform:rotate(-7deg)}55%{transform:rotate(4deg)}}
@keyframes firmin-hoche{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}50%{transform:rotate(3deg) translateY(.6px)}75%{transform:rotate(-2deg)}}
.firmin.is-calme .firmin-tete *{animation:none!important;transition:none!important}
@media (prefers-reduced-motion:reduce){
  .firmin *,.firmin{animation:none!important;transition:none!important}
}

/* ---------- la bulle d'invitation ---------- */
.firmin-bulle{
  position:relative;display:flex;align-items:center;gap:2px;
  margin-right:4px;padding:4px 4px 4px 14px;
  background:var(--ground-2,#FCFBF7);color:var(--ink,#173A2A);
  border:1px solid var(--rule-strong,rgba(23,58,42,.28));border-radius:12px;
  box-shadow:0 10px 26px -14px rgba(20,63,36,.5);
  animation:firmin-apparait .45s cubic-bezier(.16,1,.3,1) both;
}
.firmin-bulle[hidden]{display:none}
.firmin-bulle::after{
  content:"";position:absolute;right:22px;bottom:-7px;width:12px;height:12px;
  background:inherit;border-right:1px solid var(--rule-strong,rgba(23,58,42,.28));border-bottom:1px solid var(--rule-strong,rgba(23,58,42,.28));
  transform:rotate(45deg);
}
.firmin-bulle__texte{
  border:0;background:none;padding:6px 2px;cursor:pointer;
  font-family:inherit;font-size:.84rem;font-weight:500;line-height:1.3;color:inherit;text-align:left;
}
.firmin-bulle__x{
  display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;
  background:none;color:var(--ink-2,#5A6E62);cursor:pointer;
}
.firmin-bulle__x:hover{background:rgba(23,58,42,.07)}
@keyframes firmin-apparait{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}

/* ---------- la fenêtre ---------- */
.firmin-panneau{
  width:min(372px,calc(100vw - 24px));
  height:min(560px,calc(100vh - var(--firmin-bas) - 120px));
  height:min(560px,calc(100dvh - var(--firmin-bas) - 120px));
  min-height:300px;padding:0;margin:0;
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--ground-2,#FCFBF7);color:var(--ink,#173A2A);
  border:1px solid var(--rule-strong,rgba(23,58,42,.28));border-radius:14px;
  box-shadow:0 2px 6px rgba(20,63,36,.08),0 28px 60px -24px rgba(20,63,36,.55);
  transform-origin:100% 100%;
  animation:firmin-ouvre .32s cubic-bezier(.16,1,.3,1) both;
}
.firmin-panneau[hidden]{display:none}
@keyframes firmin-ouvre{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}

.firmin-entete{
  display:flex;align-items:center;gap:10px;padding:10px 8px 10px 12px;
  background:var(--band-bg,#1F4D3A);color:var(--band-ink,#F4F1EA);
}
.firmin-avatar{
  flex:0 0 auto;width:40px;height:40px;border-radius:50%;overflow:hidden;
  background:var(--ground-2,#FCFBF7);display:grid;place-items:center;
}
.firmin-avatar .firmin-tete{width:40px;height:40px;margin-top:-2px}
.firmin-qui{margin:0;flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.firmin-qui strong{color:inherit;font-family:"Cinzel",Georgia,serif;font-weight:600;font-size:1.02rem;letter-spacing:.04em}
.firmin-qui span{font-size:.72rem;color:var(--band-ink-2,#B6CCBE)}
.firmin-outil{
  display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;
  background:none;color:var(--band-ink,#F4F1EA);cursor:pointer;opacity:.85;
}
.firmin-outil:hover{background:rgba(244,241,234,.12);opacity:1}
.firmin-outil:focus-visible{outline:2px solid var(--band-accent,#F0836D);outline-offset:1px}

.firmin-fil{
  flex:1;overflow-y:auto;overscroll-behavior:contain;
  padding:14px 12px 8px;display:flex;flex-direction:column;gap:10px;
  scroll-behavior:smooth;
}
.firmin-msg{
  max-width:88%;padding:9px 12px;border-radius:12px;
  font-size:.88rem;line-height:1.5;overflow-wrap:anywhere;
  animation:firmin-apparait .3s ease both;
}
.firmin-msg p{margin:0}
.firmin-msg p+p{margin-top:.5em}
.firmin-msg strong{font-weight:600;color:inherit}
.firmin p{max-width:none}
.firmin-msg--lui{align-self:flex-start;background:var(--ground,#F4F1EA);border:1px solid var(--rule,rgba(23,58,42,.14));border-bottom-left-radius:4px}
.firmin-msg--moi{align-self:flex-end;background:var(--emerald,#1F4D3A);color:var(--band-ink,#F4F1EA);border-bottom-right-radius:4px}

.firmin-liens{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.firmin-lien{
  display:inline-flex;align-items:center;padding:5px 11px;border-radius:999px;
  font-size:.78rem;font-weight:600;text-decoration:none;
  color:var(--accent,#D95034);background:var(--ground-2,#FCFBF7);border:1px solid rgba(217,80,52,.45);
}
.firmin-lien:hover{background:var(--coral,#ED674F);border-color:var(--coral,#ED674F);color:#FFF}
.firmin-lien--tel::before{content:"";width:12px;height:12px;margin-right:6px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.2 15.2 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.2 15.2 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center/contain no-repeat}
.firmin-lien:focus-visible,.firmin-puce:focus-visible{outline:2px solid var(--focus,#ED674F);outline-offset:2px}

.firmin-choix{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px;margin-top:2px}
.firmin-puce{
  padding:6px 11px;border-radius:999px;cursor:pointer;
  font-family:inherit;font-size:.78rem;font-weight:500;line-height:1.25;text-align:left;
  color:var(--emerald,#1F4D3A);background:transparent;border:1px solid rgba(31,77,58,.4);
  transition:background .15s ease,color .15s ease;
}
.firmin-puce:hover{background:var(--emerald,#1F4D3A);color:var(--band-ink,#F4F1EA)}

.firmin-points{display:flex;gap:4px;padding:12px 14px}
.firmin-points i{width:6px;height:6px;border-radius:50%;background:var(--sage,#6E8B7B);animation:firmin-point 1s infinite ease-in-out}
.firmin-points i:nth-child(2){animation-delay:.15s}
.firmin-points i:nth-child(3){animation-delay:.3s}
@keyframes firmin-point{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}

.firmin-saisie{
  display:flex;gap:6px;padding:10px 10px 6px;border-top:1px solid var(--rule,rgba(23,58,42,.14));
}
.firmin-saisie input{
  flex:1;min-width:0;padding:9px 12px;border-radius:999px;
  border:1px solid var(--rule-strong,rgba(23,58,42,.28));background:#FFF;color:var(--ink,#173A2A);
  font-family:inherit;font-size:16px;line-height:1.2;   /* 16 px : pas de zoom forcé sur iPhone */
}
.firmin-saisie input::placeholder{color:var(--ink-2,#5A6E62);opacity:.8}
.firmin-saisie input:focus{outline:none;border-color:var(--emerald,#1F4D3A);box-shadow:0 0 0 3px rgba(31,77,58,.15)}
.firmin-saisie button{
  flex:0 0 auto;width:40px;height:40px;padding:0;border:0;border-radius:50%;cursor:pointer;
  display:grid;place-items:center;background:var(--coral,#ED674F);color:#FFF;
}
.firmin-saisie button:hover{background:var(--accent,#D95034)}
.firmin-saisie button:focus-visible{outline:2px solid var(--emerald,#1F4D3A);outline-offset:2px}
.firmin-note{margin:0;padding:0 14px 9px;font-size:.68rem;color:var(--ink-2,#5A6E62);text-align:center}

/* ---------- téléphone ---------- */
@media (max-width:520px){
  .firmin-lanceur{width:52px;height:52px}
  .firmin-lanceur .firmin-tete{width:48px;height:48px;margin-top:-3px}
  .firmin-panneau{width:calc(100vw - 20px);height:min(620px,calc(100dvh - var(--firmin-bas) - 96px))}
  .firmin-bulle__texte{font-size:.8rem}
}
@media print{.firmin{display:none!important}}

/* ---------- « Pas la bonne réponse ? » ---------- */
.firmin-acote{
  display:block;margin:8px 0 0;padding:0;border:0;background:none;cursor:pointer;
  font-family:inherit;font-size:.72rem;color:var(--ink-2,#5A6E62);
  text-decoration:underline;text-decoration-color:rgba(90,110,98,.4);text-underline-offset:2px;
}
.firmin-acote:hover{color:var(--accent,#D95034);text-decoration-color:currentColor}
.firmin-acote:focus-visible{outline:2px solid var(--focus,#ED674F);outline-offset:2px}