/* ============================================================
   擎能新能源 · 科技感增强 (基于原版配色,不改变布局)
   ============================================================ */

/* ---------- 语言选择器 ---------- */
.lang-wrap{position:relative;flex:none;margin-left:4px}
.lang-btn{display:inline-flex;align-items:center;gap:7px;color:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);border-radius:8px;padding:7px 11px;font-size:.86rem;font-weight:600;line-height:1;transition:border-color .2s,background .2s}
.lang-btn:hover{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.12)}
.lang-btn .icon{width:15px;height:15px;display:flex}
.lang-btn .icon svg{width:15px;height:15px}
.lang-btn .caret{width:11px;height:11px;flex:none;transition:transform .2s}
.lang-wrap.open .lang-btn .caret{transform:rotate(180deg)}
.lang-menu{position:absolute;top:calc(100% + 10px);right:0;min-width:160px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);padding:6px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:all .22s;z-index:130}
.lang-wrap.open .lang-menu{opacity:1;visibility:visible;transform:none}
.lang-menu a{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;border-radius:8px;font-size:.9rem;font-weight:600;color:var(--navy-800);transition:background .15s}
.lang-menu a:hover{background:#EEF4FC}
.lang-menu a.active{color:var(--blue-600)}
.lang-menu a.active::after{content:"✓";font-weight:800;color:var(--blue-500)}

/* ---------- Hero HUD 数据角标 ---------- */
.hero-hud{position:absolute;top:8px;right:8px;z-index:6;display:inline-flex;align-items:center;gap:8px;font-size:.7rem;letter-spacing:.16em;color:rgba(255,255,255,.6);background:rgba(8,21,38,.38);border:1px solid rgba(55,198,232,.25);border-radius:6px;padding:6px 10px;backdrop-filter:blur(4px);white-space:nowrap}
.hero-hud b{color:var(--cyan-400);font-weight:700;letter-spacing:.08em}
.hero-hud em{font-style:normal}
.hero-hud .hud-dot{width:6px;height:6px;border-radius:50%;background:var(--cyan-400);box-shadow:0 0 8px var(--cyan-400);animation:pulse 1.6s infinite}

/* ---------- Hero 扫描线 ---------- */
.hero-scan{position:absolute;left:4%;right:4%;top:0;height:2px;z-index:4;background:linear-gradient(90deg,transparent,rgba(55,198,232,.75),transparent);opacity:.55;pointer-events:none;animation:scanmove 8s ease-in-out infinite}
@keyframes scanmove{0%{transform:translateY(0);opacity:0}12%{opacity:.55}50%{transform:translateY(430px);opacity:.35}88%{opacity:.55}100%{transform:translateY(0);opacity:0}}

/* ---------- Hero 刻度环 ---------- */
.hero-ring{position:absolute;top:50%;left:50%;width:min(560px,94%);aspect-ratio:1;transform:translate(-50%,-50%);border:1px dashed rgba(55,198,232,.32);border-radius:50%;z-index:0;pointer-events:none;animation:spin 46s linear infinite}
.hero-ring::before{content:"";position:absolute;inset:16px;border:1px solid rgba(255,255,255,.07);border-radius:50%}
.hero-ring::after{content:"";position:absolute;inset:34px;border:1px dashed rgba(46,124,246,.28);border-radius:50%}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}

/* ---------- Hero 产品图四角括号 ---------- */
.hero-photo{position:relative;z-index:2}
.hero-photo img{position:relative;z-index:2}
.corner{position:absolute;width:26px;height:26px;z-index:4;border:0 solid var(--cyan-400);opacity:.95;pointer-events:none}
.corner--tl{top:-10px;left:-10px;border-top-width:2px;border-left-width:2px}
.corner--tr{top:-10px;right:-10px;border-top-width:2px;border-right-width:2px}
.corner--bl{bottom:-10px;left:-10px;border-bottom-width:2px;border-left-width:2px}
.corner--br{bottom:-10px;right:-10px;border-bottom-width:2px;border-right-width:2px}

/* ---------- Hero 信任条 ---------- */
.hero-trust{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:24px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12)}
.hero-trust span{display:inline-flex;align-items:center;gap:8px;font-size:.74rem;letter-spacing:.08em;color:rgba(255,255,255,.62)}
.hero-trust .icon{width:14px;height:14px;display:flex;color:var(--cyan-400)}
.hero-trust .icon svg{width:14px;height:14px}
.hero-trust b{font-weight:700}

/* ---------- 浮动卡片内文字 ---------- */
.float-card b{display:block;line-height:1.3}
.float-card small{display:block;font-weight:600;color:var(--muted);font-size:.74rem;margin-top:2px;line-height:1.35}

/* ---------- 区块编号角标 ---------- */
.section{position:relative}
.section-num{position:absolute;top:22px;right:18px;font-size:6rem;font-weight:800;line-height:1;color:rgba(46,124,246,.09);letter-spacing:.02em;pointer-events:none;user-select:none;z-index:0;font-family:"Space Grotesk","Segoe UI",sans-serif}
.section--alt .section-num{color:rgba(11,31,58,.06)}
.section .container{position:relative;z-index:1}

