/* Hangli Shipping — static website. No remote fonts or libraries. */
:root{--navy:#103249;--mid:#1e5167;--blue:#2c7287;--ink:#1b3543;--muted:#526a74;--line:#d3dfe3}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f6f7f8;color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:18px;line-height:1.68}a{color:var(--mid)}button{font:inherit}img{max-width:100%}.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.skip-link{position:absolute;top:-80px;left:16px;z-index:10001;padding:10px 16px;background:#fff;color:var(--navy);border:2px solid var(--navy)}.skip-link:focus{top:8px}
.brand{background:#fff;border-bottom:1px solid var(--line)}.brand-row{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:106px}.brand-row .logo{display:inline-flex;flex-direction:column;align-items:flex-start;text-decoration:none;max-width:100%;color:#162d39}.typed-brand{display:flex;align-items:center;gap:13px;max-width:100%}.brand-emblem{position:relative;display:block;overflow:hidden;width:66px;height:66px;flex:0 0 66px}.brand-row .brand-emblem img{position:absolute;left:-3px;top:-2px;max-width:none;width:227px;height:72px;display:block}.brand-words{display:flex;flex-direction:column;gap:3px;line-height:1.15;min-width:0}.brand-cn{font-family:'Microsoft YaHei','PingFang SC','Noto Sans CJK SC','Noto Sans SC','Heiti SC',sans-serif;font-size:29px;font-weight:600;letter-spacing:.10em;line-height:1.25;color:#152f3d}.brand-en{font-family:Arial,Helvetica,sans-serif;font-size:25px;font-weight:700;letter-spacing:.005em;white-space:nowrap;color:#152f3d}.logo-sub{margin-top:8px;font-size:10px;letter-spacing:.12em;color:#526a74;font-weight:700}.top-contact{font-size:15px;text-align:right;color:var(--muted);line-height:1.45}.top-contact strong{color:var(--navy)}.top-contact a{color:inherit;text-decoration:none}.top-contact a:hover{text-decoration:underline}
.site-nav{background:var(--navy);position:sticky;top:0;z-index:99}.site-nav .links{display:flex;flex-wrap:wrap}.site-nav a{font-size:16px;font-weight:700;display:block;color:#fff;text-decoration:none;padding:15px 14px;border-right:1px solid #ffffff20}.site-nav a:hover,.site-nav a[aria-current=page]{background:#26657b}.site-nav a:focus-visible{outline:2px solid #fff;outline-offset:-4px}
.content-wrap{padding-top:24px;padding-bottom:50px}.panel{background:#fff;border:1px solid var(--line);padding:36px 40px}.panel .page-title{font-size:31px;line-height:1.2;letter-spacing:-.02em;color:var(--navy);margin:0 0 16px;font-weight:700}.lead{color:var(--mid);font-size:20px;line-height:1.52;font-weight:500;border-bottom:1px solid #dce5e8;padding-bottom:22px;margin:0 0 24px}.unit{padding:4px 0 14px}.unit .section-title{font-size:23px;color:var(--navy);margin:22px 0 10px;line-height:1.68}.unit p{margin:0 0 14px}.corporate-profile p{margin-bottom:17px;line-height:1.75}.page-section{scroll-margin-top:110px}body.single-site .page-section{margin-bottom:20px}html.js body.single-site .page-section{display:none}html.js body.single-site .page-section.active{display:block}
.home-photo-hero{position:relative;margin:0 0 25px;background:#d7e5ed;overflow:hidden;border:1px solid #cbd8df;border-radius:3px}.home-hero-copy{position:relative;width:auto;max-width:none;padding:23px 30px;background:var(--navy);color:#fff;display:grid;grid-template-columns:1fr 1.2fr;column-gap:30px;row-gap:5px;align-items:center}.beauty-eyebrow{font:700 10px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.18em;color:#a9c3d2;grid-column:1;grid-row:1;margin:0}.home-hero-copy h1{grid-column:1;grid-row:2;margin:0;font-size:34px;line-height:1.15;color:#fff;letter-spacing:-.035em}.home-hero-copy p{grid-column:2;grid-row:1/3;margin:0;max-width:480px;color:#e3edf2;font-size:17px;line-height:1.5;font-weight:500}.home-hero-photo{width:100%;height:auto;object-fit:contain;object-position:center;display:block}
.cargo-section{padding:26px 0 30px;border-top:1px solid #dce6ea;break-inside:avoid}.cargo-heading{display:flex;align-items:flex-start;gap:14px;margin-bottom:20px}.cargo-number{font-size:14px;font-weight:700;color:#9f4149;border-top:3px solid #c5656e;padding-top:6px;min-width:25px;line-height:1.4}.panel .cargo-heading .section-title{font-size:25px;line-height:1.25;margin:0 0 7px;color:var(--navy)}.cargo-heading p{font-size:16px;line-height:1.5;margin:0;color:var(--muted)}.cargo-photo-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;align-items:start}.cargo-photo-slot{margin:0;min-width:0;padding:0;background:none;border:0}.cargo-photo{position:relative;display:block;width:100%;aspect-ratio:4/3;overflow:hidden;border:1px solid #d2dfe5;border-radius:4px;background:#f3f6f7;cursor:zoom-in}.cargo-photo img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.cargo-photo:focus-visible{outline:3px solid #527a8d;outline-offset:3px}
.map-widget{margin:22px 0;background:#fff;border:1px solid #d7e1e5;border-radius:6px;overflow:hidden;position:relative}.map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 15px;background:#f8fafb;border-bottom:1px solid #dae4e8}.map-actions{display:none;gap:6px;align-items:center;flex-wrap:wrap}html.js .map-actions{display:flex}.map-actions button{border:1px solid #ccd9df;background:#fff;color:#163e52;border-radius:4px;padding:6px 12px;min-height:36px;font-size:14px;cursor:pointer}.map-actions button:hover{background:#ecf3f6}.map-actions button:focus-visible{outline:2px solid #527a8d;outline-offset:2px}.map-selection{font-size:14px;color:#3e5a68;font-weight:700}.map-viewport{position:relative;overflow:hidden;background:#f3f7f9;aspect-ratio:1600/1135;max-height:830px;touch-action:pan-y;cursor:grab}.map-viewport:active{cursor:grabbing}.map-viewport.is-zoomed,.map-widget.is-expanded .map-viewport{touch-action:none}.range-map{display:block;width:100%;height:100%;user-select:none;overflow:hidden}.range-map .port-item{cursor:pointer}.range-map .port-item:hover .label-bg{fill:#fff8e8;opacity:1}.range-map .port-item.is-selected .port-ring{opacity:1}.range-map .port-item.is-selected .label-bg{fill:#fff4d5;opacity:1}.range-map .port-item.is-selected .port-label{font-weight:bold;fill:#792a31}.range-map .port-item:focus{outline:none}.range-map .port-item:focus .label-bg{stroke:#153e52;stroke-width:2}.map-widget.is-expanded{position:fixed;inset:14px;z-index:10000;box-shadow:0 0 0 30px #082b3b99;display:flex;flex-direction:column;margin:0}.map-widget.is-expanded .map-viewport{flex:1;min-height:200px;max-height:none;aspect-ratio:auto}
.investor-image-intro{display:grid;grid-template-columns:.9fr 1.1fr;gap:32px;align-items:center;margin:23px 0 30px;padding-bottom:28px;border-bottom:1px solid #dce5e8}.investor-intro-copy>p{font-size:20px;line-height:1.6;margin:0 0 20px;color:#204457}.investor-intro-copy ul{font-size:16px;line-height:1.55;padding-left:21px;margin:0;color:var(--muted)}.investor-intro-copy li{margin-bottom:13px}.investor-beauty{margin:0;min-width:0}.investor-beauty img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;border-radius:2px}.investor-beauty figcaption{font:500 12px/1.4 Arial,sans-serif;letter-spacing:.035em;color:var(--muted);padding:9px 0 0;margin:0}.investor-layout{display:grid;grid-template-columns:1.08fr .92fr;gap:30px;align-items:start}.investor-copy .section-title{font-size:1.17em;line-height:1.68;margin:24px 0 1em}.investor-copy ul{padding-left:23px}.investor-copy li{margin-bottom:10px}.investor-chart{margin:0;background:#fff;padding:18px;border:1px solid #dbe4e8}.investor-chart .section-title{margin:0 0 20px;font-size:21px;line-height:1.25}.investor-chart img{width:100%;height:auto;display:block;max-width:410px;margin:auto}.chart-legend{display:flex;gap:13px;flex-wrap:wrap;font-size:13px;color:#405a67;margin-top:14px}.chart-legend span{display:flex;align-items:center;gap:6px}.swatch{display:inline-block;width:13px;height:13px;background:#052563}.swatch.green{background:#397c2d}.swatch.yellow{background:#ecb118}
.office-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.office-card{padding:16px 17px;background:#f1f6f7;border:1px solid #d9e4e7}.office-card h4{font-size:18px;color:var(--navy);margin:0 0 7px}.office-card p{font-size:16px;color:var(--muted);margin:0;overflow-wrap:anywhere}.office-card p+p{margin-top:4px}
.photo-dialog{padding:40px 10px 10px;max-width:94vw;max-height:94vh;background:#0b2432;border:0;border-radius:5px;overflow:auto}.photo-dialog::backdrop{background:rgba(3,16,25,.86)}.photo-dialog img{display:block;width:auto;height:auto;max-width:89vw;max-height:82vh;object-fit:contain}.photo-dialog button{position:absolute;right:8px;top:5px;background:transparent;border:1px solid #9dafb9;border-radius:3px;color:#fff;padding:3px 12px;font-size:15px;cursor:pointer}.photo-dialog button:focus-visible{outline:2px solid #fff}
@media(max-width:1080px){.cargo-photo-slots{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
@media(max-width:900px){body{font-size:17px}.brand-row{min-height:90px}.top-contact{display:none}.site-nav a{padding:12px}.panel{padding:26px 22px}.panel .page-title{font-size:27px}.office-grid{grid-template-columns:1fr}}
@media(max-width:800px){.map-toolbar{align-items:flex-start}.map-selection{font-size:12px}.map-actions button{font-size:12px;padding:6px 9px}.investor-layout,.investor-image-intro{grid-template-columns:1fr}.investor-image-intro{gap:18px}.investor-intro-copy>p{font-size:19px}}
@media(max-width:650px){.home-hero-copy{display:block;padding:22px 23px}.beauty-eyebrow{display:block;margin-bottom:8px}.home-hero-copy h1{font-size:31px;margin-bottom:12px}.home-hero-copy p{font-size:15px}}
@media(max-width:600px){.content-wrap{padding-left:10px;padding-right:10px}.panel{padding:24px 16px}.site-nav a{padding:11px 10px;font-size:13px}}
@media(max-width:520px){.typed-brand{gap:9px}.brand-emblem{width:60px;height:60px;flex-basis:60px}.brand-row .brand-emblem img{width:206.36px;height:65.45px;left:-2.7px;top:-1.8px}.brand-cn{font-size:25px}.brand-en{font-size:21px}.logo-sub{font-size:8px;letter-spacing:.1em}.brand-row{padding-top:14px;padding-bottom:14px}.cargo-photo-slots{gap:12px}.panel .cargo-heading .section-title{font-size:22px}.cargo-heading{gap:11px}.map-selection{display:none}.map-widget.is-expanded{inset:6px}.map-viewport{min-height:300px}.home-photo-hero{margin-bottom:15px}.investor-image-intro{margin-top:19px}.investor-intro-copy>p{font-size:18px}.wrap.links{padding-left:10px;padding-right:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media print{.site-nav,.skip-link,.top-contact,.map-actions,.photo-dialog{display:none!important}body{background:#fff;font-size:12px}.brand-row{min-height:85px}.panel{border:0;padding:20px 0}.content-wrap{padding:12px 0 30px}.page-section{display:block!important;break-before:page}.page-section:first-child{break-before:auto}.home-photo-hero,.investor-image-intro,.cargo-section,.office-card{break-inside:avoid}.cargo-photo-slots{grid-template-columns:repeat(4,minmax(0,1fr))}.map-widget{break-inside:avoid}.map-viewport{max-height:none}.home-hero-copy{-webkit-print-color-adjust:exact;print-color-adjust:exact}.investor-layout{display:block}.brand-cn{font-size:23px}.brand-en{font-size:21px}a{color:inherit;text-decoration:none}}