.ruelle-dialogue { background: #f4ede8; }
.ruelle-dialogue .ruelle-chat__inner { max-width: 760px; }
.ruelle-dialogue .ruelle-chat__conversation { gap: 1.75rem; }
.ruelle-dialogue .ruelle-chat__message { max-width: 84%; }
.ruelle-dialogue .ruelle-chat__customer + .ruelle-chat__customer { margin-top: -.75rem; }
.ruelle-dialogue .ruelle-chat__customer .ruelle-chat__bubble { background: #fdfaf5; }
.ruelle-dialogue .ruelle-chat__bubble { font-size: clamp(1.0625rem, 1.5vw, 1.1875rem); }
.ruelle-dialogue .ruelle-dialogue__closing { margin-top: clamp(3.5rem, 7vw, 6rem); }
.ruelle-dialogue .ruelle-dialogue__closing h2 { margin: 0 0 1rem; font-family: "Averia Serif Libre", Georgia, serif; color: #5e4040; font-size: clamp(1.7rem, 3vw, 2.25rem); line-height: 1.25; }
.ruelle-dialogue .ruelle-dialogue__closing > p { margin: 0 0 1.5rem; font-size: 1rem; line-height: 1.6; }
.ruelle-dialogue .ruelle-dialogue__typing { display: none; grid-area: 1 / 1; align-self: start; margin-top: 2rem; align-items: center; gap: .4rem; padding: 1.25rem 1.5rem; background: #edb1c9; border-radius: 1.5rem 1.5rem .35rem 1.5rem; }
.ruelle-dialogue .ruelle-dialogue__typing span { width: .375rem; height: .375rem; border-radius: 50%; background: #5e4040; }
@media (prefers-reduced-motion: no-preference) {
 .ruelle-dialogue.dialogue-ready .ruelle-dialogue__step { opacity: 0; transform: translateY(8px); transition: opacity .5s ease-out, transform .5s ease-out; }
 .ruelle-dialogue.dialogue-ready .ruelle-dialogue__step.is-visible { opacity: 1; transform: none; }
 .ruelle-dialogue.dialogue-ready .ruelle-dialogue__typing.is-visible { display: flex; }
 .ruelle-dialogue .ruelle-dialogue__typing.is-visible span { animation: ruelle-dialogue-dot .9s ease-in-out infinite; }
 .ruelle-dialogue .ruelle-dialogue__typing.is-visible span:nth-child(2) { animation-delay: .15s; }
 .ruelle-dialogue .ruelle-dialogue__typing.is-visible span:nth-child(3) { animation-delay: .3s; }
}
@keyframes ruelle-dialogue-dot { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@media (max-width: 540px) {
 .ruelle-dialogue .ruelle-chat__message { max-width: 94%; }
 .ruelle-dialogue .ruelle-chat__conversation { gap: 1.5rem; }
 .ruelle-dialogue .ruelle-chat__cta { font-size: .9375rem; }
}
.ruelle-dialogue .ruelle-dialogue__closing h2 { text-transform: none; }
