/* Flexipack motion layer (mu-plugin flexipack-motion.php) */
@property --fp-d{syntax:'<number>';inherits:true;initial-value:1}
:root{--fp-line:rgba(36,40,41,.14);--fp-ease:cubic-bezier(.22,.61,.36,1)}

/* 1. Replay on re-entry (direction-aware) */
@keyframes fpRpUp{from{opacity:0;transform:translate3d(0,40px,0)}to{opacity:1;transform:none}}
@keyframes fpRpDown{from{opacity:0;transform:translate3d(0,-40px,0)}to{opacity:1;transform:none}}
.fp-rp-hidden{opacity:0!important;animation:none!important}
.fp-rp-up{animation:fpRpUp .9s var(--fp-ease) both}
.fp-rp-down{animation:fpRpDown .9s var(--fp-ease) both}

/* 2. In-frame image parallax (tablet + desktop) */
@media(min-width:768px){.fp-px{overflow:hidden}.fp-px img{scale:1.12}}

/* 3. First-section exit (+ .fp-enter sections, motion.js section 8) */
.fp-exit-root,.fp-enter,.fp-exit{overflow:hidden}
.fp-qa-checks,.fp-range{overflow-x:clip}

/* 4. Line-draw (--fp-d animates 0 -> 1) */
.fp-draw-ready{--fp-d:0}
.fp-draw-ready.fp-drawn{--fp-d:1}
.fp-draw-reset{--fp-d:0!important;transition:none!important}
/* 7b. Products tabs: revealed content does not replay on re-open */
.e-n-tabs-content .fp-settled.animated{animation:none!important}
.elementor-divider-separator.fp-draw-ready{transform:scaleX(var(--fp-d));transform-origin:left center}
/* Home - hero product range grid */
.elementor-element-634dc40::before{transform:translateX(-50%) scaleX(var(--fp-d));transform-origin:left center}
.elementor-element-634dc40.fp-draw-ready{border-top-color:transparent!important}
@media(min-width:1025px){
.elementor-element-634dc40.fp-draw-ready{border-left-color:transparent!important;border-right-color:transparent!important;background-image:linear-gradient(var(--fp-line),var(--fp-line)),linear-gradient(var(--fp-line),var(--fp-line));background-repeat:no-repeat;background-origin:border-box;background-position:left top,right top;background-size:1px calc(var(--fp-d)*100%),1px calc(var(--fp-d)*100%)}
.elementor-element-f4aaecc.fp-draw-ready,.elementor-element-37f1708.fp-draw-ready{border-left-color:transparent!important;background-image:linear-gradient(var(--fp-line),var(--fp-line));background-repeat:no-repeat;background-origin:border-box;background-position:left top;background-size:1px calc(var(--fp-d)*100%)}
}
@media(max-width:1024px){
.elementor-element-f4aaecc.fp-draw-ready,.elementor-element-37f1708.fp-draw-ready{border-top-color:transparent!important;background-image:linear-gradient(var(--fp-line),var(--fp-line));background-repeat:no-repeat;background-origin:border-box;background-position:left top;background-size:calc(var(--fp-d)*100%) 1px}
}
.elementor-element-f4aaecc.fp-draw-ready,.elementor-element-37f1708.fp-draw-ready{transition:background-color .3s ease}
/* Products - tab heading rule */
.e-n-tabs-heading.fp-draw-ready{border-bottom-color:transparent!important;background-image:linear-gradient(#D9DCDC,#D9DCDC);background-repeat:no-repeat;background-position:left bottom;background-size:calc(var(--fp-d)*100%) 1px}

/* 5. Header shrink once scrolled (spacer clone excluded) */
body.fp-scrolled .fp-header:not(.elementor-sticky__spacer){box-shadow:0 12px 26px -20px rgba(36,40,41,.45)}

/* 6. About - 4Cs pinned stacked cards (JS adds .fp-stack only >=768px wide and >=560px tall).
   Approved layout (28 Sep): title list under the heading (built by JS from the card titles), per-card colours
   (set in Elementor), editorial portrait cards (icon top, H3 title + Lead text at the bottom), pinned block sized
   to its content with ~1/3 screen of scroll per card. */
@media(min-width:768px){
.fp-4cs.fp-stack{padding-block-start:0!important;padding-block-end:0!important}
.fp-4cs.fp-stack > .e-con{position:sticky;top:var(--fp-hdr-h,80px);padding-block:72px 88px!important}
.fp-stack .fp-stack-inner{justify-content:center!important}
.fp-stack .fp-stack-head .fp-eyebrow,.fp-stack .fp-stack-head .elementor-widget-heading{align-self:flex-start}
.fp-stack .fp-stack-stage{position:relative;display:block!important;margin-top:64px;width:100%;max-width:540px}
.fp-stack .fp-stack-card{position:absolute!important;top:0;left:0;width:100%!important;max-width:100%!important;min-height:420px;padding:40px!important;transform-origin:50% 0;box-shadow:0 -16px 40px -26px rgba(36,40,41,.35)!important;overflow:hidden}
.fp-stack .fp-stack-card > .elementor-widget-icon-box{flex:1 1 auto;display:flex;flex-direction:column;transition:opacity .4s ease}
.fp-stack .fp-stack-card > .elementor-widget-icon-box > .elementor-widget-container{flex:1 1 auto;display:flex;flex-direction:column}
.fp-stack .fp-stack-card .elementor-icon-box-wrapper{flex:1 1 auto;display:flex;flex-direction:column;align-items:flex-start;text-align:left}
.fp-stack .fp-stack-card .elementor-icon-box-icon{margin-bottom:0!important}
.fp-stack .fp-stack-card .elementor-icon-box-content{margin-top:auto;padding-top:40px}
.fp-stack .fp-stack-card .elementor-icon-box-title{min-height:0!important}
.fp-stack .fp-stack-card.is-under > .elementor-widget-icon-box{opacity:.45}
/* title list */
.fp-4c-list{display:block;list-style:none;margin:18px 0 0;padding:0;border-top:1px solid rgba(36,40,41,.14);width:100%}
.fp-4c-list li{margin:0}
body .fp-4c-list button,body .fp-4c-list button:hover,body .fp-4c-list button:focus{width:100%;display:flex;align-items:center;appearance:none;-webkit-appearance:none;background:transparent!important;box-shadow:none!important;border:0;border-bottom:1px solid rgba(36,40,41,.14);border-radius:0;margin:0;padding:16px 0 16px 18px;text-align:left;font-family:var(--e-global-typography-f8d78a0-font-family),sans-serif;font-size:17px;font-weight:600;line-height:1.3;letter-spacing:0;text-transform:none;color:rgba(36,40,41,.45);cursor:pointer;position:relative;transition:color .35s ease,padding-left .35s var(--fp-ease)}
body .fp-4c-list button::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;background:#7FBE1B;transform:scaleY(0);transform-origin:top;transition:transform .35s var(--fp-ease)}
body .fp-4c-list button:hover,body .fp-4c-list button:focus-visible{color:#242829}
body .fp-4c-list button.is-active{color:#4E7A0C;padding-left:24px}
body .fp-4c-list button.is-active::before{transform:scaleY(1)}
}
@media(max-width:767px){.fp-4c-list{display:none}}
@media(min-width:1025px){
.fp-stack .fp-stack-inner{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;gap:80px!important}
.fp-stack .fp-stack-head{flex:0 0 36%;max-width:36%}
.fp-stack .fp-stack-stage{flex:1 1 auto;margin-top:0;margin-left:auto}
}

/* 7. Products - compact sticky tab bar */
.fp-tabbar{position:fixed;left:0;right:0;top:0;z-index:98;background:#F4F5F2;border-bottom:1px solid #D9DCDC;box-shadow:0 12px 26px -22px rgba(36,40,41,.45);transform:translateY(-110%);opacity:0;visibility:hidden;transition:transform .35s var(--fp-ease),opacity .25s ease,visibility 0s linear .35s}
.fp-tabbar.is-on{transform:none;opacity:1;visibility:visible;transition:transform .35s var(--fp-ease),opacity .25s ease,visibility 0s}
.fp-tabbar__in{max-width:1250px;margin:0 auto;display:flex;padding:0 40px}
@media(min-width:1331px){.fp-tabbar__in{padding:0}}
body .fp-tabbar button,body .fp-tabbar button:hover,body .fp-tabbar button:focus{flex:1 1 0;min-width:0;appearance:none;-webkit-appearance:none;background:transparent!important;box-shadow:none!important;border:0;border-left:1px solid #D9DCDC;border-bottom:3px solid transparent;border-radius:0;margin:0 0 -1px;padding:21px 16px 18px;font-family:var(--e-global-typography-66778f8-font-family),sans-serif;font-weight:var(--e-global-typography-66778f8-font-weight);font-size:15px;line-height:1.2;letter-spacing:-.3px;text-transform:uppercase;text-align:center;color:#242829;cursor:pointer;transition:color .3s ease,border-color .3s ease}
body .fp-tabbar button:first-child{border-left:0}
body .fp-tabbar button:hover,body .fp-tabbar button:focus-visible{color:#4E7A0C}
body .fp-tabbar button.is-active{color:#4E7A0C;border-bottom-color:#7FBE1B}
@media(max-width:767px){.fp-tabbar__in{padding:0}body .fp-tabbar button,body .fp-tabbar button:hover,body .fp-tabbar button:focus{font-size:12px;letter-spacing:0;padding:17px 6px 14px}}

/* 8. Transparent header over the dark first section (Home video hero + inner-page banners).
   Layout: the first section slides up under the header by the header's natural height (73 / 54 / 46px)
   and gets that height added to its top padding, so its content stays where it was.
   State: header is transparent with white links until the first section has scrolled out from under it;
   JS then adds body.fp-hdr-solid and the normal header returns. */
:root{--fp-hdr0:73px}
@media(max-width:1024px){:root{--fp-hdr0:54px}}
@media(max-width:767px){:root{--fp-hdr0:46px}}
.fp-header{position:relative;z-index:99}
[data-elementor-type="wp-page"] > .fp-hero:first-child,[data-elementor-type="wp-page"] > .fp-banner:first-child{margin-top:calc(-1 * var(--fp-hdr0));padding-block-start:calc(var(--padding-top,0px) + var(--fp-hdr0))}
.fp-header:not(.elementor-sticky__spacer){transition:padding .35s var(--fp-ease),box-shadow .35s ease,background-color .35s ease,border-color .35s ease}
.fp-header .fp-header-in{transition:padding .35s var(--fp-ease),border-color .35s ease}
.fp-header .elementor-widget-theme-site-logo img{transition:width .35s var(--fp-ease),filter .35s ease}
.fp-header .elementor-nav-menu--main .elementor-item,.fp-header .elementor-menu-toggle{transition:color .35s ease,background-color .35s ease}
body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header{background-color:transparent!important;box-shadow:none!important}
body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header{border-bottom-color:rgba(255,255,255,.18)!important}
body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header .elementor-widget-theme-site-logo img{filter:brightness(0) invert(1)}
body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header .elementor-nav-menu--main .elementor-item{color:#FFFFFF!important}
body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header .elementor-nav-menu--main .elementor-item:hover,body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header .elementor-nav-menu--main .elementor-item:focus,body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header .elementor-nav-menu--main .elementor-item.elementor-item-active{color:#7FBE1B!important}
body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header .elementor-menu-toggle{color:#FFFFFF!important;background-color:rgba(255,255,255,.12)!important}
body:has(.fp-hero,.fp-banner):not(.fp-hdr-solid) .fp-header .elementor-menu-toggle svg{fill:#FFFFFF!important}

/* 8. Scroll-scrubbed moments (see motion.js section 8) */
.fp-cta-zoom{background-image:none!important;isolation:isolate;overflow:hidden}
.fp-cta-bg{position:absolute;inset:0;z-index:-1;background-position:center center;background-size:cover;background-repeat:no-repeat;pointer-events:none;will-change:scale}
.fp-words-on .fp-w{transition:opacity .15s linear}
.fp-qa-flow{position:relative}
.fp-qa-bar{display:none;position:absolute;left:-1px;right:-1px;top:-1px;height:3px;background:rgba(36,40,41,.12);z-index:2;pointer-events:none}
.fp-qa-bar span{position:absolute;inset:0;background:#7FBE1B;transform-origin:left center;transform:scaleX(0)}
@media(min-width:1025px){.fp-qa-bar{display:block}}
.fp-qa-on > .e-con .fp-num .elementor-heading-title{color:#C9CDCE!important;transition:color .4s ease}
.fp-qa-on > .e-con.is-lit .fp-num .elementor-heading-title{color:#7FBE1B!important}

/* 9. Smooth scroll (Lenis 1.3.26 base styles; iframes only ignore the pointer while a scroll is in motion) */
html.lenis,html.lenis body{height:auto}
.lenis:not(.lenis-autoToggle).lenis-stopped{overflow:clip}
.lenis [data-lenis-prevent],.lenis [data-lenis-prevent-wheel],.lenis [data-lenis-prevent-touch]{overscroll-behavior:contain}
html.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-scrolling iframe{pointer-events:none}

@media(prefers-reduced-motion:reduce){.fp-rp-up,.fp-rp-down{animation:none!important}.fp-tabbar{transition:none}}