, {open && ( )} ); } // ——— Mega nav function ServiceNav({ currentSlug }) { const [open, setOpen] = useStateSp(null); const i18n = window.__useI18n(); const t = i18n.t; const data = window.SERVICES_DATA; const H = window.SERVICES_HELPERS || {}; const byDiv = {}; data.services.forEach(s => { (byDiv[s.division] = byDiv[s.division] || []).push(s); }); // Resolve translatable mega-menu data fresh each render. URLs stay English. const platFeatured = { eyebrow: t('nav.mega.platform.eyebrow'), title: t('nav.mega.platform.title'), desc: t('nav.mega.platform.desc'), cta: t('nav.mega.platform.cta'), href: platFeatured_HREF, }; const resFeatured = { eyebrow: t('nav.mega.resources.eyebrow'), title: t('nav.mega.resources.title'), desc: t('nav.mega.resources.desc'), cta: t('nav.mega.resources.cta'), href: resFeatured_HREF, }; // Stash slug so the sticky-header CTA can pass it to the quote widget. if (typeof window !== 'undefined') window.__SERVICE_PAGE_SLUG = currentSlug || null; return (

setOpen(null)}>

{[ { label: 'Facebook', href: 'https://www.facebook.com/abgroupshipping', path: 'M22 12.06C22 6.5 17.52 2 12 2S2 6.5 2 12.06c0 5 3.66 9.15 8.44 9.94v-7.03H7.9v-2.91h2.54V9.84c0-2.52 1.49-3.91 3.77-3.91 1.09 0 2.24.2 2.24.2v2.47h-1.26c-1.24 0-1.63.78-1.63 1.57v1.89h2.78l-.44 2.91h-2.34V22c4.78-.79 8.44-4.94 8.44-9.94z' }, { label: 'X', href: 'https://x.com/abgroupshipping', path: 'M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231 5.45-6.231zm-1.161 17.52h1.833L7.084 4.126H5.117l11.966 15.644z' }, { label: 'Instagram', href: 'https://www.instagram.com/abgroupshipping', path: 'M12 2.16c3.2 0 3.58.01 4.85.07 1.17.05 1.8.25 2.23.41.56.22.96.48 1.38.9.42.42.68.82.9 1.38.16.42.36 1.06.41 2.23.06 1.27.07 1.65.07 4.85s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.41 2.23-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.16-1.06.36-2.23.41-1.27.06-1.65.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.23-.41-.56-.22-.96-.48-1.38-.9-.42-.42-.68-.82-.9-1.38-.16-.42-.36-1.06-.41-2.23C2.17 15.58 2.16 15.2 2.16 12s.01-3.58.07-4.85c.05-1.17.25-1.8.41-2.23.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.16 1.06-.36 2.23-.41C8.42 2.17 8.8 2.16 12 2.16M12 0C8.74 0 8.33.01 7.05.07 5.78.13 4.9.33 4.14.63c-.79.31-1.46.72-2.13 1.39C1.34 2.69.93 3.36.62 4.14.33 4.9.13 5.78.07 7.05.01 8.33 0 8.74 0 12s.01 3.67.07 4.95c.06 1.27.26 2.15.56 2.91.31.79.72 1.46 1.39 2.13.67.67 1.34 1.08 2.13 1.39.76.3 1.64.5 2.91.56C8.33 23.99 8.74 24 12 24s3.67-.01 4.95-.07c1.27-.06 2.15-.26 2.91-.56.79-.31 1.46-.72 2.13-1.39.67-.67 1.08-1.34 1.39-2.13.3-.76.5-1.64.56-2.91.06-1.28.07-1.69.07-4.95s-.01-3.67-.07-4.95c-.06-1.27-.26-2.15-.56-2.91-.31-.79-.72-1.46-1.39-2.13C21.31 1.34 20.64.93 19.86.62 19.1.33 18.22.13 16.95.07 15.67.01 15.26 0 12 0zm0 5.84A6.16 6.16 0 1 0 18.16 12 6.16 6.16 0 0 0 12 5.84zm0 10.16A4 4 0 1 1 16 12a4 4 0 0 1-4 4zm6.41-11.85a1.44 1.44 0 1 0 1.44 1.44 1.44 1.44 0 0 0-1.44-1.44z' }, { label: 'LinkedIn', href: 'https://www.linkedin.com/company/abgroupshipping', path: 'M20.45 20.45h-3.56v-5.57c0-1.33-.02-3.04-1.85-3.04-1.85 0-2.14 1.45-2.14 2.94v5.67H9.34V9h3.42v1.56h.05c.48-.9 1.64-1.85 3.37-1.85 3.6 0 4.27 2.37 4.27 5.46v6.28zM5.34 7.43a2.07 2.07 0 1 1 0-4.13 2.07 2.07 0 0 1 0 4.13zM7.12 20.45H3.56V9h3.56v11.45zM22.23 0H1.77C.79 0 0 .77 0 1.72v20.56C0 23.23.79 24 1.77 24h20.45C23.2 24 24 23.23 24 22.28V1.72C24 .77 23.2 0 22.23 0z' }, ].map((s) => ( { e.currentTarget.style.background = '#f2f4f7'; e.currentTarget.style.color = '#1846B0'; }} onMouseLeave={e => { e.currentTarget.style.background = 'transparent'; e.currentTarget.style.color = '#667085'; }}> ))}

