@charset "UTF-8";
:root { --ss-red: #d0121c; --ss-text: #222; --ss-muted: #666; }
* { box-sizing: border-box; }
.ss-page { margin: 0; color: var(--ss-text); font-family: "MiSans", "PingFang SC", "Source Han Sans CN", "Microsoft YaHei", Arial, sans-serif; background: #fff; }
.ss-wrap { width: 16.4rem; max-width: calc(100% - .6rem); margin: 0 auto; }
.ss-header { position: relative; z-index: 5; display: flex; align-items: center; width: 100%; height: 1rem; padding: 0 1.4rem; background: #111; border-bottom: 1px solid rgba(255,255,255,.22); color: #fff; }
.ss-lang { display: inline-flex; flex-shrink: 0; align-items: center; gap: .06rem; }
.ss-lang a, .ss-lang em, .ss-lang i { display: inline-block; width: auto !important; height: auto !important; color: inherit; }
.ss-lang a { color: inherit; font-style: normal; text-decoration: none; opacity: .68; transition: opacity .2s ease; }
.ss-lang a:hover { opacity: 1; }
.ss-lang a.is-on { opacity: 1; }
.ss-lang em { font-style: normal; text-decoration: none; opacity: .68; }
/* 当前语言用纯白高亮，未选中语言淡化 */
.ss-lang .is-on { color: #fff; opacity: 1; }
html[lang="en"] .ss-nav { gap: .5rem; }
html[lang="en"] .ss-header-tools { gap: .3rem; }
html[lang="en"] .ss-lang { padding-right: .26rem; }
html[lang="en"] .ss-lang, html[lang="en"] .ss-header-hotline strong { white-space: nowrap; }
html[lang="en"] .ss-header-hotline strong { font-size: .19rem; }
.ss-logo { display: block; margin-right: auto; width: 2.11rem; height: .6rem; overflow: hidden; }.ss-logo img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: left center; }
.ss-nav { display: flex; gap: .8rem; margin-left: auto; align-self: stretch; }.ss-nav a { position: relative; display: flex; align-items: center; color: #fff; font-size: .18rem; text-decoration: none; white-space: nowrap; }.ss-nav a:after { position: absolute; bottom: 0; left: 0; width: 100%; height: .02rem; content: ""; background: transparent; }.ss-nav a:hover:after, .ss-nav a.is-active:after { background: var(--ss-red); }
.ss-header-tools { display: flex; align-items: center; gap: .4rem; margin-left: .6rem; }.ss-search { display: flex; width: .24rem; height: .24rem; margin-right: .2rem; align-items: center; justify-content: center; }.ss-search img { display: block; width: .22rem; height: .22rem; object-fit: contain; }.ss-lang { padding-right: .1rem; font-size: .16rem; font-weight: 700; color: #fff; white-space: nowrap; }.ss-lang i { font-style: normal; font-weight: 400; color: #fff; }.ss-header-hotline { display: flex; align-items: center; gap: .06rem; color: #fff; text-decoration: none; font-size: .16rem; }.ss-hotline-icon { display: block; width: .4rem; height: .4rem; object-fit: contain; }.ss-header-hotline span, .ss-header-hotline strong { display: block; color: #fff; }.ss-header-hotline strong { margin-top: .06rem; font-size: .22rem; line-height: 1; }
.ss-hero { position: relative; min-height: 6rem; overflow: hidden; background: #090909 url('/starshine/img/hero.png') center/cover no-repeat; color: #fff; }.ss-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }.ss-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.54) 35%, rgba(0,0,0,.05) 67%); }.ss-hero-content { position: relative; z-index: 1; padding-top: 1.3rem; }.ss-eyebrow { display: block; margin-bottom: .16rem; padding-left: .7rem; font-size: .24rem; text-shadow: 0 .02rem .06rem rgba(0,0,0,.5); }.ss-hero h1 { width: 8.4rem; max-width: 8.4rem; margin: 0; font-size: .54rem; line-height: 1.3; font-weight: 700; text-shadow: 0 .02rem .06rem rgba(0,0,0,.5); }.ss-hero p { width: 7.5rem; margin: .18rem 0 .46rem; font-size: .17rem; line-height: 1.8; color: rgba(255,255,255,.85); text-shadow: 0 .02rem .05rem rgba(0,0,0,.45); }
.ss-button { display: inline-flex; min-width: 1.48rem; height: .52rem; align-items: center; justify-content: center; gap: .14rem; padding: 0 .3rem; background: var(--ss-red); border: 1px solid var(--ss-red); border-radius: .03rem; color: #fff; font-size: .17rem; text-decoration: none; white-space: nowrap; transition: background-color .25s ease, border-color .25s ease, color .25s ease; }.ss-link-arrow { display: inline-block; width: .14rem; height: .14rem; flex: 0 0 .14rem; color: inherit; background: currentColor; -webkit-mask: url('/starshine/img/arrow-red.svg') center/contain no-repeat; mask: url('/starshine/img/arrow-red.svg') center/contain no-repeat; }.ss-button-light { background: rgba(255,255,255,.2); border-color: #fff; color: #fff; }.ss-button-outline { background: transparent; border: 1px solid var(--ss-red); color: var(--ss-red); }.ss-scroll { position: absolute; z-index: 1; bottom: .4rem; left: 50%; transform: translateX(-50%); color: rgba(255,255,255,.7); font-size: .15rem; letter-spacing: .02rem; }
.ss-about { padding: .8rem 0 .7rem; background: #f8f8f8; }.ss-section-head h2 { margin: 0; font-size: .45rem; line-height: 1.2; }.ss-section-head h2 span { color: var(--ss-red); }.ss-section-head p { margin: .12rem 0 0; color: var(--ss-muted); font-size: .19rem; }.ss-section-head-center { text-align: center; }.ss-about-panel { display: grid; grid-template-columns: 1fr 1fr; min-height: 4.5rem; margin-top: .42rem; background: #fff; }.ss-about-copy { padding: .6rem; }.ss-label { color: var(--ss-red); font-size: .16rem; }.ss-about-copy h2 { margin: .18rem 0; font-size: .3rem; }.ss-richtext { min-height: 1.2rem; color: var(--ss-muted); font-size: .16rem; line-height: 1.9; }.ss-richtext p { margin: 0 0 .12rem; }.ss-text-link { display: inline-flex; align-items: center; gap: .12rem; margin-top: .22rem; color: var(--ss-red); font-size: .16rem; text-decoration: none; }.ss-metrics { display: flex; gap: 1.4rem; margin-top: .45rem; }.ss-metrics article { display: flex; flex-direction: column; gap: .1rem; }.ss-metrics strong, .ss-metrics article > span { display: block; }.ss-metrics strong { color: var(--ss-red); font-size: .4rem; line-height: .4rem; }.ss-metrics strong span, .ss-metrics strong em { color: inherit; }.ss-metrics strong em { font-size: .2rem; font-style: normal; }.ss-metrics article > span { color: var(--ss-muted); font-size: .16rem; line-height: .2rem; }.ss-about-image { overflow: hidden; }.ss-about-image img { width: 100%; height: 100%; min-height: 4.5rem; object-fit: cover; }
.ss-capability { padding: .84rem 0; }.ss-capability .ss-section-head { margin-bottom: .4rem; }.ss-capability-banner { position: relative; height: 5.86rem; overflow: hidden; border-radius: .1rem; background: #0a0a0a url('/starshine/img/capability-3d.png') no-repeat; background-size: 89.49% 137.16%; background-position: 100% 73.68%; }.ss-capability-banner:after { position: absolute; inset: 0; content: ''; background: url('/starshine/img/capability-texture.png') no-repeat; background-size: 100% 156.85%; background-position: 0 25.3%; opacity: .1; pointer-events: none; }.ss-card-shade { position: absolute; inset: 0; background: linear-gradient(270deg, rgba(0,0,0,0) 37.988%, rgba(5,5,5,.4) 72.18%, #060606 82.99%, #080808 100%); }.ss-capability-copy { position: relative; z-index: 1; top: .8rem; left: .8rem; width: 6.8rem; }.ss-capability-copy i { display: block; width: .6rem; height: .6rem; }.ss-capability-copy i img { display: block; width: 100%; height: 100%; object-fit: contain; }.ss-capability-copy h3 { margin: .1rem 0 .25rem; color: #fff; font-size: .3rem; }.ss-capability-copy p { overflow: hidden; margin: 0; height: .84rem; color: rgba(255,255,255,.8); font-size: .15rem; line-height: .28rem; }.ss-button-ghost { display: inline-flex; min-width: 1.48rem; height: .52rem; align-items: center; justify-content: center; gap: .14rem; padding: 0 .3rem; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.7); border-radius: .03rem; color: #fff; font-size: .17rem; text-decoration: none; white-space: nowrap; }.ss-button-ghost .ss-link-arrow, .ss-button-light .ss-link-arrow { -webkit-mask-image: url('/starshine/img/arrow-white.svg'); mask-image: url('/starshine/img/arrow-white.svg'); }
.ss-consult { position: relative; padding: .4rem 0; background: #fff; color: #fff; }.ss-consult-inner { position: relative; display: flex; min-height: 1.8rem; align-items: center; justify-content: space-between; padding: 0 1.1rem; overflow: hidden; border-radius: .1rem; background: #080808 url('/starshine/img/figma-consult.png') center/cover no-repeat; }.ss-consult-mask { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: linear-gradient(90deg, rgba(2,0,0,1) 0%, rgba(5,1,1,.8) 75%); }.ss-consult-copy { position: relative; z-index: 1; }.ss-consult-copy > div { display: flex; flex-direction: column; gap: .06rem; }.ss-consult .ss-button { position: relative; z-index: 1; }.ss-consult span, .ss-consult em, .ss-consult strong { display: block; }.ss-consult-copy span, .ss-consult-copy strong { color: #fff !important; }.ss-consult span { font-size: .24rem; }.ss-consult em { margin-top: .08rem; color: rgba(255,255,255,.7); font-size: .14rem; font-style: normal; }.ss-consult strong { font-size: .35rem; }
.ss-process { position: relative; padding: .8rem 0; overflow: hidden; background: #050505; color: #fff; }.ss-process-bg { position: absolute; inset: 0; opacity: .55; background: url('/starshine/img/service-bg.png') center/cover no-repeat; }.ss-process .ss-wrap { position: relative; }.ss-process .ss-section-head h2 { color: #fff; }.ss-section-head-dark p { color: rgba(255,255,255,.6); }.ss-process-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, 1fr); gap: .2rem; margin-top: .46rem; }.ss-process-grid article { position: relative; display: flex; min-height: 2.3rem; flex-direction: column; justify-content: flex-end; padding: .4rem; background: #fff; border-radius: .08rem; color: #222; }.ss-process-grid article.is-highlight { background: var(--ss-red) url('/starshine/img/process-decor.png') right top/auto 100% no-repeat; color: #fff; }.ss-process-grid h3 { margin: 0; color: inherit; font-size: .24rem; }.ss-process-grid p { min-height: .76rem; margin: .12rem 0; color: #666; font-size: .16rem; line-height: 1.55; }.ss-process-grid .is-highlight p { color: rgba(255,255,255,.9); }.ss-process-grid strong { position: absolute; right: .3rem; bottom: .2rem; color: var(--ss-red); font-size: .34rem; line-height: 1; }.ss-process-grid .is-highlight strong { color: #fff; }.ss-process-grid article .ss-link-arrow { display: none; }.ss-process-grid article.is-highlight .ss-link-arrow { position: absolute; left: .4rem; bottom: .34rem; display: block; color: #fff; }
.ss-news { padding: .8rem 0; }.ss-section-head-inline { display: flex; align-items: center; justify-content: space-between; }.ss-news-grid { display: grid; grid-template-columns: repeat(2, 1fr) 1fr; gap: .25rem; margin-top: .4rem; }.ss-news-feature { position: relative; overflow: hidden; background: #f7f7f7; border-radius: .08rem; color: var(--ss-text); text-decoration: none; }.ss-news-feature > img { width: 100%; height: 2.8rem; object-fit: cover; }.ss-news-body { display: block; min-height: 2.1rem; padding: .25rem .35rem; }.ss-news-body i { color: var(--ss-red); font-size: .15rem; font-style: normal; }.ss-news-body h3 { display: -webkit-box; overflow: hidden; margin: .13rem 0; font-size: .23rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.ss-news-body p { display: -webkit-box; overflow: hidden; margin: 0; color: var(--ss-muted); font-size: .15rem; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }.ss-news-body time { display: block; margin-top: .18rem; color: #999; font-size: .15rem; }.ss-news-feature .ss-link-arrow { position: absolute; right: .32rem; bottom: .32rem; color: var(--ss-red); }.ss-news-list { display: flex; flex-direction: column; gap: .1rem; }.ss-news-list a { position: relative; flex: 1; padding: .22rem .5rem .22rem .35rem; background: #f7f7f7; color: var(--ss-text); text-decoration: none; }.ss-news-list time { color: #999; font-size: .15rem; }.ss-news-list h3 { display: -webkit-box; overflow: hidden; margin: .08rem 0; font-size: .2rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.ss-news-list p { overflow: hidden; margin: 0; color: var(--ss-muted); font-size: .14rem; text-overflow: ellipsis; white-space: nowrap; }.ss-news-list b.ss-link-arrow { position: absolute; left: .35rem; bottom: .1rem; color: var(--ss-red); }
/* 新闻网格三等分：清除子项自动最小宽度（英文长句 nowrap 的最小内容宽度等于整句长度，会把列表列撑爆、挤压左侧卡片），锁定与设计稿一致的三等分布局 */
.ss-news-grid > .ss-news-feature, .ss-news-grid > .ss-news-list { min-width: 0; }
/* 新闻卡片 hover：参考设计稿 83-2396（整卡变红底 #D0121C + 白色文字） */
.ss-news-feature { transition: background-color .3s ease; }
.ss-news-feature .ss-news-body h3,
.ss-news-feature .ss-news-body p,
.ss-news-feature .ss-news-body time { transition: color .3s ease; }
.ss-news-feature .ss-link-arrow { transition: color .3s ease; }
.ss-news-feature:hover { background: var(--ss-red); }
.ss-news-feature:hover .ss-news-body h3,
.ss-news-feature:hover .ss-news-body p,
.ss-news-feature:hover .ss-news-body time { color: #fff; }
.ss-news-feature:hover .ss-link-arrow { color: #fff; -webkit-mask-image: url('/starshine/img/arrow-white.svg'); mask-image: url('/starshine/img/arrow-white.svg'); }
/* 新闻卡片 hover：图片放大（与新闻列表页 .ss-news-card-media img 效果一致） */
.ss-news-feature > img { transition: transform .35s ease; }
.ss-news-feature:hover > img { transform: scale(1.04); }
/* 新闻列表 hover：参考设计稿 107-626（标题变红 + 箭头变红 + 底部红线） */
.ss-news-list a { transition: box-shadow .3s ease; }
.ss-news-list a h3 { transition: color .3s ease; }
.ss-news-list a:hover { box-shadow: inset 0 -.02rem 0 var(--ss-red); }
.ss-news-list a:hover h3 { color: var(--ss-red); }
.ss-join { min-height: 4.6rem; padding: .8rem 0; background: #111 url('/starshine/img/join-bg.png') center/cover no-repeat; color: #fff; }.ss-join-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: center; min-height: 3rem; }.ss-join h2 { margin: 0; font-size: .45rem; }.ss-join h2 span { color: var(--ss-red); }.ss-join-inner > div > p { margin: .15rem 0 0; color: rgba(255,255,255,.7); font-size: .18rem; }.ss-join-copy p { max-width: 6.8rem; white-space: pre-line; line-height: 1.8; }.ss-join-copy .ss-button { margin-top: .28rem; }.ss-footer { padding: .42rem 0; background: #000; color: rgba(255,255,255,.65); }.ss-footer img { width: 1.7rem; height: auto; }.ss-footer p, .ss-footer span { margin-left: .3rem; font-size: .14rem; }
@media (max-width: 1024px) { .ss-header { padding: 0 .2rem; }.ss-nav { gap: .22rem; }.ss-wrap { max-width: calc(100% - .4rem); }.ss-about-panel, .ss-join-inner { grid-template-columns: 1fr; }.ss-capability-grid, .ss-news-grid { grid-template-columns: 1fr; }.ss-capability-grid > *, .ss-news-grid > * { min-width: 0; }.ss-news-feature > img { max-width: 100%; }.ss-capability-card { height: 4.6rem; }.ss-process-grid { grid-template-columns: repeat(2, 1fr); }.ss-consult-inner { min-height: 5.86rem; }.ss-hero { min-height: 6rem; }.ss-hero-content { padding-top: 1.3rem; }.ss-hero h1 { width: 7rem; font-size: .44rem; }.ss-news-list { min-height: 3rem; }.ss-footer p, .ss-footer span { display: block; margin: .1rem 0 0; } }

/* 小屏文字颜色对齐 PC（≥1025px 块）：轮播文案/滚动提示/关于我们/加入我们/横幅分页 */
@media (max-width: 1024px) {
  .ss-hero-content, .ss-hero-content h1, .ss-hero-content p, .ss-hero p { color: #fff; }
  .ss-hero-scroll em { color: #acb2b7; }
  .ss-richtext { color: #555; }
  .ss-join-inner .ss-join-copy p { color: #fff; }
  .ss-hero-pager button { background: transparent; border: 0; color: #fff; }
  .ss-hero-pager button.is-active { border: 1px solid #fff; border-radius: 50%; }
}

/* 页脚小屏样式：黑色底 + 居中单列排版，去掉链接网格/二维码/公司名等冗余内容 */
@media (max-width: 1024px) {
  .ss-footer { display: flex; flex-direction: column; align-items: center; padding: .28rem .2rem .24rem; background: #000; color: rgba(255,255,255,.9); text-align: center; }
  .ss-footer:before { display: none; }
  .ss-footer-main, .ss-footer-company { display: contents; }
  .ss-footer-links, .ss-footer-qrcode, .ss-footer-company .ss-footer-name { display: none; }
  /* 友情链接 */
  .ss-footer-friends { order: 1; display: flex; width: auto; flex-wrap: wrap; align-items: center; justify-content: center; gap: .08rem; margin: 0 0 .16rem; padding: 0; font-size: 12px; }
  .ss-footer-friends strong { color: #fff; font-size: 12px; }
  .ss-footer-friends span { display: flex; align-items: center; gap: .16rem; }
  .ss-footer-friends img { width: auto; height: .24rem; }
  .ss-footer-friends a { display: inline-flex; width: auto; height: auto; align-items: center; color: rgba(255,255,255,.8); font-size: 12px; text-decoration: none; }
  /* 版权 · ICP · 法律声明 */
  .ss-footer-bottom { order: 2; display: block; width: auto; margin: 0; padding: 0; color: rgba(255,255,255,.9); font-size: 12px; line-height: 2; }
  /* 版权行文本是嵌套 span，桌面规则 .ss-footer span{font-size:.14rem} 在小屏会把字号压到 .14rem，
     与相邻的备案号/法律声明/地址行不一致，此处强制继承底部条字号 */
  .ss-footer-bottom span { display: block; margin: 0; font-size: inherit; }
  .ss-footer-bottom span span { display: inline; margin: 0; }
  .ss-footer-bottom .ss-beian-link { display: block; font-size: inherit; color: inherit; text-decoration: none; }
  .ss-footer-bottom .ss-footer-legal { display: block; margin: 0; font-size: 12px; }
  /* 地址 · 邮箱 · 电话 */
  .ss-footer-company p { width: auto; margin: 0; color: rgba(255,255,255,.9); font-size: 12px; line-height: 2; }
  .ss-footer-company p:nth-of-type(2) { order: 5; }
  .ss-footer-company p:nth-of-type(3) { order: 4; }
  .ss-footer-company p:nth-of-type(4) { order: 3; }
  .ss-footer-company p span { display: inline; margin: 0; color: inherit; font-size: inherit; }
  /* 底部 logo */
  .ss-footer-company > img { order: 6; width: 1.1rem; height: auto; margin: .16rem 0 0; }
}

/* 加入我们（小屏）：对齐 PC 版式（白底 + 深色圆角卡片 + 半弧形遮罩），
   并在卡片与页脚之间留出白色间距，避免「加入我们」与纯黑页脚连成一片。
   三层结构与 PC 完全一致：配图 → 半弧形红色装饰 → 半弧形深色遮罩 → 文案。 */
@media (max-width: 1024px) {
  .ss-join { min-height: 0; padding: .3rem 0 0; background: #fff; }
  .ss-join-inner { position: relative; display: block; min-height: 4rem; overflow: hidden; border-radius: .1rem; padding: .64rem .36rem .7rem; background: #111; }
  /* 配图：铺满右侧区域，画面锚定原图右侧（只露出右半边），左侧被深色弧形遮罩盖住 */
  .ss-join-photo { display: block; position: absolute; z-index: 0; top: 0; right: 0; bottom: 0; left: 38%; background: url('/starshine/img/figma-join-photo.png') right center/cover no-repeat; pointer-events: none; }
  /* 弧形过渡：在配图上方叠加「深 → 透明」渐变，柔化弧线边缘；置于红弧与遮罩之下，避免遮挡红弧 */
  .ss-join-inner:after { position: absolute; z-index: 1; top: 0; bottom: 0; left: 44%; width: 22%; content: ''; pointer-events: none; background: linear-gradient(to right, rgba(17,17,17,.92) 0%, rgba(17,17,17,.45) 55%, rgba(17,17,17,0) 100%); }
  /* 半弧形红色装饰：与遮罩同形并整体右移一个弧宽，使红弧沿边界自顶部微微露出、向下逐渐变宽（上端细、下端粗） */
  .ss-join-curve { display: block; position: absolute; z-index: 2; top: 0; bottom: 0; left: 6%; width: 64%; background: url('/starshine/img/figma-join-curve.svg') left center/100% 100% no-repeat; pointer-events: none; }
  /* 半弧形深色遮罩：覆盖左侧约 2/3，右缘为弧线（拉伸后弧线更平缓） */
  .ss-join-inner:before { position: absolute; z-index: 3; top: 0; bottom: 0; left: 0; width: 66%; content: ''; pointer-events: none; background: url('/starshine/img/figma-join-front.png') left center/100% 100% no-repeat; }
  /* 文案：宽度占满整个容器，描述尽量铺满整行，超出容器才换行 */
  .ss-join-copy { position: relative; z-index: 4; max-width: 100%; }
  .ss-join h2 { color: #fff; }
  .ss-home-page .ss-footer { margin-top: .5rem; }
}

/* 小屏首页模块顺序与 PC 保持一致：关于我们 → 新闻中心 → 核心能力 → 即时为您提供优质服务 → 服务中心 → 加入我们 */
@media (max-width: 1024px) {
  .ss-home-page main { display: flex; flex-direction: column; }
  .ss-home-page main > .ss-about { order: 1; }
  .ss-home-page main > .ss-news { order: 2; }
  .ss-home-page main > .ss-capability { order: 3; }
  .ss-home-page main > .ss-consult { order: 4; }
  .ss-home-page main > .ss-process { order: 5; }
  .ss-home-page main > .ss-join { order: 6; }
}

@media (min-width: 1025px) {
  .ss-page main { display: flex; flex-direction: column; }
  .ss-page main > .ss-about { order: 1; }
  .ss-page main > .ss-news { order: 2; }
  .ss-page main > .ss-capability { order: 3; }
  .ss-page main > .ss-consult { order: 4; }
  .ss-page main > .ss-process { order: 5; }
  .ss-page main > .ss-join { order: 6; }
  .ss-hero { height: 6rem; min-height: 6rem; }
  .ss-hero-shade { background: linear-gradient(165deg, rgba(0,0,0,.8) 16.394%, rgba(0,0,0,0) 49.082%); }
  .ss-hero-content { padding-top: 1.3rem; }
  .ss-hero-content, .ss-hero-content h1, .ss-hero-content p { color: #fff; }
  .ss-hero h1 { font-size: .4rem; line-height: .66rem; letter-spacing: .02rem; }
  .ss-hero p { margin: .11rem 0 .6rem; font-size: .18rem; line-height: .26rem; color: #fff; }
  .ss-hero-scroll { position: absolute; z-index: 1; top: 4.37rem; left: 50%; display: flex; width: 1.71rem; flex-direction: column; align-items: center; gap: .16rem; transform: translateX(-50%); }
  .ss-hero-scroll span { width: 1px; height: .64rem; background: linear-gradient(#8d9399, #fff); }
  .ss-hero-scroll em { color: #acb2b7; font: .1rem/.15rem Arial, sans-serif; letter-spacing: .04rem; text-transform: uppercase; white-space: nowrap; font-style: normal; }
  .ss-hero-scroll b { width: .12rem; height: .12rem; border-radius: 50%; background: #f21618; box-shadow: 0 0 .2rem rgba(241,56,62,.8); }
  .ss-hero-pager { position: absolute; z-index: 1; bottom: .5rem; left: 1.4rem; display: flex; height: .48rem; align-items: center; }
  .ss-hero-pager a { position: relative; display: flex; width: .48rem; height: .48rem; align-items: center; justify-content: center; margin-right: .32rem; color: #fff; font: .11rem/1 Arial, sans-serif; text-decoration: none; }
  .ss-hero-pager a:last-child { margin-right: 0; }
  .ss-hero-pager a:first-child { border: 1px solid #fff; border-radius: 50%; margin-right: .6rem; }
  .ss-hero-pager a:first-child:after { position: absolute; top: 50%; right: -.41rem; width: .53rem; height: 1px; content: ''; background: rgba(255,255,255,.3); }
  .ss-about { position: relative; overflow: hidden; height: 8.54rem; padding: .8rem 0; }
  /* 关于我们·设计稿背景装饰：电路纹理整体 180° 翻转 + 5% 不透明度，随 rem 等比缩放 */
  .ss-about::before { position: absolute; top: -3.714rem; left: 0; width: 100%; height: 16.544rem; content: ''; background: url('/starshine/img/about-circuit.png') center/100% 100% no-repeat; opacity: .05; transform: scale(-1, -1); pointer-events: none; }
  .ss-about .ss-wrap { position: relative; }
  .ss-about-panel { grid-template-columns: 7.5rem 8.66rem; grid-template-rows: 6rem; column-gap: .24rem; justify-content: space-between; height: 6rem; min-height: 6rem; margin-top: .4rem; overflow: hidden; border-radius: .1rem; }
  .ss-about-copy { display: flex; grid-column: 2; flex-direction: column; padding: .8rem 2.2rem .55rem .6rem; }
  .ss-about-copy h2 { margin: 0 0 .3rem; font-weight: 520; line-height: .3rem; }
  .ss-richtext { width: 7.6rem; max-width: none; margin: 0 0 .4rem; color: #555; line-height: .3rem; }
  .ss-richtext p:last-child { margin-bottom: 0; }
  .ss-metrics { margin: 0; padding-top: .8rem; }
  .ss-about-image { position: relative; grid-column: 1; grid-row: 1; overflow: hidden; background: radial-gradient(3.75rem 3rem at 50% 50%, #fff 9.38%, #e6e8ec 100%); }
  /* 关于我们·左侧图片：完全按照接口返回的图片等比缩放、完整显示，不裁剪 */
  .ss-about-image img { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; max-width: 100%; max-height: 100%; min-height: 0; object-fit: contain; transform: translate(-50%, -50%); }
  .ss-capability { height: auto; padding: 0; }
  .ss-capability-copy .ss-button { margin-top: .27rem; }
  .ss-capability-grid { grid-template-columns: 9.8rem 6.4rem; margin-top: .4rem; }
  .ss-capability-card { display: block; width: auto; }
  .ss-capability-card.ss-capability-main { width: 9.8rem; }
  .ss-capability-card.ss-capability-side { width: 6.4rem; }
  .ss-capability-card.ss-capability-main > div { top: .8rem; left: .8rem; width: 6.8rem; }
  .ss-capability-card.ss-capability-side > div { top: .6rem; left: .6rem; width: 4.2rem; }
  .ss-capability-card > div { position: absolute; display: flex; flex-direction: column; }
  .ss-capability-card i { width: .6rem; height: .6rem; }
  .ss-capability-card i img { display: block; width: 100%; height: 100%; object-fit: contain; }
  .ss-capability-card h3 { margin: .1rem 0 .25rem; }
  .ss-consult { height: 2.6rem; margin-top: .8rem; padding: 0; background: #fff; }
  .ss-page .ss-consult a.ss-button { width: 1.8rem !important; height: .64rem !important; min-height: .64rem !important; }
  .ss-consult-inner { height: 2.6rem; padding: 0 1.1rem; background: #020000 url('/starshine/img/figma-consult.png') no-repeat; background-size: 117.12% 420.03%; background-position: 100% 34.4%; }
  .ss-consult-inner:after { position: absolute; inset: 0; content: ''; background: url('/starshine/img/consult-texture.png') bottom/100% 100% no-repeat; opacity: .15; pointer-events: none; }
  .ss-consult-copy { display: flex; align-items: center; gap: .22rem; }
  .ss-consult .ss-button { width: max-content !important; max-width: 100%; height: .64rem !important; padding-right: .2rem; padding-left: .2rem; background: rgba(255,255,255,.2); font-size: .2rem; }
  html[lang="en"] .ss-consult .ss-button { font-size: 17px; }
  .ss-consult-copy > img { width: .8rem; height: .8rem; flex: 0 0 .8rem; object-fit: contain; }
  .ss-consult em { display: none; }
  .ss-consult span { line-height: .32rem; }
  .ss-consult strong { line-height: .46rem; }
  .ss-process { height: 6.8rem; margin-top: .8rem; padding: 1rem 0 .6rem; }
  /* 服务中心底图：设计稿为 67.03%x112.91% 定位 + 左黑右透明渐变，替换默认 cover 铺满 */
  .ss-process-bg { opacity: 1; background: linear-gradient(to right, #000 3.88%, #080808 27.335%, rgba(18,18,18,0) 54.792%), url('/starshine/img/service-bg.png') no-repeat; background-size: 100% 100%, 67.03% 112.91%; background-position: 0 0, 72.53% 35.88%; }
  .ss-process-grid { margin-top: 1.96rem; }
  .ss-process-grid article.is-highlight .ss-link-arrow { left: .4rem; bottom: .4rem; width: .32rem; height: .32rem; background: url('/starshine/img/process-arrow.svg') center/contain no-repeat; -webkit-mask: none; mask: none; }
  .ss-process-grid strong { right: .4rem; bottom: .4rem; font-size: .3rem; }
  .ss-process-grid p { min-height: .48rem; margin: .1rem 0; }
  /* 选中卡：文字下方预留「箭头行 32 + 间距 68 + 内边距 40」= 140，箭头/序号绝对定位在底部 40 */
  .ss-process-grid article.is-highlight { height: 2.7rem; min-height: 2.7rem; padding-bottom: 1.4rem; }
  /* 未选中卡：文字下方预留「序号行 + 间距 20 + 内边距 40」= 92 */
  .ss-process-grid article:not(.is-highlight) { height: 2.3rem; min-height: 2.3rem; margin-top: .4rem; padding-bottom: .92rem; }
  .ss-news { height: auto; padding: .8rem 0; }
  .ss-news .ss-section-head { height: .97rem; }
  .ss-news-list a { position: relative; max-height: 1.7rem; padding: .22rem .35rem .2rem; }
  .ss-news-feature { border-radius: .1rem; }
  .ss-news-body { display: flex; height: 2.5rem; min-height: 2.5rem; flex-direction: column; padding: .2rem .35rem .3rem; }
  .ss-news-body time { display: flex; height: .6rem; margin-top: auto; padding: 0; align-items: flex-end; padding-bottom: .1rem; border-top: 1px solid #ddd; }
  .ss-news-body h3 { margin: .15rem 0; }
  .ss-news-feature .ss-link-arrow { right: .35rem; bottom: .23rem; }
  .ss-join { position: relative; height: 4.6rem; min-height: 4.6rem; margin-top: .8rem; padding: 0; background: #fff; }
  .ss-join-inner { position: relative; z-index: 1; display: block; height: 4.6rem; min-height: 4.6rem; overflow: hidden; padding-top: 1rem; border-radius: .1rem; background: #111; }
  /* 加入我们配图：设计稿为 953x460 的图框，位于右起、整图铺满（不裁切、不镜像），左侧被前景遮罩盖住 */
  .ss-join-photo { position: absolute; z-index: 0; top: 0; bottom: 0; left: 6.87rem; width: 9.53rem; background: url('/starshine/img/figma-join-photo.png') 0 0 / 100% 100% no-repeat; pointer-events: none; }
  .ss-join-inner:before { position: absolute; z-index: 1; inset: 0; content: ''; pointer-events: none; background: url('/starshine/img/figma-join-front.png') left center/auto 100% no-repeat; }
  .ss-join-curve { position: absolute; z-index: 0; top: 0; bottom: 0; left: .2624rem; width: 10.4676rem; background: url('/starshine/img/figma-join-curve.svg') left center/100% 100% no-repeat; pointer-events: none; }
  .ss-join-copy { padding-left: .73rem; position: relative; z-index: 3; }
  .ss-join-copy h2 { line-height: .54rem; }
  .ss-join-copy p { max-width: 7.4rem; margin-top: .4rem; font-size: .16rem; line-height: .3rem; color: #fff; }
  .ss-join-copy .ss-button { margin-top: .54rem; }
  .ss-footer { position: relative; display: block; height: auto; min-height: 0; margin-top: 0; padding: .4rem 0 .18rem; background: #000; color: rgba(255,255,255,.65); }
  .ss-home-page .ss-footer { margin-top: .8rem; }
  .ss-footer:before { position: absolute; inset: 0; content: ''; background: url('/starshine/img/footer-bg.png') center 50%/cover no-repeat; opacity: .05; }
  .ss-footer > .ss-wrap { position: relative; z-index: 1; }
  .ss-footer-main { display: flex; height: auto; padding-top: .1rem; align-items: flex-start; }
  .ss-footer-company { flex: 0 0 auto; width: auto; padding: .1rem .68rem 0 0; border-right: 1px solid rgba(255,255,255,.25); }
  .ss-footer-company > img { display: none; }
  .ss-footer-company .ss-footer-name { display: block; margin: 0 0 .08rem; color: #fff; font-size: .24rem; font-weight: 700; letter-spacing: .02rem; white-space: nowrap; }
  .ss-footer-company p { margin: .05rem 0; color: rgba(255,255,255,.8); font-size: .16rem; line-height: .256rem; }
  .ss-footer-company p span { margin-left: 0; font-size: .16rem; }
  .ss-footer-links { display: flex; flex: 0 0 10rem; margin-right: .53rem; justify-content: space-between; padding: .1rem .5rem 0 .8rem; }
  .ss-footer-links div { display: flex; min-width: 1.3rem; flex-direction: column; gap: .1rem; }
  .ss-footer-links strong { color: #fff; font-size: .18rem; line-height: .3rem; }
  .ss-footer-links a { position: relative; padding-left: .14rem; width: auto !important; height: auto !important; color: rgba(255,255,255,.8); font-size: .16rem; line-height: .24rem; text-decoration: none; }
  .ss-footer-links a:before { position: absolute; top: .1rem; left: 0; width: .04rem; height: .04rem; content: ''; background: #ccc; }
  .ss-footer-qrcode { width: 1.6rem; text-align: center; }
  .ss-footer-qrcode { padding-top: .1rem; }
  .ss-footer-qrcode img { display: block; width: 1.3rem; height: 1.3rem; margin: 0 auto .1rem; object-fit: contain; }
  .ss-footer-qrcode span { margin-left: 0; color: rgba(255,255,255,.8); font-size: .16rem; }
  .ss-footer-friends, .ss-footer-bottom { display: flex; align-items: center; border-top: 1px solid rgba(255,255,255,.13); }
  .ss-footer-friends { display: flex; flex-wrap: wrap; height: auto; margin-top: .28rem; padding: .14rem 0; align-items: center; gap: .1rem; }
  .ss-footer-friends strong { color: #fff; font-size: .16rem; }
  .ss-footer-friends span { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; }
  .ss-footer-friends img { width: auto; height: .42rem; object-fit: contain; }
  .ss-footer-friends a { display: inline-flex; width: auto !important; height: auto !important; align-items: center; color: rgba(255,255,255,.8); font-size: .16rem; text-decoration: none; transition: opacity .2s ease; }
  .ss-footer-friends a:hover { color: #fff; opacity: .85; }
  .ss-footer-bottom { position: relative; display: flex; flex-wrap: wrap; height: auto; min-height: 0; margin-top: 0; align-items: center; gap: .1rem .2rem; padding: .06rem .66rem .06rem 0; color: #ccc; font-size: .14rem; }
  .ss-footer-bottom span { margin-left: 0; }
  .ss-beian-link { color: inherit; text-decoration: none; transition: color .2s ease; }
  .ss-beian-link:hover { color: #fff; }
  .ss-footer-bottom .ss-footer-legal { margin-left: auto; font-size: .12rem; }
  html[lang="en"] .ss-footer { height: auto; min-height: 0; }
  html[lang="en"] .ss-footer-main { display: grid; grid-template-columns: minmax(3.8rem, 4.8rem) minmax(0, 1fr) 1.6rem; height: auto; min-height: 0; column-gap: .32rem; }
  html[lang="en"] .ss-footer-company { width: 100%; min-width: 0; padding-right: .32rem; }
  html[lang="en"] .ss-footer-company .ss-footer-name { font-size: .2rem; letter-spacing: 0; white-space: normal; }
  html[lang="en"] .ss-footer-company p, html[lang="en"] .ss-footer-company p span { overflow-wrap: anywhere; word-break: break-word; }
  html[lang="en"] .ss-footer-links { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); width: auto; min-width: 0; flex: none; margin-right: 0; padding: .1rem 0 0; column-gap: .2rem; }
  html[lang="en"] .ss-footer-links div { min-width: 0; }
  html[lang="en"] .ss-footer-links strong, html[lang="en"] .ss-footer-links a { overflow-wrap: anywhere; word-break: break-word; }
  html[lang="en"] .ss-footer-links strong { font-size: .16rem; line-height: .24rem; }
  html[lang="en"] .ss-footer-links a { font-size: .14rem; line-height: .22rem; }
  html[lang="en"] .ss-footer-qrcode { min-width: 0; }
  html[lang="en"] .ss-footer-bottom { padding-right: 0; }
  html[lang="en"] .ss-footer-bottom span { overflow-wrap: anywhere; word-break: break-word; }
  /* 页脚下方不再预留 1rem 空白，避免底部露出白色边距 */
  .ss-page { background: #fff; }
}

@media (min-width: 1025px) {
  .ss-news-feature > img { height: 2.8rem; }
}

/* Figma home-state interactions: banner slides, capability expansion, and process selection. */
.ss-hero-slide { position: absolute; inset: 0; visibility: hidden; opacity: 0; transition: opacity .7s ease, visibility 0s linear .7s; }
.ss-page .ss-hero-slide, .ss-page .ss-hero-pager button, .ss-page .ss-button, .ss-page .ss-text-link { width: auto; height: auto; }
.ss-page .ss-hero-slide { height: 100%; }
.ss-page a.ss-button { display: inline-flex !important; width: max-content !important; max-width: 100%; min-height: .52rem; height: auto !important; padding-right: .2rem; padding-left: .2rem; white-space: nowrap; overflow: hidden; }
.ss-page main > .ss-consult a.ss-button { height: .64rem !important; min-height: .64rem !important; }
.ss-page .ss-hero-pager button { display: flex !important; width: .48rem !important; height: .48rem !important; }
.ss-page .ss-capability-card, .ss-page .ss-news-feature, .ss-page .ss-news-list a { width: auto !important; height: auto !important; }
.ss-hero-slide.is-active { z-index: 1; visibility: visible; opacity: 1; transition-delay: 0s; }
.ss-hero-slide-values { background: linear-gradient(97.493deg, #00335b 11.429%, rgba(2,52,83,.62) 35.997%, rgba(8,112,177,0) 56.661%), #000 url('/starshine/img/figma-banner-values.png') 7.45% -.04% / 102.87% 100% no-repeat; }
.ss-hero-slide-chip { background-image: linear-gradient(146.206deg, #ebEEF4 1.914%, #e5e8ee 9.353%, rgba(233,233,233,0) 21.445%), linear-gradient(180deg, rgba(33,25,25,.8), rgba(33,25,25,0) 14.352%), url('/starshine/img/figma-banner-chip-light.png'), url('/starshine/img/figma-banner-chip-base.png'); background-position: center, center, -1.97% -17.98%, -3.82% -9.83%; background-size: 100% 100%, 100% 100%, 120.48% 120.48%, 110% 109.86%; background-repeat: no-repeat; }
.ss-hero-slide-chip-red { background-image: linear-gradient(180deg, rgba(51,51,51,.8), rgba(27,27,27,0) 16.435%), url('/starshine/img/figma-banner-chip-red.png'), url('/starshine/img/figma-banner-chip-red-light.png'), url('/starshine/img/figma-banner-chip-red-base.png'); background-position: center, -3.94% -2.03%, 0 -13.21%, -3.82% -9.83%; background-size: 100% 100%, 113.51% 113.51%, 113.22% 113.22%, 110% 109.86%; background-repeat: no-repeat; }
.ss-hero-slide:not(:first-child) .ss-button { margin-top: .99rem; }
/* EN/长标题可读性：浅色芯片底上叠加左侧暗色渐隐，避免白色标题与芯片高光重叠 */
.ss-hero-slide-values::before, .ss-hero-slide-chip::before, .ss-hero-slide-chip-red::before { position: absolute; inset: 0; z-index: 0; content: ''; pointer-events: none; background: linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.5) 32%, rgba(0,0,0,.16) 58%, rgba(0,0,0,0) 80%); }
.ss-capability-card { transition: width .35s ease, opacity .25s ease; }
.ss-process-grid article { cursor: pointer; transition: margin-top .28s ease, height .28s ease, min-height .28s ease, padding-bottom .28s ease, background-color .28s ease, color .28s ease; }
.ss-process-grid article:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }

@media (min-width: 1025px) {
  .ss-hero-content { padding-top: 1.3rem; }
  .ss-hero-mark { position: absolute; top: 1.19rem; left: 0; display: block; width: .5rem; height: .5rem; background: url('/starshine/img/figma-banner-vision-mark.svg') center/contain no-repeat; }
  .ss-hero-slide-values .ss-hero-mark { background-image: url('/starshine/img/figma-banner-values-mark.svg'); }
  .ss-eyebrow { margin-bottom: .1rem; font-weight: 380; line-height: .28rem; }
  .ss-hero h1 { font-weight: 520; }
  .ss-hero-slide:first-child .ss-button { margin-top: .99rem; }
  .ss-capability-card h3 { color: #fff; }
  .ss-join h2 { color: #fff; }
  .ss-join h2 span { color: var(--ss-red); border-bottom: 0; }
  .ss-join-inner .ss-join-copy p { margin-top: .4rem; color: #fff; font-size: .16rem; line-height: .3rem; }
  .ss-hero-pager button { position: relative; display: flex; width: .48rem; height: .48rem; align-items: center; justify-content: center; margin-right: .32rem; padding: 0; border: 0; background: transparent; color: #fff; cursor: pointer; font: .11rem/1 Arial, sans-serif; }
  .ss-hero-pager button:last-child { margin-right: 0; }
  .ss-hero-pager button.is-active { border: 1px solid #fff; border-radius: 50%; margin-right: .6rem; }
  .ss-hero-pager button.is-active:after { position: absolute; top: 50%; right: -.41rem; width: .53rem; height: 1px; content: ''; background: rgba(255,255,255,.3); }
  .ss-hero-pager button.is-active:last-child { margin-right: 0; }
  .ss-hero-pager button.is-active:last-child:after { display: none; }
}

.ss-page .ss-button.ss-button-light:hover,
.ss-page .ss-button.ss-button-outline:hover,
.ss-page .ss-button.ss-button-ghost:hover { background: var(--ss-red); border-color: var(--ss-red); color: #fff; }
@media (max-width: 768px) {
  .ss-header { height: auto; min-height: .86rem; flex-wrap: wrap; padding: .1rem .2rem; }
  .ss-logo { width: 1.55rem; height: .48rem; }
  .ss-nav { order: 3; width: 100%; margin: .08rem 0 0; justify-content: space-between; gap: .06rem; }
  .ss-nav a { flex: 0 1 auto; font-size: clamp(11px, 3vw, 14px); line-height: 1.4; text-align: center; white-space: normal; }
  html[lang="en"] .ss-nav { gap: .04rem; }
  .ss-hero-content { padding-top: 1.3rem; }
  .ss-hero h1, .ss-hero p { width: min(100%, 7rem); max-width: 100%; }
  .ss-hero h1 { font-size: clamp(23px, 5.6vw, 32px); line-height: 1.25; }
  .ss-eyebrow { padding-left: 0; font-size: clamp(14px, 3.4vw, 18px); }
  .ss-process-grid { grid-template-columns: repeat(2, 1fr); gap: .16rem; }
  .ss-process-grid article { min-height: 2.7rem; padding: .32rem; }
  .ss-consult-inner { min-height: 3.2rem; align-items: flex-start; flex-direction: column; gap: .16rem; padding: .4rem; }
  .ss-consult-copy > img { width: .5rem; height: .5rem; flex: 0 0 .5rem; }
  .ss-consult .ss-button { align-self: flex-start; }
  .ss-capability-banner { height: auto; min-height: 3.2rem; padding: .5rem .3rem .6rem; }
  .ss-capability-copy { top: 0; left: 0; width: auto; }
  .ss-capability-copy p { height: auto; }
  .ss-capability-copy .ss-button-ghost { min-width: 0; max-width: 100%; }
}

/* ============================================================
   面包屑（全站统一，设计稿 414:2626）
   横幅下方 60px 白底条，右对齐内容栏，含首页图标与箭头
   ============================================================ */
.ss-crumb-bar { background: #fff; }
.ss-crumb {
  display: flex; align-items: center; justify-content: flex-end; gap: .05rem;
  min-height: .6rem; color: #666; font-size: .14rem; line-height: .3rem;
}
.ss-crumb > a, .ss-crumb > span { flex: 0 0 auto; width: auto; height: auto; }
.ss-crumb a { color: #666; text-decoration: none; }
.ss-crumb a:hover { color: var(--ss-red); }
.ss-crumb em { color: var(--ss-red); font-style: normal; }
.ss-crumb > span { color: var(--ss-red); }
.ss-crumb-home {
  display: inline-flex; width: .1rem; height: .1rem; flex: 0 0 auto;
  align-items: center; justify-content: center;
}
.ss-crumb-home img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ss-crumb-arrow { display: block; width: .05rem; height: .1rem; flex: 0 0 auto; object-fit: contain; }
@media (max-width: 1200px) {
  .ss-crumb { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .ss-crumb { min-height: .5rem; font-size: .12rem; }
}

/* ============================================================
   英文站首页：英文文案普遍长于中文，正文容器按内容自适应高度，
   完整展示文字（不再用省略号截断）；仅 Banner 标题保留 2 行上限，
   避免超长标题撑破固定高度的大图横幅
   ============================================================ */
html[lang="en"] .ss-hero-slide .ss-eyebrow { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
html[lang="en"] .ss-hero-slide h1 { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
/* 英文标题最多 2 行，按钮上边距相应收窄，按钮/分页器位置与中文版一致 */
html[lang="en"] .ss-hero-slide .ss-button { margin-top: .18rem; }
/* 关于我们：面板随英文正文增高，标题与正文完整显示 */
html[lang="en"] .ss-about { height: auto; }
html[lang="en"] .ss-about-panel { grid-template-rows: auto; height: auto; }
html[lang="en"] .ss-about-copy h2 { display: block; overflow: visible; -webkit-line-clamp: unset; }
html[lang="en"] .ss-about-copy .ss-richtext { display: block; overflow: visible; -webkit-line-clamp: unset; }
html[lang="en"] .ss-capability-copy p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
/* 服务中心：英文卡片同样固定高度（文案较长，尺寸略大于中文版），
   普通卡 2.7rem + .4rem 上边距 = 高亮卡 3.1rem，网格行高恒定，移入切换不跳动 */
html[lang="en"] .ss-process { height: auto; }
@media (min-width: 1025px) {
  html[lang="en"] .ss-process-grid article:not(.is-highlight) { height: 2.7rem; min-height: 2.7rem; }
  html[lang="en"] .ss-process-grid article.is-highlight { height: 3.1rem; min-height: 3.1rem; }
}
/* 英文标题较长（如 Requirement Confirmation），字号略收窄以保证标题单行显示 */
html[lang="en"] .ss-process-grid h3 { font-size: .21rem; }
html[lang="en"] .ss-process-grid h3 { display: block; overflow: visible; -webkit-line-clamp: unset; }
html[lang="en"] .ss-process-grid p { display: block; overflow: visible; -webkit-line-clamp: unset; }

/* ============================================================
   移动端 banner 智能居中裁切（首页）
   ------------------------------------------------------------
   首页主横幅 hero.png 为 2848x1600（比例 1.78）。
   小屏原固定 min-height 6rem，容器比例约 1.2，cover 会裁掉左右两侧约 1/3。
   改为 height:auto + aspect-ratio 随屏宽等比，并统一居中；
   保留足够的 min-height 以容纳标题/按钮/分页器等内容。
   ============================================================ */
@media (max-width: 1024px) {
  /* 移动端 banner：默认按设计稿比例等比铺满（首屏非图片时兜底） */
  .ss-hero { height: auto; aspect-ratio: 2848 / 1600; min-height: 0; } .ss-hero-content { padding-top: .7rem; } .ss-about-image img { width: 100%; height: auto; min-height: 0; } .ss-news-feature > img { height: auto; }
  .ss-hero, .ss-hero-slide { background-position: center; }
  .ss-hero-image { object-position: center; }
  /* 首屏为图片时：图片 100% 宽、整图完整显示、高度随图片自然比例自适应；其余轮播项固定为同一高度 */
  .ss-hero:has(> .ss-hero-slide:first-child > .ss-hero-image) { aspect-ratio: auto; }
  .ss-hero:has(> .ss-hero-slide:first-child > .ss-hero-image) > .ss-hero-slide:first-child { position: relative; inset: auto; height: auto; }
  .ss-hero:has(> .ss-hero-slide:first-child > .ss-hero-image) > .ss-hero-slide:first-child .ss-hero-image { position: relative; inset: auto; display: block; width: 100%; height: auto; object-fit: contain; }
  .ss-hero:has(> .ss-hero-slide:first-child > .ss-hero-image) > .ss-hero-slide:first-child .ss-hero-content { position: absolute; top: 0; left: 50%; width: 100%; transform: translateX(-50%); }
  /* 轮播标题与按钮间距：各轮播项统一为紧凑间距（含英文站），避免图/蓝底两种 banner 间距不一致
     并缩小「了解更多」按钮（默认 .64rem 偏大），收紧高度/宽度/内边距 */
  .ss-hero .ss-hero-slide .ss-button,
  html[lang="en"] .ss-hero .ss-hero-slide .ss-button { margin-top: .3rem; min-width: 1.3rem; height: .52rem !important; min-height: .52rem !important; padding: 0 .26rem; font-size: .16rem; }
  /* 「Scroll to explore」为 PC 设计元素（其竖向渐变线/圆点样式仅定义在 ≥1025px），
     小屏未定义定位会退回文档流，在 banner 图片下方多排出一段空白；移动端直接隐藏 */
  .ss-hero-scroll { display: none; }
  /* 移动端首页：隐藏「关于我们」与「核心能力」之间的公司大楼配图（.ss-about-image 仅首页使用） */
  .ss-about-image { display: none; }
}
/* 英文按完整单词换行，避免单词被截断 */
html[lang="en"] .ss-news-body h3, html[lang="en"] .ss-news-body p, html[lang="en"] .ss-news-list h3, html[lang="en"] .ss-news-list p { word-break: keep-all !important; }

/* ============================================================
   小屏图片响应式修正
   ============================================================ */
@media (max-width: 1024px) {
  /* 核心能力横幅：小屏不再使用设计稿的固定裁切比例，改为等比铺满，避免大图被拉伸变形 */
  .ss-capability-banner { background-size: cover; background-position: center; }
}

/* ============================================================
   移动端模块间距收紧（首页）
   ------------------------------------------------------------
   ≤1200px 时 1rem = 62.5px，首页各 section 原有 .8rem/.84rem
   上下留白在手机上达 50px 以上，相邻模块叠加约 94~105px，偏大。
   此处统一收紧到 .5rem（31.25px）左右，相邻模块合计约 62px。
   ============================================================ */
@media (max-width: 1024px) {
  .ss-about { padding: .5rem 0 .45rem; }
  .ss-capability { padding: .5rem 0; }
  .ss-process { padding: .5rem 0; }
  .ss-news { padding: .5rem 0; }
}

/* ============================================================
   英文站跳转按钮文案全大写
   ------------------------------------------------------------
   英文站（html[lang="en"]）所有点击跳转类按钮统一转大写，
   与 Learn More / Contact Us Now 视觉一致。中文站不受影响。
   home.css 被首页、关于我们及所有内页 @import 引用。
   ============================================================ */
html[lang="en"] .ss-button,
html[lang="en"] .ss-button-light,
html[lang="en"] .ss-button-outline,
html[lang="en"] .ss-button-ghost,
html[lang="en"] .ss-link-arrow,
html[lang="en"] .ss-header-hotline > div > span,
html[lang="en"] .ss-service-pill,
html[lang="en"] .ss-recruit-hero-button,
html[lang="en"] .ss-recruit-switch-link,
html[lang="en"] .ss-jobs-tabs a,
html[lang="en"] .ss-search-tabs a,
html[lang="en"] .ss-search-empty-link,
html[lang="en"] .ss-capability-submit,
html[lang="en"] .ss-legal-link,
html[lang="en"] .ss-about-tabs a,
html[lang="en"] .ss-about-tabs button,
html[lang="en"] .ss-about-tabs li,
html[lang="en"] .emp-nav,
html[lang="en"] .ss-backtop {
  text-transform: uppercase;
}
/* 首页轮播进度环（环转满一圈自动切换下一张，无限循环）
   .ss-hero-timer-track / .ss-hero-timer-progress 为环内的底圆与进度圆，供小屏分页器圆点复用 */
.ss-hero-timer-track { fill: none; stroke: rgba(255,255,255,.3); stroke-width: 1.4; }
.ss-hero-timer-progress { fill: none; stroke: #fff; stroke-width: 1.4; stroke-linecap: round; stroke-dasharray: 125.664; stroke-dashoffset: 125.664; }
.ss-hero-timer-progress.is-running { animation: ss-hero-ring 6.5s linear forwards; }
.ss-hero.is-paused .ss-hero-timer-progress { animation-play-state: paused; }
/* 小屏分页器内的圆点与进度环：每张轮播一个圆点，当前项圆点外带进度环；PC 端保持数字分页器，需默认隐藏 */
.ss-hero-pager-dot, .ss-hero-pager-ring { display: none; }
/* 右侧计数：所在数 / 总数（如 01 / 02），仅小屏显示 */
.ss-hero-counter { position: absolute; z-index: 2; right: .3rem; bottom: .46rem; display: none; height: .62rem; align-items: center; gap: .06rem; color: #fff; font: 700 .2rem/1 Arial, sans-serif; letter-spacing: .01rem; }
.ss-hero-counter i { font-style: normal; opacity: .5; }
@keyframes ss-hero-ring { from { stroke-dashoffset: 125.664; } to { stroke-dashoffset: 0; } }
@media (min-width: 1025px) { .ss-hero-scroll { top: 3.85rem; } }

/* 横幅切换控件：PC(≥1025px)显示数字分页器(01/02…)；
   小屏(≤1024px)改为圆点分页器——每张轮播一个圆点，当前项的圆点外带进度环（环转满一圈切换下一张） */
@media (max-width: 1024px) {
  .ss-hero-pager {
    position: absolute; z-index: 2; bottom: .42rem; left: 50%;
    display: flex; height: auto; align-items: center; gap: .16rem;
    transform: translateX(-50%);
  }
  .ss-page .ss-hero-pager button,
  .ss-hero-pager button {
    position: relative; display: flex !important;
    width: .34rem !important; height: .34rem !important;
    align-items: center; justify-content: center;
    margin: 0 !important; padding: 0; border: 0 !important; background: transparent; cursor: pointer;
  }
  .ss-hero-pager button.is-active { border: 0 !important; margin: 0 !important; }
  .ss-hero-pager button.is-active:after { display: none; }
  .ss-hero-pager-num { display: none; }
  .ss-hero-pager-dot { display: block; width: .1rem; height: .1rem; border-radius: 50%; background: rgba(255,255,255,.5); }
  .ss-hero-pager button.is-active .ss-hero-pager-dot { background: #fff; }
  .ss-hero-pager-ring {
    position: absolute; left: 50%; top: 50%;
    display: none; width: .34rem; height: .34rem; overflow: visible;
    transform: translate(-50%, -50%) rotate(-90deg); pointer-events: none;
  }
  .ss-hero-pager button.is-active .ss-hero-pager-ring { display: block; }
  .ss-hero-pager-ring .ss-hero-timer-track { stroke: rgba(255,255,255,.35); stroke-width: 2; }
  .ss-hero-pager-ring .ss-hero-timer-progress { stroke: #fff; stroke-width: 2; }
  .ss-hero-counter { display: flex; }
}

/* 移动端头部语言切换:统一为纯白加粗,只显示目标语言,隐藏当前语言与分隔符「/」 */
@media (max-width: 768px) {
  .ss-lang i,
  .ss-lang .is-on { display: none !important; }
  .ss-lang a,
  .ss-lang em { display: inline-block !important; color: #fff !important; opacity: 1 !important; font-weight: 700; text-transform: uppercase; }
}

@media (max-width: 1024px) {
  .ss-page a.ss-button { height: .64rem !important; min-height: .64rem !important; }
}
/* PC 头部语言切换:还原为「CN / EN」双语言显示 + 竖线分隔 */
@media (min-width: 769px) {
  .ss-lang { padding-right: .4rem; border-right: 1px solid rgba(255,255,255,.4); }
}

/* ============================================================
   窄屏(≤540px) banner 文案自适应
   ------------------------------------------------------------
   首页 hero 在窄屏下高度由首屏图片比例决定（约 0.39 倍屏宽），
   固定高度偏小；而英文标题普遍较长（如 "Building a globally
   leading advanced packaging volume production hub"），
   eyebrow + 两行标题 + 按钮的总高会超过横幅高度：因 .ss-hero
   为 overflow:hidden，「了解更多」按钮被挤出可视区。
   此处仅收紧文案字号与纵向间距，使内容完整落在横幅内；
   标题仍保留 2 行上限并超出隐藏。
   ============================================================ */
@media (max-width: 540px) {
  .ss-hero-content { padding-top: .28rem; }
  .ss-hero .ss-eyebrow { margin-bottom: .06rem; font-size: 13px; }
  .ss-hero h1 { font-size: clamp(20px, 5vw, 26px); line-height: 1.22; }
  .ss-hero .ss-hero-slide .ss-button,
  html[lang="en"] .ss-hero .ss-hero-slide .ss-button { margin-top: .14rem; }
}

/* ============================================================
   移动端「核心能力」「加入我们」正文可读性优化（中英文首页通用）
   ------------------------------------------------------------
   小屏下这两个模块的正文会横跨整个容器宽度，右半部分压在明亮的
   背景配图（3D 芯片 / 人物剪影）上，白字对比度不足、发灰看不清。
   做法：在背景图与文字之间补一层深色遮罩（压暗配图），同时给正文
   加一层轻微投影，双重保证文字清晰突出。
   仅作用于首页（.ss-home-page），桌面端（≥1025px）版式不受影响。
   ============================================================ */
@media (max-width: 1024px) {
  /* 核心能力：加深遮罩层，整体压暗右侧亮色芯片图，保证白色正文清晰 */
  .ss-home-page .ss-capability-banner .ss-card-shade {
    background: linear-gradient(270deg, rgba(6,6,6,.58) 0%, rgba(6,6,6,.58) 58%, rgba(8,8,8,.86) 100%);
  }
  .ss-home-page .ss-capability-copy h3,
  .ss-home-page .ss-capability-copy p { text-shadow: 0 .02rem .07rem rgba(0,0,0,.75); }

  /* 加入我们：正文压在右侧明亮的人物配图上，在配图与文字之间补一层
     「左浓右淡」的深色遮罩，并给标题/正文加投影 */
  .ss-home-page .ss-join-photo {
    background:
      linear-gradient(to right, rgba(17,17,17,.5) 0%, rgba(17,17,17,.66) 50%, rgba(17,17,17,.75) 100%),
      url('/starshine/img/figma-join-photo.png') right center/cover no-repeat;
  }
  .ss-home-page .ss-join-copy h2,
  .ss-home-page .ss-join-copy p { text-shadow: 0 .02rem .08rem rgba(0,0,0,.7); }
}
