/* DBML motion layer (v1.1). Additive only: transitions, hover feedback and entrance animations.
   It does not change any layout, colour, size or structure. Everything is off for visitors who
   prefer reduced motion. */
@keyframes m-fade{from{opacity:0}to{opacity:1}}
@keyframes m-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes m-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes m-popc{from{opacity:0;transform:translate(-50%,-46%) scale(.97)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes m-pulse{0%{box-shadow:0 0 0 0 rgba(255,106,26,.55)}100%{box-shadow:0 0 0 12px rgba(255,106,26,0)}}
@keyframes m-shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
@keyframes m-spin{to{transform:rotate(360deg)}}
@keyframes m-rip{from{transform:scale(0);opacity:.28}to{transform:scale(2.6);opacity:0}}
@keyframes m-page{from{opacity:0;transform:translateY(8px)}}

@media (prefers-reduced-motion:no-preference){
/* page entrance */
main{animation:m-page .5s ease-out}

/* scroll reveal (classes are added by motion.js) */
.m-rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease var(--m-d,0s),transform .7s cubic-bezier(.2,.7,.2,1) var(--m-d,0s)}
.m-rv.m-sc{transform:translateY(24px) scale(.97)}
.m-rv.m-in{opacity:1;transform:none}
img.m-wait{opacity:0}
img.m-wait.m-done{opacity:1;transition:opacity .5s ease}

/* header */
.sh{transition:box-shadow .3s ease}
.sh.is-scrolled{box-shadow:0 6px 24px rgba(0,0,0,.08)}
.sh-logo .lg,.sf-logo .lg{transition:transform .25s ease;transform-origin:left center}
.sh-nav .sh-has:hover>ul.sh-sub,.sh-nav .sh-has:focus-within>ul.sh-sub{animation:m-drop .18s ease}

/* buttons: smooth state changes and a soft press ripple */
.btn,.rs-btn,.sh-btn,.mm-b1,.mm-b2{position:relative;overflow:hidden;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease}
.btn:active,.rs-btn:active,.sh-btn:active,.mm-b1:active,.mm-b2:active{transform:scale(.97)}
.m-rip{position:absolute;border-radius:50%;background:currentColor;pointer-events:none;transform:scale(0);animation:m-rip .6s ease-out}
.pill:active,.chip:active,.pk button:active,.tabs button:active{transform:scale(.96)}
.qty button{transition:transform .1s ease}.qty button:active{transform:scale(.88)}
.cartbtn{transition:transform .2s ease,border-color .2s ease}
#count.m-bump{animation:m-pulse .55s ease-out}
.pg-market .add{transition:transform .2s ease,background-color .2s ease}
.th button{transition:transform .2s ease,border-color .2s ease}

/* forms */
.m-shake{animation:m-shake .4s ease}
button[type=submit]:disabled{cursor:progress;opacity:.8}
button[type=submit]:disabled::after{content:"";display:inline-block;width:14px;height:14px;margin-left:10px;vertical-align:-2px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:m-spin .7s linear infinite}
#rs-ok,.ok{animation:m-up .4s ease both}

/* popups, drawer and menus */
body.rs-open .rs-scrim,body.q .scrim,body.pay #mscrim,body.open #scrim{animation:m-fade .25s ease}
body.rs-open .rs-modal,body.q .modal,body.pay .modal{animation:m-popc .3s cubic-bezier(.2,.8,.2,1)}
.mm.open{animation:m-fade .22s ease}
.mm.open .mm-item{animation:m-up .4s ease both}
.mm.open .mm-item:nth-child(1){animation-delay:.03s}.mm.open .mm-item:nth-child(2){animation-delay:.07s}.mm.open .mm-item:nth-child(3){animation-delay:.11s}.mm.open .mm-item:nth-child(4){animation-delay:.15s}.mm.open .mm-item:nth-child(5){animation-delay:.19s}.mm.open .mm-item:nth-child(6){animation-delay:.23s}.mm.open .mm-item:nth-child(7){animation-delay:.27s}.mm.open .mm-item:nth-child(8){animation-delay:.31s}
.mm.open .mm-card,.mm.open .mm-btns{animation:m-up .45s ease .3s both}
.mm-item.open .mm-sub{animation:m-drop .25s ease both}

/* tab panels, product image swap, accordions */
.mkpanel:not([hidden]),[data-pane]:not([hidden]){animation:m-fade .35s ease}
.pg-rice .main>:not(.mock){animation:m-fade .35s ease}
details[open]>*:not(summary){animation:m-drop .3s ease both}

/* decorative parallax (values set by motion.js) */
.pg-contact .ch::before,.pg-contact .ch::after,.pg-about .vm .wm{transform:translate3d(0,var(--py,0px),0)}
}

@media (prefers-reduced-motion:no-preference) and (hover:hover){
.btn:hover,.rs-btn:hover,.sh-btn:hover,.mm-b1:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(0,0,0,.16)}
.cartbtn:hover{transform:translateY(-1px)}
.sh-logo:hover .lg,.sf-logo:hover .lg{transform:scale(1.04)}
.pill:hover,.chip:hover{transform:translateY(-1px)}
.pg-market .add:hover{transform:rotate(90deg) scale(1.08)}
.pg-market .add:active{transform:scale(.88)}
.th button:hover{transform:translateY(-2px)}

/* cards */
.pg-services .card,.tc,.rc,.pg-about .vm article,.pg-contact .vis,.pg-contact .fc,.pg-market .cta{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.pg-services .card:hover,.tc:hover,.rc:hover,.pg-about .vm article:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(0,0,0,.10)}
.pg-market .p .ph{overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}
.pg-market .p .ph img,.tcph img,.ban img{transition:transform .5s ease}
.pg-market .p:hover .ph{transform:translateY(-3px);box-shadow:0 12px 24px rgba(0,0,0,.12)}
.pg-market .p:hover .ph img,.tc:hover .tcph img,.pg-services .card:hover .ban img{transform:scale(1.06)}
.pg-events .v .frame{transition:transform .3s ease,box-shadow .3s ease}
.pg-events .v:hover .frame{transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,0,0,.14)}
.pg-blog .card .im,.pg-blog .feat .im{transition:transform .35s ease,filter .35s ease}
.pg-blog .card:hover .im,.pg-blog .feat:hover .im{transform:translateY(-3px);filter:brightness(1.04)}
.pg-contact .qc .ic{transition:transform .25s ease}
.pg-contact .qc:hover .ic{transform:scale(1.08) rotate(-4deg)}
.pg-rice .rg a .ph,.pg-market .rg a .ph{transition:transform .3s ease}
.pg-rice .rg a:hover .ph{transform:translateY(-3px)}

/* home: hero tiles, logos, service sliders */
.pg-home .tile{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease}
.pg-home .tile:hover{transform:rotate(0deg) scale(1.05);z-index:2;box-shadow:0 14px 28px rgba(0,0,0,.2)}
.pg-home .marq:hover .track,.pg-home .clients:hover .logos{animation-play-state:paused}
.pg-home .logos span{transition:opacity .25s ease,transform .25s ease}
.pg-home .logos span:hover{opacity:1;transform:scale(1.06)}
.pg-home .slide .art i img{transition:transform .6s ease}
.pg-home .slide:hover .art i.on img{transform:scale(1.05)}

/* footer */
.sf li a{display:inline-block;transition:transform .2s ease,color .2s ease}
.sf li a:hover{transform:translateX(3px)}
.sf-soc a{transition:background .2s,border-color .2s,transform .2s}
.sf-soc a:hover{transform:translateY(-2px)}
}
@media print{.m-rv{opacity:1!important;transform:none!important}}