{t('nav.signin')} { e.currentTarget.style.background = '#f9fafb'; }} onMouseLeave={(e) => { e.currentTarget.style.background = '#fff'; }} style={{ display: 'inline-flex', alignItems: 'center', gap: 6, padding: '6px 11px', borderRadius: 8, background: '#fff', border: '1px solid #d0d5dd', color: '#101828', fontSize: 12.5, fontWeight: 600, letterSpacing: '-0.005em', textDecoration: 'none', whiteSpace: 'nowrap', transition: 'all 180ms cubic-bezier(0.16,1,0.3,1)' }}> {t('nav.expert')}

{/* Mega panel — Services */} {open === 'services' && (

setOpen('services')}>

{/* Featured tile */}

{t('nav.mega.services.eyebrow')}

{t('nav.mega.services.title')}

{t('nav.mega.services.desc')}

{[t('nav.mega.services.bdg.logistics'), t('nav.mega.services.bdg.fulfillment'), t('nav.mega.services.bdg.trade'), t('nav.mega.services.bdg.storage')].map((b, idx) => ( {b} ))}

{t('nav.mega.services.cta')}

{data.divisions.map(div => (

{H.divLabel ? H.divLabel(div) : div.label}

{byDiv[div.id].map(s => ( e.currentTarget.style.background = '#f9fafb'} onMouseLeave={e => e.currentTarget.style.background = s.slug === currentSlug ? '#f9fafb' : 'transparent'}> {H.svcName ? H.svcName(s) : s.name} ))}

))}

)} {/* Mega panel — Platform */} {open === 'platform' && (

setOpen('platform')}>

{platFeatured.eyebrow}

{platFeatured.title}

{platFeatured.desc}

{['SHIPMENTS','QUOTE','CUSTOMS','FINANCE','API'].map(b => ( {b} ))}

{platFeatured.cta}

{SP_PLAT_SECTIONS_BASE.map(sec => (

{t(sec.labelKey)}

{sec.items.map(it => ( e.currentTarget.style.background = '#f9fafb'} onMouseLeave={e => e.currentTarget.style.background = 'transparent'}>

{t(it.nameKey)}

{t(it.descKey)}

))}

)} {/* Mega panel — Resources */} {open === 'resources' && (

setOpen('resources')}>

{resFeatured.eyebrow}

{resFeatured.title}

{resFeatured.desc}

{['C-TPAT','NVOCC','IAC','HAZMAT','CBW','FMC'].map(b => ( {b} ))}

{resFeatured.cta}

{SP_RES_SECTIONS_BASE.map(sec => (

{t(sec.labelKey)}

{sec.items.map(it => ( e.currentTarget.style.background = '#f9fafb'} onMouseLeave={e => e.currentTarget.style.background = 'transparent'}>

{t(it.nameKey)}

{t(it.descKey)}

))}

)}

{(() => { const C = typeof window !== 'undefined' ? window.ContactModalRoot : null; return C ? : null; })()} ); } const navLink = { display: 'inline-flex', alignItems: 'center', gap: 4, fontSize: 13.5, fontWeight: 500, color: '#344054', textDecoration: 'none', letterSpacing: '-0.005em' }; // ——— Breadcrumbs function Breadcrumbs({ division, name }) { const i18n = window.__useI18n(); const t = i18n.t; return (

