:root{--ink:#14202b;--muted:#62717e;--paper:#f7f6f2;--white:#fff;--bronze:#8a541b;--gold:#bc7b2b;--line:#dfe3e3;--dark:#102630;--lime:#d9e37a}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif;font-size:15px;line-height:1.6}a{color:inherit;text-decoration:none}.site-header{height:90px;padding:0 clamp(22px,5vw,80px);display:flex;align-items:center;justify-content:space-between;gap:26px;background:#fbfaf7;border-bottom:1px solid rgba(20,32,43,.08);position:relative;z-index:5}.brand{display:inline-flex;align-items:center;gap:10px;font-size:12px;line-height:1.05;font-weight:800;letter-spacing:.1em;white-space:nowrap}.brand b{display:block;color:var(--bronze);font-size:10px;letter-spacing:.22em}.brand-mark{width:35px;height:35px;border-radius:50% 50% 50% 10%;display:grid;place-items:center;background:var(--bronze);color:white;font-family:"Playfair Display";font-size:14px;letter-spacing:0}nav{display:flex;align-items:center;gap:30px;font-size:12px;font-weight:700}nav a{position:relative}nav a:after{content:"";position:absolute;left:0;bottom:-7px;width:0;height:2px;background:var(--bronze);transition:width .25s}nav a:hover:after,nav .active:after{width:100%}.header-cta{font-size:12px;font-weight:800;background:var(--ink);color:white;border-radius:999px;padding:11px 16px}.header-cta span{color:var(--lime);font-size:16px;margin-left:7px}.menu-button{display:none;border:0;background:none;font-size:24px}.hero{min-height:650px;display:grid;grid-template-columns:minmax(0,1.03fr) minmax(370px,.97fr);overflow:hidden}.hero-copy{padding:clamp(65px,11vw,150px) clamp(25px,7vw,120px) 80px;position:relative;z-index:2}.kicker,.eyebrow{font-family:"DM Mono",monospace;color:var(--bronze);font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700}.kicker i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--gold);vertical-align:middle;margin:0 10px}.hero h1,h2{font-size:clamp(40px,5.15vw,78px);letter-spacing:-.065em;line-height:1.03;margin:18px 0 22px;font-weight:800}.hero h1 em,h2 em{font-family:"Playfair Display",serif;font-weight:600}.hero-text{max-width:520px;color:var(--muted);font-size:16px;line-height:1.75}.hero-actions{display:flex;gap:27px;align-items:center;margin-top:34px}.button{display:inline-flex;align-items:center;gap:30px;border-radius:3px;padding:15px 20px;font-size:12px;font-weight:800;transition:transform .25s,box-shadow .25s}.button:hover{transform:translateY(-4px);box-shadow:0 10px 25px rgba(20,32,43,.17)}.button-primary{background:var(--bronze);color:white}.button-primary span{font-size:19px}.button-dark{background:var(--ink);color:white}.text-link{font-size:12px;font-weight:800;border-bottom:1px solid var(--ink);padding-bottom:3px}.text-link span{color:var(--bronze);font-size:17px;margin-left:6px}.trust-row{display:flex;gap:25px;margin-top:75px;font-size:10px;line-height:1.25;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.trust-row span{max-width:80px}.trust-row b{display:block;font-size:17px;color:var(--ink);letter-spacing:0}.hero-art{min-height:650px;background:linear-gradient(105deg,rgba(223,231,226,.42),rgba(24,54,64,.1)),url("../img/4.jpg") center/cover;position:relative;overflow:hidden;isolation:isolate}.hero-art:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(130deg,transparent 0 70px,rgba(255,255,255,.23) 71px 72px),linear-gradient(20deg,rgba(255,255,255,.4),transparent 55%)}.sun{position:absolute;width:290px;height:290px;border-radius:50%;background:#e9b877;right:14%;top:10%;opacity:.84}.route{position:absolute;width:150%;height:280px;border:2px dashed rgba(138,84,27,.35);border-radius:50%;transform:rotate(-23deg);z-index:-1}.route-one{right:-55%;bottom:8%}.route-two{right:-82%;bottom:21%;transform:rotate(-11deg)}.world-card,.freight-tag{position:absolute;background:rgba(255,255,255,.89);backdrop-filter:blur(10px);padding:14px 17px;box-shadow:0 15px 40px rgba(30,56,53,.12)}.world-card{left:10%;top:17%;width:190px}.world-card small{font:9px "DM Mono";color:var(--bronze);display:block;letter-spacing:.1em}.world-card strong{display:block;font-size:15px;margin:5px 0}.world-card i{font-style:normal;color:var(--bronze)}.world-card span{font-size:10px;color:var(--muted)}.freight-tag{right:8%;bottom:17%;font:11px "DM Mono";line-height:1.8;transform:rotate(-4deg)}.freight-tag b{color:var(--bronze)}.hero-truck{position:absolute;left:20%;bottom:29%;transform:scale(1.25);animation:floatTruck 3s ease-in-out infinite}@keyframes floatTruck{50%{transform:scale(1.25) translateY(-12px)}}.service-rail{background:var(--dark);color:white;padding:22px clamp(22px,5vw,80px);display:flex;gap:clamp(20px,4vw,75px);align-items:center;white-space:nowrap;overflow:auto}.service-rail p{margin:0;color:var(--lime);font:10px "DM Mono";letter-spacing:.08em}.service-rail a{font-size:12px;font-weight:700}.service-rail a span{color:var(--lime);margin-left:8px}.section-pad{padding:clamp(80px,11vw,160px) clamp(22px,8vw,130px)}.intro-grid{display:grid;grid-template-columns:1.15fr .7fr;gap:12vw;margin-top:34px}.intro h2,.solutions h2,.sectors h2{margin:0}.intro-grid p{margin:0 0 28px;color:var(--muted);font-size:16px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);margin-top:100px}.metrics div{padding:27px 25px 0;border-right:1px solid var(--line)}.metrics div:first-child{padding-left:0}.metrics div:last-child{border:0}.metrics b{font-size:46px;line-height:1;font-weight:500;letter-spacing:-.05em}.metrics b span{color:var(--bronze)}.metrics p{font-size:11px;color:var(--muted);line-height:1.5}.solutions{background:#e9ece7}.section-top{display:flex;justify-content:space-between;align-items:flex-end}.circle-link{height:98px;width:98px;border:1px solid var(--ink);border-radius:50%;display:grid;place-content:center;text-align:center;font-size:10px;font-weight:800;line-height:1.3;transition:.3s}.circle-link:hover{background:var(--ink);color:white;transform:rotate(9deg)}.circle-link span{display:block;color:var(--bronze);font-size:18px}.solution-list{display:grid;grid-template-columns:repeat(3,1fr);margin-top:65px}.solution-list article{position:relative;padding:25px 28px 30px;border-top:1px solid #bfc8c4;border-right:1px solid #bfc8c4;transition:.35s}.solution-list article:last-child{border-right:0}.solution-list article:hover{background:var(--bronze);color:white;transform:translateY(-12px);box-shadow:0 20px 30px rgba(55,43,21,.16)}.solution-list article>span{font:10px "DM Mono";color:var(--bronze)}.solution-list article:hover>span{color:var(--lime)}.service-icon{font:40px "Playfair Display";height:74px;padding-top:18px;color:var(--bronze)}.solution-list h3{font-size:22px;letter-spacing:-.04em;margin:0}.solution-list p{font-size:12px;line-height:1.65;color:var(--muted);max-width:230px}.solution-list article:hover p{color:#f0e7d7}.solution-list article>a{position:absolute;right:23px;bottom:20px;font-size:20px;color:var(--bronze)}.solution-list article:hover>a{color:var(--lime)}.route-section{display:grid;grid-template-columns:1fr 1.05fr;background:var(--dark);color:white;min-height:620px}.route-copy{padding:clamp(70px,11vw,130px) clamp(25px,7vw,120px)}.route-copy .eyebrow{color:var(--lime)}.route-copy h2{font-size:clamp(38px,4.5vw,63px)}.route-copy p{color:#b6c5c7;max-width:460px;margin:28px 0 36px}.route-map{position:relative;overflow:hidden;background:#183640}.map-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(217,227,122,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(217,227,122,.09) 1px,transparent 1px);background-size:48px 48px}.route-map svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.route-map path{fill:none;stroke:var(--lime);stroke-width:1.8;stroke-dasharray:7 8;animation:dash 15s linear infinite}.route-map circle{fill:var(--gold);stroke:#f6db9d;stroke-width:7}@keyframes dash{to{stroke-dashoffset:-300}}.pin{position:absolute;background:#f8f3e9;color:var(--ink);font:10px "DM Mono";padding:6px 9px;z-index:1}.pin:before{content:"";position:absolute;width:6px;height:6px;border-radius:50%;background:var(--lime);left:-3px;top:-3px}.pin-dubai{top:44%;left:48%}.pin-europe{top:20%;left:12%}.pin-asia{top:25%;right:10%}.pin-africa{bottom:17%;left:19%}.sectors-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:7vw;margin-top:35px}.sector-chips{display:grid;grid-template-columns:repeat(2,1fr);align-content:start}.sector-chips a{border-bottom:1px solid var(--line);padding:19px 5px;font-weight:700;font-size:12px;transition:.2s}.sector-chips a:nth-child(odd){margin-right:22px}.sector-chips a:hover{color:var(--bronze);padding-left:9px}.sector-chips span{float:right;color:var(--bronze)}.cta-panel{margin:0 clamp(16px,4vw,64px) 60px;padding:clamp(45px,7vw,95px);background:var(--bronze);display:grid;grid-template-columns:1fr .8fr;color:white;gap:70px}.cta-panel .kicker{color:#f4d698}.cta-panel h2{margin:13px 0 0;font-size:clamp(36px,4vw,60px)}.cta-panel>div:last-child{align-self:end}.cta-panel p:not(.kicker){color:#f5dfc3;margin:0 0 24px;max-width:360px}.cta-panel .button{background:var(--lime);color:var(--ink)}footer{padding:65px clamp(22px,5vw,80px) 25px;background:#f0eee8;display:grid;grid-template-columns:1.2fr .7fr 1.1fr 1.1fr;gap:35px;position:relative}footer h4{margin:0 0 15px;font:10px "DM Mono";letter-spacing:.1em;color:var(--bronze);text-transform:uppercase}footer>div:not(.footer-bottom){display:flex;flex-direction:column;align-items:flex-start;gap:6px;font-size:11px}footer p{color:var(--muted);font-size:11px;line-height:1.65}.footer-brand .brand{margin-bottom:12px}.footer-brand>p{font-size:14px!important;color:var(--ink)!important}.group-links a{font-size:10px}.footer-bottom{grid-column:1/-1;border-top:1px solid var(--line);padding-top:18px;margin-top:18px;font:10px "DM Mono";color:var(--muted);display:flex;justify-content:space-between}.whatsapp{position:fixed;right:22px;bottom:20px;background:#1c9a67;color:white;border-radius:50px;padding:12px 16px;z-index:4;font-size:17px;box-shadow:0 6px 20px rgba(0,0,0,.18)}.whatsapp span{font-size:11px;font-weight:800;margin-left:6px;vertical-align:1px}.loader{position:fixed;inset:0;z-index:20;background:var(--dark);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:white;font:11px "DM Mono";letter-spacing:.1em;animation:loaderOut .6s 1.1s forwards}@keyframes loaderOut{to{visibility:hidden;opacity:0;transform:translateY(-100%)}}.page-hero{padding:110px clamp(22px,10vw,160px) 90px;background:var(--dark);color:white;position:relative;overflow:hidden}.page-hero:after{content:"";position:absolute;width:600px;height:600px;border:1px solid rgba(217,227,122,.2);border-radius:50%;right:-130px;top:-270px}.page-hero .eyebrow{color:var(--lime)}.page-hero h1{position:relative;z-index:1;margin:15px 0;font-size:clamp(48px,7vw,96px);line-height:.98;letter-spacing:-.07em}.page-hero p{position:relative;z-index:1;max-width:640px;color:#b5c4c5;font-size:16px}.page-content{padding:90px clamp(22px,10vw,160px)}.prose{max-width:720px;font-size:17px;color:var(--muted)}.prose p{margin:0 0 22px}.value-grid,.sector-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:70px}.value-grid article,.sector-grid article{padding:27px;border:1px solid var(--line);min-height:180px}.value-grid h3,.sector-grid h3{margin:25px 0 8px;font-size:20px;letter-spacing:-.04em}.value-grid p,.sector-grid p{margin:0;color:var(--muted);font-size:12px}.number{font:10px "DM Mono";color:var(--bronze)}.service-page-list{margin-top:60px}.service-row{display:grid;grid-template-columns:70px 1fr .8fr 40px;gap:25px;padding:34px 0;border-top:1px solid var(--line);align-items:start}.service-row:last-child{border-bottom:1px solid var(--line)}.service-row h2{font-size:32px;margin:0}.service-row p{margin:0;color:var(--muted)}.service-row a{color:var(--bronze);font-size:20px}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw}.contact-card{background:#e9ece7;padding:35px}.contact-card h2{font-size:30px;margin:0 0 23px}.contact-card a{display:block;font-weight:800;margin:8px 0}.contact-card p{font-size:12px;color:var(--muted)}.quote-form{display:grid;grid-template-columns:1fr 1fr;gap:18px}.quote-form label{font-size:11px;font-weight:800}.quote-form input,.quote-form select,.quote-form textarea{font:14px Manrope;width:100%;border:0;border-bottom:1px solid #aab5b6;background:transparent;padding:11px 1px;outline:0}.quote-form textarea{min-height:90px;resize:vertical}.quote-form .full{grid-column:1/-1}.quote-form button{border:0;justify-self:start;cursor:pointer}.form-note{font-size:11px;color:var(--muted);margin-top:14px}@media(max-width:850px){.site-header{height:72px}.site-header nav,.header-cta{display:none}.menu-button{display:block;margin-left:auto}.site-header.open nav{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:12px 22px 20px;background:#fbfaf7;box-shadow:0 10px 15px rgba(0,0,0,.07)}.site-header.open nav a{padding:10px 0}.hero,.route-section,.cta-panel,.contact-grid{grid-template-columns:1fr}.hero-copy{padding:75px 25px 60px}.hero-art{min-height:410px}.world-card{top:11%}.hero-truck{left:13%;bottom:27%;transform:scale(.9)}.trust-row{margin-top:42px}.service-rail{gap:28px}.intro-grid,.sectors-grid{grid-template-columns:1fr;gap:30px}.metrics{margin-top:65px}.section-top{align-items:flex-start}.solution-list{grid-template-columns:1fr;margin-top:35px}.solution-list article{border-right:0}.route-copy{padding:75px 25px}.route-map{min-height:400px}.value-grid,.sector-grid{grid-template-columns:1fr}.service-row{grid-template-columns:40px 1fr 30px}.service-row p{grid-column:2}.quote-form{grid-template-columns:1fr}footer{grid-template-columns:1fr 1fr}.footer-brand,.group-links{grid-column:1/-1}}@media(max-width:480px){footer{grid-template-columns:1fr}.hero-actions{align-items:flex-start;flex-direction:column;gap:17px}.metrics{grid-template-columns:1fr}.metrics div,.metrics div:first-child{padding:20px 0;border-right:0;border-bottom:1px solid var(--line)}.sector-chips{grid-template-columns:1fr}.sector-chips a:nth-child(odd){margin-right:0}.cta-panel{margin-bottom:25px}.footer-bottom{flex-direction:column;gap:8px}}
.image-story{display:grid;grid-template-columns:1.15fr .85fr;min-height:520px;background:#f0eee8}.story-image{position:relative;overflow:hidden}.story-image img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block;filter:saturate(.82)}.story-image:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,38,48,.32),transparent 45%)}.story-image span{position:absolute;z-index:1;bottom:28px;left:clamp(24px,6vw,80px);color:white;font:10px "DM Mono";letter-spacing:.13em}.story-copy{padding:clamp(55px,9vw,120px) clamp(28px,7vw,100px);align-self:center}.story-copy h2{font-size:clamp(38px,4.5vw,65px);margin:15px 0}.story-copy p{max-width:390px;color:var(--muted);margin:0 0 25px}@media(max-width:850px){.image-story{grid-template-columns:1fr}.story-image img{min-height:360px}.story-copy{padding:65px 25px}}.image-story{display:grid;grid-template-columns:1.15fr .85fr;min-height:520px;background:#f0eee8}.story-image{position:relative;overflow:hidden}.story-image img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block;filter:saturate(.82)}.story-image:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(16,38,48,.32),transparent 45%)}.story-image span{position:absolute;z-index:1;bottom:28px;left:clamp(24px,6vw,80px);color:white;font:10px "DM Mono";letter-spacing:.13em}.story-copy{padding:clamp(55px,9vw,120px) clamp(28px,7vw,100px);align-self:center}.story-copy h2{font-size:clamp(38px,4.5vw,65px);margin:15px 0}.story-copy p{max-width:390px;color:var(--muted);margin:0 0 25px}@media(max-width:850px){.image-story{grid-template-columns:1fr}.story-image img{min-height:360px}.story-copy{padding:65px 25px}}
/* ============ scroll truck: runs left <-> right across the foot ============ */
.scroll-truck{position:fixed;left:0;right:0;bottom:0;height:52px;z-index:6;pointer-events:none;opacity:0;transform:translateY(16px);transition:opacity .45s ease,transform .5s cubic-bezier(.2,.8,.2,1)}
.scroll-truck.is-visible{opacity:1;transform:none}
.scroll-truck__road{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(20,32,43,.1);overflow:hidden}
.scroll-truck__fill{position:absolute;inset:0;transform-origin:left center;transform:scaleX(0);background:linear-gradient(90deg,var(--gold),var(--bronze))}
.scroll-truck__rig{position:absolute;left:0;bottom:3px;width:94px;height:46px;will-change:transform}
.scroll-truck__body{position:relative;width:100%;height:100%;transform:scaleX(1);transition:transform .45s cubic-bezier(.34,1.4,.5,1)}
.scroll-truck.is-reverse .scroll-truck__body{transform:scaleX(-1)}
.scroll-truck svg{display:block;width:100%;height:100%;filter:drop-shadow(0 5px 7px rgba(20,32,43,.2))}
.scroll-truck .wheel{transform-box:fill-box;transform-origin:50% 50%;animation:wheelSpin .55s linear infinite;animation-play-state:paused}
.scroll-truck.is-driving .wheel{animation-play-state:running}
@keyframes wheelSpin{to{transform:rotate(360deg)}}
/* exhaust trail — sits at the rear and flips with the truck */
.scroll-truck__smoke{position:absolute;left:1px;bottom:16px;width:0;height:0}
.scroll-truck__smoke i{position:absolute;width:9px;height:9px;border-radius:50%;background:rgba(20,32,43,.2);opacity:0;animation:puff 1.1s ease-out infinite;animation-play-state:paused}
.scroll-truck.is-driving .scroll-truck__smoke i{animation-play-state:running}
.scroll-truck__smoke i:nth-child(2){animation-delay:.22s}
.scroll-truck__smoke i:nth-child(3){animation-delay:.44s}
.scroll-truck__smoke i:nth-child(4){animation-delay:.66s}
.scroll-truck__smoke i:nth-child(5){animation-delay:.88s}
@keyframes puff{0%{opacity:0;transform:translate(0,0) scale(.35)}14%{opacity:.45}70%{opacity:.16}100%{opacity:0;transform:translate(-40px,-22px) scale(2.7)}}
.whatsapp{bottom:64px;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.whatsapp:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 12px 26px rgba(28,154,103,.4)}
@media(max-width:600px){.scroll-truck{height:40px}.scroll-truck__rig{width:70px;height:34px}.scroll-truck__smoke{bottom:12px}.whatsapp{bottom:52px}}

/* ============ enquiry form: status panel + field polish ============ */
.quote-form[hidden]{display:none}
.form-status[hidden]{display:none}
.form-status{grid-column:1/-1;margin-top:6px;padding:26px 28px;border-left:3px solid var(--bronze);background:#eef1ec;animation:statusIn .5s cubic-bezier(.2,.8,.2,1) both}
.form-status.is-ok{background:#e9efe4;border-left-color:#2f7d4f}
.form-status.is-warn{background:#f7ede2;border-left-color:#b4531f}
.form-status b{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#2f7d4f;color:#fff;font-size:16px;margin-bottom:14px}
.form-status.is-warn b{background:#b4531f}
.form-status strong{display:block;font-size:21px;letter-spacing:-.03em;line-height:1.25}
.form-status p{margin:10px 0 0;font-size:13px;color:var(--muted);max-width:430px}
.form-status em{font-style:normal;font-weight:800;color:var(--ink)}
.form-status a{font-weight:700;color:var(--bronze);border-bottom:1px solid rgba(138,84,27,.35);transition:border-color .25s}
.form-status a:hover{border-bottom-color:var(--bronze)}
.form-status__aside{font-size:11px!important}
@keyframes statusIn{from{opacity:0;transform:translateY(14px)}}
.quote-form input,.quote-form select,.quote-form textarea{transition:border-color .25s,box-shadow .25s,background .25s}
.quote-form input:focus,.quote-form select:focus,.quote-form textarea:focus{border-bottom-color:var(--bronze);box-shadow:0 1px 0 var(--bronze)}
.quote-form label{transition:color .25s}
.quote-form label:focus-within{color:var(--bronze)}
.quote-form.is-sending{opacity:.55;pointer-events:none;transition:opacity .3s}
.hide{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ============ hover + transition polish ============ */
a,button{transition:color .25s,background .25s,border-color .25s}
:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.button{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,background .3s}
.button span{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.button:hover span{transform:translateX(6px)}
.button:active{transform:translateY(-1px)}
.button:before{content:"";position:absolute;top:0;left:-120%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transition:left .6s ease}
.button:hover:before{left:150%}
.header-cta{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.header-cta:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(20,32,43,.22)}
.brand-mark{transition:transform .4s cubic-bezier(.34,1.4,.5,1)}
.brand:hover .brand-mark{transform:rotate(-10deg) scale(1.06)}
.text-link{transition:color .25s,border-color .25s}
.text-link span{display:inline-block;transition:transform .3s}
.text-link:hover{color:var(--bronze);border-bottom-color:var(--bronze)}
.text-link:hover span{transform:translateX(5px)}
.circle-link{transition:background .35s,color .35s,transform .45s cubic-bezier(.34,1.3,.5,1)}
.solution-list article{transition:background .35s,color .35s,transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
.solution-list .service-icon{transition:transform .45s cubic-bezier(.34,1.3,.5,1),color .35s}
.solution-list article:hover .service-icon{transform:translateY(-4px) scale(1.12);color:#f4d698}
.solution-list article>a{transition:transform .35s cubic-bezier(.2,.8,.2,1),color .3s}
.solution-list article:hover>a{transform:translate(5px,-5px)}
.sector-chips a span{display:inline-block;transition:transform .3s}
.sector-chips a:hover span{transform:translateX(5px)}
.value-grid article,.sector-grid article{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,border-color .4s,background .4s}
.value-grid article:hover,.sector-grid article:hover{transform:translateY(-6px);border-color:var(--bronze);background:#fff;box-shadow:0 18px 34px rgba(20,32,43,.09)}
.service-row{transition:background .35s}
.service-row:hover{background:rgba(188,123,43,.05)}
.service-row a{display:inline-block;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.service-row:hover a{transform:translateX(6px)}
.metrics div{transition:background .35s}
.metrics div:hover{background:rgba(188,123,43,.05)}
.service-rail a span{display:inline-block;transition:transform .3s}
.service-rail a:hover span{transform:translateX(4px)}
footer a:not(.brand){transition:color .25s,transform .25s}
footer a:not(.brand):hover{color:var(--bronze)}
.contact-card a{transition:color .25s,transform .25s}
.contact-card a:hover{color:var(--bronze);transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ============ hero + loader now share the scroll truck artwork ============ */
.hero-truck{position:absolute;left:17%;bottom:27%;width:300px;height:auto;transform:none;filter:drop-shadow(0 18px 14px rgba(23,38,37,.26));animation:floatTruck 3.4s ease-in-out infinite}
.hero-truck svg,.loader-truck svg{display:block;width:100%;height:auto}
@keyframes floatTruck{50%{transform:translateY(-13px)}}
.loader-truck{width:170px;filter:drop-shadow(0 12px 12px rgba(0,0,0,.35))}
@media(max-width:850px){.hero-truck{left:11%;bottom:24%;width:220px}}
@media(max-width:600px){.hero-truck{width:186px}.loader-truck{width:140px}}

/* ============ real Al Khoori Cargo logo in place of the AK monogram ============ */
/* Header: the emblem cropped out of the logo artwork (transparent padding and the
   Arabic lockup are clipped away, then the space is reclaimed with negative margins)
   so the mark reads crisply in a 90px header beside the English wordmark. */
.brand-mark{width:94.9px;height:94.9px;border-radius:0;background:none;display:block;
  clip-path:inset(10.5px 21.9px 38.4px 22.6px);margin:-10.5px -21.9px -38.4px -22.6px}
/* Footer: the complete original logo, emblem and Arabic wordmark together. */
.footer-brand .brand-mark{width:auto;height:104px;clip-path:none;margin:0 -25px 0 -25px}
@media(max-width:850px){.brand-mark{width:82.5px;height:82.5px;clip-path:inset(9.1px 19.1px 33.4px 19.6px);margin:-9.1px -19.1px -33.4px -19.6px}
.footer-brand .brand-mark{height:92px;margin:0 -22px}}

/* ============ photography across the service, sector and about pages ============ */
.service-row{grid-template-columns:70px 1fr .8fr 172px 40px}
.row-media{width:172px;height:112px;object-fit:cover;display:block;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}
.service-row:hover .row-media{transform:translateY(-4px) scale(1.03);box-shadow:0 14px 28px rgba(20,32,43,.18)}
.sector-grid article{padding:0;overflow:hidden;display:flex;flex-direction:column}
.sector-grid article>:not(.card-media){padding-left:27px;padding-right:27px}
.sector-grid article>.number{padding-top:24px}
.sector-grid article>p{padding-bottom:27px}
.card-media{width:100%;height:172px;object-fit:cover;display:block;margin-bottom:20px;
  transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.sector-grid article:hover .card-media{transform:scale(1.05)}
.feature-media{width:100%;max-height:420px;object-fit:cover;display:block;margin-top:70px}
.feature-media+.value-grid{margin-top:28px}
@media(max-width:850px){
  .service-row{grid-template-columns:40px 1fr 30px}
  .service-row p{grid-column:2}
  .row-media{grid-column:1/-1;width:100%;height:200px;margin-top:8px}
  .feature-media{max-height:260px;margin-top:44px}
}
/* route map sits on a real logistics photo, washed back so the routes stay readable */
.route-map{background:#183640 url("../img/10.jpg") center/cover}
.map-grid{background-color:rgba(16,38,48,.9)}

/* ================= hero: depth, entrance and gentle motion ================= */
@keyframes riseIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes riseTag{from{opacity:0;transform:rotate(-4deg) translateY(24px)}to{opacity:1;transform:rotate(-4deg)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes floatTag{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-4deg) translateY(-9px)}}
@keyframes glowPulse{0%,100%{opacity:.5;transform:scale(1)}50%{opacity:.78;transform:scale(1.07)}}
@keyframes cueBob{0%,100%{transform:translateY(-2px);opacity:.45}50%{transform:translateY(3px);opacity:1}}

/* copy rises in, one element after another */
.hero-copy>*{animation:riseIn .9s cubic-bezier(.2,.8,.2,1) both}
.hero-copy .kicker{animation-delay:.05s}
.hero-copy h1{animation-delay:.16s}
.hero-copy .hero-text{animation-delay:.28s}
.hero-copy .hero-actions{animation-delay:.4s}
.hero-copy .trust-row{animation-delay:.52s}
.hero-copy .scroll-cue{animation-delay:.68s}
.hero-art{animation:fadeIn 1.3s ease both}

/* the flat disc becomes a soft, slowly breathing glow */
.sun{width:380px;height:380px;right:8%;top:6%;background:radial-gradient(circle,rgba(233,184,119,.95) 0%,rgba(233,184,119,.5) 42%,rgba(233,184,119,0) 70%);opacity:.6;filter:blur(6px);animation:glowPulse 8s ease-in-out infinite}

/* floating cards, lifted off the photo like frosted glass */
.world-card,.freight-tag{border-radius:14px;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.74);backdrop-filter:blur(14px) saturate(1.25);box-shadow:0 20px 46px rgba(20,32,43,.2)}
.world-card{animation:riseIn .9s .55s cubic-bezier(.2,.8,.2,1) both,floatCard 6.5s 1.6s ease-in-out infinite}
.freight-tag{animation:riseTag .9s .7s cubic-bezier(.2,.8,.2,1) both,floatTag 7.5s 2s ease-in-out infinite}
.card-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:var(--bronze);color:#fff;font-size:13px;font-style:normal;margin-bottom:9px}

/* scroll cue */
.scroll-cue{display:inline-flex;align-items:center;gap:11px;margin-top:44px;font:10px "DM Mono",monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);transition:color .25s}
.scroll-cue i{width:28px;height:28px;border-radius:50%;border:1px solid rgba(20,32,43,.22);display:grid;place-items:center;transition:border-color .25s}
.scroll-cue i:after{content:"\2193";font-size:12px;color:var(--bronze);animation:cueBob 1.9s ease-in-out infinite}
.scroll-cue:hover{color:var(--ink)}
.scroll-cue:hover i{border-color:var(--bronze)}

/* ================= inner page heroes ================= */
.page-hero{position:relative;isolation:isolate;background:var(--dark)}
.page-hero:before{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(100deg,rgba(16,38,48,.95) 12%,rgba(16,38,48,.7) 62%,rgba(16,38,48,.52))}
.hero-about:before{background-image:linear-gradient(100deg,rgba(16,38,48,.95) 12%,rgba(16,38,48,.7) 62%,rgba(16,38,48,.52)),url("../img/11.jpg")}
.hero-services:before{background-image:linear-gradient(100deg,rgba(16,38,48,.95) 12%,rgba(16,38,48,.7) 62%,rgba(16,38,48,.52)),url("../img/2.jpg")}
.hero-business-sectors:before{background-image:linear-gradient(100deg,rgba(16,38,48,.95) 12%,rgba(16,38,48,.7) 62%,rgba(16,38,48,.52)),url("../img/9.jpg")}
.hero-contact:before{background-image:linear-gradient(100deg,rgba(16,38,48,.95) 12%,rgba(16,38,48,.7) 62%,rgba(16,38,48,.52)),url("../img/3.jpg")}
.page-hero:before{background-size:cover;background-position:center;background-repeat:no-repeat}
.page-hero>*{animation:riseIn .85s cubic-bezier(.2,.8,.2,1) both}
.page-hero .eyebrow{animation-delay:.05s}
.page-hero h1{animation-delay:.15s}
.page-hero p{animation-delay:.28s}
@media(max-width:850px){.sun{width:250px;height:250px}.scroll-cue{margin-top:32px}}

/* ---- hero refinements: pill badge, accent headline, clearer glow ---- */
.hero-copy .kicker{display:inline-flex;align-items:center;padding:9px 17px 9px 15px;border-radius:999px;
  background:rgba(188,123,43,.08);border:1px solid rgba(188,123,43,.26);color:var(--bronze)}
.hero-copy .kicker i{animation:dotPulse 2.4s ease-in-out infinite}
@keyframes dotPulse{0%,100%{box-shadow:0 0 0 0 rgba(188,123,43,.5)}70%{box-shadow:0 0 0 8px rgba(188,123,43,0)}}
.hero h1 em{color:var(--bronze)}
.sun{opacity:.78;filter:blur(4px)}
.freight-tag{right:6%;bottom:27%}
.page-hero .eyebrow{display:inline-flex;align-items:center;padding:8px 16px;border-radius:999px;
  background:rgba(217,227,122,.1);border:1px solid rgba(217,227,122,.28)}
/* failsafe: never leave hero copy stuck invisible if animations do not run */
.anim-done .hero-copy>*,.anim-done .page-hero>*,.anim-done .world-card,.anim-done .hero-art{animation:none!important;opacity:1!important}
.anim-done .hero-copy>*,.anim-done .page-hero>*,.anim-done .world-card{transform:none!important}
.anim-done .freight-tag{animation:none!important;opacity:1!important;transform:rotate(-4deg)!important}