/* Logo chuyển động "chấm dẫn đường" (parts/logo-motion.php + js/logo-motion.js), dùng ở Giới thiệu và Thương hiệu.
   Tách từ about.css 21/10/2026, giữ nguyên rule. */
.xd-lm{position:relative;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(22px,3vw,36px);min-height:clamp(340px,40vw,520px);padding:72px 24px 56px;border-radius:28px;overflow:hidden;color:#fff;
  background-color:var(--xd-blue);background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:240px 240px,240px 240px,48px 48px,48px 48px}
.xd-lm__wm{width:min(760px,88%);height:auto;overflow:visible;display:block}
.xd-lm__lt{fill:#fff}
.xd-lm__rip{fill:none;stroke:var(--xd-lime);stroke-width:3;opacity:0;transform-box:fill-box;transform-origin:center;vector-effect:non-scaling-stroke}
.xd-lm__rip.is-go{animation:xd-lm-rip .7s var(--xd-ease)}
@keyframes xd-lm-rip{0%{opacity:.9;transform:scale(1.05)}100%{opacity:0;transform:scale(5.6)}}
.xd-lm__trace{fill:none;stroke:var(--xd-lime);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:0}
.xd-lm__trace.is-go{animation:xd-lm-trace 2.6s .05s both}
@keyframes xd-lm-trace{0%{stroke-dashoffset:1;opacity:.9;animation-timing-function:cubic-bezier(.5,0,.2,1)}38%{stroke-dashoffset:0;opacity:.9}70%{stroke-dashoffset:0;opacity:.9}100%{stroke-dashoffset:0;opacity:0}}
.xd-lm__trail line{stroke:var(--xd-lime);stroke-linecap:round}
.xd-lm__phase{min-height:28px;font-size:clamp(17px,1.6vw,22px);letter-spacing:.32em;text-transform:uppercase;font-weight:500;text-align:center}
.xd-lm__phase.is-in{animation:xd-lm-in .32s var(--xd-ease)}
@keyframes xd-lm-in{from{opacity:0;transform:translateX(-26px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.xd-lm__phase>b{color:var(--xd-lime);font-weight:700}
.xd-lm__phase i{font-style:normal}
.xd-lm__phase span{margin-left:16px;font-size:.82em;letter-spacing:.04em;text-transform:none}
.xd-lm__phase span:has(b:empty){display:none}
.xd-lm__phase em{font-style:normal}
.xd-lm__phase span b{font-size:1.25em;font-weight:700;color:var(--xd-lime)}
.xd-lm__replay{position:absolute;right:20px;bottom:20px;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:0;border-radius:999px;background:rgba(11,18,32,.32);color:#fff;font-size:14px;font-weight:600;cursor:pointer}
.xd-lm__replay:hover{background:rgba(11,18,32,.5)}
.xd-lm__replay[hidden]{display:none}
@media (max-width:640px){
  .xd-lm{padding:56px 16px 72px}
  .xd-lm__phase span{display:block;margin:8px 0 0}
  .xd-lm__replay{right:12px;bottom:12px}
}
