/* Quiet entrances, with a conversation path that keeps moving while in view. */
.visual-reveal{opacity:0;translate:0 24px;scale:.985}
.visual-reveal.is-in-view{animation:visual-arrive .8s cubic-bezier(.2,.7,.2,1) both}
/* Keep the approved desk, seller, customer and monitor composition intact.
   Native UI sits exactly over the illustration's suggestion and transcript. */
.illustration-scene{position:relative;width:100%;container-type:inline-size}
.illustration-scene>.scene-art{display:block;width:100%;height:auto}
.illustration-speaker-frame{position:absolute;z-index:1;border:.1953125cqw solid #343630;border-radius:1.15cqw;background:#343630;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.illustration-speaker-customer{left:22.786458%;top:29.785156%;width:33.007813%;height:30.761719%}
.illustration-speaker-seller{left:45.3125%;top:22.363281%;width:10.9375%;height:11.425781%;z-index:2}
.illustration-portrait{position:absolute;inset:0;overflow:hidden}
.illustration-portrait img{position:absolute;left:0;top:0;max-width:none;height:auto;pointer-events:none}
.illustration-speaker-customer .illustration-portrait{transform:none}
.illustration-speaker-customer .illustration-portrait img{width:100%;height:100%;object-fit:cover;object-position:center top;transform:none}
.illustration-speaker-seller .illustration-portrait{transform:scaleX(-1)}
.illustration-speaker-seller .illustration-portrait img{width:990.967742%;transform:translate(-45.703125%,-22.753906%)}
.illustration-speaker-frame[data-active="true"]{border-color:var(--yellow);box-shadow:0 0 0 .065cqw #effa6855}
.illustration-question,.illustration-transcript{position:absolute;font-family:Plex,sans-serif;color:#151515}
.illustration-question{left:58.203125%;top:38.574219%;width:29.296875%;height:7.421875%;background:#ffe4d3;border:.065cqw solid #ffb39a;border-radius:.46cqw;padding:.65cqw 1.3cqw;overflow:hidden}
.illustration-question>span{display:flex;gap:.55cqw;align-items:center;font-size:.82cqw;font-weight:600;letter-spacing:.06em;color:#b5361c;line-height:1.4}
.illustration-question svg{width:1.3cqw;height:1.3cqw;fill:none;stroke:currentColor;stroke-width:1.5;flex-shrink:0}
.illustration-question p{font-size:1.3cqw;line-height:1.2;margin:.35cqw 0 0;letter-spacing:-.015em}
.illustration-question.question-arriving{animation:illustration-question-arrive .5s ease-out}
.illustration-transcript{left:58.203125%;top:50.292969%;width:29.296875%;height:13.28125%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:20% 40% 40%;border:.065cqw solid #dbd3bf;border-radius:.32cqw;overflow:hidden;background:#fffaf0;font-size:.98cqw;line-height:1.25}
.illustration-transcript>div{padding:.38cqw 1cqw;border-right:.065cqw solid #dbd3bf;border-bottom:.065cqw solid #dbd3bf;min-width:0}
.illustration-transcript>div:nth-child(even){border-right:0}
.illustration-transcript>div:nth-last-child(-n+2){border-bottom:0}
.illustration-transcript .illustration-transcript-heading{display:flex;align-items:center;gap:.6cqw;font-weight:600;background:#f9f4e8;font-size:1.03cqw}
.illustration-transcript-heading svg{width:1.2cqw;height:1.2cqw;fill:none;stroke:currentColor;stroke-width:1.7;flex-shrink:0}
.illustration-transcript .illustration-customer-cell{background:#fffaf0}
.illustration-transcript [data-active="true"]{background:#f2f7ca;box-shadow:inset 0 0 0 .065cqw #c1ce70}
.illustration-transcript [data-transcript-current][data-active="true"]:after{content:'';display:inline-block;width:.065cqw;height:.9cqw;margin-left:.12cqw;background:#6a7938;animation:illustration-cursor .8s steps(1) infinite}
.illustration-live-dot{position:absolute;left:82.77%;top:47.66%;width:.68%;aspect-ratio:1;border-radius:50%;background:#008e3e;animation:illustration-listening 1.5s ease-in-out infinite}
.illustration-voice{position:absolute;right:.6cqw;bottom:.6cqw;height:1.9cqw;display:flex;align-items:center;gap:.22cqw;padding:.25cqw .4cqw;background:#242823b3;border-radius:.2cqw;opacity:0;transition:opacity .2s}
.illustration-speaker-frame[data-active="true"] .illustration-voice{opacity:1}
.illustration-voice i{display:block;width:.2cqw;height:1cqw;background:var(--yellow);animation:illustration-speaking .65s ease-in-out infinite alternate;transform-origin:center}
.illustration-voice i:nth-child(2){height:1.5cqw;animation-delay:-.2s}
.illustration-voice i:nth-child(3){height:.8cqw;animation-delay:-.4s}
.illustration-voice i:nth-child(4){height:1.3cqw;animation-delay:-.1s}
.illustration-scene[data-playing="false"] .illustration-voice i,.illustration-scene[data-playing="false"] .illustration-live-dot{animation-play-state:paused}
/* Individual transforms preserve a visual's own tilt and positioning. */
@keyframes visual-arrive{from{opacity:0;translate:0 24px;scale:.985}to{opacity:1;translate:0 0;scale:1}}
@keyframes illustration-question-arrive{from{filter:brightness(1.09)}to{filter:brightness(1)}}
@keyframes illustration-speaking{from{transform:scaleY(.35)}to{transform:scaleY(1)}}
@keyframes illustration-listening{50%{opacity:.45}}
@keyframes illustration-cursor{50%{opacity:0}}
.page-home .journey article{border-top:0;padding-top:0}
.panel-reveal .panel-motion-item{opacity:0;transform:translateY(12px)}
.panel-reveal.is-visible .panel-motion-item{animation:panel-content-arrive .6s cubic-bezier(.2,.7,.2,1) var(--entrance-delay,0ms) both}
.panel-reveal .flow-node{transition:background-color .5s,border-color .5s,box-shadow .5s}
.panel-reveal .flow-node.active{box-shadow:0 0 0 2px #a5ad4040,0 6px 16px #15151510}
.panel-reveal .flow-node.flow-visited{border-color:#8c9952}
.panel-reveal .flow-wire:before{content:'';position:absolute;width:5px;height:5px;left:-2px;top:0;border-radius:50%;background:#687a2d;opacity:0}
.panel-reveal .flow-wire.wire-current:before{animation:flow-travel 1.5s .3s ease-in-out infinite}
.panel-reveal[data-motion-running="false"] .flow-wire:before{animation-play-state:paused}
[data-theme="dark"] .panel-reveal .flow-node.flow-visited{border-color:#d5ea87}
[data-theme="dark"] .panel-reveal .flow-wire:before{background:var(--accent-lime)}
@keyframes panel-arrive{from{transform:translateY(22px)}to{transform:translateY(0)}}
@keyframes panel-content-arrive{to{opacity:1;transform:translateY(0)}}
@keyframes flow-travel{0%{opacity:0;transform:translateY(0)}20%{opacity:1}80%{opacity:1}100%{opacity:0;transform:translateY(21px)}}
@media(prefers-reduced-motion:reduce){
  .visual-reveal,.illustration-scene *{animation:none!important;transition:none!important}
  .visual-reveal{opacity:1;translate:none;scale:none}
  .panel-reveal,.panel-reveal .panel-motion-item{animation:none!important;transition:none!important;opacity:1;transform:none}
  .panel-reveal .flow-wire:before{display:none}
}