/* Approved multichannel composition. All assets are served by this site. */
.contact-demo{--contact-active:#d2789e;--contact-motion:paused;width:100%;max-width:320px;margin:0 auto}
.contact-demo[data-running=true]{--contact-motion:running}
.contact-legend{display:flex;align-items:center;justify-content:center;gap:21px;margin:0 0 15px;font-size:11px;line-height:1.4;color:#716b76}
.contact-legend>span{display:flex;align-items:center;gap:6px}
.contact-legend>span>svg{width:12px;height:12px}
.contact-signals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 12px;padding:0 4px}
.contact-signal{height:40px;min-width:0;border-radius:24px;background:var(--contact-paper);display:flex;align-items:center;justify-content:center;gap:9px;position:relative;transition:box-shadow .45s ease;box-shadow:0 0 0 1px transparent}
.contact-signal[data-focus=true]{box-shadow:0 0 0 1px var(--contact-color),0 3px 14px #6b465d0a}
.js .contact-signal{animation:contact-enter .62s var(--entry-delay) cubic-bezier(.2,.7,.2,1) both;animation-play-state:var(--contact-motion)}
.contact-avatar{width:25px;height:25px;border-radius:50%;flex-shrink:0;background-image:url('assets/contact-portraits.jpg');background-size:400% 400%;background-position:var(--face-x) var(--face-y);position:relative}
.contact-channel{width:14px;height:14px;position:absolute;right:-4px;bottom:-3px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 0 0 1.5px var(--contact-paper);color:#77717b}
.contact-channel>svg{width:8px;height:8px;stroke-width:2}
.contact-wa{display:inline-block;width:14px;height:14px;background:#43ac72;border-radius:50%;position:relative;color:#fff;flex-shrink:0}
.contact-wa svg{position:absolute;stroke-width:1.7;color:#fff}
.contact-wa svg:first-child{width:11px;height:11px;left:1.5px;top:1.5px}
.contact-wa svg:last-child{width:5px;height:5px;left:4.5px;top:4px;stroke-width:2.1}
.contact-channel.contact-wa{position:absolute;background:#43ac72}
.contact-wave{display:flex;align-items:center;justify-content:center;gap:2px;width:29px;height:22px;flex-shrink:0;color:var(--contact-color)}
.contact-wave i{width:2px;border-radius:3px;background:currentColor;transform-origin:center;animation:contact-speaking var(--duration) ease-in-out infinite;animation-delay:var(--delay);animation-play-state:var(--contact-motion)}
.contact-messages{width:29px;height:25px;position:relative;flex-shrink:0}
.contact-message{position:absolute;display:block;border-radius:4px;animation:contact-message 3400ms ease-in-out infinite;animation-play-state:var(--contact-motion);animation-delay:var(--message-offset)}
.contact-message:first-child{top:1px;left:0;width:20px;height:9px;background:#dcdde1;border-bottom-left-radius:1px}
.contact-message:last-child{bottom:1px;right:0;width:24px;height:10px;background:#b9d8c3;border-bottom-right-radius:1px;animation-delay:calc(var(--message-offset) + 450ms)}
.contact-message:after{content:'';position:absolute;left:4px;right:4px;top:4px;height:1px;background:#fff;border-radius:1px;opacity:.9}
.contact-excerpt{min-height:124px;margin-top:22px;display:grid;align-items:start}
.contact-quote{grid-area:1/1;opacity:0;visibility:hidden;transform:translateY(5px);transition:opacity .45s ease,transform .45s ease,visibility .45s;text-align:center;align-self:start;padding:0 8px}
.contact-quote[data-current=true]{opacity:1;visibility:visible;transform:translateY(0)}
.contact-quote-label{font-size:11px;line-height:1.5;display:flex;align-items:center;justify-content:center;gap:6px;color:#716873;margin:0 0 9px}
.contact-quote-label>svg{width:11px;height:11px;color:var(--quote-color)}
.contact-quote blockquote{margin:0;font-size:15px;line-height:1.7;letter-spacing:-.25px;color:#51454f;font-weight:400}
.contact-quote blockquote strong{font-weight:600;color:var(--quote-color)}
.contact-quote[data-channel=whatsapp] blockquote{position:relative;width:fit-content;max-width:100%;margin:0 auto;background:#e8f2e9;color:#455c4b;border-radius:13px 13px 3px 13px;padding:9px 15px 15px;font-size:13px;line-height:1.65;text-align:left;letter-spacing:-.1px}
.contact-checks{position:absolute;right:9px;bottom:4px;color:#4b7960;font-size:8px;line-height:1}
.contact-promise{text-align:center;font-size:20px;line-height:1.4;letter-spacing:-.65px;color:#3b323a;font-weight:400}
.contact-promise em{display:block;color:color-mix(in srgb,var(--contact-active) 68%,#302932);transition:color 1s ease}
.contact-proof{font-size:9px;line-height:1.5;text-align:center;color:#79727c;margin-top:12px}
.contact-static .contact-signal,.contact-settled .contact-signal{animation:none!important;opacity:1;transform:none}
@keyframes contact-enter{from{opacity:0;transform:translateY(7px) scale(.9)}to{opacity:1;transform:none}}
@keyframes contact-speaking{0%,100%{transform:scaleY(.22)}18%{transform:scaleY(.72)}38%{transform:scaleY(.36)}61%{transform:scaleY(1)}81%{transform:scaleY(.46)}}
@keyframes contact-message{0%,12%{transform:translateY(3px) scale(.82);opacity:.3}30%,82%{transform:translateY(0) scale(1);opacity:1}100%{transform:translateY(-1px) scale(.96);opacity:.3}}
.presentation .hero .demo-wrap.contact-demo{max-width:308px}
.presentation .hero-grid{gap:25px}
.presentation .hero .contact-demo .channel-list{margin:16px 0 0;gap:7px;font-size:9px;font-weight:400}
.presentation .hero .contact-demo .call-label{color:#68616d;font-weight:600}
@media(min-width:900px){
 .presentation .hero .demo-wrap.contact-demo{max-width:396px}
 .contact-signals{gap:13px 16px;padding:0 8px}
 .contact-signal{height:50px;gap:13px}
 .contact-avatar{width:31px;height:31px}
 .contact-wave{width:34px;gap:2.5px}
 .contact-messages{width:33px}
 .contact-legend{font-size:12px;margin-bottom:22px}
 .contact-excerpt{margin-top:27px;min-height:139px}
 .contact-quote-label{font-size:12px}
 .contact-quote blockquote{font-size:17px}
 .contact-quote[data-channel=whatsapp] blockquote{font-size:15px;padding:11px 18px 17px}
 .contact-promise{font-size:24px}
 .presentation .hero .contact-demo .channel-list{font-size:10px;gap:10px;margin-top:20px}
 .contact-proof{font-size:10px}
}
@media(max-width:359px){
 .contact-signals{gap:8px;padding:0}
 .contact-signal{gap:7px;height:38px}
 .contact-avatar{width:22px;height:22px}
 .contact-wave{gap:1.7px;width:26px}
 .contact-quote{padding:0 4px}
}
@media(max-height:730px) and (max-width:899px){
 .presentation .hero-grid{gap:19px}
 .contact-signal{height:32px}
 .contact-signals{gap:7px 10px}
 .contact-legend{font-size:10px;margin-bottom:10px}
 .contact-avatar{width:23px;height:23px}
 .contact-excerpt{min-height:103px;margin-top:15px}
 .contact-quote-label{font-size:10px;margin-bottom:6px}
 .contact-quote blockquote{font-size:13px}
 .contact-quote[data-channel=whatsapp] blockquote{font-size:12px;padding:7px 12px 13px}
 .contact-promise{font-size:17px}
 .contact-proof{font-size:8px;margin-top:8px}
 .presentation .hero .contact-demo .channel-list{font-size:8px;margin-top:10px;gap:6px}
}
@media(max-height:620px) and (max-width:599px){
 .presentation .hero-grid{gap:15px}
 .contact-signals{gap:5px 9px}
 .contact-signal{height:27px;gap:8px}
 .contact-avatar{width:20px;height:20px}
 .contact-channel{width:12px;height:12px;right:-3px;bottom:-2px}
 .contact-channel.contact-wa svg:first-child{left:.5px;top:.5px}
 .contact-channel.contact-wa svg:last-child{left:3.5px;top:3px}
 .contact-excerpt{min-height:91px;margin-top:12px}
 .contact-quote-label{font-size:9px}
 .contact-quote blockquote{font-size:12px}
 .contact-quote[data-channel=whatsapp] blockquote{font-size:11px;padding:6px 11px 13px}
 .contact-promise{font-size:14px;letter-spacing:-.3px}
 .contact-promise em{display:inline;margin-left:4px}
 .contact-proof{font-size:7.5px;margin-top:7px}
 .presentation .hero .contact-demo .channel-list{margin-top:9px;font-size:7.5px;gap:6px}
}
@media(max-height:550px) and (min-width:600px){
 .presentation .hero .demo-wrap.contact-demo{max-width:300px;zoom:.85}
 .contact-signal{height:30px}
 .contact-legend{margin-bottom:10px}
 .contact-excerpt{min-height:102px;margin-top:14px}
 .contact-promise{font-size:17px}
 .contact-proof{margin-top:7px}
}
@media(prefers-reduced-motion:reduce){.contact-demo *{animation:none!important;transition:none!important}.contact-signal{opacity:1;transform:none}}
