/* VG Shipping Services — 02-1, 02-2, 02-3 PSD implementation. */
.service-page{--ink:#102d4e;--blue:#104580;--red:#ed2535;--pale:#eff3f8;color:var(--ink)}
.service-page main{overflow:clip}.service-page .vg-container{width:min(calc(100% - 200px),1640px)}
.eyebrow{margin:0 0 22px;color:var(--red);font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.eyebrow--white{color:#d9e8f6}
.page-section{padding:88px 0 94px}.page-section.muted{background:var(--pale)}.section-title{margin-bottom:34px}.section-title h2{max-width:900px;margin:0;font-size:clamp(36px,3vw,54px);line-height:1.09;font-weight:700;letter-spacing:-.025em}.section-lead{max-width:880px;margin:18px 0 0;color:#6c8197;font-size:17px;line-height:1.55}.center-cta{text-align:center;margin-top:44px}
.action{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;min-height:55px;padding:15px 25px;border:0;border-radius:3px;color:#fff!important;font-size:14px;font-weight:700;line-height:1.2;text-align:left}.action span{font-size:19px;line-height:1}.action--blue{background:#104780}.action--red{background:#ed2535}.action:hover{filter:brightness(.91);color:#fff!important}.text-link{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;color:#0d4787;font-weight:700;font-size:14px}.text-link span{font-size:19px}.text-link:hover{color:var(--red)}
.service-hero{position:relative;display:flex;align-items:center;min-height:790px;background:#0b3768 var(--hero) center/cover no-repeat;color:#fff}.service-hero__veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,24,46,.78) 0%,rgba(5,29,55,.61) 38%,rgba(5,29,55,.08) 100%)}.service-hero__inner{position:relative;padding:105px 0}.service-hero h1{max-width:800px;margin:0 0 24px;font-size:clamp(48px,4.1vw,80px);line-height:1.07;letter-spacing:-.035em}.service-hero__inner>p:not(.eyebrow){max-width:700px;font-size:18px;line-height:1.6;color:#e0eaf3;margin:0 0 32px}
.intro-bar{background:#f0f4f8;padding:22px 0 45px}.breadcrumbs{display:flex;align-items:center;gap:11px;margin-bottom:42px;font-size:12px;color:#8297aa}.breadcrumbs a:hover{color:var(--red)}.intro-bar__copy{display:grid;grid-template-columns:1fr 1.9fr;gap:50px;align-items:start}.intro-bar h2{margin:0;font-size:26px;line-height:1.17}.intro-bar p{margin:0;color:#677e94;font-size:15px;line-height:1.7}
.service-rows{border-top:1px solid #dce6ef}.service-row{display:grid;grid-template-columns:90px 458px minmax(0,1fr) 36px;gap:24px;align-items:center;padding:26px 0;border-bottom:1px solid #dce6ef;min-height:305px}.service-row img{width:458px;height:260px;object-fit:cover}.row-number{align-self:start;padding-top:13px;color:#9fb7cf;font-size:42px;font-weight:700;line-height:1}.service-row h3,.freight-row h3{margin:0 0 12px;font-size:26px;line-height:1.2}.service-row p,.freight-row p{max-width:720px;margin:0 0 32px;font-size:15px;color:#6e8399}.service-row .text-link{min-width:250px}.row-arrow{font-size:24px;color:#0d4787;align-self:end}.row-arrow:hover{color:var(--red)}
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:44px}.plan-grid article{border-top:2px solid #7ba7cf;padding-top:25px}.plan-grid span{font-size:26px;font-weight:700;color:#a9bfd3}.plan-grid h3{font-size:20px;line-height:1.2;margin:20px 0 12px}.plan-grid p{color:#71869a;font-size:14px}.plan-links{display:grid;grid-template-columns:repeat(2,1fr);gap:16px 40px;margin-top:48px}.plan-links a{padding:14px 0;border-top:1px solid #d0dce8}
.hk-banner{background-color:#0c407a;background-image:linear-gradient(90deg,rgba(6,47,92,.89),rgba(12,65,122,.71)),var(--band);background-position:center,center 53%;background-size:cover;background-repeat:no-repeat;color:#fff;padding:82px 0}.hk-banner__inner{display:grid;grid-template-columns:1.1fr 1fr;gap:100px;align-items:center}.hk-banner h2,.hk-fleet-band h2{color:#fff}.hk-banner p:not(.eyebrow),.hk-fleet-band p:not(.eyebrow){color:#d1dfeb;font-size:16px;line-height:1.6}.hk-banner .action{margin:10px 10px 0 0}
.solution-card{display:grid;grid-template-columns:1.05fr 1fr;min-height:440px;border:1px solid #e0e8ef;background:#fff}.solution-card>img{width:100%;height:100%;min-height:440px;object-fit:cover}.solution-card>div{padding:70px 70px;display:flex;align-items:flex-start;flex-direction:column;justify-content:center}.solution-card h3{font-size:32px;line-height:1.16;margin:0 0 20px}.solution-card p:not(.eyebrow){color:#73879b;margin:0 0 30px}
.resource-grid,.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.resource-grid article>img{width:100%;aspect-ratio:1.72;object-fit:cover;border-radius:5px}.resource-grid article .eyebrow{font-size:12px;margin:20px 0 9px}.resource-grid h3{font-size:25px;margin:0 0 14px}.resource-grid article>p:not(.eyebrow){color:#6c8197;min-height:54px;font-size:15px}.resource-grid .text-link{width:100%;margin-top:22px}
.brands-section{padding-top:58px;padding-bottom:70px}.brands-section .section-title{margin-bottom:0}.brands-section .section-title h2{font-size:28px;letter-spacing:0}.brands-section .eyebrow{font-size:11px;margin-bottom:10px}.brand-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;justify-items:center;gap:56px clamp(40px,4.5vw,90px);width:100%;margin:64px 0 0}.brand-grid img{width:auto;height:auto;max-width:min(100%,205px);max-height:80px;object-fit:contain}
.blogs-section .blog-grid article{background:#fff;overflow:hidden;border-radius:6px}.blog-grid article>img{width:100%;aspect-ratio:1.7;object-fit:cover}.blog-grid article>div{padding:25px 26px}.blog-grid h3{font-size:19px;line-height:1.3;min-height:72px;margin:0 0 20px}.blog-grid .text-link{width:100%}
.faq-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px}.faq-layout .section-title h2{font-size:44px}.faq-layout .section-title .section-lead{font-size:15px}.faq-list{border-top:1px solid #d6e1ec}.faq-list details{border-bottom:1px solid #d6e1ec}.faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:23px 0;font-size:16px;font-weight:700;cursor:pointer}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary span::after{content:'+';font-size:26px;font-weight:400;color:#0c477f}.faq-list details[open] summary span::after{content:'−'}.faq-list details p{margin:0 35px 20px 0;font-size:14px;color:#697e93;line-height:1.7}
.quote-section{background:#10447f;color:#fff;padding:80px 0 90px}.quote-layout{display:grid;grid-template-columns:1fr 1.12fr;gap:120px}.quote-layout h2{font-size:clamp(42px,3.2vw,62px);line-height:1.06;margin:0 0 25px}.quote-layout>div>p:not(.eyebrow){max-width:570px;color:#c4d5e6;font-size:16px}.quote-form{display:grid;gap:20px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.quote-form label{display:grid;gap:8px;font-size:13px;font-weight:700}.quote-form input:not([type=checkbox]),.quote-form select,.quote-form textarea{width:100%;border:1px solid #afc6d9;border-radius:2px;background:#fff;color:#102d4e;padding:13px 14px;min-height:45px;font-size:14px}.quote-form textarea{resize:vertical}.quote-form .consent{display:block;font-weight:400;color:#d3e2f0}.consent input{margin-right:8px}.consent a{text-decoration:underline}.quote-form .action{justify-self:start}.form-message{font-size:12px;color:#b5cfe5;margin:0}
.table-scroll{overflow-x:auto}.compare-section table,.timeline-section table{width:100%;border-collapse:collapse;min-width:700px;font-size:14px}.compare-section th,.timeline-section th{background:#10447f;color:#fff;text-align:left;padding:17px 24px}.compare-section td,.timeline-section td{padding:18px 24px;border-bottom:1px solid #d9e4ee}.compare-section tbody tr:nth-child(even),.timeline-section tbody tr:nth-child(even){background:#eaf1f7}.table-note{font-size:13px;color:#788da0;margin-top:17px}
.freight-list{border-top:1px solid #d7e2ec}.freight-row{display:grid;grid-template-columns:80px minmax(0,1fr) 30px;gap:30px;align-items:center;padding:30px 0;border-bottom:1px solid #d7e2ec;min-height:190px}.freight-row.featured{grid-template-columns:50% 68px minmax(0,1fr);min-height:560px}.freight-row.featured img{width:100%;height:500px;object-fit:cover;grid-column:1;grid-row:1}.freight-row.featured .row-number{grid-column:2;grid-row:1}.freight-row.featured div{grid-column:3;grid-row:1}.freight-row.featured .row-arrow{display:none}.freight-row.featured h3{font-size:34px}.freight-row.featured p{margin-bottom:28px}.freight-row-toggle{all:unset;display:inline;cursor:pointer}.freight-row-toggle:focus-visible{outline:2px solid #0d4787;outline-offset:5px}
.routes-section{padding:100px 0;background-color:#0d3e78;background-image:linear-gradient(90deg,rgba(8,54,106,.9),rgba(8,54,106,.8)),var(--routes);background-position:center;background-size:cover;background-repeat:no-repeat;color:#fff}.routes-section .section-title h2{color:#fff}.routes-top{display:flex;justify-content:space-between;align-items:end;gap:35px}.routes-top>p{max-width:620px;font-size:15px;color:#c9daeb}.route-tabs{display:flex;flex-wrap:wrap;gap:8px}.route-tabs button{border:1px solid #88a7c5;background:transparent;color:#fff;padding:12px 20px;font-weight:700}.route-tabs button[aria-selected=true],.route-tabs button:hover{background:#ed2535;border-color:#ed2535}.route-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:42px}.route-grid article{background:#fff;color:#123456;padding:28px;min-height:200px;display:flex;flex-direction:column}.route-grid article span{color:#88a0b7;font-size:11px;font-weight:700}.route-grid article h3{font-size:26px;margin:24px 0 auto}.route-grid article .text-link{width:100%;margin-top:20px}.route-note{max-width:960px;color:#b8cde1;font-size:14px;margin:35px 0}.routes-section .action{margin:0 14px 0 0}.routes-section .action--blue{background:transparent;border:1px solid #8baccc}
.learning-list{display:grid;gap:1px;background:#dbe5ee}.learning-list article{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:35px;align-items:center;padding:26px 30px;background:#fff}.learning-list h3{font-size:21px;margin:0}.learning-list p{color:#6a8196;margin:0}.learning-list .text-link{justify-self:end}
.fcl-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:35px}.fcl-grid article{padding:42px 47px;background:#eef3f8}.fcl-grid .fcl-primary{background:#0f447e;color:#fff}.fcl-grid h3{font-size:34px;margin:0 0 13px}.fcl-grid article>p:not(.eyebrow){font-size:15px;color:#6d8398;min-height:70px}.fcl-grid .fcl-primary>p:not(.eyebrow){color:#bed4e8}.fcl-grid dl{margin:30px 0}.fcl-grid dl div{padding:12px 0;border-top:1px solid #ccdae6}.fcl-grid .fcl-primary dl div{border-color:#5b87ae}.fcl-grid dt{font-weight:700;font-size:14px}.fcl-grid dd{margin:5px 0 0;color:#71879c;font-size:14px}.fcl-grid .fcl-primary dd{color:#c5d7e8}
.scope-grid,.destination-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.scope-grid article{background:#fff;border-top:3px solid var(--red);padding:35px;display:flex;flex-direction:column;min-height:325px}.scope-grid h3{font-size:24px;margin:5px 0 15px}.scope-grid p:not(.eyebrow){color:#72889b;font-size:15px}.scope-grid .text-link{margin-top:auto}
.cost-list article{display:grid;grid-template-columns:405px minmax(0,1fr) 30px;gap:30px;align-items:center;padding:19px 0;border-bottom:1px solid #d9e5ef}.cost-list img{width:405px;height:228px;object-fit:cover}.cost-list h3{font-size:24px;margin:0 0 12px}.cost-list p{color:#6f8499;max-width:800px}.cost-list article>span{font-size:25px;color:#0d4787}
.process-section{background-color:#0c417b;background-image:linear-gradient(90deg,rgba(7,51,99,.91),rgba(7,51,99,.83)),var(--process);background-position:center;background-size:cover;background-repeat:no-repeat;color:#fff}.process-section .section-title h2{color:#fff}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.process-grid article{background:#fff;color:#133453;padding:30px;min-height:260px}.process-grid span{color:#ed2535;font-size:27px;font-weight:700}.process-grid h3{font-size:20px}.process-grid p{color:#71869a;font-size:14px}
.prep-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.prep-grid article{display:grid;grid-template-columns:55px 1fr;gap:20px;background:#eef3f8;border-left:2px solid #0c4785;padding:26px}.prep-grid span{color:#ed2535;font-weight:700}.prep-grid h3{margin:0 0 10px;font-size:20px}.prep-grid p{margin:0;color:#71869b;font-size:14px}
.hk-fleet-band{padding:90px 0;background:#0d447e;color:#fff}.hk-fleet-band .vg-container{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.hk-fleet-band img{width:100%;aspect-ratio:877/494;object-fit:cover}
.destination-grid article{background:#fff}.destination-grid img{width:100%;aspect-ratio:1.5;object-fit:cover}.destination-grid article>div{padding:25px}.destination-grid h3{font-size:23px;line-height:1.2}.destination-grid p:not(.eyebrow){color:#72869b}
.ocean-brand-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.ocean-brand-grid img{width:100%;aspect-ratio:260/174;object-fit:cover}
@media(max-width:1300px){.service-page .vg-container{width:min(calc(100% - 88px),1640px)}.service-row{grid-template-columns:65px 33% 1fr 25px}.service-row img{width:100%}.quote-layout{gap:65px}.cost-list article{grid-template-columns:32% 1fr 25px}.cost-list img{width:100%}.brand-grid{gap:48px clamp(28px,3.2vw,48px)}.brand-grid img{max-width:min(100%,175px)}}
@media(max-width:900px){.service-page .vg-container{width:min(calc(100% - 42px),1640px)}.page-section{padding:65px 0}.service-hero{min-height:610px}.service-hero__inner{padding:75px 0}.service-hero h1{font-size:clamp(43px,7vw,66px)}.intro-bar__copy,.hk-banner__inner,.faq-layout,.quote-layout{grid-template-columns:1fr;gap:26px}.breadcrumbs{margin-bottom:22px}.service-row{grid-template-columns:55px minmax(150px,32%) 1fr;gap:20px}.service-row .row-arrow{display:none}.service-row img{height:205px}.plan-grid{grid-template-columns:repeat(2,1fr)}.solution-card>div{padding:35px}.resource-grid,.blog-grid,.scope-grid,.destination-grid{gap:14px}.freight-row.featured{grid-template-columns:45% 45px 1fr;gap:15px}.freight-row.featured .row-arrow{display:none}.routes-top{display:block}.route-grid{grid-template-columns:repeat(3,1fr)}.learning-list article{grid-template-columns:1fr 1.4fr;gap:10px}.learning-list .text-link{grid-column:1/-1;justify-self:start}.cost-list article{grid-template-columns:35% 1fr}.cost-list article>span{display:none}.process-grid{grid-template-columns:repeat(2,1fr)}.ocean-brand-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:640px){.service-page .vg-container{width:min(calc(100% - 32px),1640px)}.service-hero{min-height:620px;background-position:62% center}.service-hero__veil{background:linear-gradient(90deg,rgba(4,24,46,.84),rgba(4,24,46,.42))}.service-hero h1{font-size:42px}.service-hero__inner>p:not(.eyebrow){font-size:16px}.section-title h2{font-size:36px}.section-lead{font-size:15px}.service-row{grid-template-columns:42px 1fr;gap:10px;min-height:auto;padding:22px 0}.service-row .row-number{grid-column:1;grid-row:1;font-size:29px}.service-row img{grid-column:2;grid-row:1;width:100%;height:auto;aspect-ratio:1.8}.service-row>div{grid-column:2}.service-row h3{font-size:23px}.plan-grid{gap:18px}.plan-links{grid-template-columns:1fr}.hk-banner{padding:60px 0}.hk-banner .action{margin-bottom:8px}.solution-card{grid-template-columns:1fr}.solution-card>img{min-height:0;aspect-ratio:1.7}.solution-card>div{padding:27px}.resource-grid,.blog-grid,.scope-grid,.destination-grid{grid-template-columns:1fr;gap:28px}.resource-grid article>p:not(.eyebrow){min-height:0}.brands-section{overflow:hidden}.brand-set{grid-template-rows:repeat(2,55px);grid-auto-columns:150px;column-gap:15px}.brand-set img{max-width:140px;max-height:50px}.faq-layout .section-title h2{font-size:35px}.quote-section{padding:62px 0}.quote-layout h2{font-size:42px}.form-grid{grid-template-columns:1fr}.freight-row,.freight-row.featured{display:grid;grid-template-columns:44px 1fr;min-height:0;gap:10px}.freight-row.featured img{grid-column:1/-1;grid-row:1;height:auto;aspect-ratio:1.6}.freight-row.featured .row-number{grid-column:1;grid-row:2}.freight-row.featured div{grid-column:2;grid-row:2}.freight-row .row-number{font-size:28px}.freight-row>div{grid-column:2}.freight-row .row-arrow{display:none}.freight-row h3,.freight-row.featured h3{font-size:22px}.routes-section{padding:70px 0}.route-grid{grid-template-columns:repeat(2,1fr);gap:10px}.route-grid article{padding:18px;min-height:175px}.route-grid article h3{font-size:21px}.route-tabs button{padding:9px 11px;font-size:12px}.learning-list article{grid-template-columns:1fr}.learning-list .text-link{grid-column:auto}.fcl-grid{grid-template-columns:1fr}.fcl-grid article{padding:30px 23px}.fcl-grid article>p:not(.eyebrow){min-height:0}.cost-list article{grid-template-columns:1fr;gap:12px}.cost-list img{height:auto;aspect-ratio:1.78}.process-grid{gap:10px}.process-grid article{min-height:220px;padding:19px}.prep-grid,.hk-fleet-band .vg-container{grid-template-columns:1fr}.ocean-brand-grid{grid-template-columns:repeat(2,1fr)}.page-section{padding:55px 0}}
@media(max-width:1000px){.brand-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 22px}}
@media(max-width:640px){.brand-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 15px;margin-top:35px}.brand-grid img{max-width:min(100%,155px);max-height:64px}}
@media(prefers-reduced-motion:reduce){.service-page *{scroll-behavior:auto}}

/* Photography zoom frames retain the original image dimensions in all service layouts. */
.service-row>.vg-image-zoom{width:min(100%,458px);aspect-ratio:458/260}
.service-row>.vg-image-zoom>img{width:100%;height:100%;object-fit:cover}
.solution-card>.vg-image-zoom{width:100%;min-height:440px;height:100%}
.solution-card>.vg-image-zoom>img{width:100%;height:100%;min-height:440px;object-fit:cover}
.resource-grid article>.vg-image-zoom{width:100%;aspect-ratio:1.72;border-radius:5px}
.resource-grid article>.vg-image-zoom>img{width:100%;height:100%;object-fit:cover}
.blog-grid article>.vg-image-zoom{width:100%;aspect-ratio:1.7}
.blog-grid article>.vg-image-zoom>img{width:100%;height:100%;object-fit:cover}
.freight-row>img,.freight-row>.vg-image-zoom{display:none}
.freight-row.featured>img,.freight-row.featured>.vg-image-zoom{display:block;grid-column:1;grid-row:1;width:100%;height:500px}
.freight-row.featured>.vg-image-zoom>img{width:100%;height:100%;object-fit:cover}
.cost-list article>.vg-image-zoom{display:block;width:100%;aspect-ratio:405/228}
.cost-list article>.vg-image-zoom>img{width:100%;height:100%;object-fit:cover}
.hk-fleet-band .vg-container>.vg-image-zoom{width:100%;aspect-ratio:877/494}
.hk-fleet-band .vg-container>.vg-image-zoom>img{width:100%;height:100%;object-fit:cover}
.destination-grid article>.vg-image-zoom{width:100%;aspect-ratio:1.5}
.destination-grid article>.vg-image-zoom>img{width:100%;height:100%;object-fit:cover}
@media(max-width:900px){.service-row>.vg-image-zoom{aspect-ratio:458/205}}
@media(max-width:640px){
  .service-row>.vg-image-zoom{grid-column:2;grid-row:1;width:100%;aspect-ratio:1.8}
  .solution-card>.vg-image-zoom,.solution-card>.vg-image-zoom>img{min-height:0}
  .solution-card>.vg-image-zoom{height:auto;aspect-ratio:1.7}
  .freight-row.featured>.vg-image-zoom{grid-column:1/-1;grid-row:1;height:auto;aspect-ratio:1.6}
  .cost-list article>.vg-image-zoom{aspect-ratio:1.78}
}