{t('shell.crumb.home')} {t('shell.crumb.services')} {division} {name}

); } // ——— Section title block function SectionHeader({ kicker, title, lead, align = 'left' }) { return (

{kicker && (

{kicker}

)}

{title}

{lead && (

{lead}

)}

); } // ——— Stats strip function StatsStrip({ items }) { return (

{items.map((it, i) => (

0 ? '1px solid #eaecf0' : 'none' }}>

{it.label}

{it.value}

{it.note && (

{it.note}

)}

))}

); } // ——— Whats included grid function IncludedGrid({ items }) { return (

{items.map((it, i) => (

{it.title}

{it.desc}

))}

); } // ——— How it works numbered steps function HowItWorks({ steps }) { return (

{/* connector line */}

{steps.map((s, i) => (

{String(i + 1).padStart(2, '0')}

{s.title}

{s.desc}

))}

); } // ——— Customer quote function CustomerQuote({ quote, author, title, company, logo, metric }) { return (

“

{quote}

{(author || '').split(' ').map(n => n[0]).slice(0, 2).join('')}

{author}

{title} · {company}

{metric && (

{metric.value}

{metric.label}

)}

); } // ——— FAQ accordion function FAQ({ items }) { const [open, setOpen] = useStateSp(null); return (

{items.map((it, i) => (

0 ? '1px solid #eaecf0' : 'none' }}> {open === i && (

{it.a}

)}

))}

); } // ——— Related services function RelatedServices({ currentSlug, relatedSlugs }) { const i18n = window.__useI18n(); const t = i18n.t; const H = window.SERVICES_HELPERS || {}; const byS = {}; window.SERVICES_DATA.services.forEach(s => { byS[s.slug] = s; }); const related = (relatedSlugs || []).map(sl => byS[sl]).filter(Boolean); if (!related.length) return null; return (

{t('shell.related.eyebrow')}

{t('shell.related.title')}

{t('shell.related.full')}

{related.slice(0, 4).map(s => (

{H.svcName ? H.svcName(s) : s.name}

{H.svcOne ? H.svcOne(s) : s.one}

{t('shell.related.learn')}

))}

); } // ——— Division CTA block (footer-style, customized per division) function DivisionCTA({ divisionId }) { const i18n = window.__useI18n(); const t = i18n.t; const H = window.SERVICES_HELPERS || {}; const div = window.SERVICES_DATA.divisions.find(d => d.id === divisionId); if (!div) return null; const tt = (key, fallback) => key && t ? t(key) : fallback; const ctaKicker = tt(div.ctaKickerKey, div.ctaKicker); const ctaTitle = tt(div.ctaTitleKey, div.ctaTitle); const ctaPrimary = tt(div.ctaPrimaryKey, div.ctaPrimary); const ctaSecondary = tt(div.ctaSecondaryKey, div.ctaSecondary); const bgByDiv = { logistics: 'linear-gradient(135deg, #0B1220 0%, #1846B0 100%)', fulfillment: 'linear-gradient(135deg, #1E1B4B 0%, #4F46E5 100%)', trade: 'linear-gradient(135deg, #1A1208 0%, #92400E 100%)', }; // Per-page override (e.g. Replenishment uses AB Group blue, not fulfillment indigo) const ctaBg = window.__PAGE_CTA_BG_OVERRIDE || bgByDiv[divisionId] || bgByDiv.logistics; return (

{ctaKicker}

{ctaTitle}

{[ ['2,000+', t('shell.cta.shippers')], ['40+', t('shell.cta.partners')], ['140', t('shell.cta.countries')], ['99.8%', t('shell.cta.ontime')], ].map(([v, l]) => (

{v}

{l}

))}

); } // ——— Page footer function ServiceFooter() { const i18n = window.__useI18n(); const t = i18n.t; return ( ); } const footerLink = { display: 'block', color: 'rgba(255,255,255,0.7)', textDecoration: 'none', padding: '4px 0', fontSize: 13 }; Object.assign(window, { ServiceNav, Breadcrumbs, SectionHeader, StatsStrip, IncludedGrid, HowItWorks, CustomerQuote, FAQ, RelatedServices, DivisionCTA, ServiceFooter, applyAccent, SP_ACCENTS, });