/* Site-wide motion: scroll reveals, entrances and hover life */

/* Scroll reveal (classes added by assets/js/animations.js) */
.rv{opacity:0;transform:translateY(34px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rv-delay,0ms);will-change:opacity,transform}
.rv-left{transform:translateX(-40px)}
.rv-right{transform:translateX(40px)}
.rv-zoom{transform:scale(.94)}
.rv.is-in{opacity:1;transform:none}
@media(max-width:1000px){.rv-left,.rv-right{transform:translateY(34px)}}

/* Never let anything widen the page sideways */
html,body{max-width:100%}
body{overflow-x:hidden}
@supports(overflow:clip){body{overflow-x:clip}}

/* Page intro entrance (inner pages) */
.page-intro .container>*,.detail-hero .breadcrumb,.detail-hero-grid>div>*,.quote-aside>*{animation:anim-up .9s cubic-bezier(.2,.7,.2,1) both}
.page-intro .container>*:nth-child(2),.detail-hero-grid>div>*:nth-child(2),.quote-aside>*:nth-child(2){animation-delay:.1s}
.page-intro .container>*:nth-child(3),.detail-hero-grid>div>*:nth-child(3),.quote-aside>*:nth-child(3){animation-delay:.2s}
.page-intro .container>*:nth-child(4),.detail-hero-grid>div>*:nth-child(4),.quote-aside>*:nth-child(4){animation-delay:.3s}
.page-intro .container>*:nth-child(n+5),.detail-hero-grid>div>*:nth-child(n+5),.quote-aside>*:nth-child(n+5){animation-delay:.4s}
.detail-hero-grid>.detail-image{animation:anim-reveal-img 1.1s cubic-bezier(.2,.7,.2,1) .15s both}
.detail-image>img{animation:anim-kenburns 14s ease-in-out infinite alternate}
@keyframes anim-up{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes anim-reveal-img{from{opacity:0;clip-path:inset(0 0 100% 0 round 22px)}to{opacity:1;clip-path:inset(0 0 0 0 round 22px)}}
@keyframes anim-kenburns{from{transform:scale(1)}to{transform:scale(1.08)}}

/* Desktop nav: keep every item on one line */
@media(min-width:1201px){.main-nav>a,.nav-dropdown>summary{white-space:nowrap}}
@media(min-width:1201px) and (max-width:1380px){.main-nav{gap:14px}}

/* Header gains depth once the page scrolls */
.site-header{transition:box-shadow .3s,background .3s}
.site-header.is-scrolled{box-shadow:0 10px 30px #071f4014}

/* Eyebrow line draws in */
.rv.is-in .eyebrow>span:empty,.eyebrow.rv.is-in>span:empty,.page-intro .eyebrow>span:empty{animation:anim-line .9s cubic-bezier(.2,.7,.2,1) .2s both}
@keyframes anim-line{from{width:0}to{width:22px}}

/* Buttons: light sweep and arrow nudge */
.button{position:relative;overflow:hidden}
.button:after{content:"";position:absolute;top:0;bottom:0;left:-75%;width:50%;background:linear-gradient(100deg,transparent,#ffffff40,transparent);transform:skewX(-20deg);pointer-events:none}
.button:hover:after{animation:anim-sweep .75s ease}
.button:hover{transform:translateY(-2px);box-shadow:0 12px 26px #d8531433}
.button-white:hover,.button-ghost:hover,.button-outline-white:hover{box-shadow:0 12px 26px #071f4022}
@keyframes anim-sweep{to{left:130%}}
.button .icon,.text-link .icon,.card-bottom .icon,.section-foot .icon,.footer-enquiry .icon,.hu-more .icon,.update-bar-link .icon{transition:transform .25s ease}
.button:hover .icon,.text-link:hover .icon,.service-card:hover .card-bottom .icon,.section-foot a:hover .icon,.footer-enquiry:hover .icon,.hu-card:hover .hu-more .icon,.update-bar-link:hover .icon{transform:translateX(4px)}

/* Cards come alive on hover */
.service-card .service-icon{transition:transform .35s cubic-bezier(.3,1.6,.5,1),background .25s,border-color .25s,color .25s}
.service-card:hover .service-icon{transform:rotate(-8deg) scale(1.1)}
.process-grid article,.feature-grid article,.value-grid article{transition:transform .3s ease}
.process-grid article:hover,.feature-grid article:hover,.value-grid article:hover{transform:translateY(-5px)}
.process-num,.feature-number{transition:letter-spacing .3s}
.process-grid article:hover .process-num,.feature-grid article:hover .feature-number{letter-spacing:.2em}
.journey-icon{transition:transform .35s cubic-bezier(.3,1.6,.5,1),background .25s}
.journey-list>article:hover .journey-icon{transform:rotate(-6deg) scale(1.08);background:#ffeadc}
.journey-number{transition:color .3s}
.journey-list>article:hover .journey-number{color:var(--orange)}
.company-photo,.about-photo>img,.freight-card>img,.post-card-img img,.hu-img img,.executive-portrait img,.executive-card img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.company-intro:hover .company-photo,.about-photo:hover>img,.freight-card:hover>img,.post-card:hover .post-card-img img,.hu-card:hover .hu-img img,.executive-card:hover img{transform:scale(1.05)}
.company-intro{overflow:hidden}
.freight-card,.executive-card{transition:box-shadow .3s,transform .3s}
.freight-card:hover,.executive-card:hover{box-shadow:0 20px 44px #071f4016;transform:translateY(-4px)}
.connection-stack>div{transition:transform .3s}
.connection-stack>div:hover{transform:translateX(8px)}
.big-number{transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.connection-stack>div:hover .big-number{transform:scale(1.15)}
.platform-logos>span{transition:color .25s,transform .25s}
.platform-logos>span:hover{color:var(--orange);transform:translateY(-3px)}
.faq-item>summary{transition:color .2s,padding-left .25s}
.faq-item>summary:hover{padding-left:6px;color:var(--orange)}

/* Call-to-action band: soft moving glow */
.cta-section{overflow:hidden;isolation:isolate}
.cta-section:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,#ffffff2e,transparent 65%);top:-200px;left:-120px;z-index:-1;animation:anim-drift 12s ease-in-out infinite alternate;pointer-events:none}
@keyframes anim-drift{to{transform:translate(70vw,120px)}}

/* WhatsApp button: gentle attention ring */
.whatsapp-float:before{content:"";position:absolute;inset:-1px;border-radius:50px;border:2px solid #25d366;opacity:0;animation:anim-ring 3.2s ease-out 2s infinite;pointer-events:none}
@keyframes anim-ring{0%{opacity:.7;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.25)}}

/* Back-to-top and footer links */
.footer-grid>div>a:not(.footer-wordmark){transition:color .2s,transform .2s}
.footer-grid>div>a:not(.footer-wordmark):hover{transform:translateX(4px)}

@media(prefers-reduced-motion:reduce){
  .rv{opacity:1!important;transform:none!important;transition:none!important}
  .page-intro .container>*,.detail-hero .breadcrumb,.detail-hero-grid>div>*,.quote-aside>*,.detail-hero-grid>.detail-image,.detail-image>img,.cta-section:before,.whatsapp-float:before,.eyebrow>span:empty{animation:none!important}
  .button:hover:after{animation:none}
}