/* ===== 长藤默航运官网 · 公共样式 ===== */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:"Microsoft YaHei","PingFang SC","Noto Sans SC","SimHei",sans-serif; color:#14243a; background:#f4f8fb; -webkit-font-smoothing:antialiased; }
a { text-decoration:none; color:inherit; }
img { display:block; max-width:100%; }
:root { --blue:#0d3a5c; --teal:#16607f; --sky:#1f6fa8; --gold:#e8b45a; --line:#e7eef5; }

/* ===== 顶栏 ===== */
header { position:fixed; top:0; left:0; right:0; z-index:100; color:#fff;
         background:linear-gradient(180deg,rgba(6,26,42,.55),rgba(6,26,42,.22));
         backdrop-filter:blur(12px) saturate(1.3); -webkit-backdrop-filter:blur(12px) saturate(1.3);
         border-bottom:1px solid rgba(255,255,255,.12); transition:.35s; }
header.solid, header.page { background:rgba(255,255,255,.97); color:var(--blue); box-shadow:0 6px 24px rgba(13,42,74,.08); border-bottom:1px solid var(--line); }
.nav { max-width:1320px; margin:0 auto; display:flex; align-items:center; height:76px; padding:0 24px; }
.brand { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.brand .mark { width:48px; height:48px; border-radius:10px; background:linear-gradient(135deg,var(--sky),var(--blue)); color:#fff;
               display:flex; align-items:center; justify-content:center; font-size:21px; font-weight:800; }
.brand .txt b { display:block; font-size:20px; letter-spacing:3px; line-height:1.15; }
.brand .txt em { display:block; font-style:normal; font-size:10px; letter-spacing:1.5px; opacity:.72; }
.menu { display:flex; list-style:none; margin-left:auto; font-size:15px; align-items:center; }
.menu > li { position:relative; }
.menu > li > a { display:block; padding:0 15px; line-height:76px; transition:.25s; letter-spacing:.5px; }
header:not(.solid):not(.page) .menu > li > a { color:rgba(255,255,255,.9); }
header:not(.solid):not(.page) .menu > li > a:hover { color:#fff; }
header.solid .menu > li > a, header.page .menu > li > a { color:#2a3a55; }
header.solid .menu > li > a:hover, header.page .menu > li > a:hover { color:var(--sky); }
.menu > li.hasub > a::after { content:"›"; display:inline-block; margin-left:6px; transform:rotate(90deg); font-size:12px; opacity:.6; }
.sub { position:absolute; top:76px; left:50%; transform:translate(-50%,8px); min-width:180px; background:#fff; border-radius:8px;
       box-shadow:0 18px 44px rgba(13,42,74,.16); padding:8px 0; opacity:0; visibility:hidden; transition:.25s; list-style:none; }
.menu > li:hover .sub { opacity:1; visibility:visible; transform:translate(-50%,0); }
.sub a { display:block; padding:11px 22px; font-size:14px; color:#33445f; white-space:nowrap; transition:.2s; }
.sub a:hover { background:#f0f6fb; color:var(--sky); padding-left:28px; }
.lang { margin-left:16px; display:flex; border:1px solid rgba(255,255,255,.4); border-radius:16px; overflow:hidden; flex-shrink:0; }
header.solid .lang, header.page .lang { border-color:#c3d2e0; }
.lang button { border:none; background:none; color:inherit; font-size:13px; padding:6px 13px; cursor:pointer; font-family:inherit; }
.lang button.on { background:var(--gold); color:#0a2939; font-weight:700; }

/* ===== 页面通用 ===== */
section { padding:88px 0; }
.wrap { max-width:1320px; margin:0 auto; padding:0 24px; }
.sec-row { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:46px; }
.sec-row h2 { font-size:30px; letter-spacing:4px; color:var(--blue); position:relative; padding-left:18px; }
.sec-row h2::before { content:""; position:absolute; left:0; top:9px; bottom:9px; width:5px; border-radius:3px; background:var(--gold); }
.sec-row h2 small { display:block; font-size:12px; letter-spacing:3px; color:#93a3bb; text-transform:uppercase; margin-top:8px; font-weight:400; }
.sec-row .more { background:var(--teal); color:#fff; font-size:13px; padding:9px 22px; border-radius:4px; letter-spacing:1px; transition:.25s; }
.sec-row .more:hover { background:var(--sky); }
.sec-row.on-dark h2 { color:#fff; }
.sec-row.on-dark h2 small { color:rgba(255,255,255,.55); }

/* 内容页标题区 */
.phead { position:relative; height:300px; display:flex; align-items:center; justify-content:center; color:#fff; text-align:center;
         background:linear-gradient(rgba(7,30,48,.72),rgba(7,30,48,.78)),url(../biz-bg.jpg) center/cover; margin-top:0; }
.phead h1 { font-size:38px; letter-spacing:6px; }
.phead p { margin-top:12px; font-size:12px; letter-spacing:3px; color:rgba(255,255,255,.65); text-transform:uppercase; }
.crumb { position:absolute; left:0; right:0; bottom:26px; text-align:center; font-size:13px; color:rgba(255,255,255,.7); }
.crumb a:hover { color:var(--gold); }

/* 面包屑 + 文章排版 */
.article { background:#fff; border-radius:14px; padding:52px 56px; box-shadow:0 14px 40px rgba(13,42,74,.08); }
.article h3 { font-size:20px; color:var(--blue); margin:34px 0 14px; padding-left:14px; position:relative; }
.article h3:first-child { margin-top:0; }
.article h3::before { content:""; position:absolute; left:0; top:6px; bottom:6px; width:4px; border-radius:2px; background:var(--gold); }
.article p { font-size:15px; line-height:2.15; color:#41506a; margin-bottom:14px; }
.article ul { margin:0 0 16px 20px; }
.article li { font-size:15px; line-height:2.1; color:#41506a; }

/* 卡片网格 */
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.grid4 { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.card { background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 12px 32px rgba(13,42,74,.08); transition:.3s; }
.card:hover { transform:translateY(-6px); box-shadow:0 20px 46px rgba(13,42,74,.14); }
.card .th { height:170px; background:linear-gradient(120deg,var(--teal),var(--blue)); position:relative; }
.card .th::after { content:""; position:absolute; left:0; right:0; bottom:0; height:4px; background:var(--gold); }
.card .bd { padding:20px 22px; }
.card .bd h4 { font-size:15.5px; color:var(--blue); line-height:1.6; }
.card .bd p { font-size:12.8px; color:#8b96ab; margin-top:10px; line-height:1.8; }

/* 页脚 */
footer { background:#08283e; color:#8a97b5; padding:46px 0 26px; font-size:13px; }
footer .fcols { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.08); }
footer h5 { color:#d7dfee; font-size:14.5px; margin-bottom:16px; letter-spacing:2px; }
footer a, footer p { display:block; line-height:2.15; color:#8a97b5; }
footer a:hover { color:var(--gold); }
footer .copy { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; padding-top:22px; }

/* 语言切换显隐 */
.en .cn { display:none !important; }
html:not(.en) .en { display:none !important; }

@media (max-width:1100px){
  .menu > li > a { padding:0 10px; font-size:14px; }
}
@media (max-width:960px){
  .menu, .lang { display:none; }
  .grid3, .grid4 { grid-template-columns:1fr; }
  .article { padding:28px 22px; }
  footer .fcols { grid-template-columns:1fr 1fr; gap:24px; }
  section { padding:56px 0; }
}