/* 【地标长廊】lm-marquee
   一排行业地标图从右往左无缝循环滚动。平时是蓝 / 绿调色版；光标放上去（触屏点一下）整条暂停，
   这张换回原色，底部按这张图自己的色调渐变，浮出说明文字。
   可调变量写在 .lm-strip 上：--lm-w 卡宽、--lm-h 卡高、--lm-speed 转一圈的时间、--lm-ink 文字色。
   每张卡用 data-tone="b" / "g" 选蓝或绿的底色。 */
.lm-strip{--lm-w:clamp(220px,18vw,300px);--lm-h:clamp(380px,36vw,540px);--lm-speed:90s;--lm-ink:#F7F2E9;
  --lm-blue:#0A1C5C;--lm-green:#0A3326;position:relative;overflow:hidden}
.lm-track{display:flex;width:max-content;animation:lm-scroll var(--lm-speed) linear infinite}
.lm-strip:hover .lm-track,.lm-strip:focus-within .lm-track,.lm-strip.is-paused .lm-track{animation-play-state:paused}
@keyframes lm-scroll{to{transform:translateX(-50%)}}

.lm{position:relative;flex:none;width:var(--lm-w);height:var(--lm-h);margin:0 2px 0 0;overflow:hidden;--lm-hue:var(--lm-blue);outline-offset:-4px}
.lm[data-tone="g"]{--lm-hue:var(--lm-green)}
.lm img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .5s ease,transform 1.4s ease}
.lm .lm-c{opacity:0}
.lm::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.28),transparent 24%)}
.lm::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .45s ease;
  background:linear-gradient(to top,var(--lm-hue) 0%,color-mix(in srgb,var(--lm-hue) 90%,transparent) 36%,color-mix(in srgb,var(--lm-hue) 40%,transparent) 54%,transparent 70%)}

.lm-tag{position:absolute;z-index:2;left:16px;top:14px;right:16px;display:grid;gap:5px;color:var(--lm-ink);font-size:12.5px;line-height:1.3}
.lm-tag b{font:400 24px/1 var(--display,inherit);letter-spacing:-.01em}

.lm-ins{position:absolute;z-index:2;left:18px;right:18px;bottom:18px;display:grid;gap:11px;color:var(--lm-ink);
  opacity:0;transform:translateY(18px);transition:opacity .4s ease .05s,transform .5s cubic-bezier(.2,.7,.2,1) .05s}
.lm-ins .k{font-size:11px;letter-spacing:.16em;opacity:.72}
.lm-ins .q{font:400 21px/1.35 var(--display,inherit);letter-spacing:-.01em}
.lm-ins .fu{font-size:13.5px;line-height:1.65;opacity:.9;border-left:1px solid color-mix(in srgb,var(--lm-ink) 55%,transparent);padding-left:10px}
.lm-ins .mc{font-size:12px;line-height:1.5;opacity:.82;border-top:1px solid color-mix(in srgb,var(--lm-ink) 26%,transparent);padding-top:10px}

.lm:is(:hover,:focus-visible,.is-open) .lm-c{opacity:1}
.lm:is(:hover,:focus-visible,.is-open) img{transform:scale(1.04)}
.lm:is(:hover,:focus-visible,.is-open)::after{opacity:1}
.lm:is(:hover,:focus-visible,.is-open) .lm-ins{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .lm-track{animation:none}
  .lm-strip{overflow-x:auto}
  .lm img,.lm-ins,.lm::after{transition:none}
}
