/* ===== LWP网站公共样式表 =====
 * 香港聯盈精密零部件有限公司 - LINKWIN PRECISION
 * 路径: C:\Users\33249\Desktop\LWP网站源码\style.css
 */

/* ===== RESET ===== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:14px; scroll-behavior:smooth; }
body { font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif; color:#333; background:#fff; line-height:1.6; overflow-x:hidden; }
a { text-decoration:none; color:inherit; }
ul, ol { list-style:none; }
img { max-width:100%; display:block; border:none; }
input,textarea,select { font-family:inherit; }
button { cursor:pointer; border:none; font-family:inherit; }

/* ===== LAYOUT ===== */
.container { max-width:1200px; margin:0 auto; padding:0 20px; }
.section { padding:60px 0; }
.section-title { text-align:center; margin-bottom:40px; }
.section-title h2 { font-size:28px; font-weight:700; color:#0d2137; position:relative; display:inline-block; padding-bottom:12px; }
.section-title h2::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:60px; height:3px; background:linear-gradient(90deg,#f5a623,#e8791a); border-radius:2px; }
.section-title p { font-size:14px; color:#888; margin-top:8px; }

/* ===== TOPBAR ===== */
.topbar { background:#0a1f33; color:#ccc; font-size:12px; padding:6px 0; }
.topbar .container { display:flex; justify-content:space-between; align-items:center; }
.topbar a { color:#ccc; transition:color .3s; }
.topbar a:hover { color:#f5a623; }
.topbar-right { display:flex; gap:20px; align-items:center; }
.lang-btns { display:flex; gap:4px; }

/* Language Switcher (Bilingual) */
.lang-switcher {
  display: inline-flex;
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 16px;
  overflow: hidden;
  margin-right: 14px;
}
.lang-switcher button {
  padding: 3px 10px;
  font-size: 12px;
  color: rgba(255,255,255,0.7);
  background: transparent;
  border: none;
  cursor: pointer;
  transition: all 0.3s;
  font-family: inherit;
}
.lang-switcher button:first-child { border-right: 1px solid rgba(255,255,255,0.2); }
.lang-switcher button.active,
.lang-switcher button:hover {
  background: rgba(245,166,35,0.25);
  color: #f5a623;
}
.lang-btns span { padding:2px 6px; border-radius:3px; font-size:11px; cursor:pointer; background:#1a3050; color:#aaa; }
.lang-btns span.active { background:#f5a623; color:#fff; }

/* ===== HEADER ===== */
.header { background:#fff; box-shadow:0 2px 20px rgba(0,0,0,.08); position:sticky; top:0; z-index:1000; }
.header-inner { display:flex; justify-content:space-between; align-items:center; height:80px; }

/* LOGO区域 - 预留图片位置
 * 使用方法：将logo.png放入images文件夹，取消注释img标签
 */
.logo { display:flex; align-items:center; gap:12px; }
.logo-img { 
  height:48px; 
  width:auto; 
  max-width:180px;
  object-fit:contain;
}
.logo-placeholder { 
  width:48px; 
  height:48px; 
  background:linear-gradient(135deg,#f5a623,#e8791a); 
  border-radius:8px; 
  display:flex; 
  align-items:center; 
  justify-content:center; 
  font-size:14px; 
  font-weight:900; 
  color:#fff; 
  letter-spacing:1px;
}
.logo-text { line-height:1.2; }
.logo-text strong { display:block; font-size:16px; color:#0a1f33; letter-spacing:1px; }
.logo-text span { font-size:10px; color:#888; letter-spacing:2px; }

.nav { display:flex; gap:0; }
.nav a { display:block; padding:28px 18px; font-size:15px; color:#333; position:relative; transition:color .3s; }
.nav a:hover,.nav a.active { color:#e8791a; }
.nav a::after { content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:0; height:3px; background:#e8791a; transition:width .3s; border-radius:2px 2px 0 0; }
.nav a:hover::after,.nav a.active::after { width:calc(100% - 36px); }
.header-phone { display:flex; align-items:center; gap:8px; font-size:14px; color:#0a1f33; font-weight:600; }
.header-phone span { font-size:20px; color:#e8791a; }
.mobile-toggle { display:none; background:none; font-size:24px; color:#333; padding:10px; }

/* ===== FOOTER ===== */
.footer { background:#061424; color:#888; padding:40px 0 0; }
.footer-top { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.06); }

/* 页脚Logo位置 - 预留图片位置
 * 使用方法：将logo.png放入images文件夹，取消注释img标签
 */
.footer-logo { 
  height:40px; 
  width:auto; 
  max-width:160px;
  object-fit:contain;
  margin-bottom:16px;
}
.footer-logo-placeholder {
  width:40px;
  height:40px;
  background:linear-gradient(135deg,#f5a623,#e8791a);
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:900;
  color:#fff;
  margin-bottom:16px;
}

.footer-brand p { font-size:13px; line-height:1.8; color:#888; }
.footer h4 { color:#fff; font-size:15px; margin-bottom:16px; }
.footer ul li { margin-bottom:10px; }
.footer ul li a { font-size:13px; color:#888; transition:color .3s; }
.footer ul li a:hover { color:#f5a623; }
.footer-bottom { padding:20px 0; display:flex; justify-content:space-between; align-items:center; font-size:12px; color:#555; }
.footer-bottom a { color:#555; }
.footer-bottom a:hover { color:#f5a623; }

/* ===== BACK TO TOP ===== */
.back-to-top { position:fixed; right:24px; bottom:24px; width:44px; height:44px; background:linear-gradient(135deg,#f5a623,#e8791a); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:18px; cursor:pointer; opacity:0; transition:all .3s; z-index:999; box-shadow:0 4px 15px rgba(245,166,35,.4); }
.back-to-top.visible { opacity:1; }
.back-to-top:hover { transform:translateY(-3px); }

/* ===== MOBILE MENU ===== */
.mobile-menu { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.95); z-index:9999; flex-direction:column; align-items:center; justify-content:center; gap:20px; }
.mobile-menu.open { display:flex; }
.mobile-menu a { font-size:22px; color:#fff; padding:10px 20px; }
.mobile-menu-close { position:absolute; top:20px; right:20px; font-size:32px; color:#fff; background:none; }

/* ===== RESPONSIVE ===== */
@media(max-width:992px) {
  .nav { display:none; }
  .mobile-toggle { display:block; }
  .footer-top { grid-template-columns:1fr 1fr; }
}
@media(max-width:768px) {
  .footer-top { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:8px; text-align:center; }
  .section { padding:40px 0; }
}