/* ===== Reset & Base ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
:root{
    --navy:#0b1f3a; --blue:#0a3d91; --sky:#0077b6; --orange:#f39c12;
    --orange2:#e67e22; --light:#f5f8fc; --gray:#5a6b7e; --white:#ffffff;
}
html{ scroll-behavior:smooth; }
body{ font-family:'Segoe UI',Arial,sans-serif; color:var(--navy); line-height:1.6; overflow-x:hidden; }
a{ text-decoration:none; color:inherit; }
ul{ list-style:none; }
.container{ max-width:1200px; margin:0 auto; padding:0 20px; }
img{ max-width:100%; display:block; }

/* ===== Buttons ===== */
.btn{ display:inline-block; padding:13px 28px; border-radius:6px; font-weight:600; font-size:15px; transition:all .25s; cursor:pointer; border:none; }
.btn-primary{ background:var(--orange); color:#fff; }
.btn-primary:hover{ background:var(--orange2); transform:translateY(-2px); }
.btn-ghost{ background:transparent; color:#fff; border:2px solid rgba(255,255,255,.85); }
.btn-ghost:hover{ background:#fff; color:var(--navy); }
.btn-nav{ background:var(--orange); color:#fff; padding:10px 22px; font-size:14px; border-radius:6px; }
.btn-nav:hover{ background:var(--orange2); }

/* ===== Header ===== */
header{ position:fixed; top:0; left:0; width:100%; z-index:100; background:var(--navy); transition:all .3s; }
header.scrolled{ box-shadow:0 4px 20px rgba(0,0,0,.15); }
/* Logo 居中：整个 header 内容垂直水平居中 */
.header-inner{ display:flex; flex-direction:column; align-items:center; justify-content:center; height:auto; padding:12px 20px; gap:10px; }
.logo{ display:flex; align-items:center; justify-content:center; gap:10px; color:#fff; font-size:18px; }
.logo-mark{ width:34px; height:34px; background:var(--sky); border-radius:7px; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:18px; }
.logo-text b{ color:var(--orange); }
/* 导航菜单居中 */
.nav-links{ display:flex; gap:26px; justify-content:center; }
.nav-links a{ color:rgba(255,255,255,.9); font-size:14.5px; font-weight:500; transition:color .2s; padding:4px 0; }
.nav-links a:hover,.nav-links a.active{ color:var(--orange); }
/* Get Quote 按钮居中 */
.header-inner .btn-nav{ margin:0 auto; display:inline-block; }
.menu-toggle{ display:none; background:none; border:none; color:#fff; font-size:26px; cursor:pointer; }
@media(max-width:900px){
    .menu-toggle{ display:block; position:absolute; top:18px; right:20px; }
    .nav-links{ position:absolute; top:74px; left:0; width:100%; flex-direction:column; background:var(--navy); padding:15px 20px; gap:14px; transform:translateY(-150%); transition:transform .3s; }
    .nav-links.open{ transform:translateY(0); }
}

/* ===== Hero Slideshow ===== */
.hero{ position:relative; height:100vh; min-height:620px; display:flex; align-items:center; overflow:hidden; padding-top:74px; }
.hero-slides{ position:absolute; inset:0; z-index:-1; }
.hero-slide{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1s ease; }
.hero-slide.active{ opacity:1; }
.hero-slide::before{ content:''; position:absolute; inset:0; background:linear-gradient(110deg,rgba(11,31,58,.82),rgba(10,61,145,.5) 55%,rgba(0,119,182,.32)); }
.hero-slide::after{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 80% 20%,rgba(0,180,216,.22),transparent 45%); }
.hs-caption{ position:absolute; inset:0; display:flex; align-items:center; }
.hero-content{ color:#fff; max-width:760px; }
.badge{ display:inline-block; background:var(--orange); color:#fff; padding:6px 16px; border-radius:30px; font-size:13px; font-weight:700; letter-spacing:.5px; margin-bottom:18px; }
.hero h1{ font-size:52px; font-weight:800; line-height:1.15; margin-bottom:18px; }
.highlight{ color:var(--orange); }
.hero-sub{ font-size:18px; opacity:.95; margin-bottom:30px; max-width:620px; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.hero-dots{ position:absolute; bottom:36px; left:0; right:0; z-index:5; display:flex; gap:12px; justify-content:center; }
.hero-dots .dot{ width:13px; height:13px; border-radius:50%; border:2px solid rgba(255,255,255,.75); background:transparent; cursor:pointer; padding:0; transition:all .25s; }
.hero-dots .dot.active{ background:var(--orange); border-color:var(--orange); transform:scale(1.25); }
@media(max-width:700px){
    .hero h1{ font-size:34px; }
    .hero-sub{ font-size:16px; }
}

/* ===== Section Heading ===== */
section{ padding:80px 0; }
.section-head{ text-align:center; max-width:760px; margin:0 auto 50px; }
.section-head .eyebrow{ color:var(--orange); font-weight:700; letter-spacing:1px; font-size:14px; text-transform:uppercase; }
.section-head h2{ font-size:32px; font-weight:800; margin-top:10px; line-height:1.3; }
.section-head.light h2,.section-head.light .eyebrow{ color:#fff; }

/* ===== Services ===== */
.services{ background:#fff; }
/* 首页：2 行 × 2 列（两行每行两个） */
.service-grid-2x2{ display:grid; grid-template-columns:repeat(2,1fr); gap:26px; max-width:760px; margin:0 auto; }
.service-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; max-width:1000px; margin:0 auto; }
.service-card{ background:var(--light); border-radius:12px; padding:32px 24px; text-align:center; transition:transform .25s,box-shadow .25s; }
.service-card:hover{ transform:translateY(-8px); box-shadow:0 14px 30px rgba(11,31,58,.12); }
.service-icon{ font-size:46px; margin-bottom:14px; }
.service-card h3{ font-size:20px; margin-bottom:12px; }
.service-card p{ color:var(--gray); font-size:14.5px; margin-bottom:16px; }
.link{ color:var(--orange); font-weight:700; font-size:14px; }
.link:hover{ color:var(--orange2); }
@media(max-width:900px){ .service-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .service-grid{ grid-template-columns:1fr; } }
@media(max-width:520px){ .service-grid-2x2{ grid-template-columns:1fr; } }

/* ===== Why Choose ===== */
.why{ background:var(--light); }
.why-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
.why-card{ background:#fff; border-radius:12px; padding:30px 24px; text-align:center; box-shadow:0 6px 20px rgba(11,31,58,.06); transition:transform .25s; }
.why-card:hover{ transform:translateY(-8px); }
.why-icon{ font-size:44px; margin-bottom:12px; }
.why-card h3{ font-size:19px; margin-bottom:10px; }
.why-card p{ color:var(--gray); font-size:14px; }
@media(max-width:900px){ .why-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .why-grid{ grid-template-columns:1fr; } }

/* ===== Project Cargo ===== */
.project{ background:var(--navy); color:#fff; }
.project-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:20px; margin-bottom:36px; }
.project-card{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); border-radius:12px; padding:28px 18px; text-align:center; transition:background .25s; }
.project-card:hover{ background:var(--orange); }
.project-icon{ font-size:40px; margin-bottom:12px; }
.project-card h3{ font-size:15px; line-height:1.4; }
.project-cta{ text-align:center; }
@media(max-width:900px){ .project-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .project-grid{ grid-template-columns:1fr; } }

/* ===== Coverage ===== */
.coverage{ background:#fff; }
.coverage-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
/* 图文卡片：顶部图片 + 底部文字，对齐截图 */
.coverage-card{ background:#fff; border-radius:12px; overflow:hidden; text-align:left; box-shadow:0 6px 20px rgba(11,31,58,.08); transition:transform .25s,box-shadow .25s; }
.coverage-card:hover{ transform:translateY(-8px); box-shadow:0 14px 30px rgba(11,31,58,.14); }
/* 卡片顶部图片区（关键：之前缺失，导致“底部没图片”） */
.coverage-thumb{ position:relative; height:150px; background-size:cover; background-position:center; }
.coverage-thumb::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top,rgba(11,31,58,.35),transparent 60%); }
.coverage-flag{ position:absolute; top:12px; left:12px; z-index:2; font-size:30px; line-height:1; }
.coverage-body{ padding:20px 20px 22px; }
.coverage-body h3{ font-size:19px; margin-bottom:6px; color:var(--navy); }
.coverage-body p{ color:var(--gray); font-size:13.5px; margin-bottom:10px; }
.coverage-body .tag{ display:inline-block; font-size:12px; color:var(--orange); font-weight:700; }
/* 兼容旧结构：若写成了 coverage-icon（emoji 占位白框），隐藏它，避免红框白块 */
.coverage-card .coverage-icon{ display:none !important; }
/* 路线/航线卡：统一为“顶部图 + 底部文字”的图文卡片（关键：必须给图片区固定高度，否则会塌陷成白色） */
.route-card .coverage-thumb{ height:150px; }
.coverage-card.route-card{ display:flex; flex-direction:column; }
@media(max-width:900px){ .coverage-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .coverage-grid{ grid-template-columns:1fr; } }

/* ===== CTA Band ===== */
.cta-band{ background:linear-gradient(110deg,var(--navy),var(--blue)); color:#fff; padding:60px 0; }
.cta-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.cta-inner h2{ font-size:30px; margin-bottom:6px; }
@media(max-width:600px){ .cta-inner{ flex-direction:column; text-align:center; } }

/* ===== Footer ===== */
footer{ background:#07152a; color:rgba(255,255,255,.8); padding-top:60px; }
.contact-strip{ background:#0c2a52; border-bottom:1px solid rgba(255,255,255,.08); padding:14px 0; }
.contact-strip-inner{ display:flex; justify-content:center; flex-wrap:wrap; gap:36px; font-size:14px; color:rgba(255,255,255,.9); }
.contact-strip-inner span{ display:inline-flex; align-items:center; gap:8px; }
.contact-strip-inner a{ color:inherit; text-decoration:none; }
.contact-strip-inner a:hover{ color:#f97316; }
.cs-ico{ color:#f97316; }
.footer-inner{ display:grid; grid-template-columns:2fr 1fr 1.4fr 1.4fr; gap:34px; padding-bottom:40px; }
.logo-light{ color:#fff; margin-bottom:14px; }
.footer-col p{ font-size:14px; }
.footer-col h4{ color:#fff; font-size:16px; margin-bottom:16px; position:relative; padding-bottom:8px; }
.footer-col h4::after{ content:''; position:absolute; left:0; bottom:0; width:36px; height:2px; background:var(--orange); }
.footer-col ul li{ margin-bottom:9px; font-size:14px; }
.footer-col ul a:hover{ color:var(--orange); }
.contact-list li,.hours li{ font-size:14px; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding:20px 0; text-align:center; font-size:13px; color:rgba(255,255,255,.55); }
@media(max-width:800px){ .footer-inner{ grid-template-columns:1fr 1fr; } }
@media(max-width:480px){ .footer-inner{ grid-template-columns:1fr; } }
