Files
docs/悦/官网头程下单/index.html
T
2026-09-08 18:17:00 +08:00

2416 lines
177 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>柏悦物流 CHONGCHONG GLOBAL | 跨境物流一站式解决方案</title>
<meta name="description" content="柏悦物流 - 专业货代服务,提供海外采购、美本土卡车、美本土散板、海运专线、一件代发等跨境物流解决方案。">
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Crect width='64' height='64' rx='14' fill='%231565c0'/%3E%3Cpath d='M18 14h19c9 0 14 4 14 11 0 5-3 8-8 9 6 1 9 4 9 10 0 8-6 12-16 12H18V14zm10 9v8h8c4 0 6-1 6-4s-2-4-6-4h-8zm0 16v9h9c4 0 6-2 6-5s-2-4-7-4h-8z' fill='white'/%3E%3C/svg%3E">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600;700;900&family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
theme: {
extend: {
colors: {
brand: {
green: '#4CAF50',
greenDark: '#2E7D32',
blue: '#1565C0',
blueDark: '#0D47A1',
teal: '#00838F',
light: '#F0F7FF',
dark: '#0A1628'
}
},
fontFamily: {
sans: ['Inter', 'Noto Sans SC', 'system-ui', 'sans-serif'],
},
boxShadow: {
'glow': '0 0 40px rgba(21, 101, 192, 0.15)',
'glow-green': '0 0 40px rgba(76, 175, 80, 0.15)',
'card': '0 10px 40px rgba(10, 22, 40, 0.08)',
'card-hover': '0 20px 60px rgba(10, 22, 40, 0.15)',
}
}
}
}
</script>
<style>
:root {
--primary: #1565C0;
--primary-dark: #0D47A1;
--accent: #4CAF50;
--accent-dark: #2E7D32;
}
* {
scroll-behavior: smooth;
}
body {
font-family: 'Inter', 'Noto Sans SC', system-ui, sans-serif;
overflow-x: hidden;
}
.gradient-text {
background: linear-gradient(135deg, #1565C0 0%, #4CAF50 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.gradient-bg {
background: linear-gradient(135deg, #0A1628 0%, #1565C0 50%, #00838F 100%);
}
.gradient-bg-soft {
background: linear-gradient(135deg, #F0F7FF 0%, #E8F5E9 100%);
}
.btn-primary {
background: linear-gradient(135deg, #1565C0 0%, #0D47A1 100%);
transition: all 0.3s ease;
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 10px 30px rgba(21, 101, 192, 0.35);
}
.btn-accent {
background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%);
transition: all 0.3s ease;
}
.btn-accent:hover {
transform: translateY(-2px);
box-shadow: 0 10px 30px rgba(76, 175, 80, 0.35);
}
.hero-bg {
background: linear-gradient(135deg, rgba(10, 22, 40, 0.92) 0%, rgba(21, 101, 192, 0.85) 50%, rgba(0, 131, 143, 0.8) 100%),
url('https://images.unsplash.com/photo-1494412574643-ff11b0a5c1c3?ixlib=rb-4.0.3&auto=format&fit=crop&w=2070&q=80');
background-size: cover;
background-position: center;
background-attachment: fixed;
}
/* 首页五大核心业务轮播 */
.core-hero {
min-height: 780px;
height: 100vh;
max-height: 980px;
position: relative;
overflow: hidden;
background: #071426;
}
.core-slides,.core-slide,.core-slide::after { position:absolute;inset:0; }
.core-slide {
opacity:0;
transform:scale(1.035);
transition:opacity .8s ease,transform 5.8s ease;
background-image:linear-gradient(90deg,rgba(5,16,31,.96) 0%,rgba(8,31,58,.82) 48%,rgba(4,31,45,.38) 100%),var(--slide-bg);
background-size:cover;
background-position:center;
}
.core-slide::after {
content:'';
background:linear-gradient(180deg,rgba(3,12,24,.2),transparent 50%,rgba(3,12,24,.72));
}
.core-slide.active { opacity:1;transform:scale(1); }
.core-hero-content { position:relative;z-index:4;height:100%;display:flex;align-items:center;padding:126px 0 180px; }
.core-copy { max-width:720px; }
.core-kicker { display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(255,255,255,.09);backdrop-filter:blur(12px);color:rgba(255,255,255,.9);font-size:13px;font-weight:600;letter-spacing:.08em; }
.core-kicker::before { content:'';width:8px;height:8px;border-radius:50%;background:#4CAF50;box-shadow:0 0 14px rgba(76,175,80,.9); }
.core-title { margin-top:24px;color:#fff;font-size:clamp(50px,6.2vw,86px);font-weight:900;line-height:1.04;letter-spacing:-.04em; }
.core-desc { margin-top:24px;max-width:660px;color:rgba(255,255,255,.76);font-size:18px;line-height:1.85; }
.core-points { display:flex;flex-wrap:wrap;gap:10px;margin-top:26px; }
.core-point { padding:8px 13px;border-radius:10px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.88);font-size:13px;backdrop-filter:blur(10px); }
.core-actions { display:flex;align-items:center;gap:14px;margin-top:32px; }
.core-detail-btn { display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:999px;background:#fff;color:#0D47A1;font-weight:700;transition:transform .25s ease,box-shadow .25s ease; }
.core-detail-btn:hover { transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.24); }
.core-arrow { width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;display:inline-flex;align-items:center;justify-content:center;transition:background .2s; }
.core-arrow:hover { background:rgba(255,255,255,.2); }
.core-nav-wrap { position:absolute;z-index:6;left:0;right:0;bottom:32px; }
.core-tabs { display:grid;grid-template-columns:repeat(5,1fr);gap:10px; }
.core-tab { position:relative;min-width:0;padding:16px 16px 14px;text-align:left;border-radius:14px;background:rgba(5,18,34,.5);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(14px);color:rgba(255,255,255,.62);transition:all .3s ease;overflow:hidden; }
.core-tab:hover,.core-tab.active { color:#fff;background:rgba(21,101,192,.52);border-color:rgba(255,255,255,.42);transform:translateY(-3px); }
.core-tab-index { display:block;font-size:11px;letter-spacing:.12em;opacity:.65;margin-bottom:4px; }
.core-tab-name { display:block;font-size:15px;font-weight:700;white-space:nowrap; }
.core-tab-progress { position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.12); }
.core-tab-progress::after { content:'';display:block;width:0;height:100%;background:#4CAF50; }
.core-tab.active .core-tab-progress::after { animation:coreProgress 5s linear forwards; }
@keyframes coreProgress { from{width:0} to{width:100%} }
.secondary-page { padding-top:96px;background:#f7f9fc;min-height:calc(100vh - 96px); }
.subpage-hero { position:relative;min-height:370px;display:flex;align-items:center;overflow:hidden;background-image:linear-gradient(90deg,rgba(5,16,31,.97),rgba(8,38,68,.88) 55%,rgba(5,38,51,.58)),var(--sub-bg);background-size:cover;background-position:center; }
.subpage-hero::before { content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.11) 1px,transparent 1px);background-size:30px 30px; }
.subpage-hero::after { content:'';position:absolute;width:430px;height:430px;right:-80px;top:-180px;border-radius:50%;background:rgba(76,175,80,.13);filter:blur(28px); }
.subpage-hero-inner { position:relative;z-index:2;width:100%;padding:72px 0 68px; }
.subpage-breadcrumb { display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.58);font-size:13px;margin-bottom:26px; }
.subpage-breadcrumb button { color:rgba(255,255,255,.72);transition:color .2s; }
.subpage-breadcrumb button:hover { color:#fff; }
.subpage-kicker { display:inline-flex;align-items:center;gap:9px;color:#8ed492;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase; }
.subpage-kicker::before { content:'';width:26px;height:2px;background:#4CAF50;border-radius:99px; }
.subpage-title { margin-top:14px;color:#fff;font-size:clamp(40px,5vw,64px);font-weight:900;line-height:1.12;letter-spacing:-.035em; }
.subpage-desc { margin-top:20px;max-width:720px;color:rgba(255,255,255,.7);font-size:17px;line-height:1.8; }
.subpage-meta { display:flex;flex-wrap:wrap;gap:10px;margin-top:25px; }
.subpage-meta>span { display:inline-flex;align-items:center;gap:7px;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);color:rgba(255,255,255,.76);font-size:12px;backdrop-filter:blur(10px); }
.subpage-meta>span i { color:#6fc474; }
.secondary-page>section { padding-top:76px!important;padding-bottom:88px!important; }
#servicesSection #services>.max-w-7xl>.text-center,
#processSection #process>.max-w-7xl>.text-center,
#businessSection #business>.max-w-7xl>.text-center,
#aboutSection #advantages>.max-w-7xl>.text-center,
#contactSection #contact>.max-w-7xl>.text-center { display:none; }
#servicesSection #services,#businessSection #business,#aboutSection #culture { background:#fff!important; }
#processSection #process,#aboutSection #advantages,#contactSection #contact { background:linear-gradient(135deg,#f3f7ff 0%,#eef8f0 100%)!important; }
#aboutSection #about { background:#f7f9fc!important; }
.secondary-page .service-card { border-radius:24px;box-shadow:0 14px 42px rgba(10,22,40,.08);border-color:#edf1f7; }
.secondary-page .service-card:hover { transform:translateY(-7px);box-shadow:0 24px 56px rgba(21,101,192,.13); }
.secondary-page .process-step>div:last-child { border:1px solid rgba(21,101,192,.08);box-shadow:0 14px 40px rgba(10,22,40,.08);min-height:230px;display:flex;flex-direction:column;align-items:center;justify-content:center; }
.secondary-page .feature-item { background:#fff;border:1px solid #edf1f7;box-shadow:0 8px 24px rgba(10,22,40,.05);transition:transform .25s,box-shadow .25s; }
.secondary-page .feature-item:hover { transform:translateX(5px);box-shadow:0 14px 32px rgba(21,101,192,.1); }
#contactSection #contact .bg-white { border-radius:24px;box-shadow:0 14px 40px rgba(10,22,40,.08);transition:transform .25s,box-shadow .25s; }
#contactSection #contact .bg-white:hover { transform:translateY(-6px);box-shadow:0 22px 48px rgba(21,101,192,.13); }
.nav-link.route-active { color:#69c46f!important;position:relative; }
.nav-link.route-active::after { content:'';position:absolute;left:50%;bottom:-9px;width:18px;height:2px;background:#4CAF50;border-radius:99px;transform:translateX(-50%); }
.nav-scrolled .nav-link.route-active { color:#1565C0!important; }
/* 五大业务独立详情页 */
.business-detail-page { padding-top:96px;background:#f5f7fb;min-height:100vh; }
.bd-hero { position:relative;min-height:420px;display:flex;align-items:center;overflow:hidden;background:#07182b var(--bd-bg) center/cover no-repeat; }
.bd-hero::before { content:'';position:absolute;inset:0;background:rgba(5,20,38,.78); }
.bd-hero::after { content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.12) 1px,transparent 1px);background-size:30px 30px;opacity:.5; }
.bd-hero-inner { position:relative;z-index:2;width:100%;padding:62px 0 70px; }
.bd-breadcrumb { display:flex;align-items:center;gap:9px;color:rgba(255,255,255,.6);font-size:13px;margin-bottom:34px; }
.bd-breadcrumb button { color:rgba(255,255,255,.78);transition:color .2s; }
.bd-breadcrumb button:hover { color:#fff; }
.bd-eyebrow { display:inline-flex;align-items:center;gap:10px;color:#8ed492;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase; }
.bd-eyebrow::before { content:'';width:26px;height:2px;border-radius:99px;background:#4CAF50; }
.bd-title { margin-top:14px;color:#fff;font-size:clamp(44px,6vw,68px);font-weight:900;line-height:1.08;letter-spacing:-.035em; }
.bd-desc { max-width:760px;margin-top:20px;color:rgba(255,255,255,.76);font-size:17px;line-height:1.85; }
.bd-badges { display:flex;flex-wrap:wrap;gap:10px;margin-top:26px; }
.bd-badge { display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.85);font-size:12px;backdrop-filter:blur(10px); }
.bd-badge i { color:#78ce7d; }
.bd-content { padding:76px 0 92px; }
.bd-section-head { display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px; }
.bd-section-kicker { color:#1565C0;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase; }
.bd-section-title { margin-top:8px;color:#111827;font-size:30px;font-weight:800;letter-spacing:-.02em; }
.bd-section-copy { max-width:570px;color:#64748b;font-size:14px;line-height:1.75; }
.bd-feature-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:72px; }
.bd-feature-card { padding:24px;border:1px solid #e6eaf0;border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(15,23,42,.05);transition:transform .25s,box-shadow .25s,border-color .25s; }
.bd-feature-card:hover { transform:translateY(-5px);border-color:#c7d7ef;box-shadow:0 16px 36px rgba(15,23,42,.1); }
.bd-feature-icon { width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:#edf5ff;color:#1565C0;font-size:19px; }
.bd-feature-card h3 { margin-top:18px;color:#1e293b;font-size:16px;font-weight:750; }
.bd-feature-card p { margin-top:9px;color:#64748b;font-size:13px;line-height:1.7; }
.bd-flow-card { border:1px solid #e3e8ef;border-radius:22px;background:#fff;box-shadow:0 16px 42px rgba(15,23,42,.07);overflow:hidden; }
.bd-flow-top { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px;border-bottom:1px solid #edf0f4; }
.bd-flow-top h3 { color:#1e293b;font-size:19px;font-weight:800; }
.bd-flow-switch { display:flex;gap:4px;padding:4px;border-radius:10px;background:#f1f4f8; }
.bd-flow-switch button { padding:8px 17px;border-radius:8px;color:#64748b;font-size:13px;font-weight:650;transition:all .2s; }
.bd-flow-switch button.active { color:#fff;background:#1565C0;box-shadow:0 5px 14px rgba(21,101,192,.24); }
.bd-flow-panel { display:none;padding:34px 28px 38px; }
.bd-flow-panel.active { display:block; }
.bd-simple-flow { display:flex;align-items:stretch;gap:0;overflow-x:auto;padding:4px 2px 14px; }
.bd-simple-step { flex:1;min-width:145px;position:relative;padding:20px 14px;text-align:center;border:1px solid #e5eaf1;border-radius:16px;background:#fbfcfe; }
.bd-simple-step:not(:last-child) { margin-right:44px; }
.bd-simple-step:not(:last-child)::after { content:'\f061';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;right:-31px;top:50%;transform:translateY(-50%);color:#76a7d9;font-size:15px; }
.bd-simple-icon { width:48px;height:48px;margin:0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eaf3ff;color:#1565C0;font-size:18px; }
.bd-simple-step strong { display:block;margin-top:13px;color:#1e293b;font-size:14px; }
.bd-simple-step span { display:block;margin-top:6px;color:#8491a4;font-size:11px;line-height:1.5; }
.bd-detail-flow { position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px; }
.bd-detail-step { position:relative;padding:20px;border:1px solid #e6eaf0;border-radius:16px;background:#fff;min-height:164px; }
.bd-detail-no { display:inline-flex;width:30px;height:30px;align-items:center;justify-content:center;border-radius:9px;background:#1565C0;color:#fff;font-size:11px;font-weight:800; }
.bd-detail-step h4 { margin-top:15px;color:#1e293b;font-size:15px;font-weight:750; }
.bd-detail-step p { margin-top:8px;color:#64748b;font-size:12px;line-height:1.65; }
.bd-other { margin-top:72px; }
.bd-other-grid { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:24px; }
.bd-other-card { padding:18px;border:1px solid #e3e8ef;border-radius:15px;background:#fff;text-align:left;transition:all .22s; }
.bd-other-card:hover,.bd-other-card.active { border-color:#1565C0;background:#f2f7fd;transform:translateY(-3px); }
.bd-other-card span { display:block;color:#94a3b8;font-size:10px;font-weight:700;letter-spacing:.1em; }
.bd-other-card strong { display:block;margin-top:6px;color:#1e293b;font-size:14px; }
@media(max-width:1024px){.bd-feature-grid{grid-template-columns:repeat(2,1fr)}.bd-detail-flow{grid-template-columns:repeat(2,1fr)}.bd-other-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){
.core-hero{min-height:720px;height:100svh;max-height:none}
.core-hero-content{padding:112px 0 190px}
.core-title{font-size:clamp(42px,13vw,62px)}
.core-desc{font-size:16px;line-height:1.7}
.core-tabs{display:flex;overflow-x:auto;padding:4px 0 8px;scrollbar-width:none}
.core-tabs::-webkit-scrollbar{display:none}
.core-tab{min-width:138px}
.core-nav-wrap{bottom:18px}
.secondary-page{padding-top:80px}
.subpage-hero{min-height:330px}
.subpage-hero-inner{padding:52px 0 48px}
.subpage-desc{font-size:15px;line-height:1.7}
.secondary-page>section{padding-top:56px!important;padding-bottom:64px!important}
.business-detail-page{padding-top:80px}.bd-hero{min-height:390px}.bd-hero-inner{padding:48px 0 56px}.bd-desc{font-size:15px}.bd-content{padding:54px 0 70px}.bd-section-head{display:block}.bd-section-copy{margin-top:14px}.bd-flow-top{align-items:flex-start;flex-direction:column}.bd-detail-flow{grid-template-columns:1fr}.bd-other-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){.bd-feature-grid{grid-template-columns:1fr}.bd-flow-panel{padding:24px 18px 28px}.bd-other-grid{grid-template-columns:1fr}.bd-flow-switch{width:100%}.bd-flow-switch button{flex:1}}
/* 流程图第二套展现:路线图 + 时间轴 */
.bd-flow-card { border:0;background:#0b1d32;box-shadow:0 20px 48px rgba(7,24,43,.18); }
.bd-flow-top { background:#0b1d32;border-bottom:1px solid rgba(255,255,255,.12); }
.bd-flow-top h3 { color:#fff; }
.bd-flow-switch { background:rgba(255,255,255,.1); }
.bd-flow-switch button { color:rgba(255,255,255,.66); }
.bd-flow-switch button.active { color:#0b1d32;background:#fff;box-shadow:none; }
.bd-flow-panel { background:#f5f8fc;overflow-x:auto; }
.bd-simple-flow { min-width:760px;display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:0;position:relative;overflow:visible;padding:24px 8px 30px; }
.bd-simple-flow::before { content:'';position:absolute;left:8%;right:8%;top:54px;height:2px;background:#b7cee7; }
.bd-simple-step { min-width:0;padding:0 9px;border:0;border-radius:0;background:transparent;z-index:1; }
.bd-simple-step:not(:last-child) { margin-right:0; }
.bd-simple-step:not(:last-child)::after { content:'';right:-1px;top:50px;width:7px;height:7px;border:solid #86a9ce;border-width:2px 2px 0 0;transform:rotate(45deg); }
.bd-simple-icon { width:60px;height:60px;border:6px solid #f5f8fc;background:#1565C0;color:#fff;box-shadow:0 0 0 2px #9fbeda;font-size:19px; }
.bd-simple-step strong { margin-top:17px;font-size:13px; }
.bd-simple-step span { max-width:130px;margin:7px auto 0;font-size:11px; }
.bd-detail-flow { display:block;position:relative;max-width:920px;margin:0 auto;padding:4px 0 8px; }
.bd-detail-flow::before { content:'';position:absolute;left:28px;top:20px;bottom:20px;width:2px;background:#c6d9ec; }
.bd-detail-step { display:grid;grid-template-columns:58px 1fr;column-gap:18px;min-height:0;margin:0 0 14px;padding:18px 22px 18px 0;border:1px solid #e2e9f2;border-radius:15px;background:#fff;box-shadow:0 7px 18px rgba(15,23,42,.05); }
.bd-detail-step:nth-child(even) { margin-left:72px; }
.bd-detail-step:nth-child(odd) { margin-right:72px; }
.bd-detail-no { grid-row:1 / span 2;align-self:start;justify-self:center;width:38px;height:38px;border:5px solid #f5f8fc;border-radius:50%;background:#1565C0;box-shadow:0 0 0 2px #9fbeda;font-size:10px;z-index:1; }
.bd-detail-step h4 { margin-top:1px;font-size:15px; }
.bd-detail-step p { margin-top:6px; }
@media(max-width:900px){.bd-detail-step:nth-child(even){margin-left:0}.bd-detail-step:nth-child(odd){margin-right:0}}
.nav-scrolled {
background: rgba(255, 255, 255, 0.98);
backdrop-filter: blur(20px);
box-shadow: 0 4px 30px rgba(10, 22, 40, 0.08);
}
.nav-scrolled .nav-link {
color: #0A1628;
}
.nav-scrolled .nav-logo-text {
color: #0A1628;
}
/* 导航栏 LOGO:默认白色(叠在深色 Hero),滚动到白色导航栏时
用 filter 把白字 PNG 染成深蓝 #0D47A1 */
.nav-logo-img {
display: block;
transition: filter 0.4s ease;
}
.nav-scrolled .nav-logo-img {
filter: brightness(0) saturate(100%) invert(20%) sepia(84%) saturate(1926%) hue-rotate(202deg) brightness(94%) contrast(93%);
}
.service-card {
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.service-card:hover {
transform: translateY(-10px);
box-shadow: 0 25px 60px rgba(10, 22, 40, 0.15);
}
.service-card:hover .service-icon {
transform: scale(1.1) rotate(5deg);
}
.service-icon {
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.process-line {
background: linear-gradient(90deg, #1565C0 0%, #4CAF50 100%);
}
.process-step {
transition: all 0.3s ease;
}
.process-step:hover {
transform: translateY(-5px);
}
.process-step:hover .process-number {
transform: scale(1.15);
box-shadow: 0 0 30px rgba(21, 101, 192, 0.3);
}
.process-number {
transition: all 0.3s ease;
}
.feature-item {
transition: all 0.3s ease;
}
.feature-item:hover {
background: rgba(21, 101, 192, 0.05);
}
.stat-card {
transition: all 0.3s ease;
}
.stat-card:hover {
transform: translateY(-5px);
box-shadow: 0 15px 40px rgba(21, 101, 192, 0.12);
}
.input-field {
transition: all 0.3s ease;
}
.input-field:focus {
border-color: #1565C0;
box-shadow: 0 0 0 4px rgba(21, 101, 192, 0.1);
}
.animate-float {
animation: float 6s ease-in-out infinite;
}
@keyframes float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-20px); }
}
.animate-pulse-slow {
animation: pulse-slow 4s ease-in-out infinite;
}
@keyframes pulse-slow {
0%, 100% { opacity: 0.8; }
50% { opacity: 1; }
}
.reveal {
opacity: 0;
transform: translateY(30px);
transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.reveal.active {
opacity: 1;
transform: translateY(0);
}
.mobile-menu {
transform: translateX(100%);
transition: transform 0.3s ease;
}
.mobile-menu.open {
transform: translateX(0);
}
.route-section {
display: none;
animation: fadeIn 0.5s ease;
}
.route-section.active {
display: block;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(10px); }
to { opacity: 1; transform: translateY(0); }
}
.overlay-dots {
background-image: radial-gradient(rgba(255,255,255,0.1) 1px, transparent 1px);
background-size: 30px 30px;
}
.glass-card {
background: rgba(255, 255, 255, 0.95);
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.tab-active {
background: linear-gradient(135deg, #1565C0 0%, #0D47A1 100%);
color: white;
}
.check-list li {
position: relative;
padding-left: 2rem;
}
.check-list li::before {
content: '\f00c';
font-family: 'Font Awesome 6 Free';
font-weight: 900;
position: absolute;
left: 0;
color: #4CAF50;
}
/* 语言切换器 */
.lang-switcher {
display: flex;
align-items: center;
background: rgba(255, 255, 255, 0.15);
border-radius: 9999px;
padding: 3px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.lang-switcher button {
font-size: 12px;
font-weight: 600;
padding: 4px 9px;
border-radius: 9999px;
color: rgba(255, 255, 255, 0.9);
transition: all 0.25s ease;
white-space: nowrap;
}
.lang-switcher button:hover {
color: #fff;
}
.lang-switcher button.active {
background: #fff;
color: #0D47A1;
}
.nav-scrolled .lang-switcher {
background: rgba(21, 101, 192, 0.08);
border-color: rgba(21, 101, 192, 0.15);
}
.nav-scrolled .lang-switcher button {
color: #0A1628;
}
.nav-scrolled .lang-switcher button.active {
background: #1565C0;
color: #fff;
}
.lang-switcher-mobile {
display: flex;
gap: 8px;
}
.lang-switcher-mobile button {
flex: 1;
font-size: 14px;
font-weight: 600;
padding: 10px;
border-radius: 12px;
border: 1px solid #e5e7eb;
background: #f9fafb;
color: #374151;
transition: all 0.25s ease;
}
.lang-switcher-mobile button.active {
background: #1565C0;
color: #fff;
border-color: #1565C0;
}
.dash-sidebar.open { transform: translateX(0); }
.dash-menu-btn { display: inline-flex; }
}
/* ===== 官网内认证流程 ===== */
body.auth-modal-open { overflow: hidden; }
.auth-modal { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 24px; }
.auth-modal[hidden] { display: none; }
.auth-modal-backdrop { position: absolute; inset: 0; border: 0; background: rgba(5, 18, 34, .76); cursor: default; }
.auth-dialog { position: relative; width: min(1040px, 100%); max-height: calc(100vh - 48px); overflow: hidden; border-radius: 16px; background: #fff; box-shadow: 0 28px 80px rgba(4, 18, 34, .34); }
.auth-close { position: absolute; top: 16px; right: 16px; z-index: 3; display: inline-grid; width: 40px; height: 40px; place-items: center; border: 1px solid #d9e2ec; border-radius: 10px; background: #fff; color: #334155; transition: background-color .2s ease, border-color .2s ease, color .2s ease; }
.auth-close:hover { border-color: #1565c0; background: #f0f7ff; color: #0d47a1; }
.auth-close:focus-visible, .auth-dialog button:focus-visible, .auth-dialog input:focus-visible { outline: 3px solid rgba(21, 101, 192, .28); outline-offset: 2px; }
.auth-layout { display: grid; grid-template-columns: minmax(320px, .82fr) minmax(0, 1.18fr); min-height: 620px; }
.auth-story { position: relative; display: flex; min-width: 0; flex-direction: column; justify-content: space-between; overflow: hidden; padding: 48px 42px; background: #0b2d55 url('assets/core-ocean.jpg') center/cover no-repeat; color: #fff; }
.auth-modal[data-mode="register"] .auth-story { background-image: url('assets/core-fulfillment.jpg'); }
.auth-story::before { content: ''; position: absolute; inset: 0; background: linear-gradient(155deg, rgba(7, 33, 64, .9), rgba(13, 71, 161, .78)); }
.auth-story > * { position: relative; z-index: 1; }
.auth-story-logo { width: 161px; height: 60px; object-fit: contain; object-position: left center; margin-bottom: 56px; }
.auth-story h2 { max-width: 12ch; margin: 0 0 14px; font-size: clamp(30px, 3vw, 42px); line-height: 1.15; letter-spacing: -.02em; }
.auth-story p { max-width: 34ch; color: rgba(255, 255, 255, .82); line-height: 1.75; }
.auth-benefits { display: grid; gap: 14px; margin-top: 36px; }
.auth-benefit { display: flex; align-items: center; gap: 10px; color: rgba(255, 255, 255, .94); font-size: 14px; }
.auth-benefit i { color: #65d46e; }
.auth-form-side { min-width: 0; overflow-y: auto; padding: 58px 64px 48px; }
.auth-panel { max-width: 470px; margin: 0 auto; }
.auth-panel[hidden] { display: none; }
.auth-panel h2 { margin: 0 0 8px; color: #0f172a; font-size: 30px; font-weight: 800; letter-spacing: -.02em; }
.auth-switch-copy { margin-bottom: 28px; color: #64748b; }
.auth-link { color: #1565c0; font-weight: 700; }
.auth-link:hover { color: #0d47a1; text-decoration: underline; }
.auth-form { display: grid; gap: 18px; }
.auth-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.auth-field label { display: block; margin-bottom: 7px; color: #334155; font-size: 14px; font-weight: 600; }
.auth-input-wrap { position: relative; }
.auth-input-wrap > i { position: absolute; top: 50%; left: 14px; color: #64748b; transform: translateY(-50%); pointer-events: none; }
.auth-input-wrap .input-field { padding-left: 42px; }
.auth-input-wrap .toggle-password { position: absolute; top: 50%; right: 10px; display: grid; width: 36px; height: 36px; place-items: center; color: #64748b; transform: translateY(-50%); }
.auth-dialog .input-field { min-height: 48px; border: 1px solid #cbd5e1; border-radius: 10px; background: #fff; color: #0f172a; font-size: 16px; }
.auth-dialog .input-field::placeholder { color: #64748b; }
.auth-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #64748b; font-size: 14px; }
.auth-check { display: flex; min-width: 0; align-items: flex-start; gap: 9px; color: #64748b; font-size: 14px; line-height: 1.55; }
.auth-check input { flex: 0 0 auto; width: 16px; height: 16px; margin-top: 2px; accent-color: #1565c0; }
.auth-submit { min-height: 50px; border-radius: 10px; }
.auth-divider { display: flex; align-items: center; gap: 14px; margin: 24px 0 18px; color: #64748b; font-size: 13px; }
.auth-divider::before, .auth-divider::after { content: ''; height: 1px; flex: 1; background: #e2e8f0; }
.auth-socials { display: flex; justify-content: center; gap: 12px; }
.auth-socials button { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid #dbe4ee; border-radius: 12px; background: #fff; }
.auth-socials button:hover { border-color: #9fb7ca; background: #f6f9fb; }
@media (max-width: 900px) { .auth-layout { grid-template-columns: minmax(0, 1fr); min-height: 0; } .auth-story { display: none; } .auth-form-side { padding: 54px 34px 36px; } }
@media (max-width: 520px) { .auth-modal { align-items: end; padding: 0; } .auth-dialog { width: 100%; max-height: 94vh; border-radius: 16px 16px 0 0; } .auth-form-side { padding: 54px 20px 28px; } .auth-panel h2 { font-size: 26px; } .auth-field-grid { grid-template-columns: minmax(0, 1fr); } .auth-row { align-items: flex-start; flex-direction: column; gap: 10px; } }
</style>
</head>
<body class="text-gray-800 antialiased">
<!-- 导航栏 -->
<nav id="navbar" class="fixed top-0 left-0 right-0 z-50 transition-all duration-500 py-4">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between h-16">
<!-- Logo -->
<a href="#" onclick="navigateTo('home')" class="flex items-center group">
<div class="relative flex items-center justify-center" style="width:161px;height:60px;">
<img src="assets/logo.png" alt="柏悦物流" class="nav-logo-img" style="width:161px;height:60px;object-fit:contain;">
</div>
</a>
<!-- 桌面导航 -->
<div class="hidden lg:flex items-center space-x-8">
<a href="#" onclick="navigateTo('home')" class="nav-link text-white/90 hover:text-brand-green font-medium transition-colors" data-i18n="nav_home">首页</a>
<a href="#business" onclick="navigateTo('business')" class="nav-link text-white/90 hover:text-brand-green font-medium transition-colors" data-i18n="nav_business">业务</a>
<a href="#process" onclick="navigateTo('process')" class="nav-link text-white/90 hover:text-brand-green font-medium transition-colors" data-i18n="nav_process">流程</a>
<a href="#services" onclick="navigateTo('services')" class="nav-link text-white/90 hover:text-brand-green font-medium transition-colors" data-i18n="nav_services">服务</a>
<a href="#about" onclick="navigateTo('about')" class="nav-link text-white/90 hover:text-brand-green font-medium transition-colors" data-i18n="nav_about">关于</a>
<a href="#contact" onclick="navigateTo('contact')" class="nav-link text-white/90 hover:text-brand-green font-medium transition-colors" data-i18n="nav_contact">联系</a>
</div>
<!-- 语言切换(登录前后均显示) -->
<div class="lang-switcher hidden lg:flex" id="langSwitcher">
<button data-lang="zh" class="active" title="中文">中</button>
<button data-lang="en" title="English">EN</button>
<button data-lang="es" title="Español (México)">🇲🇽</button>
</div>
<!-- 未登录:登录注册按钮 -->
<div id="navAuthOut" class="hidden lg:flex items-center space-x-4">
<button onclick="openAuthModal('login')" class="nav-link text-white/90 hover:text-white font-medium px-4 py-2 transition-colors" data-i18n="nav_login">登录</button>
<button onclick="openAuthModal('register')" class="bg-white text-brand-blue hover:bg-brand-green hover:text-white font-semibold px-6 py-2.5 rounded-full transition-all duration-300 transform hover:scale-105" data-i18n="nav_register">
免费注册
</button>
</div>
<!-- 已登录:工作台 / 退出(桌面显示,移动端走汉堡菜单) -->
<div id="navAuthIn" class="hidden items-center space-x-3">
<button onclick="window.location.href='workbench.html'" class="nav-link text-white/90 hover:text-brand-green font-medium px-4 py-2 transition-colors" data-i18n="nav_dashboard">工作台</button>
<button onclick="doLogout()" class="bg-white/15 hover:bg-white/25 text-white font-semibold px-5 py-2.5 rounded-full transition-all" data-i18n="dash_logout">退出登录</button>
</div>
<!-- 移动端菜单按钮 -->
<button id="mobileMenuBtn" class="lg:hidden text-white nav-link p-2">
<i class="fas fa-bars text-2xl"></i>
</button>
</div>
</div>
</nav>
<!-- 移动端菜单 -->
<div id="mobileMenu" class="mobile-menu fixed inset-y-0 right-0 z-50 w-80 bg-white shadow-2xl lg:hidden">
<div class="p-6">
<div class="flex justify-between items-center mb-8">
<div class="flex items-center">
<img src="assets/logo.png" alt="柏悦物流" style="width:161px;height:60px;object-fit:contain;">
</div>
<button id="closeMobileMenu" class="text-gray-600 hover:text-gray-900">
<i class="fas fa-times text-2xl"></i>
</button>
</div>
<div class="flex flex-col space-y-4">
<a href="#" onclick="navigateTo('home'); closeMobileMenu();" class="text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_home">首页</a>
<a href="#business" onclick="navigateTo('business'); closeMobileMenu();" class="text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_business">业务</a>
<a href="#process" onclick="navigateTo('process'); closeMobileMenu();" class="text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_process">流程</a>
<a href="#services" onclick="navigateTo('services'); closeMobileMenu();" class="text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_services">服务</a>
<a href="#about" onclick="navigateTo('about'); closeMobileMenu();" class="text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_about">关于</a>
<a href="#contact" onclick="navigateTo('contact'); closeMobileMenu();" class="text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_contact">联系</a>
<div id="navAuthOutMobile">
<button onclick="closeMobileMenu(); openAuthModal('login');" class="text-left text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_login">登录</button>
<button onclick="closeMobileMenu(); openAuthModal('register');" class="btn-primary text-white font-semibold py-3 rounded-xl mt-4" data-i18n="nav_register">免费注册</button>
</div>
<div id="navAuthInMobile" class="hidden">
<button onclick="window.location.href='workbench.html'; closeMobileMenu();" class="text-left text-gray-700 hover:text-brand-blue font-medium py-2 border-b border-gray-100" data-i18n="nav_dashboard">工作台</button>
<button onclick="doLogout(); closeMobileMenu();" class="btn-primary text-white font-semibold py-3 rounded-xl mt-4" data-i18n="dash_logout">退出登录</button>
</div>
<!-- 移动端语言切换 -->
<div class="lang-switcher-mobile mt-4" id="langSwitcherMobile">
<button data-lang="zh" class="active" data-i18n="lang_zh">中文</button>
<button data-lang="en" data-i18n="lang_en">English</button>
<button data-lang="es" data-i18n="lang_es">Español</button>
</div>
</div>
</div>
</div>
<div id="mobileOverlay" class="fixed inset-0 bg-black/50 z-40 hidden lg:hidden"></div>
<!-- 首页 -->
<section id="homeSection" class="route-section active">
<section class="core-hero" aria-label="五大核心业务轮播">
<div class="core-slides" aria-hidden="true">
<div class="core-slide active" style="--slide-bg:url('assets/core-ocean.jpg')"></div>
<div class="core-slide" style="--slide-bg:url('assets/core-fulfillment.jpg')"></div>
<div class="core-slide" style="--slide-bg:url('assets/core-procurement.jpg')"></div>
<div class="core-slide" style="--slide-bg:url('assets/core-trucking.jpg')"></div>
<div class="core-slide" style="--slide-bg:url('assets/core-pallet.jpg')"></div>
</div>
<div class="overlay-dots absolute inset-0 z-[2]"></div>
<div class="core-hero-content">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 w-full">
<div class="core-copy reveal active">
<span class="core-kicker" data-i18n="core_kicker">五大核心业务</span>
<div class="core-copy-slide" data-core-copy="0">
<h1 class="core-title" data-i18n="biz1_title">海运专线</h1>
<p class="core-desc" data-i18n="biz1_desc">中美海运专线,提供整柜、拼箱、美森快船与盐田普船等多元化产品,舱位稳定,价格透明。</p>
<div class="core-points"><span class="core-point" data-i18n="biz1_li1">每周固定船期</span><span class="core-point" data-i18n="biz1_li2">双清包税门到门</span><span class="core-point" data-i18n="biz1_li3">全程可视化追踪</span></div>
</div>
<div class="core-copy-slide hidden" data-core-copy="1">
<h1 class="core-title" data-i18n="biz2_title">一件代发</h1><p class="core-desc" data-i18n="biz2_desc">美国本土仓储与订单履约,支持 Amazon、Walmart 和独立站等多平台订单一件代发。</p>
<div class="core-points"><span class="core-point" data-i18n="biz2_li1">多平台 API 对接</span><span class="core-point" data-i18n="biz2_li2">智能库存管理</span><span class="core-point" data-i18n="biz2_li3">24h 快速出库</span></div>
</div>
<div class="core-copy-slide hidden" data-core-copy="2">
<h1 class="core-title" data-i18n="svc1_title">海外采购</h1><p class="core-desc" data-i18n="svc1_desc">从供应商筛选、采购执行到验货质检和集中发货,提供一体化海外采购服务。</p>
<div class="core-points"><span class="core-point" data-i18n="svc1_li1">供应商资质审核</span><span class="core-point" data-i18n="svc1_li3">质量检验把关</span><span class="core-point" data-i18n="svc1_li4">集货仓储发货</span></div>
</div>
<div class="core-copy-slide hidden" data-core-copy="3">
<h1 class="core-title" data-i18n="svc2_title">美本土卡车</h1><p class="core-desc" data-i18n="svc2_desc">覆盖美国全境的卡车运输网络,提供 FTL 整车、LTL 零担与超大件派送。</p>
<div class="core-points"><span class="core-point" data-i18n="svc2_li1">全美 FTL/LTL 运输</span><span class="core-point" data-i18n="svc2_li3">GPS 实时追踪</span><span class="core-point" data-i18n="svc2_li4">预约送货签收</span></div>
</div>
<div class="core-copy-slide hidden" data-core-copy="4">
<h1 class="core-title" data-i18n="svc3_title">美本土散板</h1><p class="core-desc" data-i18n="svc3_desc">针对托盘货物提供美国本土拆板、分拣与再派服务,适配 B2B 补货及多渠道配送。</p>
<div class="core-points"><span class="core-point" data-i18n="svc3_li1">托盘拆板组板</span><span class="core-point" data-i18n="svc3_li2">多地址分拣派送</span><span class="core-point" data-i18n="svc3_li4">仓储库存管理</span></div>
</div>
<div class="core-actions">
<button class="core-detail-btn" id="coreDetailBtn" onclick="navigateBusinessDetail('ocean')"><span data-i18n="core_detail">查看业务详情</span><i class="fas fa-arrow-right"></i></button>
<button class="core-arrow" type="button" onclick="changeCoreSlide(-1)" aria-label="上一个"><i class="fas fa-arrow-left"></i></button>
<button class="core-arrow" type="button" onclick="changeCoreSlide(1)" aria-label="下一个"><i class="fas fa-arrow-right"></i></button>
</div>
</div>
</div>
</div>
<div class="core-nav-wrap">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="core-tabs" role="tablist" aria-label="五大核心业务">
<button class="core-tab active" data-core-tab="0"><span class="core-tab-index">01</span><span class="core-tab-name" data-i18n="biz1_title">海运专线</span><span class="core-tab-progress"></span></button>
<button class="core-tab" data-core-tab="1"><span class="core-tab-index">02</span><span class="core-tab-name" data-i18n="biz2_title">一件代发</span><span class="core-tab-progress"></span></button>
<button class="core-tab" data-core-tab="2"><span class="core-tab-index">03</span><span class="core-tab-name" data-i18n="svc1_title">海外采购</span><span class="core-tab-progress"></span></button>
<button class="core-tab" data-core-tab="3"><span class="core-tab-index">04</span><span class="core-tab-name" data-i18n="svc2_title">美本土卡车</span><span class="core-tab-progress"></span></button>
<button class="core-tab" data-core-tab="4"><span class="core-tab-index">05</span><span class="core-tab-name" data-i18n="svc3_title">美本土散板</span><span class="core-tab-progress"></span></button>
</div>
</div>
</div>
</section>
</section>
<!-- 五大业务独立详情页(内容由业务配置动态生成) -->
<section id="businessDetailSection" class="route-section business-detail-page">
<div class="bd-hero" id="bdHero">
<div class="bd-hero-inner">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bd-breadcrumb"><button onclick="navigateTo('home')">首页</button><i class="fas fa-chevron-right text-[9px]"></i><button onclick="navigateTo('business')">业务</button><i class="fas fa-chevron-right text-[9px]"></i><span id="bdBreadcrumbName">业务详情</span></div>
<span class="bd-eyebrow" id="bdEyebrow">Business Solution</span>
<h1 class="bd-title" id="bdTitle">业务详情</h1>
<p class="bd-desc" id="bdDesc"></p>
<div class="bd-badges" id="bdBadges"></div>
</div>
</div>
</div>
<div class="bd-content">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bd-section-head">
<div><div class="bd-section-kicker">SERVICE OVERVIEW</div><h2 class="bd-section-title">服务介绍</h2></div>
<p class="bd-section-copy" id="bdIntro"></p>
</div>
<div class="bd-feature-grid" id="bdFeatures"></div>
<div class="bd-section-head">
<div><div class="bd-section-kicker">HOW IT WORKS</div><h2 class="bd-section-title">业务操作流程</h2></div>
<p class="bd-section-copy">简版快速了解货物流转路径,详细版展示从建单到签收的关键操作节点。</p>
</div>
<div class="bd-flow-card">
<div class="bd-flow-top"><h3 id="bdFlowTitle">业务流程图</h3><div class="bd-flow-switch"><button class="active" data-flow-view="simple" onclick="switchBusinessFlow('simple',this)">简版流程</button><button data-flow-view="detail" onclick="switchBusinessFlow('detail',this)">详细流程</button></div></div>
<div class="bd-flow-panel active" id="bdSimplePanel"><div class="bd-simple-flow" id="bdSimpleFlow"></div></div>
<div class="bd-flow-panel" id="bdDetailPanel"><div class="bd-detail-flow" id="bdDetailFlow"></div></div>
</div>
<div class="bd-other">
<div class="bd-section-head"><div><div class="bd-section-kicker">MORE SOLUTIONS</div><h2 class="bd-section-title">查看其他业务</h2></div></div>
<div class="bd-other-grid" id="bdOtherBusiness"></div>
</div>
</div>
</div>
</section>
<!-- 核心服务 -->
<section id="servicesSection" class="route-section secondary-page">
<div class="subpage-hero" style="--sub-bg:url('assets/core-procurement.jpg')">
<div class="subpage-hero-inner"><div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="subpage-breadcrumb"><button onclick="navigateTo('home')" data-i18n="nav_home">首页</button><i class="fas fa-chevron-right text-[9px]"></i><span data-i18n="nav_services">服务</span></div>
<span class="subpage-kicker" data-i18n="svc_eyebrow">Core Services</span><h1 class="subpage-title" data-i18n="svc_title">专业服务,覆盖跨境全链路</h1><p class="subpage-desc" data-i18n="svc_subtitle">依托美国本土优势资源与全球化网络,为企业提供稳定、高效、可追踪的跨境物流服务。</p>
<div class="subpage-meta"><span><i class="fas fa-cart-shopping"></i><span data-i18n="svc1_title">海外采购</span></span><span><i class="fas fa-truck"></i><span data-i18n="svc2_title">美本土卡车</span></span><span><i class="fas fa-pallet"></i><span data-i18n="svc3_title">美本土散板</span></span></div>
</div></div>
</div>
<section id="services" class="py-24 bg-white relative">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center max-w-3xl mx-auto mb-16 reveal">
<span class="text-brand-blue font-semibold tracking-wider uppercase text-sm" data-i18n="svc_eyebrow">Core Services</span>
<h2 class="text-4xl lg:text-5xl font-bold text-gray-900 mt-3 mb-6" data-i18n="svc_title">专业服务,覆盖跨境全链路</h2>
<p class="text-lg text-gray-600" data-i18n="svc_subtitle">依托美国本土优势资源与全球化网络,为企业提供稳定、高效、可追踪的跨境物流服务。</p>
</div>
<div class="grid md:grid-cols-3 gap-8">
<!-- 海外采购 -->
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal">
<div class="service-icon w-16 h-16 rounded-2xl bg-gradient-to-br from-brand-blue to-brand-blueDark flex items-center justify-center text-white text-2xl mb-6">
<i class="fas fa-shopping-cart"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-4" data-i18n="svc1_title">海外采购</h3>
<p class="text-gray-600 mb-6 leading-relaxed" data-i18n="svc1_desc">提供海外供应商对接、采购执行、验货质检、集中采购等一体化服务,降低采购成本,提升供应链效率。</p>
<ul class="check-list space-y-2 text-gray-600 text-sm">
<li data-i18n="svc1_li1">供应商筛选与资质审核</li>
<li data-i18n="svc1_li2">样品确认与批量采购</li>
<li data-i18n="svc1_li3">质量检验与合规把关</li>
<li data-i18n="svc1_li4">集货仓储与统一发货</li>
</ul>
</div>
<!-- 美本土卡车 -->
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal" style="transition-delay: 0.1s;">
<div class="service-icon w-16 h-16 rounded-2xl bg-gradient-to-br from-brand-green to-brand-greenDark flex items-center justify-center text-white text-2xl mb-6">
<i class="fas fa-truck-moving"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-4" data-i18n="svc2_title">美本土卡车</h3>
<p class="text-gray-600 mb-6 leading-relaxed" data-i18n="svc2_desc">覆盖美国全境的卡车运输网络,提供 FTL 整车、LTL 零担、超大件派送等灵活解决方案。</p>
<ul class="check-list space-y-2 text-gray-600 text-sm">
<li data-i18n="svc2_li1">全美 FTL/LTL 运输</li>
<li data-i18n="svc2_li2">超大件及特种车辆</li>
<li data-i18n="svc2_li3">实时 GPS 轨迹追踪</li>
<li data-i18n="svc2_li4">预约送货与签收确认</li>
</ul>
</div>
<!-- 美本土散板 -->
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal" style="transition-delay: 0.2s;">
<div class="service-icon w-16 h-16 rounded-2xl bg-gradient-to-br from-brand-teal to-cyan-700 flex items-center justify-center text-white text-2xl mb-6">
<i class="fas fa-pallet"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-4" data-i18n="svc3_title">美本土散板</h3>
<p class="text-gray-600 mb-6 leading-relaxed" data-i18n="svc3_desc">针对托盘货物提供美国本土拆板、分拣、再派服务,适配电商退货、B2B 补货、多渠道配送场景。</p>
<ul class="check-list space-y-2 text-gray-600 text-sm">
<li data-i18n="svc3_li1">托盘拆板与重新组板</li>
<li data-i18n="svc3_li2">多地址分拣派送</li>
<li data-i18n="svc3_li3">退货逆向物流</li>
<li data-i18n="svc3_li4">仓储与库存管理</li>
</ul>
</div>
</div>
</div>
</section>
<!-- 服务流程 -->
</section>
<section id="processSection" class="route-section secondary-page">
<div class="subpage-hero" style="--sub-bg:url('assets/core-ocean.jpg')">
<div class="subpage-hero-inner"><div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="subpage-breadcrumb"><button onclick="navigateTo('home')" data-i18n="nav_home">首页</button><i class="fas fa-chevron-right text-[9px]"></i><span data-i18n="nav_process">流程</span></div>
<span class="subpage-kicker" data-i18n="proc_eyebrow">Service Process</span><h1 class="subpage-title" data-i18n="proc_title">标准化服务流程</h1><p class="subpage-desc" data-i18n="proc_subtitle">从上门取件到签收入库,每个环节都严格把控,确保货物安全、准时送达。</p>
<div class="subpage-meta"><span><i class="fas fa-box-open"></i><span data-i18n="proc1_title">上门取件</span></span><span><i class="fas fa-file-contract"></i><span data-i18n="proc2_title">入仓清关</span></span><span><i class="fas fa-ship"></i><span data-i18n="proc3_title">国际运输</span></span><span><i class="fas fa-warehouse"></i><span data-i18n="proc4_title">签收入库</span></span></div>
</div></div>
</div>
<section id="process" class="py-24 gradient-bg-soft relative overflow-hidden">
<!-- 背景装饰 -->
<div class="absolute top-0 left-0 w-full h-full opacity-30">
<div class="absolute top-20 left-10 w-64 h-64 bg-brand-blue/10 rounded-full blur-3xl"></div>
<div class="absolute bottom-20 right-10 w-80 h-80 bg-brand-green/10 rounded-full blur-3xl"></div>
</div>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="text-center max-w-3xl mx-auto mb-16 reveal">
<span class="text-brand-blue font-semibold tracking-wider uppercase text-sm" data-i18n="proc_eyebrow">Service Process</span>
<h2 class="text-4xl lg:text-5xl font-bold text-gray-900 mt-3 mb-6" data-i18n="proc_title">标准化服务流程</h2>
<p class="text-lg text-gray-600" data-i18n="proc_subtitle">从上门取件到签收入库,每个环节都严格把控,确保货物安全、准时送达。</p>
</div>
<div class="relative">
<!-- 流程线 -->
<div class="hidden lg:block absolute top-24 left-0 right-0 h-1 process-line rounded-full mx-24"></div>
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8">
<!-- 步骤1 -->
<div class="process-step text-center reveal">
<div class="process-number w-20 h-20 rounded-full bg-gradient-to-br from-brand-blue to-brand-blueDark text-white text-2xl font-black flex items-center justify-center mx-auto mb-6 relative z-10 shadow-glow">
01
</div>
<div class="bg-white rounded-2xl p-6 shadow-card">
<div class="w-14 h-14 rounded-xl bg-blue-50 flex items-center justify-center text-brand-blue text-xl mx-auto mb-4">
<i class="fas fa-box-open"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="proc1_title">上门取件</h3>
<p class="text-gray-600 text-sm leading-relaxed" data-i18n="proc1_desc">专业团队按约定时间上门提货,核对货物信息,提供标准化包装建议。</p>
</div>
</div>
<!-- 步骤2 -->
<div class="process-step text-center reveal" style="transition-delay: 0.1s;">
<div class="process-number w-20 h-20 rounded-full bg-gradient-to-br from-brand-teal to-cyan-700 text-white text-2xl font-black flex items-center justify-center mx-auto mb-6 relative z-10 shadow-glow">
02
</div>
<div class="bg-white rounded-2xl p-6 shadow-card">
<div class="w-14 h-14 rounded-xl bg-cyan-50 flex items-center justify-center text-brand-teal text-xl mx-auto mb-4">
<i class="fas fa-file-contract"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="proc2_title">入仓清关</h3>
<p class="text-gray-600 text-sm leading-relaxed" data-i18n="proc2_desc">货物入仓后由专业报关团队处理清关资料,提前预审,确保快速通关。</p>
</div>
</div>
<!-- 步骤3 -->
<div class="process-step text-center reveal" style="transition-delay: 0.2s;">
<div class="process-number w-20 h-20 rounded-full bg-gradient-to-br from-brand-green to-brand-greenDark text-white text-2xl font-black flex items-center justify-center mx-auto mb-6 relative z-10 shadow-glow-green">
03
</div>
<div class="bg-white rounded-2xl p-6 shadow-card">
<div class="w-14 h-14 rounded-xl bg-green-50 flex items-center justify-center text-brand-green text-xl mx-auto mb-4">
<i class="fas fa-ship"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="proc3_title">国际运输</h3>
<p class="text-gray-600 text-sm leading-relaxed" data-i18n="proc3_desc">海运专线稳定发运,全程轨迹可追踪,异常情况主动预警及时响应。</p>
</div>
</div>
<!-- 步骤4 -->
<div class="process-step text-center reveal" style="transition-delay: 0.3s;">
<div class="process-number w-20 h-20 rounded-full bg-gradient-to-br from-brand-blue to-brand-green text-white text-2xl font-black flex items-center justify-center mx-auto mb-6 relative z-10 shadow-glow">
04
</div>
<div class="bg-white rounded-2xl p-6 shadow-card">
<div class="w-14 h-14 rounded-xl bg-indigo-50 flex items-center justify-center text-indigo-600 text-xl mx-auto mb-4">
<i class="fas fa-warehouse"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="proc4_title">签收入库</h3>
<p class="text-gray-600 text-sm leading-relaxed" data-i18n="proc4_desc">目的地仓库签收核验,系统同步入库状态,支持一键转代发或派送。</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 业务板块 -->
</section>
<section id="businessSection" class="route-section secondary-page">
<div class="subpage-hero" style="--sub-bg:url('assets/core-fulfillment.jpg')">
<div class="subpage-hero-inner"><div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="subpage-breadcrumb"><button onclick="navigateTo('home')" data-i18n="nav_home">首页</button><i class="fas fa-chevron-right text-[9px]"></i><span data-i18n="nav_business">业务</span></div>
<span class="subpage-kicker" data-i18n="biz_eyebrow">Business Lines</span><h1 class="subpage-title" data-i18n="biz_title">核心业务的深度布局</h1><p class="subpage-desc" data-i18n="biz_subtitle">海运专线与一件代发双轮驱动,满足不同规模企业的出海需求。</p>
<div class="subpage-meta"><span><i class="fas fa-anchor"></i><span data-i18n="biz1_title">海运专线</span></span><span><i class="fas fa-parachute-box"></i><span data-i18n="biz2_title">一件代发</span></span><span><i class="fas fa-chart-line"></i>Stable & Scalable</span></div>
</div></div>
</div>
<section id="business" class="py-24 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center max-w-3xl mx-auto mb-16 reveal">
<span class="text-brand-blue font-semibold tracking-wider uppercase text-sm" data-i18n="biz_eyebrow">Business Lines</span>
<h2 class="text-4xl lg:text-5xl font-bold text-gray-900 mt-3 mb-6" data-i18n="biz_title">核心业务的深度布局</h2>
<p class="text-lg text-gray-600" data-i18n="biz_subtitle">海运专线与一件代发双轮驱动,满足不同规模企业的出海需求。</p>
</div>
<div class="grid lg:grid-cols-2 gap-10">
<!-- 海运专线 -->
<div class="group relative rounded-3xl overflow-hidden shadow-card hover:shadow-card-hover transition-all duration-500 reveal">
<div class="absolute inset-0">
<img src="https://images.unsplash.com/photo-1578575437130-527eed3abbec?ixlib=rb-4.0.3&auto=format&fit=crop&w=2070&q=80" alt="海运专线" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-110">
<div class="absolute inset-0 bg-gradient-to-t from-brand-dark via-brand-dark/70 to-transparent"></div>
</div>
<div class="relative z-10 p-10 min-h-[420px] flex flex-col justify-end">
<div class="w-16 h-16 rounded-2xl bg-brand-blue/90 backdrop-blur flex items-center justify-center text-white text-2xl mb-6">
<i class="fas fa-anchor"></i>
</div>
<h3 class="text-3xl font-bold text-white mb-4" data-i18n="biz1_title">海运专线</h3>
<p class="text-white/80 mb-6 leading-relaxed" data-i18n="biz1_desc">中美海运专线,提供整柜(FCL)、拼箱(LCL)、美森快船、盐田普船等多元化海运产品,舱位稳定,价格透明。</p>
<ul class="space-y-2 text-white/90 text-sm">
<li class="flex items-center"><i class="fas fa-check-circle text-brand-green mr-2"></i> <span data-i18n="biz1_li1">每周固定船期,舱位保障</span></li>
<li class="flex items-center"><i class="fas fa-check-circle text-brand-green mr-2"></i> <span data-i18n="biz1_li2">双清包税,门到门服务</span></li>
<li class="flex items-center"><i class="fas fa-check-circle text-brand-green mr-2"></i> <span data-i18n="biz1_li3">全程可视化追踪系统</span></li>
</ul>
</div>
</div>
<!-- 一件代发 -->
<div class="group relative rounded-3xl overflow-hidden shadow-card hover:shadow-card-hover transition-all duration-500 reveal" style="transition-delay: 0.1s;">
<div class="absolute inset-0">
<img src="https://images.unsplash.com/photo-1586528116311-ad8dd3c8310d?ixlib=rb-4.0.3&auto=format&fit=crop&w=2070&q=80" alt="一件代发" class="w-full h-full object-cover transition-transform duration-700 group-hover:scale-110">
<div class="absolute inset-0 bg-gradient-to-t from-brand-dark via-brand-dark/70 to-transparent"></div>
</div>
<div class="relative z-10 p-10 min-h-[420px] flex flex-col justify-end">
<div class="w-16 h-16 rounded-2xl bg-brand-green/90 backdrop-blur flex items-center justify-center text-white text-2xl mb-6">
<i class="fas fa-parachute-box"></i>
</div>
<h3 class="text-3xl font-bold text-white mb-4" data-i18n="biz2_title">一件代发</h3>
<p class="text-white/80 mb-6 leading-relaxed" data-i18n="biz2_desc">美国本土仓储 + 订单履约,支持 Amazon、Walmart、独立站等多平台订单的一件代发,助力卖家降本增效。</p>
<ul class="space-y-2 text-white/90 text-sm">
<li class="flex items-center"><i class="fas fa-check-circle text-brand-green mr-2"></i> <span data-i18n="biz2_li1">多平台 API 对接</span></li>
<li class="flex items-center"><i class="fas fa-check-circle text-brand-green mr-2"></i> <span data-i18n="biz2_li2">智能库存与订单管理</span></li>
<li class="flex items-center"><i class="fas fa-check-circle text-brand-green mr-2"></i> <span data-i18n="biz2_li3">24h 出库,快速妥投</span></li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- 企业优势 -->
</section>
<section id="aboutSection" class="route-section secondary-page">
<div class="subpage-hero" style="--sub-bg:url('assets/core-pallet.jpg')">
<div class="subpage-hero-inner"><div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="subpage-breadcrumb"><button onclick="navigateTo('home')" data-i18n="nav_home">首页</button><i class="fas fa-chevron-right text-[9px]"></i><span data-i18n="nav_about">关于</span></div>
<span class="subpage-kicker" data-i18n="cul_eyebrow">Corporate Culture</span><h1 class="subpage-title" data-i18n="cul_title">关于我们与企业文化</h1><p class="subpage-desc" data-i18n="cul_subtitle">以心传递,畅达天下——用专业与责任连接中美贸易的每一段旅程。</p>
<div class="subpage-meta"><span><i class="fas fa-earth-americas"></i><span data-i18n="feat1_title">全球化网络</span></span><span><i class="fas fa-laptop-code"></i><span data-i18n="feat2_title">数字化系统</span></span><span><i class="fas fa-headset"></i><span data-i18n="feat3_title">专属客服</span></span></div>
</div></div>
</div>
<section id="advantages" class="py-24 gradient-bg-soft relative overflow-hidden">
<div class="absolute top-0 right-0 w-full h-full opacity-30">
<div class="absolute top-16 right-10 w-72 h-72 bg-brand-blue/10 rounded-full blur-3xl"></div>
<div class="absolute bottom-16 left-10 w-80 h-80 bg-brand-green/10 rounded-full blur-3xl"></div>
</div>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="text-center max-w-3xl mx-auto mb-16 reveal">
<span class="text-brand-blue font-semibold tracking-wider uppercase text-sm" data-i18n="adv_eyebrow">Our Advantages</span>
<h2 class="text-4xl lg:text-5xl font-bold text-gray-900 mt-3 mb-6" data-i18n="adv_title">六大企业优势</h2>
<p class="text-lg text-gray-600" data-i18n="adv_subtitle">深耕中美跨境物流多年,以专业能力与本土资源为客户构筑稳定可靠的供应链保障。</p>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal">
<div class="w-14 h-14 rounded-2xl bg-blue-50 flex items-center justify-center text-brand-blue text-2xl mb-5">
<i class="fas fa-users"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="adv1_title">专业团队</h3>
<p class="text-gray-600 leading-relaxed" data-i18n="adv1_desc">10 年以上跨境物流经验的核心团队,熟悉各国海关政策与操作流程。</p>
</div>
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal" style="transition-delay: 0.05s;">
<div class="w-14 h-14 rounded-2xl bg-green-50 flex items-center justify-center text-brand-green text-2xl mb-5">
<i class="fas fa-warehouse"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="adv2_title">自营海外仓</h3>
<p class="text-gray-600 leading-relaxed" data-i18n="adv2_desc">美国自营海外仓,提供仓储、分拣、包装、退件处理等全方位服务。</p>
</div>
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal" style="transition-delay: 0.1s;">
<div class="w-14 h-14 rounded-2xl bg-cyan-50 flex items-center justify-center text-brand-teal text-2xl mb-5">
<i class="fas fa-file-invoice-dollar"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="adv3_title">双清包税</h3>
<p class="text-gray-600 leading-relaxed" data-i18n="adv3_desc">专业报关清关服务,包税渠道,通关高效,让您省心省力。</p>
</div>
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal" style="transition-delay: 0.15s;">
<div class="w-14 h-14 rounded-2xl bg-indigo-50 flex items-center justify-center text-indigo-600 text-2xl mb-5">
<i class="fas fa-route"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="adv4_title">全程可视化</h3>
<p class="text-gray-600 leading-relaxed" data-i18n="adv4_desc">GPS 实时定位,订单全流程跟踪,随时掌握货物状态。</p>
</div>
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal" style="transition-delay: 0.2s;">
<div class="w-14 h-14 rounded-2xl bg-rose-50 flex items-center justify-center text-rose-500 text-2xl mb-5">
<i class="fas fa-shield-halved"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="adv5_title">保险服务</h3>
<p class="text-gray-600 leading-relaxed" data-i18n="adv5_desc">完善的货物保险服务,全方位保障货物安全,降低运输风险。</p>
</div>
<div class="service-card bg-white rounded-2xl p-8 shadow-card border border-gray-100 reveal" style="transition-delay: 0.25s;">
<div class="w-14 h-14 rounded-2xl bg-amber-50 flex items-center justify-center text-amber-500 text-2xl mb-5">
<i class="fas fa-boxes-stacked"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="adv6_title">一站式服务</h3>
<p class="text-gray-600 leading-relaxed" data-i18n="adv6_desc">从揽件到签收,提供完整的物流解决方案,无需对接多个服务商。</p>
</div>
</div>
</div>
</section>
<!-- 核心优势 -->
<section id="about" class="py-24 bg-gray-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid lg:grid-cols-2 gap-16 items-center">
<div class="reveal">
<span class="text-brand-blue font-semibold tracking-wider uppercase text-sm" data-i18n="about_eyebrow">Why Choose Us</span>
<h2 class="text-4xl lg:text-5xl font-bold text-gray-900 mt-3 mb-6" data-i18n="about_title">为什么选择柏悦物流</h2>
<p class="text-lg text-gray-600 mb-10 leading-relaxed" data-i18n="about_desc">我们不只是物流服务商,更是企业出海的合作伙伴。凭借专业的团队、成熟的网络与数字化系统,为客户提供端到端的供应链保障。</p>
<div class="space-y-6">
<div class="feature-item flex items-start space-x-4 p-4 rounded-xl">
<div class="w-12 h-12 rounded-xl bg-blue-100 flex items-center justify-center text-brand-blue text-xl flex-shrink-0">
<i class="fas fa-globe-americas"></i>
</div>
<div>
<h4 class="text-lg font-bold text-gray-900 mb-1" data-i18n="feat1_title">全球化网络</h4>
<p class="text-gray-600" data-i18n="feat1_desc">覆盖中美主要口岸与城市,自建与合作仓库遍布美国东西海岸。</p>
</div>
</div>
<div class="feature-item flex items-start space-x-4 p-4 rounded-xl">
<div class="w-12 h-12 rounded-xl bg-green-100 flex items-center justify-center text-brand-green text-xl flex-shrink-0">
<i class="fas fa-laptop-code"></i>
</div>
<div>
<h4 class="text-lg font-bold text-gray-900 mb-1" data-i18n="feat2_title">数字化系统</h4>
<p class="text-gray-600" data-i18n="feat2_desc">自研物流管理系统,订单、轨迹、库存、结算一站式在线管理。</p>
</div>
</div>
<div class="feature-item flex items-start space-x-4 p-4 rounded-xl">
<div class="w-12 h-12 rounded-xl bg-cyan-100 flex items-center justify-center text-brand-teal text-xl flex-shrink-0">
<i class="fas fa-headset"></i>
</div>
<div>
<h4 class="text-lg font-bold text-gray-900 mb-1" data-i18n="feat3_title">专属客服</h4>
<p class="text-gray-600" data-i18n="feat3_desc">中美两地客服团队,7×24 小时响应,异常情况第一时间处理。</p>
</div>
</div>
<div class="feature-item flex items-start space-x-4 p-4 rounded-xl">
<div class="w-12 h-12 rounded-xl bg-indigo-100 flex items-center justify-center text-indigo-600 text-xl flex-shrink-0">
<i class="fas fa-shield-alt"></i>
</div>
<div>
<h4 class="text-lg font-bold text-gray-900 mb-1" data-i18n="feat4_title">合规保障</h4>
<p class="text-gray-600" data-i18n="feat4_desc">专业清关团队,熟悉中美贸易法规,确保货物合规高效通关。</p>
</div>
</div>
</div>
</div>
<div class="relative reveal" style="transition-delay: 0.2s;">
<div class="relative rounded-3xl overflow-hidden shadow-2xl">
<img src="https://images.unsplash.com/photo-1566576912321-d58ddd7a6088?ixlib=rb-4.0.3&auto=format&fit=crop&w=2070&q=80" alt="物流仓储" class="w-full h-auto">
<div class="absolute inset-0 bg-gradient-to-tr from-brand-blue/20 to-transparent"></div>
</div>
<!-- 浮动数据卡 -->
<div class="absolute -bottom-8 -left-8 bg-white rounded-2xl shadow-card p-6 animate-float hidden lg:block">
<div class="flex items-center space-x-4">
<div class="w-14 h-14 rounded-full bg-gradient-to-br from-brand-green to-brand-greenDark flex items-center justify-center text-white text-2xl">
<i class="fas fa-chart-line"></i>
</div>
<div>
<div class="text-2xl font-black text-gray-900">35%</div>
<div class="text-sm text-gray-600" data-i18n="about_stat_label">平均物流成本降低</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- 企业文化 -->
<section id="culture" class="py-24 bg-white relative overflow-hidden">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center max-w-3xl mx-auto mb-16 reveal">
<span class="text-brand-blue font-semibold tracking-wider uppercase text-sm" data-i18n="cul_eyebrow">Corporate Culture</span>
<h2 class="text-4xl lg:text-5xl font-bold text-gray-900 mt-3 mb-6" data-i18n="cul_title">关于我们与企业文化</h2>
<p class="text-lg text-gray-600" data-i18n="cul_subtitle">以心传递,畅达天下——用专业与责任连接中美贸易的每一段旅程。</p>
</div>
<div class="grid lg:grid-cols-5 gap-10 items-stretch">
<!-- 公司简介 -->
<div class="lg:col-span-3 reveal">
<div class="h-full bg-gray-50 rounded-3xl p-10 border border-gray-100">
<div class="w-14 h-14 rounded-2xl bg-gradient-to-br from-brand-blue to-brand-blueDark flex items-center justify-center text-white text-2xl mb-6">
<i class="fas fa-building"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-4" data-i18n="cul_profile_title">公司简介</h3>
<p class="text-gray-600 leading-relaxed mb-4" data-i18n="cul_profile_desc1">我们是一家专业从事中美海运专线、中美空运专线、海外仓储服务的跨境物流公司,深耕美国、加拿大市场,主营海运、空运、铁运等跨境专线业务。</p>
<p class="text-gray-600 leading-relaxed" data-i18n="cul_profile_desc2">建立了以美森快船、OA 联盟电商快船及中美空运为主导的 FBA 美国全程运输渠道。在美国拥有自营海外仓,加拿大有合作海外仓,配备专业报关清关团队、双清派送到门服务与完善的保险服务,为跨境电商客户提供多样化的一站式解决方案。</p>
</div>
</div>
<!-- 愿景使命价值观 -->
<div class="lg:col-span-2 flex flex-col gap-6 reveal" style="transition-delay: 0.1s;">
<div class="rounded-2xl p-6 bg-blue-50 border border-blue-100">
<div class="flex items-center space-x-3 mb-2">
<i class="fas fa-bullseye text-brand-blue text-xl"></i>
<h4 class="text-lg font-bold text-gray-900" data-i18n="cul_vision_t">企业愿景</h4>
</div>
<p class="text-gray-600" data-i18n="cul_vision_d">成为跨境物流行业值得信赖的优选服务平台。</p>
</div>
<div class="rounded-2xl p-6 bg-green-50 border border-green-100">
<div class="flex items-center space-x-3 mb-2">
<i class="fas fa-flag text-brand-green text-xl"></i>
<h4 class="text-lg font-bold text-gray-900" data-i18n="cul_mission_t">企业使命</h4>
</div>
<p class="text-gray-600" data-i18n="cul_mission_d">为顾客提供卓越的跨境物流服务,助力中国产品速达全球。</p>
</div>
<div class="rounded-2xl p-6 bg-cyan-50 border border-cyan-100">
<div class="flex items-center space-x-3 mb-2">
<i class="fas fa-heart text-brand-teal text-xl"></i>
<h4 class="text-lg font-bold text-gray-900" data-i18n="cul_values_t">核心价值观</h4>
</div>
<p class="text-gray-600" data-i18n="cul_values_d">诚信 · 务实 · 谦卑 · 感恩</p>
</div>
</div>
</div>
<!-- 口号横幅 -->
<div class="mt-10 rounded-3xl gradient-bg p-10 text-center relative overflow-hidden reveal">
<div class="overlay-dots absolute inset-0"></div>
<div class="relative z-10">
<p class="text-sm font-semibold tracking-widest uppercase text-white/70 mb-3" data-i18n="cul_slogan_t">我们的口号</p>
<p class="text-2xl lg:text-3xl font-bold text-white" data-i18n="cul_slogan_d">客户价值 · 服务至上 · 精益求精 · 追求卓越 · 共创共赢</p>
</div>
</div>
</div>
</section>
<!-- 联系我们 -->
</section>
<section id="contactSection" class="route-section secondary-page">
<div class="subpage-hero" style="--sub-bg:url('assets/core-trucking.jpg')">
<div class="subpage-hero-inner"><div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="subpage-breadcrumb"><button onclick="navigateTo('home')" data-i18n="nav_home">首页</button><i class="fas fa-chevron-right text-[9px]"></i><span data-i18n="nav_contact">联系</span></div>
<span class="subpage-kicker" data-i18n="cont_eyebrow">Contact Us</span><h1 class="subpage-title" data-i18n="cont_title">联系我们</h1><p class="subpage-desc" data-i18n="cont_subtitle">随时欢迎咨询,我们的专业团队将为您提供跨境物流解决方案与报价。</p>
<div class="subpage-meta"><span><i class="fas fa-phone"></i>0579-85875557</span><span><i class="fas fa-envelope"></i>contact@baiyuelogistics.com</span><span><i class="fas fa-clock"></i><span data-i18n="cont_hours_t">工作时间</span></span></div>
</div></div>
</div>
<section id="contact" class="py-24 gradient-bg-soft relative overflow-hidden">
<div class="absolute top-0 left-0 w-full h-full opacity-30">
<div class="absolute top-16 left-10 w-72 h-72 bg-brand-blue/10 rounded-full blur-3xl"></div>
<div class="absolute bottom-16 right-10 w-80 h-80 bg-brand-green/10 rounded-full blur-3xl"></div>
</div>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="text-center max-w-3xl mx-auto mb-16 reveal">
<span class="text-brand-blue font-semibold tracking-wider uppercase text-sm" data-i18n="cont_eyebrow">Contact Us</span>
<h2 class="text-4xl lg:text-5xl font-bold text-gray-900 mt-3 mb-6" data-i18n="cont_title">联系我们</h2>
<p class="text-lg text-gray-600" data-i18n="cont_subtitle">随时欢迎咨询,我们的专业团队将为您提供跨境物流解决方案与报价。</p>
</div>
<div class="flex items-center gap-3 mb-6 reveal"><div class="w-10 h-10 rounded-xl bg-blue-50 flex items-center justify-center text-brand-blue"><i class="fas fa-map-marker-alt"></i></div><h3 class="text-2xl font-bold text-gray-900" data-i18n="cont_addr_t">公司地址</h3></div>
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-5 mb-8">
<div class="bg-white rounded-2xl p-6 shadow-card border border-gray-100 reveal"><div class="text-xs font-bold tracking-wider text-brand-blue mb-3" data-i18n="cont_addr_sz_t">深圳</div><p class="text-gray-600 text-sm leading-relaxed" data-i18n="cont_addr_sz_d">深圳市龙岗区坂田街道万科万致天地A座3218室</p></div>
<div class="bg-white rounded-2xl p-6 shadow-card border border-gray-100 reveal" style="transition-delay:0.05s"><div class="text-xs font-bold tracking-wider text-brand-blue mb-3" data-i18n="cont_addr_yw_t">义乌</div><p class="text-gray-600 text-sm leading-relaxed" data-i18n="cont_addr_yw_d">浙江省义乌市福田街道稠州北路 1399 号 8613-8615 室</p></div>
<div class="bg-white rounded-2xl p-6 shadow-card border border-gray-100 reveal" style="transition-delay:0.1s"><div class="text-xs font-bold tracking-wider text-brand-blue mb-3" data-i18n="cont_addr_ny_t">纽约</div><p class="text-gray-600 text-sm leading-relaxed" data-i18n="cont_addr_ny_d">Door 13-14, 75 Carter Dr, Edison, New Jersey 08817</p></div>
<div class="bg-white rounded-2xl p-6 shadow-card border border-gray-100 reveal" style="transition-delay:0.15s"><div class="text-xs font-bold tracking-wider text-brand-blue mb-3" data-i18n="cont_addr_la_t">洛杉矶</div><p class="text-gray-600 text-sm leading-relaxed" data-i18n="cont_addr_la_d">10767 7th Street, Rancho Cucamonga, California 91730</p></div>
</div>
<div class="grid md:grid-cols-3 gap-5">
<div class="bg-white rounded-2xl p-7 shadow-card border border-gray-100 text-center reveal">
<div class="w-14 h-14 rounded-full bg-green-50 flex items-center justify-center text-brand-green text-2xl mx-auto mb-5">
<i class="fas fa-phone-alt"></i>
</div>
<h4 class="text-lg font-bold text-gray-900 mb-2" data-i18n="cont_phone_t">联系电话</h4>
<p class="text-gray-600 text-sm leading-relaxed">0579-85875557</p>
</div>
<div class="bg-white rounded-2xl p-7 shadow-card border border-gray-100 text-center reveal" style="transition-delay: 0.05s;">
<div class="w-14 h-14 rounded-full bg-cyan-50 flex items-center justify-center text-brand-teal text-2xl mx-auto mb-5">
<i class="fas fa-envelope"></i>
</div>
<h4 class="text-lg font-bold text-gray-900 mb-2" data-i18n="cont_email_t">电子邮箱</h4>
<p class="text-gray-600 text-sm leading-relaxed break-all">contact@baiyuelogistics.com</p>
</div>
<div class="bg-white rounded-2xl p-7 shadow-card border border-gray-100 text-center reveal" style="transition-delay: 0.1s;">
<div class="w-14 h-14 rounded-full bg-indigo-50 flex items-center justify-center text-indigo-600 text-2xl mx-auto mb-5">
<i class="fas fa-clock"></i>
</div>
<h4 class="text-lg font-bold text-gray-900 mb-2" data-i18n="cont_hours_t">工作时间</h4>
<p class="text-gray-600 text-sm leading-relaxed" data-i18n="cont_hours_d">周一至周五 9:00-18:00<br>周六 9:00-12:00</p>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="py-24 gradient-bg relative overflow-hidden">
<div class="overlay-dots absolute inset-0"></div>
<div class="absolute top-0 right-0 w-96 h-96 bg-white/10 rounded-full blur-3xl"></div>
<div class="absolute bottom-0 left-0 w-80 h-80 bg-brand-green/20 rounded-full blur-3xl"></div>
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center relative z-10 reveal">
<h2 class="text-4xl lg:text-5xl font-bold text-white mb-6" data-i18n="cta_title">开启您的出海之旅</h2>
<p class="text-xl text-white/80 mb-10" data-i18n="cta_desc">立即注册,获取专属物流方案与报价,让柏悦物流成为您的跨境物流伙伴。</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<button id="ctaPrimary" onclick="openAuthModal('register')" class="btn-accent text-white font-bold px-10 py-4 rounded-full text-lg" data-i18n="cta_btn1">
免费注册账号
</button>
<button onclick="showToast(t('toast_contact'))" class="bg-white/10 backdrop-blur-sm border-2 border-white/30 text-white hover:bg-white/20 font-bold px-10 py-4 rounded-full text-lg transition-all" data-i18n="cta_btn2">
联系销售顾问
</button>
</div>
</div>
</section>
</section>
<!-- Footer -->
<footer id="siteFooter" class="bg-brand-dark text-white pt-20 pb-8">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-10 mb-16">
<div>
<div class="flex items-center mb-6">
<img src="assets/logo.png" alt="柏悦物流" style="width:161px;height:60px;object-fit:contain;">
</div>
<p class="text-white/70 leading-relaxed mb-6" data-i18n="footer_desc">专注中美跨境物流,提供海外采购、海运专线、美本土卡车、一件代发等一站式供应链服务。</p>
<div class="flex space-x-4">
<a href="#" onclick="showToast('微信公众号即将上线')" class="w-10 h-10 rounded-full bg-white/10 flex items-center justify-center hover:bg-brand-green transition-colors">
<i class="fab fa-weixin"></i>
</a>
<a href="#" onclick="showToast('官方抖音即将上线')" class="w-10 h-10 rounded-full bg-white/10 flex items-center justify-center hover:bg-brand-green transition-colors">
<i class="fab fa-tiktok"></i>
</a>
<a href="#" onclick="showToast('LinkedIn 即将上线')" class="w-10 h-10 rounded-full bg-white/10 flex items-center justify-center hover:bg-brand-green transition-colors">
<i class="fab fa-linkedin-in"></i>
</a>
</div>
</div>
<div>
<h4 class="text-lg font-bold mb-6" data-i18n="footer_services_title">服务项目</h4>
<ul class="space-y-3 text-white/70">
<li><a href="#services" onclick="navigateTo('services')" class="hover:text-brand-green transition-colors" data-i18n="svc1_title">海外采购</a></li>
<li><a href="#services" onclick="navigateTo('services')" class="hover:text-brand-green transition-colors" data-i18n="svc2_title">美本土卡车</a></li>
<li><a href="#services" onclick="navigateTo('services')" class="hover:text-brand-green transition-colors" data-i18n="svc3_title">美本土散板</a></li>
<li><a href="#business" onclick="navigateTo('business')" class="hover:text-brand-green transition-colors" data-i18n="biz1_title">海运专线</a></li>
<li><a href="#business" onclick="navigateTo('business')" class="hover:text-brand-green transition-colors" data-i18n="biz2_title">一件代发</a></li>
</ul>
</div>
<div>
<h4 class="text-lg font-bold mb-6" data-i18n="footer_about_title">关于我们</h4>
<ul class="space-y-3 text-white/70">
<li><a href="#about" onclick="navigateTo('about')" class="hover:text-brand-green transition-colors" data-i18n="footer_link_company">公司介绍</a></li>
<li><a href="#" onclick="showToast(t('toast_news'))" class="hover:text-brand-green transition-colors" data-i18n="footer_link_news">新闻中心</a></li>
<li><a href="#" onclick="showToast(t('toast_partners'))" class="hover:text-brand-green transition-colors" data-i18n="footer_link_partners">合作伙伴</a></li>
<li><a href="#" onclick="showToast(t('toast_join'))" class="hover:text-brand-green transition-colors" data-i18n="footer_link_join">加入我们</a></li>
<li><a href="#" onclick="showToast(t('toast_contact'))" class="hover:text-brand-green transition-colors" data-i18n="footer_link_contact">联系我们</a></li>
</ul>
</div>
<div>
<h4 class="text-lg font-bold mb-6" data-i18n="footer_contact_title">联系方式</h4>
<ul class="space-y-4 text-white/70">
<li class="flex items-start space-x-3">
<i class="fas fa-map-marker-alt mt-1 text-brand-green"></i>
<span>中国 · 深圳 · 义乌<br>美国 · 洛杉矶 / 纽约</span>
</li>
<li class="flex items-center space-x-3">
<i class="fas fa-phone-alt text-brand-green"></i>
<span>0579-85875557</span>
</li>
<li class="flex items-center space-x-3">
<i class="fas fa-envelope text-brand-green"></i>
<span>contact@baiyuelogistics.com</span>
</li>
<li class="flex items-start space-x-3">
<i class="fas fa-clock mt-1 text-brand-green"></i>
<span data-i18n="footer_hours">周一至周五 9:00-18:00<br>周六 9:00-12:00</span>
</li>
</ul>
</div>
</div>
<div class="border-t border-white/10 pt-8 flex flex-col md:flex-row justify-between items-center text-sm text-white/50">
<p data-i18n="footer_copyright">© 2026 柏悦物流 CHONGCHONG GLOBAL. All rights reserved.</p>
<div class="flex space-x-6 mt-4 md:mt-0">
<a href="#" onclick="showToast(t('toast_tos'))" class="hover:text-white transition-colors" data-i18n="footer_tos">服务协议</a>
<a href="#" onclick="showToast(t('toast_pp'))" class="hover:text-white transition-colors" data-i18n="footer_pp">隐私政策</a>
<a href="#" onclick="showToast(t('toast_sitemap'))" class="hover:text-white transition-colors" data-i18n="footer_sitemap">网站地图</a>
</div>
</div>
</div>
</footer>
<!-- 官网内登录 / 注册 -->
<div id="authModal" class="auth-modal" data-mode="login" role="dialog" aria-modal="true" aria-labelledby="authDialogTitle" aria-hidden="true" hidden>
<button type="button" class="auth-modal-backdrop" aria-label="关闭登录注册窗口" onclick="closeAuthModal()"></button>
<div class="auth-dialog" role="document">
<button type="button" class="auth-close" aria-label="关闭" onclick="closeAuthModal()"><i class="fas fa-xmark" aria-hidden="true"></i></button>
<div class="auth-layout">
<aside class="auth-story" aria-hidden="true">
<div>
<img src="assets/logo.png" alt="" class="auth-story-logo">
<div id="authLoginStory">
<h2 data-i18n="login_welcome">欢迎回来</h2>
<p data-i18n="login_desc">登录柏悦物流平台,实时追踪货物轨迹,管理订单与库存。</p>
</div>
<div id="authRegisterStory" hidden>
<h2 data-i18n="reg_welcome">加入我们</h2>
<p data-i18n="reg_welcome_desc">注册柏悦物流企业账号,开启高效跨境物流体验。</p>
</div>
</div>
<div id="authLoginBenefits" class="auth-benefits">
<div class="auth-benefit"><i class="fas fa-circle-check"></i><span data-i18n="login_feat1">全程可视化追踪</span></div>
<div class="auth-benefit"><i class="fas fa-circle-check"></i><span data-i18n="login_feat2">智能订单管理</span></div>
<div class="auth-benefit"><i class="fas fa-circle-check"></i><span data-i18n="login_feat3">在线询价下单</span></div>
</div>
<div id="authRegisterBenefits" class="auth-benefits" hidden>
<div class="auth-benefit"><i class="fas fa-circle-check"></i><span data-i18n="reg_feat1">新用户专属优惠</span></div>
<div class="auth-benefit"><i class="fas fa-circle-check"></i><span data-i18n="reg_feat2">免费获取物流方案</span></div>
<div class="auth-benefit"><i class="fas fa-circle-check"></i><span data-i18n="reg_feat3">专属客户经理对接</span></div>
</div>
</aside>
<div class="auth-form-side">
<section id="loginPanel" class="auth-panel">
<h2 id="authDialogTitle" data-i18n="login_title">账号登录</h2>
<p class="auth-switch-copy"><span data-i18n="login_no_account">还没有账号?</span> <button type="button" class="auth-link" onclick="switchAuthMode('register')" data-i18n="login_register_link">立即注册</button></p>
<form id="loginForm" class="auth-form">
<div class="auth-field">
<label for="loginAccount" data-i18n="login_account_label">邮箱 / 手机号</label>
<div class="auth-input-wrap"><i class="fas fa-user"></i><input id="loginAccount" class="input-field w-full px-4" type="text" name="account" required autocomplete="username" placeholder="请输入邮箱或手机号" data-i18n-ph="login_account_ph"></div>
</div>
<div class="auth-field">
<label for="loginPassword" data-i18n="login_password_label">密码</label>
<div class="auth-input-wrap"><i class="fas fa-lock"></i><input id="loginPassword" class="input-field w-full px-4 pr-12" type="password" name="password" required autocomplete="current-password" placeholder="请输入密码" data-i18n-ph="login_password_ph"><button type="button" class="toggle-password" aria-label="显示或隐藏密码"><i class="fas fa-eye"></i></button></div>
</div>
<div class="auth-row">
<label class="auth-check"><input type="checkbox" name="remember"><span data-i18n="login_remember">记住我</span></label>
<button type="button" class="auth-link" onclick="showToast(t('toast_resetpw'))" data-i18n="login_forgot">忘记密码?</button>
</div>
<button type="submit" class="auth-submit btn-primary text-white font-bold" data-i18n="login_submit">登 录</button>
</form>
<div class="auth-divider" data-i18n="login_other">其他方式登录</div>
<div class="auth-socials">
<button type="button" aria-label="微信登录" onclick="showToast('微信登录即将上线')"><i class="fab fa-weixin text-green-600 text-xl"></i></button>
<button type="button" aria-label="企业微信登录" onclick="showToast('企业微信登录即将上线')"><i class="fas fa-briefcase text-blue-600"></i></button>
</div>
</section>
<section id="registerPanel" class="auth-panel" hidden>
<h2 id="registerDialogTitle" data-i18n="reg_title">企业注册</h2>
<p class="auth-switch-copy"><span data-i18n="reg_have_account">已有账号?</span> <button type="button" class="auth-link" onclick="switchAuthMode('login')" data-i18n="reg_login_link">立即登录</button></p>
<form id="registerForm" class="auth-form">
<div class="auth-field-grid">
<div class="auth-field"><label for="registerCompany" data-i18n="reg_company_label">企业名称</label><input id="registerCompany" class="input-field w-full px-4" type="text" name="company" required autocomplete="organization" placeholder="请输入企业名称" data-i18n-ph="reg_company_ph"></div>
<div class="auth-field"><label for="registerContact" data-i18n="reg_contact_label">联系人</label><input id="registerContact" class="input-field w-full px-4" type="text" name="contact" required autocomplete="name" placeholder="请输入联系人姓名" data-i18n-ph="reg_contact_ph"></div>
</div>
<div class="auth-field"><label for="registerEmail" data-i18n="reg_email_label">邮箱</label><div class="auth-input-wrap"><i class="fas fa-envelope"></i><input id="registerEmail" class="input-field w-full px-4" type="email" name="email" required autocomplete="email" placeholder="请输入企业邮箱" data-i18n-ph="reg_email_ph"></div></div>
<div class="auth-field"><label for="registerPhone" data-i18n="reg_phone_label">手机号</label><div class="auth-input-wrap"><i class="fas fa-phone"></i><input id="registerPhone" class="input-field w-full px-4" type="tel" name="phone" required autocomplete="tel" placeholder="请输入手机号" data-i18n-ph="reg_phone_ph"></div></div>
<div class="auth-field"><label for="registerPassword" data-i18n="reg_password_label">密码</label><div class="auth-input-wrap"><i class="fas fa-lock"></i><input id="registerPassword" class="input-field w-full px-4 pr-12" type="password" name="password" required minlength="8" maxlength="20" autocomplete="new-password" placeholder="请设置8-20位密码" data-i18n-ph="reg_password_ph"><button type="button" class="toggle-password" aria-label="显示或隐藏密码"><i class="fas fa-eye"></i></button></div></div>
<label class="auth-check" for="registerAgree"><input id="registerAgree" type="checkbox" required><span><span data-i18n="reg_agree">我已阅读并同意</span> <button type="button" class="auth-link" onclick="showToast(t('toast_tos'))" data-i18n="reg_agree_tos">《用户服务协议》</button> 和 <button type="button" class="auth-link" onclick="showToast(t('toast_pp'))" data-i18n="reg_agree_pp">《隐私政策》</button></span></label>
<button type="submit" class="auth-submit btn-accent text-white font-bold" data-i18n="reg_submit">立即注册</button>
</form>
</section>
</div>
</div>
</div>
</div>
<!-- Toast 提示 -->
<div id="toast" class="fixed top-24 left-1/2 -translate-x-1/2 z-[60] opacity-0 pointer-events-none transition-all duration-300 transform -translate-y-4">
<div class="bg-gray-900 text-white px-6 py-3 rounded-full shadow-2xl flex items-center space-x-2">
<i class="fas fa-info-circle text-brand-green"></i>
<span id="toastMessage">提示信息</span>
</div>
</div>
<script>
// 登录态(前端演示,刷新后重置)
let isLoggedIn = false;
// 首页五大核心业务轮播
let coreSlideIndex = 0;
let coreSlideTimer = null;
const coreBusinessSlugs = ['ocean', 'fulfillment', 'procurement', 'trucking', 'pallet'];
function showCoreSlide(index, restart = true) {
const slides = document.querySelectorAll('.core-slide');
const copies = document.querySelectorAll('.core-copy-slide');
const tabs = document.querySelectorAll('[data-core-tab]');
if (!slides.length) return;
coreSlideIndex = (index + slides.length) % slides.length;
slides.forEach((slide, i) => slide.classList.toggle('active', i === coreSlideIndex));
copies.forEach((copy, i) => copy.classList.toggle('hidden', i !== coreSlideIndex));
tabs.forEach((tab, i) => {
tab.classList.remove('active');
if (i === coreSlideIndex) {
void tab.offsetWidth;
tab.classList.add('active');
const tabList = tab.parentElement;
if (tabList && tabList.scrollWidth > tabList.clientWidth) {
tabList.scrollTo({ left: tab.offsetLeft - (tabList.clientWidth - tab.clientWidth) / 2, behavior: 'smooth' });
}
}
});
const detailBtn = document.getElementById('coreDetailBtn');
if (detailBtn) detailBtn.onclick = () => navigateBusinessDetail(coreBusinessSlugs[coreSlideIndex]);
if (restart) startCoreCarousel();
}
function changeCoreSlide(step) { showCoreSlide(coreSlideIndex + step); }
function startCoreCarousel() {
clearInterval(coreSlideTimer);
coreSlideTimer = setInterval(() => showCoreSlide(coreSlideIndex + 1, false), 5000);
}
document.querySelectorAll('[data-core-tab]').forEach(tab => {
tab.addEventListener('click', () => {
const index = Number(tab.dataset.coreTab);
showCoreSlide(index);
navigateBusinessDetail(coreBusinessSlugs[index]);
});
});
const coreHero = document.querySelector('.core-hero');
if (coreHero) {
coreHero.addEventListener('mouseenter', () => clearInterval(coreSlideTimer));
coreHero.addEventListener('mouseleave', startCoreCarousel);
}
startCoreCarousel();
const businessDetails = {
ocean: {
name:'海运专线',eyebrow:'Ocean Freight',bg:"url('assets/core-ocean.jpg')",
desc:'连接中国主要港口与美国核心仓网,提供整柜、拼箱、美森快船与盐田普船等稳定的中美海运产品。',
intro:'从国内收货、装柜和出口报关,到美国目的港清关、海外仓入库及 FBA 派送,柏悦物流统一协调全链路节点,让货物按计划抵达销售仓。',
badges:[['fa-ship','每周固定船期'],['fa-file-shield','双清合规'],['fa-route','全程可追踪']],
features:[['fa-boxes-stacked','整柜与拼箱','按货量灵活选择 FCL、LCL,支持多票集货与统一出运。'],['fa-calendar-check','稳定船期','核心航线固定班期,提前锁定舱位,方便销售与库存计划。'],['fa-file-contract','清关协同','中美两端资料预审与申报协同,减少查验和滞港风险。'],['fa-warehouse','仓配衔接','到港后可接海外仓、FBA 预约及后续派送服务。']],
simple:[['fa-box-open','国内交货','货物送至集货仓'],['fa-cubes','装柜报关','装柜并完成出口申报'],['fa-ship','海运运输','按船期跨洋运输'],['fa-passport','美国清关','目的港清关提柜'],['fa-warehouse','海外仓入库','清点、上架、备货'],['fa-boxes-packing','FBA派送','预约送仓并签收']],
detail:[['01','需求建单','确认货量、品名、目的仓和船期,建立运输委托。'],['02','国内收货','核对件数、唛头与包装,测量体积重量并完成入仓。'],['03','配载装柜','多票货物按目的地配载,装柜加固并拍照留档。'],['04','出口报关','准备合同、发票、装箱单等资料,完成出口申报。'],['05','国际海运','船舶按计划离港,系统同步开船、到港及异常节点。'],['06','目的港清关','提交进口清关资料,完成税费处理与放行。'],['07','海外仓入库','提柜送仓,完成卸货、清点、上架和库存同步。'],['08','FBA派送','预约 FBA 入仓,安排尾程派送并回传签收凭证。']]
},
fulfillment: {
name:'一件代发',eyebrow:'Order Fulfillment',bg:"url('assets/core-fulfillment.jpg')",
desc:'以美国本土仓为履约中心,连接 Amazon、Walmart、独立站等销售渠道,订单产生后按件拣货、打包并快速发出。',
intro:'适合跨境电商卖家和多渠道品牌,将库存前置到美国仓库,由系统自动接单、分配库存和生成面单,提升订单履约速度。',
badges:[['fa-plug','多平台接入'],['fa-bolt','24小时出库'],['fa-chart-line','库存可视化']],
features:[['fa-arrows-to-circle','订单自动同步','对接主流平台与独立站,减少人工录单和漏单。'],['fa-barcode','精准拣货','按 SKU、库位和批次拣货,支持复核与称重。'],['fa-box','灵活包装','按渠道和商品要求完成装箱、贴标及合单。'],['fa-truck-fast','快速派送','自动匹配 USPS、UPS、FedEx 等渠道,回传轨迹。']],
simple:[['fa-warehouse','库存入仓','商品入库并上架'],['fa-cart-shopping','订单同步','平台订单进入系统'],['fa-hand-holding-box','拣货打包','按单拣货、复核、包装'],['fa-truck-fast','本土派送','匹配渠道并出库'],['fa-house','客户签收','回传轨迹与签收']],
detail:[['01','商品建档','维护 SKU、条码、包装和渠道规则,绑定货主库存。'],['02','头程入仓','货物抵达美国仓,完成收货、质检、上架和库位分配。'],['03','订单接入','API 或平台插件同步订单,校验地址、库存和风控规则。'],['04','订单审核','识别异常订单,合并拆分规则确认后进入履约队列。'],['05','波次拣货','按仓库、承运商和截单时间生成波次,拣货员扫码作业。'],['06','复核包装','复核 SKU 与数量,称重、打印面单并完成包装。'],['07','出库交接','与快递或卡车承运商交接,系统记录出库时间。'],['08','轨迹售后','同步跟踪号和签收状态,支持退件、换标与补发。']]
},
procurement: {
name:'海外采购',eyebrow:'Overseas Procurement',bg:"url('assets/core-procurement.jpg')",
desc:'从供应商寻源到质检集货,提供可控、透明的一站式采购执行服务,帮助品牌稳定获得海外商品与资源。',
intro:'柏悦物流协助客户完成供应商筛选、询价比价、样品确认、批量采购、质检和入仓,适用于电商备货、渠道采购及海外仓补货。',
badges:[['fa-magnifying-glass','供应商寻源'],['fa-clipboard-check','质检验货'],['fa-layer-group','集货发运']],
features:[['fa-address-book','供应商筛选','依据品类、资质、产能和交期建立供应商候选池。'],['fa-tags','询价比价','统一询价口径,比较采购价、交期和贸易条件。'],['fa-clipboard-check','质量把关','按确认样品和检验标准进行抽检并反馈结果。'],['fa-boxes-stacked','集中发运','多供应商货物集中到仓,合并包装后统一发运。']],
simple:[['fa-lightbulb','提出需求','确认品类与采购标准'],['fa-magnifying-glass','供应商寻源','筛选供应商并询价'],['fa-file-signature','下单采购','确认样品、价格和交期'],['fa-clipboard-check','验货质检','按标准抽检并反馈'],['fa-warehouse','集货入仓','集中收货、合包并发运']],
detail:[['01','需求确认','确认 SKU、数量、规格、目标成本和交期要求。'],['02','供应商寻源','筛选供应商并核验营业资质、产能和历史履约。'],['03','询价比价','获取阶梯价格与交期,输出采购建议和成本明细。'],['04','样品确认','寄送样品,确认材质、功能、包装和合规标签。'],['05','批量下单','签订采购订单,跟进排产、付款和交付节点。'],['06','到货验货','核对数量和外观,按抽检标准记录质量结果。'],['07','集货处理','多批货物集中入仓,完成合包、贴标和资料归档。'],['08','统一发运','根据销售计划安排海运、空运或海外仓补货。']]
},
trucking: {
name:'美本土卡车',eyebrow:'US Domestic Trucking',bg:"url('assets/core-trucking.jpg')",
desc:'覆盖美国主要区域的 FTL、LTL 与超大件运输网络,支持港口、海外仓、FBA 及客户地址之间的预约派送。',
intro:'从运输需求确认、车型与承运商匹配,到提货、在途跟踪、预约送货和签收回单,提供端到端的本土卡车管理。',
badges:[['fa-map-location-dot','全美网络'],['fa-truck','FTL / LTL'],['fa-location-crosshairs','GPS追踪']],
features:[['fa-route','线路规划','结合货量、时效和地址规划最优运输线路。'],['fa-truck-front','车型匹配','覆盖整车、零担、尾板和超大件等车型。'],['fa-calendar-days','预约派送','提前与仓库或收货方预约窗口,降低等待成本。'],['fa-file-signature','签收回单','留存 POD、照片和异常记录,方便对账追责。']],
simple:[['fa-file-circle-plus','提交需求','确认货量、地址和时效'],['fa-truck-front','匹配车辆','选择 FTL / LTL 车型'],['fa-box-open','提货装运','司机提货并核验货物'],['fa-location-dot','在途运输','GPS跟踪运输状态'],['fa-pen-to-square','预约签收','送达并回传POD']],
detail:[['01','运输建单','录入提货地、送货地、货物尺寸重量和预约窗口。'],['02','询价派车','根据线路和车型询价,确认承运商与报价。'],['03','预约提货','向发货仓预约提货时间,司机到场核对件数。'],['04','装车交接','检查托盘、唛头和封签,拍照完成交接。'],['05','在途跟踪','同步 GPS、里程和预计到达时间,异常主动预警。'],['06','目的地预约','与海外仓、FBA 或客户确认卸货时间。'],['07','现场交付','完成卸货、签收和异常备注,取得 POD。'],['08','费用结算','核对里程、附加费和等待费,完成承运商对账。']]
},
pallet: {
name:'美本土散板',eyebrow:'US Pallet Breakbulk',bg:"url('assets/core-pallet.jpg')",
desc:'面向托盘货物提供美国本土拆板、分拣、重组和多地址派送服务,适配 B2B 补货与多渠道订单。',
intro:'货物到达美国仓后,按 SKU、客户和目的地拆分托盘,重新组板、贴标并安排尾程派送,减少整板直发的限制。',
badges:[['fa-pallet','托盘作业'],['fa-arrows-split-up-and-left','拆分分拣'],['fa-share-nodes','多点配送']],
features:[['fa-boxes-stacked','拆板清点','按托盘和箱号拆分,清点数量并记录破损。'],['fa-filter','精细分拣','根据客户、SKU、渠道和目的地进行分拣。'],['fa-layer-group','重新组板','按照承运和收货要求重组托盘并加固。'],['fa-truck-ramp-box','多点派送','支持多个仓库、门店和客户地址分批配送。']],
simple:[['fa-pallet','托盘到仓','托盘货物入仓'],['fa-boxes-stacked','拆板清点','拆分并核对箱数'],['fa-filter','分拣组板','按目的地重新组板'],['fa-tags','贴标复核','打印标签并复核'],['fa-truck','分批派送','多地址预约交付']],
detail:[['01','托盘预报','登记托盘数量、尺寸、重量和预计到仓时间。'],['02','到仓收货','检查托盘外观、封签和箱数,登记收货差异。'],['03','拆板作业','按客户和 SKU 拆分托盘,扫描箱号并更新库存。'],['04','分区暂存','将货物放入对应作业区,标记目的地和作业批次。'],['05','订单分拣','根据派送订单拣选箱件,复核数量和包装状态。'],['06','重新组板','按承运商和收货要求组板、缠膜、加固并称重。'],['07','标签复核','打印运输标签和箱唛,校验地址、件数和渠道。'],['08','多点派送','安排卡车或快递分批派送,回传签收与异常凭证。']]
}
};
let activeBusinessSlug = 'ocean';
function renderBusinessDetail(slug) {
const data = businessDetails[slug] || businessDetails.ocean;
activeBusinessSlug = businessDetails[slug] ? slug : 'ocean';
const setText = (id,value) => { const el=document.getElementById(id); if(el)el.textContent=value; };
setText('bdBreadcrumbName',data.name); setText('bdEyebrow',data.eyebrow); setText('bdTitle',data.name); setText('bdDesc',data.desc); setText('bdIntro',data.intro); setText('bdFlowTitle',data.name+'流程图');
const hero=document.getElementById('bdHero'); if(hero)hero.style.setProperty('--bd-bg',data.bg);
const badges=document.getElementById('bdBadges'); if(badges)badges.innerHTML=data.badges.map(item=>`<span class="bd-badge"><i class="fas ${item[0]}"></i>${item[1]}</span>`).join('');
const features=document.getElementById('bdFeatures'); if(features)features.innerHTML=data.features.map(item=>`<article class="bd-feature-card"><div class="bd-feature-icon"><i class="fas ${item[0]}"></i></div><h3>${item[1]}</h3><p>${item[2]}</p></article>`).join('');
const simple=document.getElementById('bdSimpleFlow'); if(simple){simple.style.gridTemplateColumns=`repeat(${data.simple.length},minmax(120px,1fr))`;simple.innerHTML=data.simple.map(item=>`<div class="bd-simple-step"><div class="bd-simple-icon"><i class="fas ${item[0]}"></i></div><strong>${item[1]}</strong><span>${item[2]}</span></div>`).join('');}
const detail=document.getElementById('bdDetailFlow'); if(detail)detail.innerHTML=data.detail.map(item=>`<article class="bd-detail-step"><span class="bd-detail-no">${item[0]}</span><h4>${item[1]}</h4><p>${item[2]}</p></article>`).join('');
const other=document.getElementById('bdOtherBusiness'); if(other)other.innerHTML=Object.entries(businessDetails).map(([key,item],i)=>`<button class="bd-other-card ${key===activeBusinessSlug?'active':''}" onclick="navigateBusinessDetail('${key}')"><span>0${i+1} / BUSINESS</span><strong>${item.name}</strong></button>`).join('');
switchBusinessFlow('simple');
}
function switchBusinessFlow(view,button) {
document.querySelectorAll('[data-flow-view]').forEach(x=>x.classList.toggle('active',x.dataset.flowView===view));
const simple=document.getElementById('bdSimplePanel'),detail=document.getElementById('bdDetailPanel');
if(simple)simple.classList.toggle('active',view==='simple'); if(detail)detail.classList.toggle('active',view==='detail');
}
function navigateBusinessDetail(slug,syncHistory=true) {
renderBusinessDetail(slug);
navigateTo('business-detail',null,false);
updateRouteNav('business');
if(syncHistory)history.pushState({page:'business-detail',slug:activeBusinessSlug},'',window.location.pathname+window.location.search+'#business/'+activeBusinessSlug);
}
function updateRouteNav(page) {
const routeKeys = { home:'nav_home', services:'nav_services', process:'nav_process', business:'nav_business', about:'nav_about', contact:'nav_contact' };
document.querySelectorAll('[data-i18n^="nav_"]').forEach(link => {
link.classList.toggle('route-active', link.getAttribute('data-i18n') === routeKeys[page]);
});
}
// 阻止导航链接的原生锚点跳转,避免进入二级页后落到中间内容区
const routeAnchorHashes = new Set(['#', '#home', '#services', '#process', '#business', '#about', '#contact']);
document.addEventListener('click', event => {
const anchor = event.target.closest('a[href]');
if (anchor && routeAnchorHashes.has(anchor.getAttribute('href'))) event.preventDefault();
}, true);
// 路由导航
function navigateTo(page, sectionId = null, syncHistory = true) {
if (page === 'home') startCoreCarousel(); else clearInterval(coreSlideTimer);
// 隐藏所有页面
document.querySelectorAll('.route-section').forEach(section => {
section.classList.remove('active');
});
// 显示目标页面
const targetMap = {
'home': 'homeSection',
'services': 'servicesSection',
'process': 'processSection',
'business': 'businessSection',
'business-detail': 'businessDetailSection',
'about': 'aboutSection',
'contact': 'contactSection',
};
const targetId = targetMap[page];
if (targetId) {
document.getElementById(targetId).classList.add('active');
}
if (syncHistory && targetId) {
const nextHash = page === 'home' ? '' : '#' + page;
if (window.location.hash !== nextHash) {
history.pushState({ page }, '', window.location.pathname + window.location.search + nextHash);
}
}
// 滚动到顶部
window.scrollTo(0, 0);
if (document.activeElement && typeof document.activeElement.blur === 'function') document.activeElement.blur();
requestAnimationFrame(() => requestAnimationFrame(() => window.scrollTo({ top: 0, left: 0, behavior: 'auto' })));
// 如果指定了 section,滚动到对应位置
if (page === 'home' && sectionId) {
setTimeout(() => {
const element = document.getElementById(sectionId);
if (element) {
const navHeight = 80;
const elementPosition = element.getBoundingClientRect().top;
const offsetPosition = elementPosition + window.pageYOffset - navHeight;
window.scrollTo({ top: offsetPosition, behavior: 'smooth' });
}
}, 100);
}
setTimeout(reveal, 80);
updateRouteNav(page);
// 更新导航栏样式
updateNavbarStyle(page === 'home');
}
function restoreRouteFromUrl() {
const hash = window.location.hash.replace('#', '') || 'home';
if(hash.indexOf('business/')===0){ navigateBusinessDetail(hash.split('/')[1],false); return; }
const validPages = ['home', 'services', 'process', 'business', 'about', 'contact'];
navigateTo(validPages.includes(hash) ? hash : 'home', null, false);
}
window.addEventListener('popstate', restoreRouteFromUrl);
// 导航栏滚动效果
function updateNavbarStyle(isHome = true) {
const navbar = document.getElementById('navbar');
if (window.scrollY > 50 || !isHome) {
navbar.classList.add('nav-scrolled');
} else {
navbar.classList.remove('nav-scrolled');
}
}
window.addEventListener('scroll', () => {
const homeActive = document.getElementById('homeSection').classList.contains('active');
updateNavbarStyle(homeActive);
});
// 移动端菜单
const mobileMenu = document.getElementById('mobileMenu');
const mobileOverlay = document.getElementById('mobileOverlay');
const mobileMenuBtn = document.getElementById('mobileMenuBtn');
const closeMobileMenuBtn = document.getElementById('closeMobileMenu');
function openMobileMenu() {
mobileMenu.classList.add('open');
mobileOverlay.classList.remove('hidden');
document.body.style.overflow = 'hidden';
}
function closeMobileMenu() {
mobileMenu.classList.remove('open');
mobileOverlay.classList.add('hidden');
document.body.style.overflow = '';
}
mobileMenuBtn.addEventListener('click', openMobileMenu);
closeMobileMenuBtn.addEventListener('click', closeMobileMenu);
mobileOverlay.addEventListener('click', closeMobileMenu);
// 滚动显示动画
function reveal() {
const reveals = document.querySelectorAll('.reveal');
reveals.forEach(element => {
const windowHeight = window.innerHeight;
const elementTop = element.getBoundingClientRect().top;
const elementVisible = 100;
if (elementTop < windowHeight - elementVisible) {
element.classList.add('active');
}
});
}
window.addEventListener('scroll', reveal);
window.addEventListener('load', reveal);
// 密码显示切换
document.querySelectorAll('.toggle-password').forEach(button => {
button.addEventListener('click', function() {
const input = this.previousElementSibling;
const icon = this.querySelector('i');
if (input.type === 'password') {
input.type = 'text';
icon.classList.remove('fa-eye');
icon.classList.add('fa-eye-slash');
} else {
input.type = 'password';
icon.classList.remove('fa-eye-slash');
icon.classList.add('fa-eye');
}
});
});
let authReturnFocus = null;
function switchAuthMode(mode) {
const normalizedMode = mode === 'register' ? 'register' : 'login';
const modal = document.getElementById('authModal');
const isRegister = normalizedMode === 'register';
modal.dataset.mode = normalizedMode;
document.getElementById('loginPanel').hidden = isRegister;
document.getElementById('registerPanel').hidden = !isRegister;
document.getElementById('authLoginStory').hidden = isRegister;
document.getElementById('authRegisterStory').hidden = !isRegister;
document.getElementById('authLoginBenefits').hidden = isRegister;
document.getElementById('authRegisterBenefits').hidden = !isRegister;
modal.setAttribute('aria-labelledby', isRegister ? 'registerDialogTitle' : 'authDialogTitle');
requestAnimationFrame(() => {
const firstField = document.querySelector(isRegister ? '#registerForm input' : '#loginForm input');
if (firstField) firstField.focus();
});
}
function openAuthModal(mode) {
const modal = document.getElementById('authModal');
authReturnFocus = document.activeElement;
modal.hidden = false;
modal.setAttribute('aria-hidden', 'false');
document.body.classList.add('auth-modal-open');
switchAuthMode(mode);
}
function closeAuthModal() {
const modal = document.getElementById('authModal');
if (modal.hidden) return;
modal.hidden = true;
modal.setAttribute('aria-hidden', 'true');
document.body.classList.remove('auth-modal-open');
if (authReturnFocus && typeof authReturnFocus.focus === 'function') authReturnFocus.focus();
}
document.getElementById('authModal').addEventListener('keydown', function(event) {
if (event.key === 'Escape') { closeAuthModal(); return; }
if (event.key !== 'Tab') return;
const focusable = [...this.querySelectorAll('button:not([hidden]), input:not([hidden])')]
.filter(element => !element.closest('[hidden]') && !element.disabled && element.offsetParent !== null);
if (!focusable.length) return;
const first = focusable[0];
const last = focusable[focusable.length - 1];
if (event.shiftKey && document.activeElement === first) { event.preventDefault(); last.focus(); }
else if (!event.shiftKey && document.activeElement === last) { event.preventDefault(); first.focus(); }
});
document.getElementById('loginForm').addEventListener('submit', function(event) {
event.preventDefault();
isLoggedIn = true;
updateAuthUI();
closeAuthModal();
showToast(t('toast_login_ok'));
setTimeout(() => { window.location.href = 'workbench.html'; }, 700);
});
document.getElementById('registerForm').addEventListener('submit', function(event) {
event.preventDefault();
isLoggedIn = true;
updateAuthUI();
closeAuthModal();
showToast(t('toast_register_ok'));
setTimeout(() => { window.location.href = 'workbench.html'; }, 700);
});
// 退出登录
function doLogout() {
isLoggedIn = false;
updateAuthUI();
showToast(t('toast_logout'));
setTimeout(() => navigateTo('home'), 700);
}
function updateAuthUI() {
const out = document.getElementById('navAuthOut');
const inside = document.getElementById('navAuthIn');
const outMobile = document.getElementById('navAuthOutMobile');
const insideMobile = document.getElementById('navAuthInMobile');
if (out) out.classList.toggle('hidden', isLoggedIn);
if (inside) inside.classList.toggle('hidden', !isLoggedIn);
if (outMobile) outMobile.classList.toggle('hidden', isLoggedIn);
if (insideMobile) insideMobile.classList.toggle('hidden', !isLoggedIn);
}
// ====== 多语言 i18n ======
const i18n = {
zh: {
nav_home: "首页",
nav_services: "服务",
nav_process: "流程",
nav_business: "业务",
nav_about: "关于",
nav_login: "登录",
nav_register: "免费注册",
nav_dashboard: "工作台",
dash_logout: "退出登录",
lang_zh: "中文",
lang_en: "English",
lang_es: "Español",
hero_badge: "跨境物流一站式解决方案",
hero_title1: "让世界贸易",
hero_title2: "更简单高效",
hero_desc: "柏悦物流专注中美跨境物流,提供海外采购、美本土卡车、美本土散板、海运专线、一件代发等全链路服务,助力中国品牌出海无忧。",
core_kicker: "五大核心业务",
core_detail: "查看业务详情",
hero_cta1: "立即体验",
hero_cta2: "了解服务",
stat_cities: "覆盖城市",
stat_ontime: "准时率",
stat_customs: "清关响应",
stat_clients: "服务客户",
svc_eyebrow: "Core Services",
svc_title: "专业服务,覆盖跨境全链路",
svc_subtitle: "依托美国本土优势资源与全球化网络,为企业提供稳定、高效、可追踪的跨境物流服务。",
svc1_title: "海外采购",
svc1_desc: "提供海外供应商对接、采购执行、验货质检、集中采购等一体化服务,降低采购成本,提升供应链效率。",
svc1_li1: "供应商筛选与资质审核",
svc1_li2: "样品确认与批量采购",
svc1_li3: "质量检验与合规把关",
svc1_li4: "集货仓储与统一发货",
svc2_title: "美本土卡车",
svc2_desc: "覆盖美国全境的卡车运输网络,提供 FTL 整车、LTL 零担、超大件派送等灵活解决方案。",
svc2_li1: "全美 FTL/LTL 运输",
svc2_li2: "超大件及特种车辆",
svc2_li3: "实时 GPS 轨迹追踪",
svc2_li4: "预约送货与签收确认",
svc3_title: "美本土散板",
svc3_desc: "针对托盘货物提供美国本土拆板、分拣、再派服务,适配电商退货、B2B 补货、多渠道配送场景。",
svc3_li1: "托盘拆板与重新组板",
svc3_li2: "多地址分拣派送",
svc3_li3: "退货逆向物流",
svc3_li4: "仓储与库存管理",
proc_eyebrow: "Service Process",
proc_title: "标准化服务流程",
proc_subtitle: "从上门取件到签收入库,每个环节都严格把控,确保货物安全、准时送达。",
proc1_title: "上门取件",
proc1_desc: "专业团队按约定时间上门提货,核对货物信息,提供标准化包装建议。",
proc2_title: "入仓清关",
proc2_desc: "货物入仓后由专业报关团队处理清关资料,提前预审,确保快速通关。",
proc3_title: "国际运输",
proc3_desc: "海运专线稳定发运,全程轨迹可追踪,异常情况主动预警及时响应。",
proc4_title: "签收入库",
proc4_desc: "目的地仓库签收核验,系统同步入库状态,支持一键转代发或派送。",
biz_eyebrow: "Business Lines",
biz_title: "核心业务的深度布局",
biz_subtitle: "海运专线与一件代发双轮驱动,满足不同规模企业的出海需求。",
biz1_title: "海运专线",
biz1_desc: "中美海运专线,提供整柜(FCL)、拼箱(LCL)、美森快船、盐田普船等多元化海运产品,舱位稳定,价格透明。",
biz1_li1: "每周固定船期,舱位保障",
biz1_li2: "双清包税,门到门服务",
biz1_li3: "全程可视化追踪系统",
biz2_title: "一件代发",
biz2_desc: "美国本土仓储 + 订单履约,支持 Amazon、Walmart、独立站等多平台订单的一件代发,助力卖家降本增效。",
biz2_li1: "多平台 API 对接",
biz2_li2: "智能库存与订单管理",
biz2_li3: "24h 出库,快速妥投",
about_eyebrow: "Why Choose Us",
about_title: "为什么选择柏悦物流",
about_desc: "我们不只是物流服务商,更是企业出海的合作伙伴。凭借专业的团队、成熟的网络与数字化系统,为客户提供端到端的供应链保障。",
feat1_title: "全球化网络",
feat1_desc: "覆盖中美主要口岸与城市,自建与合作仓库遍布美国东西海岸。",
feat2_title: "数字化系统",
feat2_desc: "自研物流管理系统,订单、轨迹、库存、结算一站式在线管理。",
feat3_title: "专属客服",
feat3_desc: "中美两地客服团队,7×24 小时响应,异常情况第一时间处理。",
feat4_title: "合规保障",
feat4_desc: "专业清关团队,熟悉中美贸易法规,确保货物合规高效通关。",
about_stat_label: "平均物流成本降低",
cta_title: "开启您的出海之旅",
cta_desc: "立即注册,获取专属物流方案与报价,让柏悦物流成为您的跨境物流伙伴。",
cta_btn1: "免费注册账号",
cta_btn2: "联系销售顾问",
login_welcome: "欢迎回来",
login_desc: "登录柏悦物流平台,实时追踪货物轨迹,管理订单与库存。",
login_feat1: "全程可视化追踪",
login_feat2: "智能订单管理",
login_feat3: "在线询价下单",
login_title: "账号登录",
login_no_account: "还没有账号?",
login_register_link: "立即注册",
login_account_label: "邮箱 / 手机号",
login_account_ph: "请输入邮箱或手机号",
login_password_label: "密码",
login_password_ph: "请输入密码",
login_remember: "记住我",
login_forgot: "忘记密码?",
login_submit: "登 录",
login_other: "其他方式登录",
reg_welcome: "加入我们",
reg_welcome_desc: "注册柏悦物流企业账号,开启高效跨境物流体验。",
reg_feat1: "新用户专属优惠",
reg_feat2: "免费获取物流方案",
reg_feat3: "专属客户经理对接",
reg_title: "企业注册",
reg_have_account: "已有账号?",
reg_login_link: "立即登录",
reg_company_label: "企业名称",
reg_company_ph: "请输入企业名称",
reg_contact_label: "联系人",
reg_contact_ph: "请输入联系人姓名",
reg_email_label: "邮箱",
reg_email_ph: "请输入企业邮箱",
reg_phone_label: "手机号",
reg_phone_ph: "请输入手机号",
reg_password_label: "密码",
reg_password_ph: "请设置8-20位密码",
reg_agree: "我已阅读并同意",
reg_agree_tos: "《用户服务协议》",
reg_agree_pp: "《隐私政策》",
reg_submit: "立即注册",
footer_desc: "专注中美跨境物流,提供海外采购、海运专线、美本土卡车、一件代发等一站式供应链服务。",
footer_services_title: "服务项目",
footer_about_title: "关于我们",
footer_link_company: "公司介绍",
footer_link_news: "新闻中心",
footer_link_partners: "合作伙伴",
footer_link_join: "加入我们",
footer_link_contact: "联系我们",
footer_contact_title: "联系方式",
footer_hours: "周一至周五 9:00-18:00<br>周六 9:00-12:00",
nav_contact: "联系",
adv_eyebrow: "Our Advantages",
adv_title: "六大企业优势",
adv_subtitle: "深耕中美跨境物流多年,以专业能力与本土资源为客户构筑稳定可靠的供应链保障。",
adv1_title: "专业团队",
adv1_desc: "10 年以上跨境物流经验的核心团队,熟悉各国海关政策与操作流程。",
adv2_title: "自营海外仓",
adv2_desc: "美国自营海外仓,提供仓储、分拣、包装、退件处理等全方位服务。",
adv3_title: "双清包税",
adv3_desc: "专业报关清关服务,包税渠道,通关高效,让您省心省力。",
adv4_title: "全程可视化",
adv4_desc: "GPS 实时定位,订单全流程跟踪,随时掌握货物状态。",
adv5_title: "保险服务",
adv5_desc: "完善的货物保险服务,全方位保障货物安全,降低运输风险。",
adv6_title: "一站式服务",
adv6_desc: "从揽件到签收,提供完整的物流解决方案,无需对接多个服务商。",
cul_eyebrow: "Corporate Culture",
cul_title: "关于我们与企业文化",
cul_subtitle: "以心传递,畅达天下——用专业与责任连接中美贸易的每一段旅程。",
cul_profile_title: "公司简介",
cul_profile_desc1: "我们是一家专业从事中美海运专线、中美空运专线、海外仓储服务的跨境物流公司,深耕美国、加拿大市场,主营海运、空运、铁运等跨境专线业务。",
cul_profile_desc2: "建立了以美森快船、OA 联盟电商快船及中美空运为主导的 FBA 美国全程运输渠道。在美国拥有自营海外仓,加拿大有合作海外仓,配备专业报关清关团队、双清派送到门服务与完善的保险服务,为跨境电商客户提供多样化的一站式解决方案。",
cul_vision_t: "企业愿景",
cul_vision_d: "成为跨境物流行业值得信赖的优选服务平台。",
cul_mission_t: "企业使命",
cul_mission_d: "为顾客提供卓越的跨境物流服务,助力中国产品速达全球。",
cul_values_t: "核心价值观",
cul_values_d: "诚信 · 务实 · 谦卑 · 感恩",
cul_slogan_t: "我们的口号",
cul_slogan_d: "客户价值 · 服务至上 · 精益求精 · 追求卓越 · 共创共赢",
cont_eyebrow: "Contact Us",
cont_title: "联系我们",
cont_subtitle: "随时欢迎咨询,我们的专业团队将为您提供跨境物流解决方案与报价。",
cont_addr_t: "公司地址",
cont_addr_la_t: "洛杉矶",
cont_addr_la_d: "10767 7th Street, Rancho Cucamonga, California 91730",
cont_addr_ny_t: "纽约",
cont_addr_ny_d: "Door 13-14, 75 Carter Dr, Edison, New Jersey 08817",
cont_addr_yw_t: "义乌",
cont_addr_yw_d: "浙江省义乌市福田街道稠州北路 1399 号 8613-8615 室",
cont_addr_sz_t: "深圳",
cont_addr_sz_d: "深圳市龙岗区坂田街道万科万致天地A座3218室",
cont_phone_t: "联系电话",
cont_email_t: "电子邮箱",
cont_hours_t: "工作时间",
cont_hours_d: "周一至周五 9:00-18:00<br>周六 9:00-12:00",
footer_copyright: "© 2026 柏悦物流 CHONGCHONG GLOBAL. 版权所有。",
footer_tos: "服务协议",
footer_pp: "隐私政策",
footer_sitemap: "网站地图",
toast_tos: "服务协议即将上线",
toast_pp: "隐私政策即将上线",
toast_news: "新闻中心即将上线",
toast_partners: "合作伙伴即将上线",
toast_join: "加入我们即将上线",
toast_contact: "客服咨询功能即将上线",
toast_resetpw: "请联系客服重置密码",
toast_sitemap: "网站地图即将上线",
toast_login_ok: "登录成功!欢迎回来",
toast_register_ok: "注册成功!欢迎加入柏悦物流",
toast_logout: "已退出登录"
},
en: {
nav_home: "Home",
nav_services: "Services",
nav_process: "Process",
nav_business: "Business",
nav_about: "About",
nav_login: "Login",
nav_register: "Sign Up Free",
nav_dashboard: "Workspace",
dash_logout: "Log Out",
lang_zh: "Chinese",
lang_en: "English",
lang_es: "Spanish",
hero_badge: "One-Stop Cross-Border Logistics",
hero_title1: "Make Global Trade",
hero_title2: "Simpler & More Efficient",
hero_desc: "Chongchong Global specializes in China-US cross-border logistics, offering overseas sourcing, US domestic trucking, US pallet break, ocean freight, and drop shipping — a full-chain service that helps Chinese brands go global with ease.",
core_kicker: "Five Core Businesses",
core_detail: "View business details",
hero_cta1: "Get Started",
hero_cta2: "Explore Services",
stat_cities: "Cities Covered",
stat_ontime: "On-Time Rate",
stat_customs: "Customs Response",
stat_clients: "Clients Served",
svc_eyebrow: "Core Services",
svc_title: "Professional Services Across the Full Cross-Border Chain",
svc_subtitle: "Leveraging US local resources and a global network to deliver stable, efficient, and traceable cross-border logistics.",
svc1_title: "Overseas Sourcing",
svc1_desc: "Supplier matchmaking, procurement execution, inspection, and consolidated sourcing — lowering costs and boosting supply chain efficiency.",
svc1_li1: "Supplier screening & qualification",
svc1_li2: "Sample confirmation & bulk buying",
svc1_li3: "Quality inspection & compliance",
svc1_li4: "Consolidation & unified shipping",
svc2_title: "US Domestic Trucking",
svc2_desc: "Nationwide trucking network offering FTL, LTL, and oversized delivery solutions.",
svc2_li1: "Nationwide FTL/LTL",
svc2_li2: "Oversized & specialized vehicles",
svc2_li3: "Real-time GPS tracking",
svc2_li4: "Scheduled delivery & POD",
svc3_title: "US Domestic Pallet Break",
svc3_desc: "US local de-palletizing, sorting, and re-delivery for e-commerce returns, B2B replenishment, and multi-channel fulfillment.",
svc3_li1: "Pallet break & rebuild",
svc3_li2: "Multi-address sorting",
svc3_li3: "Reverse logistics",
svc3_li4: "Warehousing & inventory",
proc_eyebrow: "Service Process",
proc_title: "Standardized Service Process",
proc_subtitle: "From pickup to warehouse receipt, every step is strictly controlled to ensure safe, on-time delivery.",
proc1_title: "Door-to-Door Pickup",
proc1_desc: "Our team picks up goods on time, verifies info, and advises on standard packaging.",
proc2_title: "Warehouse & Customs",
proc2_desc: "Professional brokers handle customs docs with pre-clearance for fast passage.",
proc3_title: "International Shipping",
proc3_desc: "Stable ocean lines with full tracking and proactive alerts.",
proc4_title: "Receipt & Storage",
proc4_desc: "Destination warehouse verifies receipt and syncs status, enabling one-click fulfillment.",
biz_eyebrow: "Business Lines",
biz_title: "Deep Layout of Core Businesses",
biz_subtitle: "Ocean freight lines and drop shipping drive growth for businesses of all sizes.",
biz1_title: "Ocean Freight Lines",
biz1_desc: "China-US ocean lines with FCL, LCL, fast and standard vessels — stable space and transparent pricing.",
biz1_li1: "Fixed weekly sailings, guaranteed space",
biz1_li2: "DDP, door-to-door",
biz1_li3: "Full visual tracking",
biz2_title: "Drop Shipping",
biz2_desc: "US warehousing + fulfillment for Amazon, Walmart, and DTC orders, cutting costs and boosting efficiency.",
biz2_li1: "Multi-platform API",
biz2_li2: "Smart inventory & orders",
biz2_li3: "24h dispatch, fast delivery",
about_eyebrow: "Why Choose Us",
about_title: "Why Choose Chongchong Global",
about_desc: "We are not just a logistics provider, but a partner for going global, delivering end-to-end supply chain assurance.",
feat1_title: "Global Network",
feat1_desc: "Covering major ports and cities in China and the US, with warehouses on both coasts.",
feat2_title: "Digital System",
feat2_desc: "In-house TMS for one-stop online management of orders, tracking, inventory, and billing.",
feat3_title: "Dedicated Support",
feat3_desc: "Bilingual support teams in China and the US, responding 7×24 and handling issues promptly.",
feat4_title: "Compliance Assurance",
feat4_desc: "Expert brokers familiar with China-US trade laws ensure compliant, efficient clearance.",
about_stat_label: "Avg. Logistics Cost Cut",
cta_title: "Start Your Global Journey",
cta_desc: "Sign up now for a tailored plan and quote, and make Chongchong Global your logistics partner.",
cta_btn1: "Create Free Account",
cta_btn2: "Contact Sales",
login_welcome: "Welcome Back",
login_desc: "Log in to track shipments in real time and manage orders and inventory.",
login_feat1: "Full Visual Tracking",
login_feat2: "Smart Order Management",
login_feat3: "Online Quoting & Ordering",
login_title: "Account Login",
login_no_account: "No account yet?",
login_register_link: "Sign Up Now",
login_account_label: "Email / Phone",
login_account_ph: "Enter email or phone",
login_password_label: "Password",
login_password_ph: "Enter password",
login_remember: "Remember Me",
login_forgot: "Forgot Password?",
login_submit: "Log In",
login_other: "Other Sign-In Methods",
reg_welcome: "Join Us",
reg_welcome_desc: "Register a Chongchong Global business account and start efficient cross-border logistics.",
reg_feat1: "Exclusive New-User Offers",
reg_feat2: "Free Logistics Plan",
reg_feat3: "Dedicated Account Manager",
reg_title: "Business Registration",
reg_have_account: "Already have an account?",
reg_login_link: "Log In Now",
reg_company_label: "Company Name",
reg_company_ph: "Enter company name",
reg_contact_label: "Contact Person",
reg_contact_ph: "Enter contact name",
reg_email_label: "Email",
reg_email_ph: "Enter company email",
reg_phone_label: "Phone Number",
reg_phone_ph: "Enter phone number",
reg_password_label: "Password",
reg_password_ph: "Set an 8-20 char password",
reg_agree: "I have read and agree to the",
reg_agree_tos: "User Agreement",
reg_agree_pp: "Privacy Policy",
reg_submit: "Sign Up Now",
footer_desc: "Focused on China-US cross-border logistics, offering sourcing, ocean freight, US trucking, and drop shipping.",
footer_services_title: "Services",
footer_about_title: "About Us",
footer_link_company: "Company Profile",
footer_link_news: "News Center",
footer_link_partners: "Partners",
footer_link_join: "Join Us",
footer_link_contact: "Contact Us",
footer_contact_title: "Contact Info",
footer_hours: "Mon-Fri 9:00-18:00<br>Sat 9:00-12:00",
nav_contact: "Contact",
adv_eyebrow: "Our Advantages",
adv_title: "Six Core Advantages",
adv_subtitle: "With years of expertise in China-US cross-border logistics, we build a stable and reliable supply chain with professional capabilities and local resources.",
adv1_title: "Professional Team",
adv1_desc: "A core team with 10+ years of cross-border logistics experience, well-versed in customs policies and operations of various countries.",
adv2_title: "Own Overseas Warehouse",
adv2_desc: "Self-operated warehouses in the US offering storage, sorting, packing and return processing.",
adv3_title: "Duty-Paid Customs",
adv3_desc: "Professional customs clearance with duty-paid channels for efficient, worry-free delivery.",
adv4_title: "Full Visibility",
adv4_desc: "Real-time GPS tracking and full order visibility, keeping you informed at every step.",
adv5_title: "Insurance Service",
adv5_desc: "Comprehensive cargo insurance for all-round protection and reduced transport risk.",
adv6_title: "One-Stop Service",
adv6_desc: "From pickup to delivery, a complete logistics solution without juggling multiple providers.",
cul_eyebrow: "Corporate Culture",
cul_title: "About Us & Our Culture",
cul_subtitle: "Delivering with heart, reaching the world — connecting every step of China-US trade with expertise and responsibility.",
cul_profile_title: "Company Profile",
cul_profile_desc1: "We are a cross-border logistics company specializing in China-US sea freight, China-US air freight and overseas warehousing, deeply rooted in the US and Canadian markets with sea, air and rail line-haul services.",
cul_profile_desc2: "We have established FBA full-route channels to the US led by Matson express, OA alliance e-commerce express and China-US air freight. With self-operated warehouses in the US and partner warehouses in Canada, a professional customs team, door-to-door duty-paid delivery and full insurance, we offer diverse one-stop solutions for cross-border e-commerce clients.",
cul_vision_t: "Vision",
cul_vision_d: "To become a trusted, preferred service platform in the cross-border logistics industry.",
cul_mission_t: "Mission",
cul_mission_d: "To provide outstanding cross-border logistics and help Chinese products reach the world fast.",
cul_values_t: "Core Values",
cul_values_d: "Integrity · Pragmatism · Humility · Gratitude",
cul_slogan_t: "Our Slogan",
cul_slogan_d: "Customer Value · Service First · Excellence · Pursuit of Perfection · Win-Win Together",
cont_eyebrow: "Contact Us",
cont_title: "Contact Us",
cont_subtitle: "You are always welcome to reach out — our team will provide cross-border logistics solutions and quotes.",
cont_addr_t: "Address",
cont_addr_la_t: "Los Angeles",
cont_addr_la_d: "10767 7th Street, Rancho Cucamonga, California 91730",
cont_addr_ny_t: "New York",
cont_addr_ny_d: "Door 13-14, 75 Carter Dr, Edison, New Jersey 08817",
cont_addr_yw_t: "Yiwu",
cont_addr_yw_d: "Room 8613-8615, No. 1399 Chouzhou North Road, Futian Street, Yiwu, Zhejiang, China",
cont_addr_sz_t: "Shenzhen",
cont_addr_sz_d: "Room 3218, Tower A, Vanke Wanzhi Tiandi, Bantian Street, Longgang District, Shenzhen, China",
cont_phone_t: "Phone",
cont_email_t: "Email",
cont_hours_t: "Business Hours",
cont_hours_d: "Mon-Fri 9:00-18:00<br>Sat 9:00-12:00",
footer_copyright: "© 2026 Chongchong Global. All rights reserved.",
footer_tos: "Terms of Service",
footer_pp: "Privacy Policy",
footer_sitemap: "Sitemap",
toast_tos: "Terms of Service coming soon",
toast_pp: "Privacy Policy coming soon",
toast_news: "News Center coming soon",
toast_partners: "Partners coming soon",
toast_join: "Join Us coming soon",
toast_contact: "Sales consultation coming soon",
toast_resetpw: "Please contact support to reset your password",
toast_sitemap: "Sitemap coming soon",
toast_login_ok: "Login successful! Welcome back",
toast_register_ok: "Registration successful! Welcome to Chongchong Global",
toast_logout: "Logged out"
},
es: {
nav_home: "Inicio",
nav_services: "Servicios",
nav_process: "Proceso",
nav_business: "Negocio",
nav_about: "Acerca de",
nav_login: "Iniciar sesión",
nav_register: "Regístrate Gratis",
nav_dashboard: "Panel",
dash_logout: "Cerrar sesión",
lang_zh: "Chino",
lang_en: "Inglés",
lang_es: "Español",
hero_badge: "Solución integral de logística transfronteriza",
hero_title1: "Haz del comercio mundial",
hero_title2: "Más simple y eficiente",
hero_desc: "Chongchong Global se especializa en logística transfronteriza China-EE.UU., ofreciendo abastecimiento en el extranjero, transporte por camión en EE.UU., despaletizado en EE.UU., líneas marítimas y envío directo, un servicio de cadena completa que ayuda a las marcas chinas a salir al mundo sin problemas.",
core_kicker: "Cinco negocios principales",
core_detail: "Ver detalles del negocio",
hero_cta1: "Comenzar",
hero_cta2: "Conoce nuestros servicios",
stat_cities: "Ciudades cubiertas",
stat_ontime: "Tasa de puntualidad",
stat_customs: "Respuesta aduanera",
stat_clients: "Clientes atendidos",
svc_eyebrow: "Servicios principales",
svc_title: "Servicios profesionales en toda la cadena transfronteriza",
svc_subtitle: "Con recursos locales en EE.UU. y una red global, ofrecemos logística transfronteriza estable, eficiente y rastreable.",
svc1_title: "Abastecimiento en el extranjero",
svc1_desc: "Conectamos proveedores, ejecutamos compras, inspeccionamos y consolidamos, reduciendo costos y mejorando la eficiencia.",
svc1_li1: "Selección y verificación de proveedores",
svc1_li2: "Confirmación de muestras y compras al por mayor",
svc1_li3: "Inspección de calidad y cumplimiento",
svc1_li4: "Consolidación y envío unificado",
svc2_title: "Transporte por camión en EE.UU.",
svc2_desc: "Red de transporte por camión en todo EE.UU. con soluciones FTL, LTL y cargas sobredimensionadas.",
svc2_li1: "FTL/LTL a nivel nacional",
svc2_li2: "Cargas sobredimensionadas y vehículos especiales",
svc2_li3: "Seguimiento GPS en tiempo real",
svc2_li4: "Entrega programada y confirmación",
svc3_title: "Despaletizado en EE.UU.",
svc3_desc: "Despaletizado, clasificación y reenvío en EE.UU. para devoluciones, reabastecimiento B2B y cumplimiento multicanal.",
svc3_li1: "Despaletizado y reagrupación",
svc3_li2: "Clasificación a múltiples direcciones",
svc3_li3: "Logística inversa",
svc3_li4: "Almacenamiento e inventario",
proc_eyebrow: "Proceso de servicio",
proc_title: "Proceso de servicio estandarizado",
proc_subtitle: "Desde la recogida hasta el ingreso al almacén, cada paso se controla para garantizar entregas seguras y puntuales.",
proc1_title: "Recogida a domicilio",
proc1_desc: "Nuestro equipo recoge la mercancía puntualmente, verifica la información y asesora sobre el embalaje.",
proc2_title: "Almacén y aduana",
proc2_desc: "Agentes aduanales gestionan los documentos con preaprobación para un paso rápido.",
proc3_title: "Transporte internacional",
proc3_desc: "Líneas marítimas estables con rastreo completo y alertas proactivas.",
proc4_title: "Recepción y almacenamiento",
proc4_desc: "El almacén de destino verifica la recepción y sincroniza el estado para un cumplimiento con un clic.",
biz_eyebrow: "Líneas de negocio",
biz_title: "Despliegue profundo de negocios clave",
biz_subtitle: "Las líneas marítimas y el envío directo impulsan el crecimiento de todo tipo de empresas.",
biz1_title: "Líneas marítimas",
biz1_desc: "Líneas marítimas China-EE.UU. con FCL, LCL y buques rápidos y estándar, con espacio estable y precios transparentes.",
biz1_li1: "Salidas semanales fijas, espacio garantizado",
biz1_li2: "DDP, puerta a puerta",
biz1_li3: "Seguimiento visual completo",
biz2_title: "Envío directo",
biz2_desc: "Almacenamiento y cumplimiento en EE.UU. para Amazon, Walmart e independientes, reduciendo costos.",
biz2_li1: "API multiplataforma",
biz2_li2: "Inventario y pedidos inteligentes",
biz2_li3: "Despacho en 24h, entrega rápida",
about_eyebrow: "Por qué elegirnos",
about_title: "Por qué elegir Chongchong Global",
about_desc: "No somos solo un proveedor logístico, sino un socio para salir al mundo, con una cadena de suministro de extremo a extremo.",
feat1_title: "Red global",
feat1_desc: "Cubrimos puertos y ciudades clave en China y EE.UU., con almacenes en ambas costas.",
feat2_title: "Sistema digital",
feat2_desc: "Sistema propio de gestión de pedidos, rastreo, inventario y facturación en línea.",
feat3_title: "Soporte dedicado",
feat3_desc: "Equipos de soporte en China y EE.UU., disponibles 7×24 y atendiendo incidencias de inmediato.",
feat4_title: "Garantía de cumplimiento",
feat4_desc: "Agentes expertos en leyes comerciales China-EE.UU. aseguran un despacho cumplido y eficiente.",
about_stat_label: "Reducción de costos logísticos",
cta_title: "Inicia tu viaje global",
cta_desc: "Regístrate ahora para un plan y cotización a medida y haz de Chongchong Global tu socio logístico.",
cta_btn1: "Crear cuenta gratis",
cta_btn2: "Contactar ventas",
login_welcome: "Bienvenido de nuevo",
login_desc: "Inicia sesión para rastrear envíos en tiempo real y gestionar pedidos e inventario.",
login_feat1: "Seguimiento visual completo",
login_feat2: "Gestión inteligente de pedidos",
login_feat3: "Cotización y pedidos en línea",
login_title: "Inicio de sesión",
login_no_account: "¿Aún no tienes cuenta?",
login_register_link: "Regístrate ahora",
login_account_label: "Correo / Teléfono",
login_account_ph: "Ingresa correo o teléfono",
login_password_label: "Contraseña",
login_password_ph: "Ingresa tu contraseña",
login_remember: "Recuérdame",
login_forgot: "¿Olvidó su contraseña?",
login_submit: "Iniciar sesión",
login_other: "Otros métodos de acceso",
reg_welcome: "Únete a nosotros",
reg_welcome_desc: "Regístrate en la cuenta empresarial de Chongchong Global y comienza una logística eficiente.",
reg_feat1: "Ofertas exclusivas para nuevos usuarios",
reg_feat2: "Plan logístico gratuito",
reg_feat3: "Gerente de cuenta dedicado",
reg_title: "Registro empresarial",
reg_have_account: "¿Ya tienes una cuenta?",
reg_login_link: "Inicia sesión ahora",
reg_company_label: "Nombre de empresa",
reg_company_ph: "Ingresa el nombre de empresa",
reg_contact_label: "Persona de contacto",
reg_contact_ph: "Ingresa el nombre de contacto",
reg_email_label: "Correo electrónico",
reg_email_ph: "Ingresa el correo empresarial",
reg_phone_label: "Número de teléfono",
reg_phone_ph: "Ingresa tu número de teléfono",
reg_password_label: "Contraseña",
reg_password_ph: "Define una contraseña de 8-20 caracteres",
reg_agree: "He leído y acepto los",
reg_agree_tos: "Términos de servicio",
reg_agree_pp: "Política de privacidad",
reg_submit: "Regístrate ahora",
footer_desc: "Especializados en logística China-EE.UU.: abastecimiento, marítimo, camiones y envío directo.",
footer_services_title: "Servicios",
footer_about_title: "Sobre nosotros",
footer_link_company: "Perfil de empresa",
footer_link_news: "Centro de noticias",
footer_link_partners: "Socios",
footer_link_join: "Únete a nosotros",
footer_link_contact: "Contáctanos",
footer_contact_title: "Información de contacto",
footer_hours: "Lun-Vie 9:00-18:00<br>Sáb 9:00-12:00",
nav_contact: "Contacto",
adv_eyebrow: "Our Advantages",
adv_title: "Seis Ventajas Clave",
adv_subtitle: "Con años de experiencia en logística transfronteriza China-EE.UU., construimos una cadena de suministro estable y confiable con capacidad profesional y recursos locales.",
adv1_title: "Equipo Profesional",
adv1_desc: "Un equipo central con más de 10 años de experiencia, conocedor de las políticas aduaneras y operaciones de varios países.",
adv2_title: "Almacén Propio",
adv2_desc: "Almacenes propios en EE.UU. con almacenamiento, clasificación, embalaje y gestión de devoluciones.",
adv3_title: "Despacho con Impuestos",
adv3_desc: "Despacho aduanero profesional con canales de impuestos incluidos, eficiente y sin preocupaciones.",
adv4_title: "Visibilidad Total",
adv4_desc: "Localización GPS en tiempo real y seguimiento completo del pedido en cada paso.",
adv5_title: "Servicio de Seguro",
adv5_desc: "Seguro de carga integral para una protección total y menor riesgo de transporte.",
adv6_title: "Servicio Integral",
adv6_desc: "Desde la recogida hasta la entrega, una solución logística completa con un solo proveedor.",
cul_eyebrow: "Corporate Culture",
cul_title: "Sobre Nosotros y Cultura",
cul_subtitle: "Entregar con el corazón, llegar al mundo: conectando cada etapa del comercio China-EE.UU. con profesionalismo y responsabilidad.",
cul_profile_title: "Perfil de Empresa",
cul_profile_desc1: "Somos una empresa de logística transfronteriza especializada en flete marítimo y aéreo China-EE.UU. y almacenamiento en el extranjero, con fuerte presencia en los mercados de EE.UU. y Canadá.",
cul_profile_desc2: "Hemos establecido canales de ruta completa FBA a EE.UU. liderados por Matson express, express de comercio electrónico de la alianza OA y flete aéreo China-EE.UU. Con almacenes propios en EE.UU. y aliados en Canadá, equipo aduanero profesional, entrega puerta a puerta con impuestos pagados y seguro completo, ofrecemos soluciones integrales para clientes de comercio electrónico.",
cul_vision_t: "Visión",
cul_vision_d: "Convertirnos en una plataforma de servicio confiable y preferida en la logística transfronteriza.",
cul_mission_t: "Misión",
cul_mission_d: "Brindar una logística transfronteriza excepcional y ayudar a que los productos chinos lleguen rápido al mundo.",
cul_values_t: "Valores Fundamentales",
cul_values_d: "Integridad · Pragmatismo · Humildad · Gratitud",
cul_slogan_t: "Nuestro Lema",
cul_slogan_d: "Valor al Cliente · Servicio Primero · Excelencia · Búsqueda de la Perfección · Ganar-Ganar",
cont_eyebrow: "Contact Us",
cont_title: "Contáctanos",
cont_subtitle: "Siempre eres bienvenido a contactarnos: nuestro equipo te ofrecerá soluciones logísticas y cotizaciones.",
cont_addr_t: "Dirección",
cont_addr_la_t: "Los Ángeles",
cont_addr_la_d: "10767 7th Street, Rancho Cucamonga, California 91730",
cont_addr_ny_t: "Nueva York",
cont_addr_ny_d: "Door 13-14, 75 Carter Dr, Edison, New Jersey 08817",
cont_addr_yw_t: "Yiwu",
cont_addr_yw_d: "Sala 8613-8615, No. 1399 Chouzhou North Road, Futian, Yiwu, Zhejiang, China",
cont_addr_sz_t: "Shenzhen",
cont_addr_sz_d: "Sala 3218, Torre A, Vanke Wanzhi Tiandi, Bantian, Longgang, Shenzhen, China",
cont_phone_t: "Teléfono",
cont_email_t: "Correo",
cont_hours_t: "Horario",
cont_hours_d: "Lun-Vie 9:00-18:00<br>Sáb 9:00-12:00",
footer_copyright: "© 2026 Chongchong Global. Todos los derechos reservados.",
footer_tos: "Términos de servicio",
footer_pp: "Política de privacidad",
footer_sitemap: "Mapa del sitio",
toast_tos: "Términos de servicio próximamente",
toast_pp: "Política de privacidad próximamente",
toast_news: "Centro de noticias próximamente",
toast_partners: "Socios próximamente",
toast_join: "Únete a nosotros próximamente",
toast_contact: "Consulta de ventas próximamente",
toast_resetpw: "Contacta a soporte para restablecer tu contraseña",
toast_sitemap: "Mapa del sitio próximamente",
toast_login_ok: "¡Inicio de sesión exitoso! Bienvenido",
toast_register_ok: "¡Registro exitoso! Bienvenido a Chongchong Global",
toast_logout: "Sesión cerrada"
}
};
let currentLang = localStorage.getItem('cc_lang') || 'zh';
function t(key) {
return (i18n[currentLang] && i18n[currentLang][key] !== undefined) ? i18n[currentLang][key] : key;
}
function applyLanguage(lang) {
if (!i18n[lang]) lang = 'zh';
currentLang = lang;
const langAttr = lang === 'zh' ? 'zh-CN' : (lang === 'es' ? 'es-MX' : 'en');
document.documentElement.setAttribute('lang', langAttr);
document.querySelectorAll('[data-i18n]').forEach(el => {
const k = el.getAttribute('data-i18n');
const v = i18n[lang][k];
if (v !== undefined) { if (v.indexOf('<br>') !== -1) el.innerHTML = v; else el.textContent = v; }
});
document.querySelectorAll('[data-i18n-ph]').forEach(el => {
const k = el.getAttribute('data-i18n-ph');
if (i18n[lang][k] !== undefined) el.setAttribute('placeholder', i18n[lang][k]);
});
document.querySelectorAll('[data-lang]').forEach(b => {
b.classList.toggle('active', b.getAttribute('data-lang') === lang);
});
try { localStorage.setItem('cc_lang', lang); } catch (e) {}
updateAuthUI();
}
document.querySelectorAll('#langSwitcher [data-lang], #langSwitcherMobile [data-lang]').forEach(b => {
b.addEventListener('click', () => applyLanguage(b.getAttribute('data-lang')));
});
// Toast 提示
function showToast(message) {
const toast = document.getElementById('toast');
const toastMessage = document.getElementById('toastMessage');
toastMessage.textContent = message;
toast.classList.remove('opacity-0', 'pointer-events-none', '-translate-y-4');
toast.classList.add('opacity-100', 'translate-y-0');
setTimeout(() => {
toast.classList.add('opacity-0', 'pointer-events-none', '-translate-y-4');
toast.classList.remove('opacity-100', 'translate-y-0');
}, 3000);
}
// 初始化
document.addEventListener('DOMContentLoaded', function() {
applyLanguage(currentLang);
updateAuthUI();
restoreRouteFromUrl();
reveal();
});
// 立即应用(脚本位于 body 末尾,DOM 已就绪)
applyLanguage(currentLang);
</script>
</body>
</html>