/* Motion is opt-in through JavaScript and respects the visitor's preference. */
@media (prefers-reduced-motion:no-preference){
 .motion-enabled .reading-progress{position:fixed;top:0;left:0;z-index:100;width:100%;height:3px;background:linear-gradient(90deg,#df2b1c,#ebbc51);transform:scaleX(0);transform-origin:left;pointer-events:none}
 .motion-enabled .header{transition:box-shadow .4s,background .4s}
 .motion-enabled .header.has-scrolled{box-shadow:0 8px 30px #18251e10}
 .motion-enabled .hero .eyebrow{animation:rise-in .8s cubic-bezier(.2,.7,.2,1) .1s both}
 .motion-enabled .hero h1{animation:rise-in 1s cubic-bezier(.16,1,.3,1) .2s both}
 .motion-enabled .hero h1 em{animation:rise-in .85s cubic-bezier(.16,1,.3,1) .45s both}
 .motion-enabled .hero-copy>p:not(.eyebrow){animation:rise-in .9s cubic-bezier(.16,1,.3,1) .5s both}
 .motion-enabled .hero-actions{animation:rise-in .9s cubic-bezier(.16,1,.3,1) .65s both}
 .motion-enabled .hero-index{animation:fade-in 1s .9s both}
 .motion-enabled .hero-background{animation:hero-focus 18s cubic-bezier(.2,.5,.2,1) both;translate:0 var(--hero-scroll,0px);transform-origin:60% 50%}
 .motion-enabled .engineer{animation:portrait-in 1.4s cubic-bezier(.16,1,.3,1) .18s both;translate:var(--portrait-x,0px) var(--portrait-y,0px);transition:translate .7s cubic-bezier(.2,.7,.2,1)}
 .motion-enabled .hero-stripes{animation:stripes-in 1.1s cubic-bezier(.16,1,.3,1) .4s both, stripe-drift 9s ease-in-out 1.5s infinite alternate}
 .motion-enabled .hero-index a{animation:scroll-hint 2s ease-in-out 2s 4}
 .motion-enabled .trust-strip .container>div{animation:rise-in .8s cubic-bezier(.16,1,.3,1) both}
 .motion-enabled .trust-strip .container>div:nth-child(1){animation-delay:.7s}
 .motion-enabled .trust-strip .container>div:nth-child(2){animation-delay:.8s}
 .motion-enabled .trust-strip .container>div:nth-child(3){animation-delay:.9s}
 .motion-enabled .trust-strip .container>div:nth-child(4){animation-delay:1s}
 .motion-enabled .page-heading .eyebrow,.motion-enabled .service-hero .eyebrow{animation:rise-in .75s .1s both}
 .motion-enabled .page-heading h1,.motion-enabled .service-hero h1{animation:rise-in 1s cubic-bezier(.16,1,.3,1) .15s both}
 .motion-enabled .page-heading>p:last-child,.motion-enabled .service-hero p:not(.eyebrow){animation:rise-in .9s .3s both}
 .motion-enabled .reveal{opacity:0;translate:0 28px;transition:opacity .8s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),translate .9s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms)}
 .motion-enabled .reveal.is-revealed{opacity:1;translate:0 0}
 .motion-enabled .about-photo.reveal{translate:-24px 0}
 .motion-enabled .about-photo.reveal.is-revealed{translate:0 0}
 .motion-enabled .reveal.is-revealed .eyebrow>span{animation:accent-draw .7s .15s both}
 .motion-enabled .brand-grid>div.reveal{translate:0 15px;transition-duration:.55s}
 .motion-enabled .brand-grid>div.is-revealed{translate:0 0}
 .motion-enabled .button{position:relative;overflow:hidden}
 .motion-enabled .button:before{content:'';position:absolute;top:-30%;left:-65%;height:160%;width:40%;background:linear-gradient(90deg,transparent,#ffffff2e,transparent);transform:skewX(-22deg);transition:left .65s cubic-bezier(.2,.7,.2,1);pointer-events:none}
 .motion-enabled .button:hover:before,.motion-enabled .button:focus-visible:before{left:130%}
 .motion-enabled .button>span,.motion-enabled .card-link b,.motion-enabled .request-link span{display:inline-block;transition:transform .35s cubic-bezier(.16,1,.3,1)}
 .motion-enabled .button:hover>span,.motion-enabled .product-card:hover .card-link b,.motion-enabled .request-link:hover span{transform:translate(3px,-3px)}
 .motion-enabled .product-image img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
 .motion-enabled .product-card:hover .product-image img{transform:scale(1.075)}
 .motion-enabled .brand-grid>div{overflow:hidden}
 .motion-enabled .brand-grid img{transition:transform .5s cubic-bezier(.16,1,.3,1),filter .5s;filter:saturate(.7)}
 .motion-enabled .brand-grid>div:hover img{transform:scale(1.13);filter:saturate(1)}
 .motion-enabled .cta:after{animation:cta-drift 12s ease-in-out infinite alternate}
 .motion-enabled nav a:after{transition:width .3s cubic-bezier(.16,1,.3,1)}
 .motion-enabled nav a[aria-current=page]:hover:after{width:100%}
 .motion-enabled .catalogue-item:not([hidden]){transition:opacity .65s,translate .65s,background .25s}
 .motion-enabled .catalogue-item:hover{background:#f7f7f255}
 .motion-enabled .quote-result:not([hidden]){animation:rise-in .5s cubic-bezier(.16,1,.3,1) both}
 @keyframes rise-in{from{opacity:0;transform:translateY(27px)}to{opacity:1;transform:translateY(0)}}
 @keyframes fade-in{from{opacity:0}to{opacity:1}}
 @keyframes portrait-in{from{opacity:0;transform:translate(35px,24px) scale(1.025)}to{opacity:1;transform:translate(0,0) scale(1)}}
 @keyframes hero-focus{from{transform:scale(1.14)}to{transform:scale(1.055)}}
 @keyframes stripes-in{from{opacity:0;transform:translateX(100px)}to{opacity:.85;transform:translateX(0)}}
 @keyframes stripe-drift{from{translate:0 0}to{translate:18px 0}}
 @keyframes scroll-hint{0%,100%{translate:0 0}50%{translate:0 5px}}
 @keyframes accent-draw{from{transform:scaleX(0);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
 @keyframes cta-drift{from{translate:-15px 0}to{translate:35px 0}}
 @media(max-width:760px){
  .motion-enabled .hero-background{animation-duration:12s;translate:0 0}
  .motion-enabled .engineer{translate:0 0}
  .motion-enabled .reveal{translate:0 20px}
  .motion-enabled .reveal.is-revealed{translate:0 0}
 }
}
@media print{.reveal{opacity:1!important;translate:none!important}.reading-progress{display:none!important}}