/* ---------- 产品卡科技感 ---------- */
.product-card{position:relative}
.product-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--blue-500),var(--cyan-400));opacity:0;transition:opacity .25s;z-index:2}
.product-card:hover::before{opacity:1}
.specs span{transition:background .2s,color .2s}
.product-card:hover .specs span{background:#E1EDFE}

/* ---------- 场景卡数字 HUD ---------- */
.scene-card{position:relative;overflow:hidden}
.scene-card::after{content:"";position:absolute;right:-34px;bottom:-34px;width:120px;height:120px;border-radius:50%;border:1px dashed rgba(46,124,246,.28);pointer-events:none}

/* ---------- 主按钮扫光 ---------- */
.btn--primary{position:relative;overflow:hidden}
.btn--primary::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);transition:left .55s ease}
.btn--primary:hover::after{left:130%}

/* ---------- 数据卡 HUD 数字 ---------- */
.stats-band{position:relative;overflow:hidden}
.stats-band::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--cyan-400),transparent 70%)}
.market-band{position:relative}

/* ---------- RTL ---------- */
html[dir="rtl"] .lang-menu{right:auto;left:0}
html[dir="rtl"] .section-num{right:auto;left:18px}
html[dir="rtl"] .hero-hud{right:auto;left:8px}
html[dir="rtl"] .float-card--1{left:auto;right:-6px}
html[dir="rtl"] .float-card--2{right:auto;left:-6px}

/* ---------- 移动端 ---------- */
@media(max-width:768px){
  .section-num{display:none}
  .hero-hud{display:none}
  .hero-trust{gap:8px 18px}
  .lang-menu{left:auto;right:0}
  .lang-btn{font-size:.8rem;padding:7px 9px}
}
@media(max-width:480px){
  .hero-ring{width:88%}
}

/* ---------- 修复:列表内长文本换行 ---------- */
.factory-points li{min-width:0}
.factory-points li span{min-width:0;word-break:break-word}

/* ---------- Hero 产品图轮播 (派能式滚动画面) ---------- */
.hero-slider{position:relative;overflow:hidden;border-radius:12px;background:var(--navy-800)}
.hero-slides{display:flex;will-change:transform;transition:transform .7s cubic-bezier(.77,0,.18,1)}
.hero-slide{position:relative;flex:0 0 100%;min-width:100%}
.hero-slide img{display:block;width:100%;aspect-ratio:1/1.06;object-fit:cover;border-radius:12px;transform:scale(1.02);transition:transform 6.5s ease-out,opacity .5s ease}
.hero-slide.active img{transform:scale(1.1)}
.hero-slide-tag{position:absolute;left:12px;bottom:12px;z-index:3;display:inline-flex;align-items:center;gap:8px;max-width:calc(100% - 24px);padding:6px 12px;border-radius:6px;background:rgba(8,21,38,.62);border:1px solid rgba(55,198,232,.35);color:#EAF6FF;font-size:.68rem;font-weight:700;letter-spacing:.12em;backdrop-filter:blur(4px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero-slide-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cyan-400);box-shadow:0 0 8px var(--cyan-400);flex:none}
.hero-counter{position:absolute;top:10px;left:12px;z-index:5;font-size:.66rem;letter-spacing:.2em;color:rgba(255,255,255,.8);background:rgba(8,21,38,.5);border:1px solid rgba(255,255,255,.16);border-radius:5px;padding:4px 8px;font-family:"Space Grotesk","Segoe UI",sans-serif}
.hero-arrow{position:absolute;top:50%;z-index:6;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:rgba(8,21,38,.45);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(3px);transition:background .2s,border-color .2s;padding:0}
.hero-arrow .icon{width:16px;height:16px;display:flex}
.hero-arrow .icon svg{width:16px;height:16px}
.hero-arrow--prev{left:10px;transform:translateY(-50%) rotate(180deg)}
.hero-arrow--next{right:10px;transform:translateY(-50%)}
.hero-arrow:hover{background:rgba(55,198,232,.35);border-color:rgba(55,198,232,.7)}
.hero-arrow--prev:hover{transform:translateY(-50%) rotate(180deg) scale(1.08)}
.hero-arrow--next:hover{transform:translateY(-50%) scale(1.08)}
.hero-dots{position:absolute;left:50%;bottom:10px;z-index:5;display:flex;align-items:center;gap:7px;transform:translateX(-50%)}
.hero-dots button{width:7px;height:7px;border:0;border-radius:99px;padding:0;background:rgba(255,255,255,.45);cursor:pointer;transition:width .25s,background .25s}
.hero-dots button.active{width:22px;background:var(--cyan-400);box-shadow:0 0 8px rgba(55,198,232,.6)}
html[dir="rtl"] .hero-slides{direction:ltr}
html[dir="rtl"] .hero-arrow--prev{right:10px;left:auto}
html[dir="rtl"] .hero-arrow--next{left:10px;right:auto}
@media(max-width:480px){
  .hero-slide img{aspect-ratio:1/1.12}
  .hero-arrow{width:30px;height:30px}
  .hero-arrow .icon{width:14px;height:14px}
  .hero-slide-tag{font-size:.6rem;letter-spacing:.1em}
}

/* ---------- 修复:按钮/导航/浮卡内图标被 .icon svg{width:100%} 撑大 ---------- */
.btn .icon{width:18px;height:18px}
.btn--sm .icon{width:16px;height:16px}
.nav-toggle .icon{width:24px;height:24px}
.float-card .ic .icon{width:20px;height:20px}

/* ---------- 修复:logo 图片未限制尺寸导致移动端横向溢出 ---------- */
.logo img{width:40px;height:40px;flex:none}
.logo .name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:420px){
  .logo .name{font-size:.98rem}
  .logo .name small{font-size:.58rem;letter-spacing:.16em}
}
