[hidden]{display:none!important}
@font-face{font-family:"Archivo";src:url(../fonts/archivo-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--navy:#0B2545;--navy-deep:#071A33;--harbour:#0E4D5C;--slate:#33445A;--grey:#5A687A;--line:#D5DBE2;--pale:#EEF0F2;--mist:#F4F7F1;--lime:#8CC63F;--lime-hi:#A8D86A;--teal:#19C3B1;--green-ink:#3E7B1E;--teal-ink:#0F766E;--error:#B42318;--focus:#0F766E;--radius-btn:999px;--radius-card:16px;--shadow-1:0 1px 2px rgba(7,26,51,.06),0 8px 24px rgba(7,26,51,.08);--shadow-2:0 2px 4px rgba(7,26,51,.08),0 24px 48px rgba(7,26,51,.16);
--signal:linear-gradient(100deg,#8CC63F 0%,#19C3B1 100%);--signal-ink:linear-gradient(100deg,#3E7B1E,#0F766E);
--night:radial-gradient(60% 80% at 85% 10%,rgba(25,195,177,.22),transparent 60%),linear-gradient(160deg,#071A33 0%,#0B2545 55%,#0E4D5C 100%);
--dawn:radial-gradient(40% 60% at 10% 0%,rgba(140,198,63,.18),transparent 70%),radial-gradient(35% 55% at 95% 30%,rgba(25,195,177,.14),transparent 70%),#fff;
--pad:48px;--gap:24px;--sec:136px;--head-gap:56px}
/* surface-scoped focus colour (plan 2.5) */
.hero,.band-dark,.marquee,.site-footer,.mobile-nav.dark{--focus:#8CC63F}
.band-signal{--focus:#0B2545}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;font:400 17px/1.6 "Archivo",system-ui,sans-serif;color:var(--navy);background:#fff;-webkit-font-smoothing:antialiased}
img,video,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.skip{position:absolute;left:-999px}
.skip:focus{left:12px;top:12px;z-index:99;background:#fff;padding:8px}
.wrap{max-width:1440px;margin:0 auto;padding:0 var(--pad)}

/* type: Archivo, weight axis only. Headings 600, .thin phrases 300 (plan 3) */
.display{font-weight:600;font-size:clamp(44px,6.6vw,100px);line-height:.98;letter-spacing:-.035em}
h1,.h1{font-weight:600;font-size:clamp(38px,5.2vw,76px);line-height:1.02;letter-spacing:-.03em}
.h2{font-weight:600;font-size:clamp(32px,4.1vw,60px);line-height:1.04;letter-spacing:-.025em;max-width:14em}
.h3{font-weight:600;font-size:clamp(20px,1.7vw,26px);line-height:1.2;letter-spacing:-.012em}
.thin{font-weight:300}
.count{font-weight:700;font-size:clamp(52px,6vw,92px);line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.lead{font-weight:400;font-size:clamp(18px,1.5vw,21px);line-height:1.5;color:var(--slate);max-width:36em}
.label,.eyebrow{font-weight:600;font-size:13px;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;color:var(--grey)}
.eyebrow::before,.ed-label:not(.crumbs)::before{content:"";display:inline-block;width:20px;height:2px;background:var(--lime);vertical-align:middle;margin-right:10px}
.label.map-cap{font-weight:400;font-size:14px;letter-spacing:0;text-transform:none}
.small{font-size:14px;line-height:1.45;color:var(--grey);margin-top:20px}
.small a{color:var(--teal-ink)}
.quote-text{font-weight:500;font-size:clamp(20px,1.8vw,26px);line-height:1.35;letter-spacing:-.01em}
.big-text{font-weight:500;font-size:clamp(24px,2.5vw,36px);line-height:1.3;letter-spacing:-.01em}
.grad,.grad-ink{-webkit-box-decoration-break:clone;box-decoration-break:clone;-webkit-background-clip:text;background-clip:text;color:transparent}
.grad{background-image:var(--signal)}
.grad-ink{background-image:var(--signal-ink)}

/* bands (plan 2.3) */
.band-dark{background:var(--night);color:#fff}
.band-signal{background:var(--signal);color:var(--navy)}
.band-dawn{background:var(--dawn)}
.band-pale{background:var(--pale)}
.band-mist{background:var(--mist)}
.band-dark .label,.band-dark .eyebrow,.band-dark .small{color:#C9D3DF}
.band-dark .lead{color:#C9D3DF}
.band-dark p a,.band-dark li a:not(.btn):not(.link),.band-dark .small a{color:var(--lime)}
p+p{margin-top:1em}

/* actions: one button, one quiet link */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 26px;background:var(--navy);color:#fff;border:0;border-radius:var(--radius-btn);font-weight:600;font-size:16px;line-height:1;letter-spacing:.005em;text-decoration:none;cursor:pointer;transition:background .2s var(--ease-out),color .2s var(--ease-out),transform .2s var(--ease-out),box-shadow .2s var(--ease-out)}
.btn:hover{background:var(--harbour);transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98);transition-duration:.1s}
.btn .arr,.link .arr{display:inline-block}
.btn .arr{transition:transform .3s var(--ease-spring)}
.link .arr{transition:transform .3s var(--ease-out)}
.btn:hover .arr,.link:hover .arr{transform:translateX(4px)}
.btn.btn-lime{background:var(--lime);color:var(--navy)}
.btn.btn-lime:hover{background:var(--lime-hi);box-shadow:0 8px 24px rgba(140,198,63,.35)}
.btn.btn-ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}
.btn.btn-ghost:hover{background:color-mix(in srgb,currentColor 8%,transparent)}
.band-dark .btn.btn-ghost,.hero .btn.btn-ghost,.site-footer .btn.btn-ghost{color:#fff}
.band-signal .btn:hover{background:var(--navy-deep)}
.link{display:inline-flex;align-items:center;gap:6px;min-height:44px;background:none;border:0;padding:0;color:var(--teal-ink);font-weight:500;font-size:16px;text-decoration:none;cursor:pointer;background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-position:0 calc(100% - 10px);background-repeat:no-repeat;transition:background-size .3s var(--ease-out)}
.link:hover{background-size:100% 1px}
.link-light,.band-dark .link,.site-footer .link,.marquee .link{color:var(--lime)}
.hero .link{color:#fff;font-weight:600}
.hero .link .arr{color:var(--lime)}
.band-signal .link{color:var(--navy)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 32px;margin-top:36px}
p a,li a:not(.btn):not(.link),dd a{color:var(--teal-ink)}

/* banner + header */
.proto-banner{background:var(--pale);color:var(--navy);font-size:13px;line-height:1.35;text-align:center;padding:8px 16px}
.site-header{position:sticky;top:0;z-index:40;background:#fff;color:var(--navy);border-bottom:1px solid var(--line);transition:background .3s var(--ease-out),color .3s var(--ease-out),border-color .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.site-header.scrolled{box-shadow:var(--shadow-1)}
.hdr{display:flex;align-items:center;gap:40px;height:76px;transition:height .3s var(--ease-out)}
@media (min-width:1024px){.site-header.scrolled .hdr{height:64px}}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;font-size:15px;letter-spacing:.08em;white-space:nowrap}
.logo-mark svg{width:32px;height:32px}
.logo-text b{font-weight:600}
.main-nav{display:flex;gap:36px;margin-left:auto;font-size:15px}
.main-nav a{position:relative;text-decoration:none;padding:6px 0}
.main-nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--lime);transform:scaleX(0);transition:transform .25s var(--ease-out)}
.main-nav a:hover::after,.main-nav a:focus-visible::after,.main-nav a[aria-current]::after{transform:scaleX(1)}
.hdr-actions .btn{min-height:44px;padding:10px 22px;font-size:15px}
.home .site-header:not(.scrolled){--focus:#8CC63F}
.home .site-header:not(.scrolled) .hdr-actions .btn{background:var(--lime);color:var(--navy)}
.home .site-header:not(.scrolled) .hdr-actions .btn:hover{background:var(--lime-hi);box-shadow:0 8px 24px rgba(140,198,63,.35)}
.menu-btn{display:none;margin-left:auto;background:none;border:0;padding:10px 0 10px 32px;min-height:44px;font-size:15px;cursor:pointer;color:inherit;position:relative}
.menu-btn::before{content:"";position:absolute;left:0;top:50%;width:22px;height:1.5px;background:currentColor;box-shadow:0 -6px 0 currentColor,0 6px 0 currentColor}
.menu-btn[aria-expanded=true]::before{box-shadow:none}
.mobile-nav{position:absolute;left:0;right:0;top:100%;background:#fff;color:var(--navy);padding:8px var(--pad) 28px;border-bottom:1px solid var(--line)}
.mobile-nav a:not(.btn){display:block;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:24px;font-weight:500}
.mobile-nav .btn{margin-top:20px;width:100%}
.home .site-header{position:absolute;top:auto;left:0;right:0;background:transparent;color:#fff;border-bottom-color:rgba(255,255,255,.18)}
.home .site-header.scrolled{position:fixed;top:0;background:#fff;color:var(--navy);border-bottom-color:var(--line)}

/* sections */
.section{padding:var(--sec) 0}
.section.tight{padding-top:calc(var(--sec)*.5)}
.pale{background:var(--pale)}
.ed{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.ed-label{grid-column:1/4;padding-top:.7em}
.ed-main{grid-column:4/13}
.ed-main.narrow{grid-column:4/11}
.sec-head{margin-bottom:var(--head-gap)}
.sec-head .h2{max-width:13em}

/* reveal */
:root{--ease-out:cubic-bezier(.2,.7,.2,1);--ease-spring:cubic-bezier(.34,1.56,.64,1)}
html.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);transition-delay:calc(var(--i,0)*80ms)}
html.js .reveal.in{opacity:1;transform:none}
html.js .reveal.rv-done{transition:opacity .7s var(--ease-out),transform .3s var(--ease-out),box-shadow .3s var(--ease-out);transition-delay:0s}
html.js .reveal-img .ph img{transform:scale(1.06);transition:transform 1.2s var(--ease-out)}
html.js .reveal-img.in .ph img{transform:none}
html.js .stat .bar{transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease-out) .2s}
html.js .stat.in .bar{transform:none}
html.motion-off *,html.motion-off *::before,html.motion-off *::after{animation-play-state:paused!important}
html.motion-off .reveal,html.motion-off .reveal-img .ph img,html.motion-off .stat .bar{opacity:1;transform:none;transition:none}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* counters (plan 5.3, 6.1) */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--gap);row-gap:56px}
.stat .bar{display:block;width:48px;height:4px;border-radius:2px;background:var(--signal);margin-bottom:20px}
.stat .count [data-count]{display:inline-block;min-width:var(--w,6ch)}
.stat-label{margin-top:12px;color:var(--slate);font-size:17px;line-height:1.4;max-width:14em}
.stats-wrap{padding-bottom:calc(var(--sec)*.7)}
.stats-wrap .h2{margin-bottom:72px}
.stats-note{margin-top:44px}

/* card lift (plan 7.3) */
.tile,.lift{transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.tile .ph img,.lift .ph img,.svc .ph img{transition:transform .9s var(--ease-out)}
@media (hover:hover) and (pointer:fine){
.tile:hover,.lift:hover{transform:translateY(-6px);box-shadow:var(--shadow-2)}
html.js .reveal.in.tile:hover,html.js .reveal.in.lift:hover{transform:translateY(-6px)}
.tile:hover .ph img,.lift:hover .ph img,.svc:hover .ph img{transform:scale(1.05)}
}

/* service bento (plan 5.4, 6.3) */
.bento-sec .h2{margin-top:20px;margin-bottom:72px}
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(280px,auto);gap:var(--gap)}
.t-air{grid-column:1/3;grid-row:1/3}
.t-sea{grid-column:3/5;grid-row:1}
.t-customs{grid-column:3;grid-row:2}
.t-land{grid-column:4;grid-row:2}
.t-project{grid-column:1;grid-row:3}
.t-reloc{grid-column:2;grid-row:3}
.t-ware{grid-column:3;grid-row:3}
.t-ecom{grid-column:4;grid-row:3}
.bento .tile{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border-radius:var(--radius-card);text-decoration:none;color:#fff;padding:28px}
.tile-body{position:relative;z-index:1;padding-right:56px}
.tile h3{font-weight:600;font-size:clamp(22px,1.9vw,28px);line-height:1.15;letter-spacing:-.012em}
.t-air h3{font-size:clamp(28px,2.6vw,38px)}
.tile p{margin-top:10px;font-size:16px;line-height:1.45;max-width:30em}
.tile p+p{margin-top:10px}
.tile-photo{background:var(--navy)}
.tile-photo .ph{position:absolute;inset:0;z-index:-1;border-radius:0;background:var(--navy)}
.tile-photo .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,26,51,0) 35%,rgba(7,26,51,.88) 100%)}
.tile-photo p{color:#fff}
.tile-navy{background:var(--navy)}
.tile-harbour{background:var(--harbour)}
.tile-navy p,.tile-harbour p{color:#C9D3DF}
.bento .tile-white{background:#fff;color:var(--navy);box-shadow:inset 0 0 0 1px var(--line)}
/* icon tiles: keep the text block clear of the absolute icon (28 + 48 + 20) */
.bento .tile-navy,.bento .tile-harbour,.bento .tile-white{padding-top:96px}
.tile-white p{color:var(--slate)}
.bento .tile>.ico{position:absolute;top:28px;left:28px;width:48px;height:48px;color:var(--lime)}
.t-reloc>.ico{color:var(--green-ink)}
.t-ecom>.ico{color:var(--teal-ink)}
.tile-go{position:absolute;right:0;bottom:0;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--lime);color:var(--navy);font-size:18px;line-height:1}
.tile-white .tile-go{background:var(--navy);color:#fff}
.tile:focus-visible,html.js .reveal.in.tile:focus-visible{transform:translateY(-6px);box-shadow:var(--shadow-2)}
.tile::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;opacity:0;transition:opacity .3s;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(140,198,63,.16),transparent 60%)}
.tile-photo::after{background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.10),transparent 60%)}
.bento-sec{padding-bottom:calc(var(--sec)*.75)}
.bento-more{margin-top:40px}
@media (hover:hover) and (pointer:fine){
.tile-go{opacity:.6;transform:translateX(-6px);transition:opacity .3s var(--ease-out),transform .3s var(--ease-out)}
.tile:hover .tile-go,.tile:focus-visible .tile-go{opacity:1;transform:none}
.tile:hover::after{opacity:1}
.bento .tile:hover,html.js .reveal.in.tile:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(-6px)}
}

/* images */
.ph{overflow:hidden;background:var(--pale);border-radius:var(--radius-card)}
/* colour tiles stand in for a photo: mesh glow, dot texture and a ringed icon, so they read as designed panels, not missing images */
.ph-tile{position:relative;isolation:isolate;display:grid;place-items:center}
.ph-tile::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle,currentColor 1.2px,transparent 1.6px) 0 0/18px 18px;opacity:.18;-webkit-mask-image:radial-gradient(70% 70% at 70% 30%,#000,transparent);mask-image:radial-gradient(70% 70% at 70% 30%,#000,transparent)}
.ph-tile::after{content:"";position:absolute;left:50%;top:50%;z-index:-1;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;border:1px solid currentColor;opacity:.35;box-shadow:0 0 0 22px rgba(255,255,255,.05)}
.ph-tile .ico{width:56px;height:56px}
.ph-harbour{background:radial-gradient(70% 90% at 90% 10%,rgba(140,198,63,.30),transparent 60%),radial-gradient(60% 80% at 0% 100%,rgba(25,195,177,.35),transparent 60%),var(--harbour);color:var(--lime)}
.ph-navy{background:radial-gradient(70% 90% at 90% 10%,rgba(25,195,177,.38),transparent 60%),radial-gradient(60% 80% at 0% 100%,rgba(140,198,63,.30),transparent 60%),var(--navy);color:var(--lime)}
.ph-white{background:radial-gradient(70% 90% at 90% 10%,rgba(25,195,177,.30),transparent 60%),radial-gradient(70% 90% at 0% 100%,rgba(140,198,63,.38),transparent 60%),#EEF6F1;color:var(--teal-ink)}
.ico{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.ph img{width:100%;height:100%;object-fit:cover}
.r43{aspect-ratio:4/3}.r45{aspect-ratio:4/5}.r11{aspect-ratio:1/1}.r32{aspect-ratio:3/2}.r34{aspect-ratio:3/4}.r1610{aspect-ratio:16/10}.r219{aspect-ratio:21/9}

/* hero */
.hero{position:relative;display:flex;align-items:flex-end;min-height:clamp(720px,calc(100vh - 34px),1000px);color:#fff;overflow:hidden;background:var(--navy)}
.hero video,.hero .hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-scrim{position:absolute;inset:0;background:radial-gradient(70% 90% at 0% 100%,rgba(7,26,51,.78),transparent 70%),linear-gradient(180deg,rgba(11,37,69,.55) 0%,rgba(11,37,69,.12) 30%,rgba(11,37,69,.18) 55%,rgba(11,37,69,.72) 100%)}
.hero-inner{position:relative;width:100%;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:end;padding-top:128px;padding-bottom:40px}
.hero-copy{grid-column:1/8;grid-row:1}
.hero .eyebrow{color:#C9D3DF}
.hero .display{max-width:9em;margin-top:20px}
.hero-sub{margin-top:28px;max-width:34em;font-size:19px;line-height:1.5;color:#fff}
.hero-copy .actions{margin-top:16px}
.hero-foot{grid-column:1/13;grid-row:2;display:flex;justify-content:space-between;align-items:center;margin-top:56px;padding-top:20px;border-top:1px solid rgba(255,255,255,.25);font-size:14px;color:rgba(255,255,255,.88)}
/* quick-quote card (plan 6.8): solid white so navy on white keeps its contrast over the moving video */
.qq{grid-column:9/13;grid-row:1;background:#fff;color:var(--navy);border-radius:var(--radius-card);box-shadow:var(--shadow-2);padding:28px;--focus:#0F766E}
.qq label{margin:14px 0 6px}
.qq .h3{max-width:none}
.qq-mode{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-top:18px;padding:4px;border:1px solid var(--line);border-radius:999px}
.qq-mode label{position:relative;margin:0;color:var(--navy);font-size:15px;cursor:pointer}
.qq-mode input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.qq-mode span{display:block;padding:10px 8px;border-radius:999px;text-align:center;font-weight:600;line-height:1.2;transition:background .2s var(--ease-out),color .2s var(--ease-out)}
.qq-mode input:not(:checked)+span:hover{background:var(--pale)}
.qq-mode input:checked+span{background:var(--navy);color:#fff}
.qq-mode input:focus-visible+span{outline:2px solid var(--focus);outline-offset:2px}
.qq .btn{width:100%;margin-top:22px}
.qq .small{margin-top:12px}
.pause{background:rgba(11,37,69,.55);color:#fff;border:1px solid rgba(255,255,255,.5);border-radius:2px;padding:7px 14px;font-size:14px;cursor:pointer}
.pause:hover{background:rgba(11,37,69,.85)}
.loop .pause{position:absolute;right:0;bottom:0}

/* lanes marquee (plan 5.2, 6.4): overflow is contained in .marquee and .mq-viewport, never 100vw */
.marquee{background:var(--navy-deep);color:#fff;overflow:hidden}
.mq-row{display:flex;align-items:center;gap:24px;min-height:72px;padding:0 var(--pad)}
.mq-label{flex:none;margin:0;color:#C9D3DF}
.mq-viewport{flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}
.mq-viewport::-webkit-scrollbar{display:none}
.mq-list{display:flex;flex:none;gap:40px;padding-right:40px}
.mq-list li{display:flex;align-items:center;gap:12px;white-space:nowrap;font-size:26px;font-weight:600;line-height:1.2}
.mq-list li::after{content:"";width:8px;height:8px;margin-left:28px;border-radius:50%;background:var(--lime);flex:none}
.mq-list b{font-weight:600}
.mq-list .mode{font-size:14px;font-weight:500;color:#C9D3DF}
.pause-sm{flex:none;min-height:36px;padding:6px 14px;font-size:13px;white-space:nowrap;border-radius:999px}
html.js .mq-viewport{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
html.js .mq-track{display:flex;width:max-content;animation:mq var(--mq-dur,80s) linear infinite}
html:not(.js) .mq-list+.mq-list{display:none}
@keyframes mq{to{transform:translateX(-50%)}}
.marquee:focus-within .mq-track{animation-play-state:paused}
@media (hover:hover) and (pointer:fine){.marquee:hover .mq-track{animation-play-state:paused}}

/* home intro */
.intro .h2{grid-column:3/8}
.intro .ed-label{grid-column:1/3}
.intro-aside{grid-column:9/13;grid-row:1/3}
.intro-aside .ph{margin-bottom:28px}
.intro-aside p{color:var(--slate)}
.intro-aside p:first-of-type{color:var(--navy);font-size:20px;line-height:1.45}
.intro-img2{grid-column:3/6;margin-top:120px}

/* services: loose asymmetric photo grid */
.svc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:72px;align-items:start}
.svc{display:block;text-decoration:none;color:var(--navy)}
.svc .ph{margin-bottom:20px}
.svc h3{font-weight:600;font-size:26px;line-height:1.2;letter-spacing:-.01em}
.svc p{margin-top:8px;color:var(--slate);font-size:16px;max-width:30em}
.svc:hover h3{color:var(--teal-ink)}
.svc-grid>:nth-child(1){grid-column:1/7}
.svc-grid>:nth-child(2){grid-column:8/13;margin-top:112px}
.svc-grid>:nth-child(3){grid-column:2/6}
.svc-grid>:nth-child(4){grid-column:7/12;margin-top:72px}
.svc-grid>:nth-child(5){grid-column:1/6}
.svc-grid>:nth-child(6){grid-column:7/13;margin-top:112px}
.svc-grid>:nth-child(7){grid-column:3/7}
.svc-grid>:nth-child(8){grid-column:8/12;margin-top:64px}
.svc-more{margin-top:72px}

/* world route map (plan 5.5, 6.2): light colours by default, dark overrides below. Box ratio always 1470/680, svg uses meet so no hub is cropped. */
.map-box{position:relative}
.map-box .pause{position:absolute;right:12px;bottom:12px;background:#fff;color:var(--navy);border-color:rgba(11,37,69,.35)}
.map-box .pause:hover{background:var(--pale);border-color:var(--navy)}
.lanes-map{position:relative;overflow:hidden}
.lm-in{aspect-ratio:1470/680}
.loop svg{width:100%;height:auto}
.map-panel{padding:24px;border-radius:var(--radius-card);overflow:hidden}
.land circle{fill:#C3CCD7}
.route{fill:none;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:240 760;stroke-dashoffset:240;animation:draw linear infinite}
.route-base{fill:none;stroke-width:1.75;opacity:.5}
.route-base[data-mode="air"]{stroke-dasharray:10 8}
.route-base[data-mode="land"]{stroke-dasharray:2 6;stroke-linecap:round}
.packet{fill:var(--navy);animation:move linear infinite}
.node .core{fill:var(--navy)}
.node .pulse{fill:none;stroke:var(--teal-ink);stroke-width:1.5;opacity:0;transform-origin:center;transform-box:fill-box;animation:pulse 4s ease-out infinite}
.node text{fill:var(--navy);font:500 15px/1 "Archivo",sans-serif;letter-spacing:.1em;paint-order:stroke;stroke:rgba(255,255,255,.85);stroke-width:4px;stroke-linejoin:round}
.map-cap{margin-top:20px}
.band-dark .loop .land circle,.loop.band-dark .land circle{fill:rgba(255,255,255,.34)}
.band-dark .loop .route-base,.loop.band-dark .route-base{opacity:.7}
.band-dark .loop .packet,.loop.band-dark .packet{fill:#fff}
.band-dark .loop .node .core,.loop.band-dark .node .core{fill:#C9D3DF}
.band-dark .loop .node .pulse,.loop.band-dark .node .pulse{stroke:var(--teal)}
.band-dark .loop .node text,.loop.band-dark .node text{fill:#C9D3DF;stroke:rgba(7,26,51,.85)}
.band-dark .map-box .pause{background:rgba(7,26,51,.6);color:#fff;border:1px solid rgba(255,255,255,.5);border-radius:999px}
.band-dark .map-box .pause:hover{background:rgba(7,26,51,.9);border-color:#fff}
/* mode filter: lanes of the other modes fade and stop moving. JS sets data-mode on .lanes-map; a map built for one mode carries data-show on its svg. */
.route,.route-base,.packet{transition:opacity .4s}
.lanes-map[data-mode="sea"] [data-mode]:not([data-mode="sea"]),.lanes-map[data-mode="air"] [data-mode]:not([data-mode="air"]),.lanes-map[data-mode="land"] [data-mode]:not([data-mode="land"]),
svg[data-show="sea"] [data-mode]:not([data-mode="sea"]),svg[data-show="air"] [data-mode]:not([data-mode="air"]),svg[data-show="land"] [data-mode]:not([data-mode="land"]){opacity:.12;animation-play-state:paused!important}
.route.hot{stroke-width:3.5;filter:drop-shadow(0 0 6px rgba(140,198,63,.6))}
@keyframes draw{from{stroke-dashoffset:240}to{stroke-dashoffset:-760}}
@keyframes move{from{offset-distance:0%}to{offset-distance:100%}}
@keyframes pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.4);opacity:0}}
.is-paused *,.is-offscreen *{animation-play-state:paused!important}

/* air / sea / land lanes band (plan 5.5, 6.2). One grid owns the spacing, so the head gap is --head-gap and no child sets a margin-top (plan 9.1). */
.lanes{display:grid;grid-template-columns:minmax(0,1fr);row-gap:var(--head-gap)}
.lanes-head .h2{margin-top:16px}
.lanes-head .lead{margin-top:20px}
.lanes-body{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr;column-gap:var(--gap);row-gap:0;align-items:start}
.lane-tabs{grid-column:1/5;grid-row:1;position:relative;display:flex;border-bottom:1px solid rgba(201,211,223,.2)}
.lane-panels{grid-column:1/5;grid-row:2}
/* map takes the 8 right columns and bleeds into the right page margin, centred on the lane list so no empty block sits under it */
.lanes-view{grid-column:5/13;grid-row:1/3;align-self:center;margin-right:calc(var(--pad)*-1)}
/* pause sits in its own strip under the map, never on a hub; right edge follows the bleed per breakpoint */
.lanes-view .map-box{padding-bottom:56px}
.lanes-view .map-box .pause{bottom:0;right:var(--pad)}
.lane-tabs button{appearance:none;background:none;border:0;color:#C9D3DF;font-size:15px;font-weight:600;line-height:1;padding:16px 22px;cursor:pointer;transition:color .2s}
.lane-tabs button:hover,.lane-tabs button[aria-selected="true"]{color:#fff}
.tab-ind{position:absolute;left:0;bottom:-1px;height:3px;width:var(--w,0);transform:translateX(var(--x,0));background:var(--signal);transition:transform .35s cubic-bezier(.34,1.56,.64,1),width .35s}
.lane-panel{padding-top:28px}
.lane-panel+.lane-panel{margin-top:32px}
.lane-key{display:flex;align-items:center;margin-top:10px;color:#C9D3DF}
.key{flex:none;width:36px;margin-right:12px;border-top:2px solid var(--lime)}
.key-air{border-top-style:dashed}
.key-land{border-top:3px dotted var(--lime)}
.lane-panel ul{margin-top:16px}
.lane-panel li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-top:1px solid rgba(201,211,223,.2);font-weight:500;transition:border-color .2s}
.lane-panel li:last-child{border-bottom:1px solid rgba(201,211,223,.2)}
.lane-panel li span+span{flex:none;font-weight:400;color:#C9D3DF;white-space:nowrap}
.lane-panel li:hover,.lane-panel li:focus-visible{border-top-color:var(--lime)}
.lane-panel .link{display:inline-block;margin-top:24px}
.map-swipe{display:none}
html:not(.js) [role="tablist"]{display:none}
@media (max-width:1023px){
.lanes-body{grid-template-columns:minmax(0,1fr);grid-template-rows:none;row-gap:24px}
.lane-tabs,.lane-panels,.lanes-view{grid-column:1/-1;grid-row:auto}
.lane-tabs{order:1;align-self:start;width:max-content;max-width:100%}
.lanes-view{order:2;align-self:auto;margin-right:0}
.lanes-view .map-box .pause{right:0}
.lanes-view .lanes-map .node text{font-size:20px;stroke-width:5px}
.lane-panels{order:3}
.lane-panel{padding-top:0}
}
@media (max-width:767px){.lane-tabs{width:100%}}


/* feature (warehousing) */
.feat-img{grid-column:1/8}
.feat-text{grid-column:9/13;align-self:end}
.feat-text .label{margin-bottom:24px}
.feat-text p{margin-top:24px;color:var(--slate)}
.plain-list{margin-top:28px;border-top:1px solid var(--line)}
.plain-list li{padding:12px 0;border-bottom:1px solid var(--line)}
.feat-img2{grid-column:9/12;margin-top:-1px}

/* steps */
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap)}
.steps li{background:#fff;border:1px solid var(--line);border-radius:var(--radius-card);padding:24px}
.steps h3{font-weight:600;font-size:24px;margin-bottom:10px}
.steps p{color:var(--slate);font-size:16px}

/* closing CTA + footer */
/* why MWL (plan 5.6) */
.why-sec .h2{margin:20px 0 var(--head-gap)}
.why-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:stretch}
.why-photo{grid-column:1/7}
/* photo follows the card list's height (img is out of flow), so the cards are not stretched to a 4:5 photo */
.why-photo .ph{position:relative;aspect-ratio:auto;height:100%;min-height:360px}
.why-photo .ph img{position:absolute;inset:0}
.why-list{grid-column:7/13;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.why-card{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff 55%,#F3F8F6);border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--line);padding:28px}
/* short Signal accent on top that runs the full width on hover */
.why-card::before{content:"";position:absolute;left:0;top:0;width:100%;height:4px;background:var(--signal);transform:scaleX(.22);transform-origin:left;transition:transform .5s var(--ease-out)}
.why-n{display:inline-grid;place-items:center;min-width:40px;height:28px;padding:0 10px;border-radius:999px;background:var(--navy);color:var(--lime);font-size:14px;font-weight:600;letter-spacing:.04em;font-variant-numeric:tabular-nums;margin-bottom:20px}
.why-card p{margin-top:10px;color:var(--slate);font-size:16px;line-height:1.5}
@media (hover:hover) and (pointer:fine){.why-card:hover{box-shadow:var(--shadow-2)}.why-card:hover::before{transform:none}}

/* case study + testimonials (plan 5.7, 6.5) */
.case-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center}
.case-photo{grid-column:1/8;grid-row:1}
.case-side{grid-column:7/13;grid-row:1;position:relative;z-index:1;min-width:0}
.case-story{background:#fff;border-radius:var(--radius-card);box-shadow:var(--shadow-1);padding:40px}
.case-story .h2{font-size:clamp(28px,2.9vw,42px);margin:16px 0 20px;max-width:none}
.case-story p:not(.eyebrow){color:var(--slate)}
.case-result{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);margin-top:var(--gap);padding:28px;border-radius:var(--radius-card)}
.rn{font-weight:700;font-size:40px;line-height:1.05;letter-spacing:-.03em;color:#fff;font-variant-numeric:tabular-nums}
.rl{margin-top:8px;font-size:14px;line-height:1.4;color:#C9D3DF}
.tm-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);margin-top:var(--head-gap)}
.tm{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border-radius:var(--radius-card);box-shadow:var(--shadow-1);padding:32px;min-width:0}
.tm-mark{width:40px;height:40px;margin-bottom:12px}
.tm blockquote{margin:0;flex:1}
.tm figcaption{margin-top:20px;font-size:15px;line-height:1.4;color:var(--slate)}
.tm figcaption b{font-weight:600;color:var(--navy)}
.tm figcaption span{color:var(--grey)}
.tag{display:inline-block;margin-top:16px;padding:4px 12px;border:1px solid var(--teal-ink);border-radius:999px;color:var(--teal-ink);font-size:13px;font-weight:500;line-height:1.4}

/* global network and hubs (plan 5.8, 6.9) */
.net-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.net-head{grid-column:1/5}
.net-head .h2{margin:20px 0 24px}
.net-body{color:var(--slate);margin-bottom:20px}
.net-cards{grid-column:5/13;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap)}
.net-card{grid-column:span 2;display:flex;flex-direction:column;background:#fff;border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--line);padding:28px;min-width:0}
.net-card:nth-child(n+4){grid-column:span 3}
.net-card .h3{font-size:clamp(20px,1.5vw,24px)}
.net-card .ex{font-size:13px;font-weight:400;color:var(--grey);letter-spacing:0}
.net-hubs{margin-top:12px;color:var(--slate);font-size:16px;line-height:1.5;flex:1}
.hub-clock{display:flex;align-items:center;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:14px;color:var(--navy);font-variant-numeric:tabular-nums}
.hc-dot{flex:none;width:6px;height:6px;border-radius:50%;background:#9AA5B3}
.hub-clock.open .hc-dot{background:var(--lime)}
@media (hover:hover) and (pointer:fine){.net-card:hover{box-shadow:var(--shadow-2)}}

/* gradient quote band (plan 5.9, 6.6): no animation, the gradient is static */
.qb{position:relative;overflow:hidden;isolation:isolate}
.qb-dots{position:absolute;top:0;right:0;bottom:0;width:55%;height:100%;z-index:-1;pointer-events:none}
.qb-dots .land circle{fill:rgba(11,37,69,.10)}
.qb-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center}
.qb-copy{grid-column:1/8}
.qb .eyebrow{color:var(--navy)}
.qb .eyebrow::before{background:var(--navy)}
.qb .h2{margin:20px 0 20px;max-width:12em}
.qb-body{max-width:30em;font-size:18px;margin-bottom:12px}
.qb-modes{grid-column:8/13;display:grid;gap:16px}
.mode-pill{display:flex;align-items:center;gap:14px;min-height:72px;padding:0 28px;border-radius:999px;background:var(--navy);color:#fff;text-decoration:none;font-weight:600;font-size:20px;line-height:1.2;transition:background .2s var(--ease-out),transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
/* three classes so it beats the generic `li a:not(.btn):not(.link)` link colour */
.qb .qb-modes .mode-pill{color:#fff}
.mode-pill .ico{flex:none;width:28px;height:28px;color:var(--lime)}
.mode-pill .mp-t{flex:1;min-width:0}
.mode-pill .arr{display:inline-block;transition:transform .3s var(--ease-out)}
.mode-pill:hover,.mode-pill:focus-visible{background:var(--navy-deep);transform:translateY(-3px);box-shadow:var(--shadow-2)}
.mode-pill:hover .arr,.mode-pill:focus-visible .arr{transform:translateX(6px)}

/* footer (plan 5.10, 6.7) */
.site-footer{position:relative;overflow:hidden;background:radial-gradient(50% 70% at 0% 0%,rgba(25,195,177,.18),transparent 60%),linear-gradient(160deg,#071A33 0%,#0B2545 55%,#0E4D5C 100%);color:#D5DDE8;font-size:15px;padding-bottom:28px}
.f-stmt{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:28px var(--gap);padding-top:var(--sec);padding-bottom:56px}
.f-stmt::after{content:"";flex-basis:100%;height:1px;background:rgba(255,255,255,.14);margin-top:28px}
.f-big{font-weight:600;font-size:clamp(32px,4.1vw,60px);line-height:1.04;letter-spacing:-.025em;color:#fff;max-width:12em}
.f-btns{display:flex;flex-wrap:wrap;gap:12px}
.f-cols{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(4,minmax(0,1fr));column-gap:var(--gap);padding-top:16px;align-items:start}
.site-footer .logo{color:#fff;margin-bottom:16px}
.f-brand p{max-width:26em;margin-top:0}
.f-brand p+p{margin-top:10px}
.f-col h3,.f-svc summary{font-weight:600;font-size:13px;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;color:#C9D3DF;margin:0 0 14px}
.f-svc summary{list-style:none;pointer-events:none;cursor:default;display:block}
.f-svc summary::-webkit-details-marker{display:none}
.site-footer li{margin-bottom:6px}
.site-footer a:not(.btn):not(.link){color:#fff;text-decoration:none}
.site-footer a:not(.btn):not(.link):hover{text-decoration:underline}
.site-footer p{margin-top:0}
.site-footer p+p{margin-top:10px}
.f-track{margin-top:24px;max-width:340px}
.f-track label{display:block;margin-bottom:8px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#C9D3DF}
.f-trk-row{display:flex;gap:8px}
.f-track input{flex:1;min-width:0;height:44px;padding:0 16px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(255,255,255,.08);color:#fff;font-size:15px}
.f-track input::placeholder{color:#C9D3DF;opacity:1}
.f-track .btn{min-height:44px;height:44px;padding:0 22px;font-size:15px}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:72px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);font-size:14px;color:#C9D3DF}
.motion-toggle{position:relative;background:none;border:0;padding:4px 0 4px 46px;min-height:28px;color:#fff;font-size:14px;cursor:pointer}
.motion-toggle::before{content:"";position:absolute;left:0;top:50%;width:36px;height:20px;margin-top:-10px;border-radius:999px;background:rgba(255,255,255,.28);transition:background .2s var(--ease-out)}
.motion-toggle::after{content:"";position:absolute;left:3px;top:50%;width:14px;height:14px;margin-top:-7px;border-radius:50%;background:#fff;transition:transform .25s var(--ease-spring)}
.motion-toggle[aria-pressed="true"]::before{background:var(--lime)}
.motion-toggle[aria-pressed="true"]::after{transform:translateX(16px);background:var(--navy)}
.action-bar{display:none}

/* inner pages */
.page-head{padding:112px 0 88px}
.mode-chip{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--navy);color:var(--lime);margin-bottom:20px;flex:none}
.mode-chip .ico{width:20px;height:20px}
.crumbs{font-size:14px;color:var(--grey);margin-bottom:28px}
.crumbs a{color:var(--grey);text-decoration:none}
.crumbs a:hover{color:var(--navy);text-decoration:underline}
.page-head h1{max-width:12em}
/* inner page heads: a stronger Dawn mesh, a Signal chip and a short Signal bar under the title */
.page-head.band-dawn{background:radial-gradient(45% 85% at 0% 0%,rgba(140,198,63,.30),transparent 70%),radial-gradient(40% 95% at 100% 15%,rgba(25,195,177,.26),transparent 70%),radial-gradient(35% 60% at 75% 100%,rgba(11,37,69,.06),transparent 70%),#fff}
.page-head .mode-chip{width:48px;height:48px;background:var(--signal);color:var(--navy)}
.page-head .mode-chip .ico{width:24px;height:24px}
.page-head h1::after{content:"";display:block;width:72px;height:6px;margin-top:24px;border-radius:3px;background:var(--signal)}
.page-head .lead{margin-top:28px}
.wide-img{margin-top:0}
.rule-list{border-top:1px solid var(--line)}
.rule-list li{display:flex;gap:14px;align-items:flex-start;padding:18px 0;border-bottom:1px solid var(--line);font-size:20px;font-weight:500}
.rule-list li::before{content:"";flex:none;width:22px;height:22px;margin-top:.15em;border-radius:50%;background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.4 2.4 4.6-5' fill='none' stroke='%230B2545' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:72px var(--gap)}
.two .h3{margin-bottom:24px}
.cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px var(--gap)}
.cols3>div{background:#fff;border:1px solid var(--line);border-radius:var(--radius-card);padding:28px}
.cols3 h3{font-weight:600;font-size:24px;margin-bottom:10px}
.cols3 p{color:var(--slate)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:24px 40px 24px 0;font-size:22px;font-weight:500;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:20px;font-size:26px;line-height:1;font-weight:500;transition:transform .3s var(--ease-spring)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 24px;color:var(--slate);max-width:40em}
.rel-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);align-items:stretch}
.rel-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;text-decoration:none;color:var(--navy)}
.rel-card .ph{border-radius:0;flex:none}
.rc-body{position:relative;flex:1;padding:24px 76px 24px 24px}
.rc-body p{margin-top:8px;color:var(--slate);font-size:16px;line-height:1.45}
.rel-card .tile-go{right:20px;bottom:20px}
.rel-card:hover .h3{color:var(--teal-ink)}
@media (hover:hover) and (pointer:fine){.rel-card:hover .tile-go,.rel-card:focus-visible .tile-go{opacity:1;transform:none}}

/* services hub list */
.filters{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:var(--head-gap)}
.chip{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;background:#fff;border:1px solid var(--line);border-radius:999px;font-size:16px;color:var(--slate);cursor:pointer;transition:background .2s var(--ease-out),color .2s var(--ease-out),border-color .2s var(--ease-out)}
.chip:hover{color:var(--navy);border-color:var(--navy)}
.chip[aria-pressed=true]{background:var(--navy);color:#fff;border-color:var(--navy)}
.svc-list{display:grid;gap:20px}
.svc-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:24px;background:#fff;border:1px solid var(--line);border-radius:var(--radius-card);align-items:start}
.svc-row .ph{border-radius:12px}
.svc-row .ph{grid-column:1/5}
.svc-row h2{grid-column:5/9;font-weight:600;font-size:clamp(28px,2.8vw,40px);line-height:1.1;letter-spacing:-.015em}
.svc-row h2 a{text-decoration:none}
.svc-row h2 a:hover{color:var(--teal-ink)}
.svc-row .svc-txt{grid-column:9/13;color:var(--slate)}
.svc-row ul{margin-top:16px}
.svc-row li{padding:6px 0;border-top:1px solid var(--line);font-size:15px}
.svc-row .link{margin-top:12px}
.hide{display:none!important}

/* about */
.about-img{grid-column:1/8}
.about-txt{grid-column:9/13;align-self:end;color:var(--slate)}
.about-txt p:first-child{color:var(--navy);font-size:22px;line-height:1.45;font-weight:500}

/* panels: flat pale blocks for forms and results, no borders or shadows */
.panel{background:#fff;padding:40px;border-radius:var(--radius-card);box-shadow:var(--shadow-1)}
.panel+.panel{margin-top:24px}
.demo-note{border-left:3px solid var(--lime);padding:4px 0 4px 20px;margin-bottom:40px;color:var(--slate)}
code{font-family:ui-monospace,Menlo,monospace;font-size:.92em;background:var(--pale);padding:1px 6px}
.panel code{background:var(--pale)}
label{display:block;font-size:14px;color:var(--slate);margin:20px 0 8px}
input:not([type=radio]):not([type=checkbox]),select,textarea{transition:border-color .15s var(--ease-out);width:100%;min-height:52px;padding:12px 14px;border:1px solid #9AA8B8;border-radius:var(--radius-field);background:#fff;font-size:17px;color:var(--navy)}
input:not([type=radio]):not([type=checkbox]):hover:not(:focus),select:hover:not(:focus),textarea:hover:not(:focus){border-color:var(--slate)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--teal-ink);outline-offset:0;border-color:var(--teal-ink)}
input::placeholder,textarea::placeholder{color:#6B788A}
[aria-invalid=true]{border-color:#B42318!important}
.row{display:flex;gap:12px}
.row input{flex:1}
.row .btn{flex:none;min-height:52px}
.trk-head{display:flex;justify-content:space-between;align-items:center;gap:16px}
.badge{font-size:14px;font-weight:500;padding:5px 14px;border:1px solid var(--navy);border-radius:999px;white-space:nowrap}
.badge-done{background:var(--lime);border-color:var(--lime);color:var(--navy);font-weight:600}
.trk-route{display:flex;align-items:center;gap:14px;margin-top:20px;font-weight:600;font-size:clamp(24px,2.6vw,36px);line-height:1.15;letter-spacing:-.015em}
.trk-route .mode-chip{margin-bottom:0}
.trk-mode{margin-top:8px;color:var(--grey);font-size:15px}
.timeline{margin-top:28px;border-left:1px solid var(--line);padding-left:24px}
.timeline li{position:relative;padding:0 0 22px;color:var(--grey)}
.timeline li::before{content:"";position:absolute;left:-29px;top:7px;width:9px;height:9px;border-radius:50%;background:#fff;border:1px solid #9AA8B8}
.timeline li.done,.timeline li.now{color:var(--navy)}
.timeline li.done::before{background:var(--navy);border-color:var(--navy)}
.timeline li.now::before{background:var(--lime);border-color:var(--lime);box-shadow:0 0 0 4px rgba(140,198,63,.3)}
.timeline b{display:block;font-weight:500}
.timeline small{font-size:14px}
.err{color:#B42318}
.help{margin-top:56px}
#trackResult:not(:empty){margin-top:24px}

/* quote */
.quote-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.quote-grid>div{grid-column:1/9}
.quote-grid>aside{grid-column:10/13}
.progress{margin-bottom:32px}
.pg-track{height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.pg-fill{display:block;height:100%;width:calc(var(--step,1)/5*100%);background:var(--signal);border-radius:3px;transition:width .4s var(--ease-out)}
.progress ol{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:12px;font-size:14px;color:var(--grey)}
.progress li{display:flex;align-items:center;gap:6px}
.progress li.now{color:var(--navy);font-weight:600}
.progress li.done{color:var(--navy)}
.progress li.done::before{content:"";flex:none;width:14px;height:14px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.4 2.4 4.6-5' fill='none' stroke='%233E7B1E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font-weight:600;font-size:30px;letter-spacing:-.01em;padding:0;margin-bottom:12px}
fieldset.inline{margin-top:20px}
fieldset.inline legend{font-size:14px;font-weight:400;color:var(--slate);margin-bottom:4px}
fieldset.inline label{display:inline-flex;align-items:center;gap:8px;margin:8px 24px 0 0;font-size:16px;color:var(--navy)}
.radio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}
.radio-card{margin:0;display:flex;align-items:center;gap:12px;background:#fff;padding:16px 18px;font-size:17px;color:var(--navy);cursor:pointer;border:1px solid var(--line);border-radius:12px}
.radio-card{position:relative;transition:border-color .2s var(--ease-spring)}
.radio-card:hover{border-color:var(--navy)}
.radio-card:has(input:checked){border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.radio-card::after{content:"";position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.4 2.4 4.6-5' fill='none' stroke='%230B2545' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat;opacity:0;transform:scale(.6);transition:transform .2s var(--ease-spring),opacity .2s var(--ease-spring);pointer-events:none}
.radio-card:has(input:checked)::after{opacity:1;transform:scale(1)}
.radio-card input,.check input{accent-color:var(--navy);width:18px;height:18px}
.check{display:flex;gap:10px;align-items:flex-start;font-size:16px;color:var(--navy);margin:14px 0 0}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hint{font-size:14px;color:var(--slate);margin-top:10px}
.form-nav{display:flex;gap:24px;align-items:center;margin-top:36px}
.err-summary{background:#FEF3F2;border-left:2px solid #B42318;padding:12px 16px;margin-bottom:20px;color:#B42318}
.success h2{margin-bottom:12px}
.success ul{margin:16px 0;border-top:1px solid var(--line)}
.success li{padding:10px 0;border-bottom:1px solid var(--line)}
.side .h3{font-size:20px;margin-bottom:10px}
.side p+.h3{margin-top:36px}
.side{color:var(--slate)}
.side.band-dawn{align-self:start;padding:28px;border-radius:var(--radius-card);box-shadow:inset 0 0 0 1px var(--line)}

/* contact */
.contact-list{border-top:1px solid var(--line)}
.contact-list a{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--gap);padding:24px 0;border-bottom:1px solid var(--line);text-decoration:none;align-items:baseline}
.contact-list b{font-weight:400;font-size:14px;color:var(--grey)}
.contact-list span{font-weight:500;font-size:clamp(24px,2.6vw,36px);letter-spacing:-.01em}
.contact-list a:hover span{color:var(--teal-ink)}
.contact-form button{margin-top:28px}
.success-inline{margin-top:16px;color:var(--navy);font-weight:500}
.net-cards-full{margin-bottom:8px}
.desk .net-hubs b{font-weight:600;color:var(--navy)}
.desk .net-hubs a{color:var(--teal-ink)}
.hc-state{font-weight:600}
.hc-state:not(:empty)::before{content:"\00b7";margin-right:8px;font-weight:400}
.hub-clock.open .hc-state{color:var(--green-ink)}
html:not(.js) .desk .hub-clock{display:none}
.net-office{grid-column:1/-1;margin-top:0}
.about-stats .stats-note{margin-top:48px}

/* ===== top 5 components (COMPONENT-IDEAS.md). New tokens only; 2.1 values untouched. ===== */
:root{--radius-field:12px;--glow-lime:0 0 0 6px rgba(140,198,63,.22);--beam-h:2px;--tick-h:56px}

/* #1 instant-quote wizard (hero card) */
.qq.wz{padding:28px 28px 22px}
.wz-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.wz-head .h3{font-size:20px;line-height:1.25;letter-spacing:-.01em;text-wrap:balance}
.wz input::-webkit-calendar-picker-indicator{display:none!important}
.wz .ex{font-size:13px;font-weight:400;letter-spacing:0;color:var(--grey)}
.wz-count{flex:none;font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--grey);font-variant-numeric:tabular-nums}
.wz-meter{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-top:14px}
.wz-meter span{height:3px;border-radius:2px;background:var(--line);transition:background .3s var(--ease-out)}
.wz-meter span.on{background:var(--signal)}
.wz-body{margin-top:20px}
html.js .wz.wz-on .wz-body{min-height:300px}
.wz legend.wz-q{font-size:15px;font-weight:600;letter-spacing:0;color:var(--navy);margin:0 0 12px}
.wz-modes{display:grid;gap:8px}
.wz-mode{position:relative;display:flex;align-items:center;gap:14px;margin:0!important;padding:13px 16px;border:1px solid var(--line);border-radius:var(--radius-field);color:var(--navy);cursor:pointer;transition:border-color .2s var(--ease-out),box-shadow .2s var(--ease-out)}
.wz-mode input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.wz-mode .ico{flex:none;width:24px;height:24px;color:var(--teal-ink)}
.wz-mode b{display:block;font-size:16px;font-weight:600;line-height:1.2}
.wz-mode small{display:block;margin-top:2px;font-size:13px;color:var(--grey)}
.wz-mode:hover{border-color:var(--slate)}
.wz-mode:has(input:checked){border-color:var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.wz-mode::after{content:"";flex:none;margin-left:auto;width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--line)}
.wz-mode:has(input:checked)::after{box-shadow:none;background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.4 2.4 4.6-5' fill='none' stroke='%230B2545' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat}
.wz-mode:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}
.wz .qq-f label{margin:0 0 6px}
.wz .qq-f+.qq-f{margin-top:12px}
.wz input:not([type=radio]):not([type=checkbox]){min-height:48px;font-size:16px}
.wz-err{margin-top:6px;font-size:13px;line-height:1.35;color:var(--error)}
.wz-err:empty{display:none}
.wz-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:14px}
.wz-chips-l{width:100%;font-size:12px;color:var(--grey)}
.wz-chip{appearance:none;min-height:32px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--navy);font-size:13px;font-weight:500;cursor:pointer;transition:border-color .2s}
.wz-chip:hover{border-color:var(--navy)}
.wz-g2{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:10px}
.wz-g2 label{margin:0 0 6px}
.wz-lbl{margin:14px 0 6px;font-size:14px;color:var(--slate)}
.wz-g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.wz-cw{margin-top:14px;padding:10px 12px;border-radius:var(--radius-field);background:var(--mist);font-size:14px;line-height:1.4;color:var(--slate)}
.wz-cw b{font-weight:600;color:var(--navy);font-variant-numeric:tabular-nums}
.wz-res:focus{outline:none}
.wz-tag{display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border-radius:999px;background:rgba(25,195,177,.10);color:var(--teal-ink);font-size:12px;font-weight:600;letter-spacing:.08em;line-height:1.2;text-transform:uppercase}
.wz-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.wz-lane{margin-top:18px;font-size:17px;font-weight:600;line-height:1.3}
.wz-lane span{font-weight:400;color:var(--grey)}
.wz-band{margin-top:6px;padding-bottom:12px;font-size:40px;font-weight:700;line-height:1.05;letter-spacing:-.03em;font-variant-numeric:tabular-nums;background:var(--signal) left bottom/64px 3px no-repeat}
.wz-band .ex{font-size:14px;letter-spacing:0}
.wz-meta{margin-top:12px;font-size:14px;color:var(--slate)}
.wz-human{display:flex;align-items:flex-start;gap:12px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:14px;line-height:1.45;color:var(--slate)}
.wz-human .ico{flex:none;width:32px;height:32px;padding:6px;border-radius:50%;background:var(--navy);color:var(--lime);box-shadow:var(--glow-lime)}
.wz-human b{color:var(--navy);font-weight:600}
.wz-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px}
.qq.wz .btn{width:auto;flex:1;margin-top:0}
.hero .wz .link{color:var(--teal-ink);font-weight:500;flex:none}
.hero .wz .link .arr{color:inherit}
.qq.wz .wz-note{margin-top:12px}
html:not(.js) .wz-res,html:not(.js) .wz-back,html:not(.js) .wz-next,html:not(.js) .wz-count,html:not(.js) .wz-meter{display:none}
html:not(.js) .wz-step+.wz-step{margin-top:20px}

/* quote.html: live example estimate (same engine) */
.est{margin-bottom:36px;padding:20px;border-radius:var(--radius-card);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.side .est .h3{margin:14px 0 6px;font-size:18px}
.est-band{font-size:30px;font-weight:700;line-height:1.1;letter-spacing:-.02em;color:var(--grey);font-variant-numeric:tabular-nums;padding-bottom:10px;background:linear-gradient(var(--line),var(--line)) left bottom/48px 3px no-repeat}
.est.on .est-band{color:var(--navy);background-image:var(--signal)}
.est .ex{font-size:13px;font-weight:400;letter-spacing:0;color:var(--grey)}
.est .wz-tag{font-size:12px;letter-spacing:0;text-transform:none}
.est-meta{margin-top:10px;font-size:14px;line-height:1.45}
.est .wz-human{margin-top:16px}

/* #5 lane + rate ticker */
.ticker .mq-row{min-height:var(--tick-h);gap:20px}
.tk-tag{flex:none;display:inline-flex;align-items:center;gap:8px;margin:0;padding:6px 12px;border:1px solid rgba(201,211,223,.32);border-radius:999px;color:#C9D3DF;font-size:12px;font-weight:600;letter-spacing:.08em;line-height:1.2;text-transform:uppercase;white-space:nowrap}
.tk-pulse{width:6px;height:6px;border-radius:50%;background:var(--lime)}
.ticker .mq-list{gap:0;padding-right:0}
.ticker .mq-list li{font-size:inherit}
.ticker .mq-list li::after{display:none}
.tk{display:flex;align-items:center;gap:12px;height:var(--tick-h);padding:0 28px;border-right:1px solid rgba(201,211,223,.14);color:#fff;text-decoration:none;white-space:nowrap}
.marquee .mq-list a.tk{color:#fff}
.tk-ic{flex:none;width:18px;height:18px;color:var(--lime)}
.tk b{font-size:17px;font-weight:600;transition:color .2s}
.tk:hover b{color:var(--lime)}
.tk-d{font-size:14px;color:#C9D3DF}
.tk-b{font-size:14px;font-weight:500;font-variant-numeric:tabular-nums}
.tk-t{padding:3px 8px;border-radius:999px;font-size:12px;font-weight:600;font-variant-numeric:tabular-nums}
.tk-t.up{color:var(--lime);background:rgba(140,198,63,.14)}
.tk-t.down{color:var(--teal);background:rgba(25,195,177,.14)}
.tk-t.flat{color:#C9D3DF;background:rgba(201,211,223,.12)}

/* #2 how your quote happens */
.flow-head .h2{margin-top:20px;max-width:15em;text-wrap:balance}
.flow-head .lead{margin-top:20px}
.flow{position:relative;margin-top:72px;--fill:0}
.fs-list{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap)}
.fs-beam{position:absolute;top:27px;left:28px;right:calc((100% - 5*var(--gap))/6 - 28px);height:var(--beam-h);border-radius:2px;background:var(--line)}
.fs-beam span{display:block;width:calc(var(--fill)*100%);height:100%;border-radius:2px;background:var(--signal)}
.fs-n{position:relative}
.fs-n>*{position:relative;z-index:1}
.fs-dot{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--line);color:var(--grey);transition:background .3s var(--ease-out),color .3s var(--ease-out),box-shadow .3s var(--ease-out)}
.fs-dot .ico{width:24px;height:24px}
.fs-n.lit .fs-dot{background:var(--navy);color:var(--lime);box-shadow:none}
.fs-i{margin-top:20px;font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--grey);font-variant-numeric:tabular-nums}
.fs-n h3{margin-top:4px;font-size:20px;font-weight:600;line-height:1.2;letter-spacing:-.01em}
.fs-d{margin-top:6px;max-width:16em;font-size:15px;line-height:1.45;color:var(--slate)}
.fs-hero::before{content:"";position:absolute;z-index:0;inset:-20px -16px -20px -16px;border-radius:var(--radius-card);background:#fff;box-shadow:var(--shadow-1)}
.fs-hero .fs-dot{background:#fff;color:var(--green-ink);box-shadow:inset 0 0 0 2px var(--lime)}
.fs-hero.lit .fs-dot{background:var(--lime);color:var(--navy);box-shadow:var(--glow-lime)}
.fs-sign{display:inline-flex;margin-top:12px;padding:4px 10px;border-radius:999px;background:rgba(140,198,63,.18);color:var(--green-ink);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}

/* #3 shipment tracker */
.trk-sec{background:var(--mist)}
.trk-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start}
.trk-copy{grid-column:1/6}
.trk-out{grid-column:7/13}
.trk-sec .trk-out,.trk-page .trk-out{grid-column:6/13;padding-left:calc(var(--gap)*2)}
.trk-copy .h2{margin-top:20px;text-wrap:balance}
.trk-page{grid-template-rows:auto 1fr}
.trk-page .trk-copy{grid-row:1}
.trk-page .trk-out{grid-row:1/span 2}
.trk-page .trk-help{grid-column:1/6;grid-row:2;margin-top:48px}
.trk-copy .lead{margin-top:20px}
.trk-ui{margin-top:36px}
.trk-page .trk-ui{margin-top:0}
.trk-form label{margin:0 0 8px}
.trk-try{margin-top:24px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.trk-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.trk-chip{appearance:none;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--navy);font-size:14px;font-weight:600;font-variant-numeric:tabular-nums;cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.trk-chip .ico{width:18px;height:18px;color:var(--teal-ink)}
.trk-chip:hover{border-color:var(--navy)}
.trk-chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.trk-chip[aria-pressed="true"] .ico{color:var(--lime)}
.trk-more{margin-top:12px}
.trk-page .help{margin-top:48px}
.tcard{padding:36px;border-radius:var(--radius-card);box-shadow:var(--shadow-2)}
.tc-top{display:flex;justify-content:space-between;align-items:center;gap:16px}
.tc-id{font-family:ui-monospace,Menlo,monospace;font-size:14px;letter-spacing:.02em;color:#C9D3DF}
.tc-pill{padding:5px 12px;border:1px solid rgba(140,198,63,.6);border-radius:999px;color:var(--lime);font-size:13px;font-weight:600;white-space:nowrap}
.tc-pill.is-done{background:var(--lime);border-color:var(--lime);color:var(--navy)}
.tc-route{margin-top:16px;font-size:clamp(28px,2.6vw,40px);font-weight:600;line-height:1.1;letter-spacing:-.02em}
.tc-route span{font-weight:300;color:var(--lime)}
.tc-meta{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:15px;color:#C9D3DF}
.tc-meta .ico{flex:none;width:20px;height:20px;color:var(--lime)}
.tc-arc{position:relative;margin-top:20px}
.tc-arc svg{width:100%;height:auto;overflow:visible}
.tc-base{fill:none;stroke:rgba(201,211,223,.35);stroke-width:2;stroke-dasharray:4 6}
.tc-fill{fill:none;stroke-width:3;stroke-linecap:round}
.tc-end{fill:#C9D3DF}
.tc-pos{fill:var(--lime);stroke:rgba(140,198,63,.3);stroke-width:10}
.tc-code{position:absolute;bottom:-24px;font-size:12px;font-weight:600;letter-spacing:.1em;color:#C9D3DF}
.tc-code.a{left:0}.tc-code.b{right:0}
.tc-tl{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:52px}
.tc-tl li{position:relative;padding-top:24px}
.tc-tl li::before{content:"";position:absolute;top:5px;left:0;right:-10px;height:2px;background:rgba(201,211,223,.22)}
.tc-tl li.done::before{background:var(--lime)}
.tc-tl li:last-child::before{right:auto;width:12px}
.tc-dot{position:absolute;top:0;left:0;z-index:1;width:12px;height:12px;border-radius:50%;background:var(--navy-deep);box-shadow:inset 0 0 0 2px rgba(201,211,223,.55)}
.tc-tl li.done .tc-dot{background:var(--lime);box-shadow:none}
.tc-tl li.now .tc-dot{background:var(--lime);box-shadow:var(--glow-lime);animation:tcnow 2s ease-out infinite}
@keyframes tcnow{0%{box-shadow:0 0 0 0 rgba(140,198,63,.55)}100%{box-shadow:0 0 0 12px rgba(140,198,63,0)}}
html.motion-off .tc-tl li.now .tc-dot{box-shadow:var(--glow-lime)}
.tc-tl b{display:block;font-size:14px;font-weight:600;line-height:1.25;color:#fff}
.tc-tl small{display:block;margin-top:4px;font-size:13px;line-height:1.35;color:#C9D3DF}
.tc-tl li:not(.done):not(.now) b{font-weight:500;color:#C9D3DF}
.tc-foot{margin-top:28px;padding-top:16px;border-top:1px solid rgba(201,211,223,.18);font-size:13px;color:#C9D3DF}
.tcard-empty,.tcard-idle{padding:36px;border-radius:var(--radius-card);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.tcard-idle{display:flex;align-items:center;gap:16px;background:transparent;box-shadow:none;border:1.5px dashed #9AA8B8;color:var(--slate)}
.tcard-idle b{color:var(--navy)}
.ti-ic{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%;background:var(--pale);color:var(--navy)}
.ti-ic .ico{width:22px;height:22px}
.tcard-empty .ti-ic{background:#FEF3F2;color:var(--error)}
.tcard-empty .h3{margin-top:16px}
.tcard-empty p{margin-top:8px;color:var(--slate)}
.tcard-empty b{color:var(--navy);word-break:break-all}
.tcard-empty .trk-chips{margin-top:16px}

/* #4 lane-arc map: Dubai HQ beacon, other hubs as dots, point-to-point Signal arcs */
.node.hq .core,.band-dark .loop .node.hq .core{fill:var(--lime)}
.node.hq .halo{fill:none;stroke:var(--lime);stroke-width:1.5;opacity:.55}
.node.hq .pulse,.band-dark .loop .node.hq .pulse{stroke:var(--lime);stroke-width:2;animation-duration:3s}
.node.hq .p2{animation-delay:-1.5s}
.node.hq text{font-weight:700;letter-spacing:.12em;fill:var(--green-ink)}
.band-dark .loop .node.hq text{fill:var(--lime)}
.map-key{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:16px}
.map-key span{display:inline-flex;align-items:center;gap:8px}
.map-key i{flex:none;display:block}
.mk-hq{width:12px;height:12px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(140,198,63,.3)}
.mk-hub{width:7px;height:7px;border-radius:50%;background:var(--navy)}
.band-dark .mk-hub{background:#C9D3DF}
.mk-arc{width:24px;height:3px;border-radius:2px;background:var(--signal)}
.map-key+.map-cap{margin-top:6px}
.lane-panel li{cursor:pointer}
.lp-go{display:inline-block;margin-left:10px;color:var(--lime);opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .2s}
.lane-panel li:hover .lp-go,.lane-panel li:focus-visible .lp-go{opacity:1;transform:none}

/* breakpoints (plan 4): desktop default 1440, then 1199, 1023 (tablet, 768 target), 767 (phone, 390 target) */
.marquee{overflow:hidden}
@media (max-width:1199px){
:root{--pad:40px;--gap:24px;--sec:120px}
.main-nav{gap:28px}
}

@media (max-width:1023px){
:root{--pad:32px;--gap:20px;--sec:96px;--head-gap:40px}
.stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}
.page-head{padding:88px 0 64px}
.main-nav{display:none}
.menu-btn{display:block;margin-left:0}
.hdr{height:68px;gap:24px}
.hdr-actions{margin-left:auto}
.mobile-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;align-content:start}
.mobile-nav .btn{grid-column:1/-1}
.ed,.svc-grid,.rel-grid,.quote-grid,.svc-row,.hero-inner{column-gap:var(--gap)}
.ed{grid-template-columns:repeat(8,minmax(0,1fr))}
.ed-label,.ed-main,.ed-main.narrow,.intro .ed-label,.intro .h2,.intro-aside,.intro-img2,.feat-img,.feat-text,.feat-img2,.about-img,.about-txt{grid-column:1/-1}
.ed-label{padding-top:0;margin-bottom:20px}
.intro-aside{grid-row:auto;margin-top:40px}
.intro-img2{margin-top:40px}
.feat-text{margin-top:40px}
.about-txt{margin-top:40px}
.hero-copy{grid-column:1/-1}
.hero .display{max-width:none}
/* headline sits over the bright sky band here, so the scrim is darker at the top */
.hero-scrim{background:linear-gradient(180deg,rgba(7,26,51,.74) 0%,rgba(7,26,51,.58) 45%,rgba(7,26,51,.38) 72%,rgba(7,26,51,.75) 100%)}
.qq{grid-column:1/-1;grid-row:2;margin-top:40px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gap);align-items:end}
.qq .h3,.qq-mode{grid-column:1/-1}
.qq-mode{max-width:420px}
.qq .btn{grid-column:1;width:100%;margin-top:22px}
.qq .small{grid-column:2;align-self:center;margin-top:22px}
.hero-foot{grid-row:3;margin-top:32px}
.bento{grid-template-columns:repeat(2,minmax(0,1fr))}
.bento .tile{grid-column:auto;grid-row:auto}
.bento .t-air,.bento .t-sea{grid-column:1/-1;min-height:360px}
.bento-sec .h2{margin-bottom:56px}
.steps{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:48px}
.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:56px}
.svc-grid>*{grid-column:auto!important;margin-top:0!important}
.rel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.rel-card:nth-child(3){grid-column:1/-1;flex-direction:row}
.rel-card:nth-child(3) .ph{flex:0 0 40%;aspect-ratio:auto;min-height:200px}
.why-photo,.why-list{grid-column:1/-1}
.why-photo .ph{height:auto;min-height:0;aspect-ratio:16/9}
.why-list{margin-top:var(--gap)}
.case-photo,.case-side{grid-column:1/-1;grid-row:auto}
.case-side{margin-top:var(--gap)}
.tm-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.tm-row>.tm:nth-child(3){grid-column:1/-1}
.net-head,.net-cards{grid-column:1/-1}
.net-head{margin-bottom:var(--head-gap)}
.net-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
.net-card,.net-card:nth-child(n+4){grid-column:auto}
.net-card:nth-child(5){grid-column:1/-1}
.qb-copy,.qb-modes{grid-column:1/-1}
.qb-modes{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:40px;gap:var(--gap)}
.mode-pill{padding:0 20px;gap:10px;font-size:17px}
.mode-pill .ico{width:24px;height:24px}
.f-stmt{padding-top:var(--sec)}
.f-cols{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}
.f-brand{grid-column:1/-1}
.quote-grid{grid-template-columns:minmax(0,1fr)}
.quote-grid>div,.quote-grid>aside{grid-column:1/-1}
.quote-grid>aside{margin-top:40px}
.svc-row{grid-template-columns:repeat(8,minmax(0,1fr))}
.svc-row .ph{grid-column:1/4;grid-row:1/span 2}
.svc-row h2{grid-column:4/9}
.svc-row .svc-txt{grid-column:4/9;margin-top:12px}
.cols3{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:767px){
:root{--pad:20px;--gap:16px;--sec:72px;--head-gap:32px}
.stats{row-gap:40px}
.stat .count{font-size:clamp(38px,11.5vw,52px)}
.stat-label{font-size:15px}
.stats-wrap .h2{margin-bottom:48px}
.stats-note{margin-top:40px}
body{font-size:16px;padding-bottom:64px}
.hdr-actions{display:none}
.menu-btn{margin-left:auto}
.hdr{height:64px}
.logo{font-size:13px}
.logo-mark svg{width:28px;height:28px}
.mobile-nav{grid-template-columns:minmax(0,1fr)}
.thin{display:block}
.display,.h2{overflow-wrap:anywhere}
.label,.eyebrow{font-size:12px}
.small{font-size:13px}
.ed,.svc-grid,.rel-grid,.quote-grid,.svc-row{grid-template-columns:1fr}
.ed-label{margin-bottom:16px}
.hero{display:block;min-height:0;background:linear-gradient(var(--navy) 0 calc(100% - 120px),#fff 0)}
.hero video,.hero-scrim{inset:0 0 120px 0;height:calc(100% - 120px)}
.hero-inner{display:flex;flex-direction:column;padding-top:112px;padding-bottom:24px}
.hero .display{font-size:44px}
.hero-sub{font-size:16px;margin-top:20px}
.hero-foot{margin-top:28px;padding-top:0;border-top:0;justify-content:flex-end;font-size:13px}
.hero-foot span{display:none}
.qq{display:block;margin-top:28px;padding:24px 20px}
.qq-mode{margin-top:18px}
.qq .btn{margin-top:20px}
.qq .small{margin-top:12px}
.bento{grid-template-columns:minmax(0,1fr);grid-auto-rows:auto}
.bento .t-air,.bento .t-sea{min-height:0}
.bento .tile-photo{aspect-ratio:4/3;padding:20px}
.bento .tile-navy,.bento .tile-harbour,.bento .tile-white{min-height:200px;padding:84px 20px 20px}
.bento .tile>.ico{top:20px;left:20px}
.bento-sec .h2{margin-bottom:40px}
.mq-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;padding-top:12px;padding-bottom:14px;min-height:0}
.mq-viewport{grid-column:1/-1;grid-row:2}
.mq-list li{font-size:20px}
.mq-list{gap:28px;padding-right:28px}
.mq-list li::after{margin-left:16px}
.intro-img2{width:62%;margin:40px 0 0 auto}
.svc-grid{row-gap:56px}
.svc-grid>:nth-child(even){width:82%;margin-left:auto}
.rel-card,.rel-card:nth-child(3){flex-direction:row}
.rel-card .ph,.rel-card:nth-child(3) .ph{flex:0 0 40%;aspect-ratio:auto;min-height:150px}
.rc-body{padding:16px 56px 16px 16px}
.rc-body .h3{font-size:19px}
.rc-body p{font-size:14px;line-height:1.45}
.rel-card .tile-go{width:34px;height:34px;right:12px;bottom:12px}
.rel-card .ph-tile::after{width:84px;height:84px;margin:-42px 0 0 -42px;box-shadow:0 0 0 12px rgba(255,255,255,.05)}
.rel-card .ph-tile .ico{width:40px;height:40px}
.svc-row .ph,.svc-row h2,.svc-row .svc-txt{grid-column:1/-1}
/* lanes band on phone (plan 6.2): segmented tabs, map in its own sideways-scrolling box, page itself never scrolls sideways */
.lane-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));height:48px;padding:4px;gap:0;background:rgba(255,255,255,.08);border:0;border-radius:999px}
.lane-tabs button{padding:0;border-radius:999px}
.lane-tabs button[aria-selected="true"]{background:var(--lime);color:var(--navy)}
.lane-tabs .tab-ind{display:none}
.lanes-view .map-box{margin:0 calc(var(--pad)*-1)}
.lanes-map{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
.lm-in{width:200%}
.lanes-map .node text,.lanes-view .lanes-map .node text{font-size:26px;stroke-width:6px}
.map-box .pause,.lanes-view .map-box .pause{right:var(--pad)}
.lanes-view .map-cap{margin-top:12px}
.map-swipe{display:block;margin-top:4px}
.map-panel{padding:12px 0}
.map-panel .map-box{margin:0}
.map-panel .map-box .pause{right:12px}
.feat-img2{display:none}
.steps,.cols3,.two{grid-template-columns:1fr;gap:36px}
.r219{aspect-ratio:4/3}
.page-head{padding:56px 0 48px}
.svc-row{padding:16px}
.svc-row h2{margin-top:20px}
.svc-row .svc-txt{margin-top:12px}
.panel{padding:24px 20px}
.radio-grid{grid-template-columns:1fr}
.row3{grid-template-columns:1fr 1fr}
.row{flex-wrap:wrap}
.row .btn{width:100%}
.progress ol{font-size:12px;gap:4px}
.progress li{gap:3px}
.progress li.done::before{width:11px;height:11px;background-size:11px}
legend{font-size:24px}
.contact-list a{grid-template-columns:1fr;gap:2px}
.why-list{grid-template-columns:minmax(0,1fr)}
.why-card{padding:24px 20px}
.why-photo .ph{aspect-ratio:4/3}
.case-story{padding:28px 20px}
.case-result{grid-template-columns:minmax(0,1fr);padding:24px 20px;gap:20px}
.rn{font-size:36px}
.tm-row{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:86%;gap:16px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding-bottom:16px;margin-top:var(--head-gap)}
.tm-row>.tm,.tm-row>.tm:nth-child(3){grid-column:auto;scroll-snap-align:start;padding:24px 20px}
.net-cards{grid-template-columns:minmax(0,1fr)}
.net-card,.net-card:nth-child(5){padding:24px 20px}
.qb-modes{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:32px}
.mode-pill{min-height:72px;font-size:18px}
.qb-body{font-size:17px}
.f-stmt{flex-direction:column;align-items:flex-start;padding-bottom:40px}
.f-stmt::after{flex-basis:auto;width:100%;margin-top:0}
.f-btns{width:100%}
.f-btns .btn{flex:1 1 auto}
.f-cols{grid-template-columns:minmax(0,1fr);row-gap:32px}
.f-svc summary{pointer-events:auto;cursor:pointer;position:relative;min-height:44px;display:flex;align-items:center;justify-content:space-between;margin:0;border-top:1px solid rgba(255,255,255,.14)}
.f-svc summary::after{content:"+";font-size:22px;letter-spacing:0;line-height:1}
.f-svc[open] summary::after{content:"\2212"}
.f-svc[open] summary{margin-bottom:8px}
.f-svc+.f-svc{margin-top:-32px}
.f-svc:last-of-type{border-bottom:1px solid rgba(255,255,255,.14)}
.footer-bottom{margin-top:48px}
.action-bar{display:grid;grid-template-columns:1fr 1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;border-top:1px solid var(--line)}
.action-bar a{display:flex;align-items:center;justify-content:center;height:64px;text-decoration:none;font-size:15px;font-weight:500;color:var(--navy)}
.action-bar a+a{border-left:1px solid var(--line)}
.action-bar .ab-quote{background:var(--lime);color:var(--navy);border-left:0}
}

/* top 5 components: tablet */
@media (max-width:1023px){
.qq.wz{display:block;max-width:560px}
.fs-list{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:56px}
.fs-beam{display:none}
.trk-copy,.trk-out,.trk-sec .trk-out,.trk-page .trk-help{grid-column:1/-1;grid-row:auto;padding-left:0}
.trk-out{margin-top:40px}
}
/* top 5 components: phone (390 target) */
@media (max-width:767px){
.qq.wz{padding:22px 18px 18px}
.wz-head .h3{font-size:18px}
html.js .wz.wz-on .wz-body{min-height:318px}
.wz-band{font-size:34px}
.wz-nav .btn{padding:12px 18px}
.ticker .mq-row{gap:10px 12px}
.tk{height:48px;padding:0 20px}
.tk b{font-size:16px}
.flow{margin-top:40px}
.fs-list{grid-template-columns:minmax(0,1fr);row-gap:28px}
.fs-beam{display:block;top:24px;bottom:24px;left:22px;right:auto;width:4px;height:auto}
.fs-beam span{width:100%;height:calc(var(--fill)*100%)}
.fs-n{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:16px;align-items:start}
.fs-dot{grid-row:1/span 4;width:48px;height:48px}
.fs-i{margin-top:2px}
.fs-n>*:not(.fs-dot){grid-column:2}
.fs-hero::before{inset:-14px -12px}
.tcard,.tcard-empty,.tcard-idle{padding:24px 20px}
.tc-tl{grid-template-columns:minmax(0,1fr);gap:0;margin-top:44px}
.tc-tl li{padding:0 0 18px 28px}
.tc-tl li::before{top:12px;bottom:-2px;left:5px;right:auto;width:2px;height:auto}
.tc-tl li:last-child::before{display:none}
.tc-tl li:last-child{padding-bottom:0}
.tc-dot{top:3px}
.tc-tl small{margin-top:2px}
.map-key{gap:6px 16px}
}