/* One arrival gesture; interaction traces the original vector without moving layout. */
.logo-motion{position:relative}
.logo-motion .brand-vector{display:block;width:100%;height:auto;aspect-ratio:561/169;overflow:visible}
.brand-initials{opacity:0;fill:var(--ink);font:27px 'DM Sans',Arial,sans-serif;letter-spacing:8px}
.brand-mark,.brand-trace{stroke-dasharray:1;stroke-dashoffset:0}
.brand-trace{stroke:var(--copper);stroke-dashoffset:1;opacity:0;pointer-events:none}
.logo-motion.is-intro .brand-mark{animation:brand-open 1400ms cubic-bezier(.3,.65,.2,1) both}
.logo-motion.is-intro .brand-initials{animation:brand-initials 2300ms ease both}
.logo-motion.is-intro .brand-name{animation:brand-name 2300ms cubic-bezier(.2,.65,.2,1) both}
.logo-motion.is-tracing .brand-trace{animation:brand-trace 1400ms cubic-bezier(.2,.65,.2,1) both}
@keyframes brand-open{0%,12%{stroke-dashoffset:1}80%,100%{stroke-dashoffset:0}}
@keyframes brand-initials{0%,15%{opacity:0}28%,43%{opacity:1}58%,100%{opacity:0}}
@keyframes brand-name{0%,50%{opacity:0;transform:translateY(3px)}82%,100%{opacity:1;transform:translateY(0)}}
@keyframes brand-trace{0%{opacity:0;stroke-dashoffset:1}12%{opacity:.7}65%{opacity:.7;stroke-dashoffset:0}100%{opacity:0;stroke-dashoffset:0}}
html[data-wle-motion="off"] .logo-motion *{animation:none!important;transition:none!important}html[data-wle-motion="off"] .brand-initials,html[data-wle-motion="off"] .brand-trace{display:none}html[data-wle-motion="off"] .brand-mark{stroke-dashoffset:0}html[data-wle-motion="off"] .brand-name{opacity:1;transform:none}
