/* Orange light-stream showcase, scoped to design 01. */
.smk-ecosystem{position:relative;isolation:isolate;overflow:hidden;background:#050505;color:#fff;padding:108px 0 72px;min-height:690px;border-block:1px solid #302118;scroll-margin-top:100px}
.smk-ecosystem::before,.smk-ecosystem::after{content:"";position:absolute;z-index:-1;pointer-events:none;width:70%;height:60%;filter:blur(38px);opacity:.3;background:radial-gradient(ellipse,#e94f192e,transparent 65%)}
.smk-ecosystem::before{left:-25%;bottom:-25%;transform:rotate(24deg)}.smk-ecosystem::after{right:-30%;top:-25%}
.smk-ecosystem canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.smk-ecosystem .ecosystem-heading{position:relative;max-width:1200px;text-align:center;margin:0 auto 62px;padding:0 24px}
.smk-ecosystem .ecosystem-kicker{color:#e94f19;font-size:clamp(48px,4.5vw,64px);font-weight:700;line-height:1.25;letter-spacing:.02em;margin:0 0 24px;text-wrap:balance}
.smk-ecosystem h2{font-size:clamp(26px,2.8vw,40px);font-weight:600;line-height:1.3;letter-spacing:-.04em;margin:0 0 24px}
.smk-ecosystem h2 span{color:#e94f19}.smk-ecosystem .ecosystem-intro{font-size:17px;line-height:1.9;color:#d0cbc6;margin:0}
.smk-ecosystem .ecosystem-window{position:relative;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 13%,#000 87%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 13%,#000 87%,transparent)}
.smk-ecosystem .ecosystem-track{display:flex;width:max-content;animation:ecosystem-marquee 44s linear infinite;will-change:transform}
.smk-ecosystem .ecosystem-row+.ecosystem-row{margin-top:34px}.smk-ecosystem .ecosystem-row:nth-child(2) .ecosystem-track{animation-duration:49s;animation-direction:reverse}
.smk-ecosystem .ecosystem-group{display:flex;align-items:center;list-style:none;padding:0;margin:0;gap:54px;padding-right:54px}
.smk-ecosystem .ecosystem-item{width:210px;min-height:94px;display:flex;align-items:center;justify-content:center;gap:14px;flex-shrink:0;color:#f0eeeb;opacity:.86}
.smk-ecosystem .ecosystem-item svg{width:43px;height:43px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.smk-ecosystem .ecosystem-word{font-family:Arial,"Microsoft YaHei",sans-serif;font-size:25px;letter-spacing:-.035em;font-weight:650;white-space:nowrap;line-height:1.05}
.smk-ecosystem .ecosystem-word small{display:block;color:#b8b1a9;font-family:inherit;font-weight:400;font-size:12px;letter-spacing:.08em;margin-top:10px}
.smk-ecosystem .ecosystem-item:nth-child(3n+2) .ecosystem-word{font-weight:400;letter-spacing:.035em}.smk-ecosystem .ecosystem-item:nth-child(3n) .ecosystem-word{font-style:italic}
.smk-ecosystem .ecosystem-bottom{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:22px;margin:45px 24px 0}
.smk-ecosystem .ecosystem-note{color:#a79c91;font-size:11px;letter-spacing:.03em;margin:0;text-align:center}
.smk-ecosystem .ecosystem-toggle{border:1px solid #8f3618;color:#e94f19;background:#1d0f09;border-radius:30px;padding:9px 15px;font:inherit;font-size:11px;cursor:pointer}
.smk-ecosystem .ecosystem-toggle:hover{background:#3d1b0f}.smk-ecosystem .ecosystem-toggle:focus-visible{outline:2px solid #f17b54;outline-offset:4px}.smk-ecosystem .ecosystem-toggle:disabled{cursor:default;opacity:.75}
.smk-ecosystem[data-running="false"] .ecosystem-track{animation-play-state:paused}
@keyframes ecosystem-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:760px){.smk-ecosystem{padding:76px 0 42px;min-height:590px}.smk-ecosystem .ecosystem-heading{margin-bottom:40px}.smk-ecosystem .ecosystem-intro{font-size:14px}.smk-ecosystem .ecosystem-kicker{font-size:clamp(34px,7vw,54px);letter-spacing:0}.smk-ecosystem .ecosystem-group{gap:26px;padding-right:26px}.smk-ecosystem .ecosystem-item{width:180px;gap:12px;min-height:78px}.smk-ecosystem .ecosystem-item svg{width:34px;height:34px}.smk-ecosystem .ecosystem-word{font-size:22px}.smk-ecosystem .ecosystem-word small{font-size:11px}.smk-ecosystem .ecosystem-row+.ecosystem-row{margin-top:24px}.smk-ecosystem .ecosystem-bottom{gap:16px;margin-top:34px}}

@media print{.smk-ecosystem{background:#fff;color:#222;min-height:0;padding:35px 0;break-inside:avoid}.smk-ecosystem canvas,.smk-ecosystem .ecosystem-toggle,.smk-ecosystem .ecosystem-group[aria-hidden=true]{display:none}.smk-ecosystem .ecosystem-track{animation:none!important;transform:none!important;width:100%}.smk-ecosystem .ecosystem-group{flex-wrap:wrap;justify-content:center;width:100%}.smk-ecosystem .ecosystem-item,.smk-ecosystem .ecosystem-word small,.smk-ecosystem .ecosystem-intro,.smk-ecosystem .ecosystem-note{color:#333}.smk-ecosystem .ecosystem-window{mask-image:none;-webkit-mask-image:none}}

/* Twenty partner text identifiers, ten unique entries per row. */
.smk-ecosystem .ecosystem-track{animation-duration:72s}
.smk-ecosystem .ecosystem-row:nth-child(2) .ecosystem-track{animation-duration:76s}
.smk-ecosystem .ecosystem-item{width:220px;opacity:.94}
.smk-ecosystem .ecosystem-word{font-size:30px;font-weight:700;letter-spacing:-.025em;text-align:center}
.smk-ecosystem .ecosystem-item:nth-child(3n+2) .ecosystem-word{font-weight:700;letter-spacing:-.025em}
.smk-ecosystem .ecosystem-item:nth-child(3n) .ecosystem-word{font-style:normal}
.smk-ecosystem .ecosystem-word small{font-size:13px;letter-spacing:.1em;color:#bcb5ae;margin-top:12px}
.smk-ecosystem .partner-ue .ecosystem-word{font-size:26px}
.smk-ecosystem .partner-hairun .ecosystem-word{font-size:36px;font-weight:500}
.smk-ecosystem .partner-longtech .ecosystem-word{font-size:26px;letter-spacing:-.05em}
.smk-ecosystem .partner-gopod .ecosystem-word{font-size:36px;font-weight:500}
.smk-ecosystem .partner-rapoo .ecosystem-word{font-size:39px;letter-spacing:-.07em;font-weight:600}
.smk-ecosystem .partner-ugreen .ecosystem-word{font-size:29px;font-weight:800}
.smk-ecosystem .partner-philips .ecosystem-word{letter-spacing:.035em;font-weight:800}
.smk-ecosystem .partner-desay .ecosystem-word{font-size:28px;font-style:italic;font-weight:800}
.smk-ecosystem .partner-candysign .ecosystem-word{font-size:25px;letter-spacing:-.04em}
.smk-ecosystem .partner-amc .ecosystem-word{font-size:45px;font-weight:500;letter-spacing:.15em}
.smk-ecosystem .partner-amc small{font-size:11px;letter-spacing:.2em}
.smk-ecosystem .partner-bull .ecosystem-word{font-size:36px;font-style:italic;font-weight:900}
.smk-ecosystem .partner-jd .ecosystem-word{font-size:30px;font-weight:600}
.smk-ecosystem .partner-speed .ecosystem-word{font-style:italic;letter-spacing:.04em}
.smk-ecosystem .partner-xingui .ecosystem-word{font-size:29px;letter-spacing:.04em}
@media(max-width:760px){.smk-ecosystem .ecosystem-item{width:200px}.smk-ecosystem .ecosystem-word{font-size:27px}}


/* Circular partner wall; keep the existing orange light-stream background. */
.smk-ecosystem .ecosystem-window{padding:10px 0;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.smk-ecosystem .ecosystem-group{gap:28px;padding-right:28px}
.smk-ecosystem .ecosystem-row+.ecosystem-row{margin-top:24px}
.smk-ecosystem .ecosystem-item{position:relative;isolation:isolate;box-sizing:border-box;width:200px;height:200px;min-height:200px;border-radius:50%;border:1px solid #a04b2b;background:radial-gradient(ellipse at 28% 18%,#74351f 0%,#372019 26%,#19120f 52%,#090909 78%);color:#f7ede5;opacity:1;padding:24px;overflow:hidden;box-shadow:inset 2px 3px 12px #f08a4740,inset -10px -14px 24px #0009,0 0 18px #e94f191a;transition:border-color .3s,box-shadow .3s}
.smk-ecosystem .ecosystem-item::before{content:"";position:absolute;inset:9px;border-radius:inherit;border:1px solid #f48b4926;pointer-events:none;z-index:-1}
.smk-ecosystem .ecosystem-item::after{content:"";position:absolute;top:16px;left:28px;width:74px;height:24px;border-radius:50%;background:#ffb16c26;filter:blur(10px);transform:rotate(-32deg);pointer-events:none;z-index:-1}
.smk-ecosystem .ecosystem-item:hover{border-color:#ef824c;box-shadow:inset 2px 3px 14px #f08a4752,inset -10px -14px 24px #0009,0 0 24px #e94f1938}
.smk-ecosystem .ecosystem-word{max-width:100%;white-space:normal;overflow-wrap:anywhere;line-height:1.2;text-align:center}
.smk-ecosystem .ecosystem-word small{color:#c9ad99;line-height:1.4}
.smk-ecosystem .ecosystem-item .partner-logo{display:block;width:100%;height:76px;max-width:152px;max-height:76px;object-fit:contain}
@media(max-width:760px){
 .smk-ecosystem .ecosystem-group{gap:18px;padding-right:18px}
 .smk-ecosystem .ecosystem-row+.ecosystem-row{margin-top:18px}
 .smk-ecosystem .ecosystem-item{width:144px;height:144px;min-height:144px;padding:18px}
 .smk-ecosystem .ecosystem-item .ecosystem-word{font-size:22px;letter-spacing:-.025em}
 .smk-ecosystem .ecosystem-item .ecosystem-word small{font-size:11px;margin-top:8px;letter-spacing:.03em}
 .smk-ecosystem .ecosystem-item .partner-logo{height:56px;max-width:108px;max-height:56px}
}

/* Fill both marquee rows at every viewport width, including browser zoom. */
.smk-ecosystem{--partner-size:160px;--partner-gap:22px}
.smk-ecosystem .ecosystem-group{gap:var(--partner-gap);padding-right:var(--partner-gap);min-width:100vw;justify-content:space-around}
.smk-ecosystem .ecosystem-row+.ecosystem-row{margin-top:18px}
.smk-ecosystem .ecosystem-item{width:var(--partner-size);height:var(--partner-size);min-height:var(--partner-size);padding:18px}
.smk-ecosystem .ecosystem-item .ecosystem-word{font-size:24px;letter-spacing:-.025em}
.smk-ecosystem .ecosystem-item .ecosystem-word small{font-size:11px;letter-spacing:.03em;margin-top:8px}
.smk-ecosystem .ecosystem-item .partner-logo{max-width:122px;max-height:60px;height:60px}
@media(max-width:760px){
 .smk-ecosystem{--partner-size:116px;--partner-gap:16px}
 .smk-ecosystem .ecosystem-row+.ecosystem-row{margin-top:14px}
 .smk-ecosystem .ecosystem-item{padding:14px}
 .smk-ecosystem .ecosystem-item .ecosystem-word{font-size:18px}
 .smk-ecosystem .ecosystem-item .ecosystem-word small{font-size:10px}
 .smk-ecosystem .ecosystem-item .partner-logo{max-width:86px;max-height:44px;height:44px}
}

/* Original brand artwork in a consistent white treatment on the existing dark spheres. */
.smk-ecosystem .ecosystem-item{flex-direction:column;gap:12px}
.smk-ecosystem .ecosystem-item .partner-logo{width:100%;max-width:122px;height:56px;max-height:56px;object-fit:contain}
.smk-ecosystem .partner-logo--mono{filter:brightness(0) invert(1)}
.smk-ecosystem .partner-logo--paper{filter:grayscale(1) invert(1) brightness(3);mix-blend-mode:screen}
.smk-ecosystem .partner-logo--original{mix-blend-mode:screen}
.smk-ecosystem .partner-caption{font-size:11px;line-height:1.4;text-align:center;color:#d1b8a5;max-width:100%;letter-spacing:.03em}
@media(max-width:760px){.smk-ecosystem .ecosystem-item{gap:8px}.smk-ecosystem .ecosystem-item .partner-logo{max-width:86px;height:38px;max-height:38px}.smk-ecosystem .partner-caption{font-size:10px}}
