/* OC-SCN-007: a quiet exchange, independent of the homepage growth artwork. */
.oc-dialogue{position:relative;isolation:isolate;width:min(100%,410px);aspect-ratio:13/7;margin:16px 0 0;pointer-events:none}
.oc-dialogue svg{display:block;width:100%;height:auto;overflow:visible}
.dialogue-dot{opacity:0;animation:oc-dialogue-listen 12s ease-in-out infinite}
.dialogue-dot--two{animation-delay:.65s}.dialogue-dot--three{animation-delay:1.3s}
.dialogue-reply{opacity:0;stroke-dasharray:15 85;stroke-dashoffset:100;animation:oc-dialogue-reply 12s ease-in-out infinite}
.oc-dialogue[data-motion-level="quiet"] .dialogue-dot,.oc-dialogue[data-motion-level="quiet"] .dialogue-reply{animation:none;opacity:0}
body.motion-idle .oc-dialogue *,body.paused .oc-dialogue *,.oc-dialogue.no-motion *{animation-play-state:paused!important}
@keyframes oc-dialogue-listen{0%,6%{opacity:0}12%,19%{opacity:.85}26%,100%{opacity:0}}
@keyframes oc-dialogue-reply{0%,39%{stroke-dashoffset:100;opacity:0}43%{opacity:.9}62%{stroke-dashoffset:0;opacity:.9}68%,100%{stroke-dashoffset:0;opacity:0}}
@media(max-width:999px){.oc-dialogue{margin:10px auto 0}}
@media(max-width:699px){.oc-dialogue{width:min(100%,290px);margin:8px auto 0}}
@media(prefers-reduced-motion:reduce){.oc-dialogue .dialogue-dot,.oc-dialogue .dialogue-reply{animation:none!important;opacity:0}}
