.elementor-4459 .elementor-element.elementor-element-c69408b{--display:flex;--min-height:560px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:110px;--padding-bottom:36px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-b259a93{width:initial;max-width:initial;padding:0px 0px 0px 0px;bottom:-110px;z-index:99;}body:not(.rtl) .elementor-4459 .elementor-element.elementor-element-b259a93{right:-113px;}body.rtl .elementor-4459 .elementor-element.elementor-element-b259a93{left:-113px;}.elementor-4459 .elementor-element.elementor-element-b259a93 img{width:70%;}.elementor-4459 .elementor-element.elementor-element-36c583a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:1;}.elementor-4459 .elementor-element.elementor-element-20d9308{width:var( --container-widget-width, 65% );max-width:65%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--container-widget-width:65%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-d8e9fe6{width:var( --container-widget-width, 65% );max-width:65%;--container-widget-width:65%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-d8e9fe6 .elementor-heading-title{color:var( --e-global-color-secondary );}.elementor-4459 .elementor-element.elementor-element-869b6c0{width:var( --container-widget-width, 85% );max-width:85%;--container-widget-width:85%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-70c69c0{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-091af43{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-859b569{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-68832ff{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0%;--margin-bottom:0%;--margin-left:0%;--margin-right:0%;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:0;}.elementor-4459 .elementor-element.elementor-element-68832ff:not(.elementor-motion-effects-element-type-background), .elementor-4459 .elementor-element.elementor-element-68832ff > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-4459 .elementor-element.elementor-element-0fa1c00{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-0fa1c00.e-con{--align-self:center;}.elementor-4459 .elementor-element.elementor-element-a6e27e1{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:10px 0px 10px 0px;column-gap:0px;text-align:justify;font-size:18px;line-height:22px;color:var( --e-global-color-8014d52 );}.elementor-4459 .elementor-element.elementor-element-a6e27e1.elementor-element{--align-self:center;}.elementor-4459 .elementor-element.elementor-element-a6e27e1 p{margin-block-end:0px;}.elementor-4459 .elementor-element.elementor-element-9d2f058{--display:flex;--min-height:0px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overflow:hidden;--margin-top:100px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-78f33cb{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-f3dc63b .elementor-heading-title{color:#FFFFFF;}.elementor-4459 .elementor-element.elementor-element-393180e{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;font-size:18px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-ed896c8{width:var( --container-widget-width, 58% );max-width:58%;--container-widget-width:58%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-ed896c8:hover{--e-transform-scale:1.1;}.elementor-4459 .elementor-element.elementor-element-ed896c8 .elementor-button{border-style:solid;border-color:#FFFFFF;padding:15px 15px 15px 15px;}.elementor-4459 .elementor-element.elementor-element-646c550{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-556470e .elementor-heading-title{color:#FFFFFF;}.elementor-4459 .elementor-element.elementor-element-76a26b4{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;font-size:18px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-9260e06{width:var( --container-widget-width, 58% );max-width:58%;--container-widget-width:58%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-9260e06:hover{--e-transform-scale:1.1;}.elementor-4459 .elementor-element.elementor-element-9260e06 .elementor-button{border-style:solid;border-color:#FFFFFF;padding:15px 15px 15px 15px;}.elementor-4459 .elementor-element.elementor-element-7dfbf2f{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-bf38087 .elementor-heading-title{color:#FFFFFF;}.elementor-4459 .elementor-element.elementor-element-1f6a228{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;font-size:18px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-2619c16{width:var( --container-widget-width, 58% );max-width:58%;--container-widget-width:58%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-2619c16:hover{--e-transform-scale:1.1;}.elementor-4459 .elementor-element.elementor-element-2619c16 .elementor-button{border-style:solid;border-color:#FFFFFF;padding:15px 15px 15px 15px;}.elementor-4459 .elementor-element.elementor-element-c963f2b{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-903cba2 .elementor-heading-title{color:#FFFFFF;}.elementor-4459 .elementor-element.elementor-element-3bff75d{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;font-size:18px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-ba68e3f{width:var( --container-widget-width, 58% );max-width:58%;--container-widget-width:58%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-ba68e3f:hover{--e-transform-scale:1.1;}.elementor-4459 .elementor-element.elementor-element-ba68e3f .elementor-button{border-style:solid;border-color:#FFFFFF;padding:15px 15px 15px 15px;}.elementor-4459 .elementor-element.elementor-element-ec5a4e7{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-8738a17 .elementor-heading-title{color:#FFFFFF;}.elementor-4459 .elementor-element.elementor-element-8d43118{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;font-size:18px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-acf972b{width:var( --container-widget-width, 58% );max-width:58%;--container-widget-width:58%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-acf972b:hover{--e-transform-scale:1.1;}.elementor-4459 .elementor-element.elementor-element-acf972b .elementor-button{border-style:solid;border-color:#FFFFFF;padding:15px 15px 15px 15px;}.elementor-4459 .elementor-element.elementor-element-dbd023b{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:flex-start;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-ce27f91 .elementor-heading-title{color:#FFFFFF;}.elementor-4459 .elementor-element.elementor-element-6f4279f{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;font-size:18px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-35bb446{width:var( --container-widget-width, 58% );max-width:58%;--container-widget-width:58%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-35bb446:hover{--e-transform-scale:1.1;}.elementor-4459 .elementor-element.elementor-element-35bb446 .elementor-button{border-style:solid;border-color:#FFFFFF;padding:15px 15px 15px 15px;}.elementor-4459 .elementor-element.elementor-element-fb52aad{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:50px 50px;--row-gap:50px;--column-gap:50px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-0a8e14b{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-7d6a34f{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-247a489{width:var( --container-widget-width, 93% );max-width:93%;--container-widget-width:93%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-9245d58{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-85953f9{--display:flex;--min-height:715px;--justify-content:center;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-85953f9:not(.elementor-motion-effects-element-type-background), .elementor-4459 .elementor-element.elementor-element-85953f9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://fbk-sa.co.za/wp-content/uploads/2026/10/Rectangle-587.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-4459 .elementor-element.elementor-element-3e7514d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-70a1f27{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overlay-opacity:0.35;border-style:solid;--border-style:solid;border-color:#FFFFFF12;--border-color:#FFFFFF12;--border-radius:20px 20px 20px 20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:40px;--padding-bottom:40px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-70a1f27:not(.elementor-motion-effects-element-type-background), .elementor-4459 .elementor-element.elementor-element-70a1f27 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF14;}.elementor-4459 .elementor-element.elementor-element-70a1f27::before, .elementor-4459 .elementor-element.elementor-element-70a1f27 > .elementor-background-video-container::before, .elementor-4459 .elementor-element.elementor-element-70a1f27 > .e-con-inner > .elementor-background-video-container::before, .elementor-4459 .elementor-element.elementor-element-70a1f27 > .elementor-background-slideshow::before, .elementor-4459 .elementor-element.elementor-element-70a1f27 > .e-con-inner > .elementor-background-slideshow::before, .elementor-4459 .elementor-element.elementor-element-70a1f27 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{--background-overlay:'';}.elementor-4459 .elementor-element.elementor-element-da8a251{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-651a1a7{width:var( --container-widget-width, 100% );max-width:100%;padding:20px 0px 0px 0px;--container-widget-width:100%;--container-widget-flex-grow:0;color:var( --e-global-color-8014d52 );}.elementor-4459 .elementor-element.elementor-element-df144ed{padding:20px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-c192ccf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:50px 50px;--row-gap:50px;--column-gap:50px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:100px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-7115eb3{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-34c15e0{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-a181ce5{width:var( --container-widget-width, 93% );max-width:93%;--container-widget-width:93%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-69e67a4{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-0475b65{--display:flex;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-bebdd43{width:initial;max-width:initial;top:-100px;text-align:start;}body:not(.rtl) .elementor-4459 .elementor-element.elementor-element-bebdd43{left:0px;}body.rtl .elementor-4459 .elementor-element.elementor-element-bebdd43{right:0px;}.elementor-4459 .elementor-element.elementor-element-bebdd43 img{width:65%;}.elementor-4459 .elementor-element.elementor-element-82bf8ed{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-17ee395{width:var( --container-widget-width, 60% );max-width:60%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--container-widget-width:60%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-1a23686{width:var( --container-widget-width, 100% );max-width:100%;padding:20px 0px 0px 0px;--container-widget-width:100%;--container-widget-flex-grow:0;text-align:justify;}.elementor-4459 .elementor-element.elementor-element-cbb5860{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-4fe4336 .elementor-button{background-color:var( --e-global-color-8014d52 );fill:var( --e-global-color-primary );color:var( --e-global-color-primary );padding:10px 10px 10px 10px;}.elementor-4459 .elementor-element.elementor-element-4fe4336{padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-92f9831 .elementor-button{background-color:var( --e-global-color-8014d52 );fill:var( --e-global-color-primary );color:var( --e-global-color-primary );padding:10px 10px 10px 10px;}.elementor-4459 .elementor-element.elementor-element-92f9831{padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-f0f89ab{--display:flex;--margin-top:50px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-f0f89ab:not(.elementor-motion-effects-element-type-background), .elementor-4459 .elementor-element.elementor-element-f0f89ab > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-4459 .elementor-element.elementor-element-d0ce260{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-81d28b7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-b5181e5{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-b5181e5 .elementor-heading-title{color:var( --e-global-color-8014d52 );}.elementor-4459 .elementor-element.elementor-element-f2676b5{width:var( --container-widget-width, 75% );max-width:75%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--container-widget-width:75%;--container-widget-flex-grow:0;}.elementor-4459 .elementor-element.elementor-element-f2676b5 .elementor-heading-title{color:var( --e-global-color-8014d52 );}.elementor-4459 .elementor-element.elementor-element-ede39d5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-60f9226{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-09faa4c{width:var( --container-widget-width, 100% );max-width:100%;padding:20px 0px 0px 0px;--container-widget-width:100%;--container-widget-flex-grow:0;text-align:start;color:var( --e-global-color-8014d52 );}.elementor-4459 .elementor-element.elementor-element-52c12c0{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-ae2f33d .elementor-button{background-color:var( --e-global-color-8014d52 );fill:var( --e-global-color-primary );color:var( --e-global-color-primary );padding:10px 10px 10px 10px;}.elementor-4459 .elementor-element.elementor-element-ae2f33d{padding:0px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-5a89271 .elementor-button{background-color:var( --e-global-color-8014d52 );fill:var( --e-global-color-primary );color:var( --e-global-color-primary );padding:10px 10px 10px 10px;}.elementor-4459 .elementor-element.elementor-element-5a89271{padding:0px 0px 0px 0px;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-4459 .elementor-element.elementor-element-c69408b{--padding-top:110px;--padding-bottom:50px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-9d2f058{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-fb52aad{--padding-top:50px;--padding-bottom:50px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-85953f9{--padding-top:0px;--padding-bottom:0px;--padding-left:50px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-c192ccf{--padding-top:50px;--padding-bottom:50px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-0475b65{--padding-top:50px;--padding-bottom:50px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-f0f89ab{--padding-top:50px;--padding-bottom:50px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-d0ce260{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}}@media(max-width:767px){.elementor-4459 .elementor-element.elementor-element-c69408b{--padding-top:110px;--padding-bottom:50px;--padding-left:16px;--padding-right:16px;}.elementor-4459 .elementor-element.elementor-element-20d9308{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-4459 .elementor-element.elementor-element-d8e9fe6{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-4459 .elementor-element.elementor-element-869b6c0{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-4459 .elementor-element.elementor-element-9d2f058{--padding-top:0px;--padding-bottom:0px;--padding-left:16px;--padding-right:16px;}.elementor-4459 .elementor-element.elementor-element-78f33cb{--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-4459 .elementor-element.elementor-element-393180e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;font-size:16px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-ed896c8{padding:25px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-646c550{--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-4459 .elementor-element.elementor-element-76a26b4{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;font-size:16px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-9260e06{padding:25px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-7dfbf2f{--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-4459 .elementor-element.elementor-element-1f6a228{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;font-size:16px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-2619c16{padding:25px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-c963f2b{--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-4459 .elementor-element.elementor-element-3bff75d{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;font-size:16px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-ba68e3f{padding:25px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-ec5a4e7{--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-4459 .elementor-element.elementor-element-8d43118{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;font-size:16px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-acf972b{padding:25px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-dbd023b{--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-4459 .elementor-element.elementor-element-6f4279f{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;font-size:16px;line-height:22px;}.elementor-4459 .elementor-element.elementor-element-35bb446{padding:25px 0px 0px 0px;}.elementor-4459 .elementor-element.elementor-element-fb52aad{--padding-top:50px;--padding-bottom:50px;--padding-left:16px;--padding-right:16px;}.elementor-4459 .elementor-element.elementor-element-85953f9{--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-4459 .elementor-element.elementor-element-70a1f27{--padding-top:40px;--padding-bottom:40px;--padding-left:40px;--padding-right:40px;}.elementor-4459 .elementor-element.elementor-element-c192ccf{--padding-top:50px;--padding-bottom:50px;--padding-left:16px;--padding-right:16px;}.elementor-4459 .elementor-element.elementor-element-0475b65{--padding-top:50px;--padding-bottom:50px;--padding-left:16px;--padding-right:16px;}body:not(.rtl) .elementor-4459 .elementor-element.elementor-element-bebdd43{left:0px;}body.rtl .elementor-4459 .elementor-element.elementor-element-bebdd43{right:0px;}.elementor-4459 .elementor-element.elementor-element-bebdd43{top:-201px;}.elementor-4459 .elementor-element.elementor-element-17ee395{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-4459 .elementor-element.elementor-element-1a23686{text-align:start;}.elementor-4459 .elementor-element.elementor-element-f0f89ab{--padding-top:50px;--padding-bottom:50px;--padding-left:16px;--padding-right:16px;}.elementor-4459 .elementor-element.elementor-element-f2676b5{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}}@media(min-width:768px){.elementor-4459 .elementor-element.elementor-element-36c583a{--width:74%;}.elementor-4459 .elementor-element.elementor-element-3e7514d{--width:51%;}.elementor-4459 .elementor-element.elementor-element-82bf8ed{--width:50%;}}@media(max-width:1024px) and (min-width:768px){.elementor-4459 .elementor-element.elementor-element-36c583a{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-9d2f058 *//* =========================================================
   6 PANEL FULL SECTION HOVER EFFECT (3 COLUMNS x 2 ROWS)
   Section class: fbk-hover-grid-6
   Content boxed to the site width, photos full screen.
   =========================================================

   LAYER STACK (all inside .fbk-hover-grid-6):
     1  image layers        .service-N::after
     2  active image layer  (hovered one lifts above the outgoing)
     3  dark overlay        .service-N::before
     4  widgets             .service-N > *
     5  content wrapper     .e-con-inner
   ========================================================= */

.fbk-hover-grid-6 {
    position: relative;
    display: grid;
    grid-template-columns:
        minmax(20px, 1fr)
        repeat(3, minmax(0, calc(var(--fbk-box-width) / 3)))
        minmax(20px, 1fr);
    grid-template-rows: repeat(2, 1fr);
    width: 100%;
    min-height: 850px;
    overflow: hidden !important;
    gap: 0;

    isolation: isolate;          /* keeps this layer stack self-contained */
    background-color: #FFFFFF;   /* visible only while images decode */

    /* BOXED CONTENT, FULL-WIDTH IMAGES
       The three columns sit in the middle of the grid, exactly as
       wide as the site's content box, so the text lines up with
       the rest of the site. The two outer grid tracks are empty
       side margins. The photos are as wide as the screen and
       centred on the box, so they run edge to edge. Set
       --fbk-box-width to Elementor > Site Settings > Layout >
       Content Width. */
    --fbk-box-width: 1330px;

    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box;

    /* No background-image here. All six images live on the ::after
       layers below, so nothing snaps while the layers crossfade. */
}


/* =========================================================
   COLUMNS
   =========================================================
   z-index MUST stay `auto`. A numeric z-index makes each column
   its own stacking context, which traps its image layer inside
   that column and locks paint order to DOM order.
   ========================================================= */

.fbk-hover-grid-6 > .service-1,
.fbk-hover-grid-6 > .service-2,
.fbk-hover-grid-6 > .service-3,
.fbk-hover-grid-6 > .service-4,
.fbk-hover-grid-6 > .service-5,
.fbk-hover-grid-6 > .service-6 {
    position: relative;          /* containing block for ::before / ::after */
    z-index: auto;

    flex: 1 1 33.333%;
    min-width: 0;
    min-height: 400px;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    padding: 40px;
    overflow: visible;

    background: transparent;
    border: none !important;
}


/* Columns sit in the three middle tracks of the boxed grid */
.fbk-hover-grid-6 > .service-1 { grid-column: 2; grid-row: 1; }
.fbk-hover-grid-6 > .service-2 { grid-column: 3; grid-row: 1; }
.fbk-hover-grid-6 > .service-3 { grid-column: 4; grid-row: 1; }
.fbk-hover-grid-6 > .service-4 { grid-column: 2; grid-row: 2; }
.fbk-hover-grid-6 > .service-5 { grid-column: 3; grid-row: 2; }
.fbk-hover-grid-6 > .service-6 { grid-column: 4; grid-row: 2; }

.fbk-hover-grid-6 > .service-1,
.fbk-hover-grid-6 > .service-2,
.fbk-hover-grid-6 > .service-3,
.fbk-hover-grid-6 > .service-4,
.fbk-hover-grid-6 > .service-5,
.fbk-hover-grid-6 > .service-6 {
    width: 100% !important;          /* fill the whole grid cell, whatever  */
    max-width: none !important;      /* width is set on it in Elementor     */
    min-width: 0 !important;
    margin: 0 !important;
    justify-self: stretch !important;
    align-self: stretch !important;
}


/* =========================================================
   BACKGROUND IMAGE CROSSFADE LAYERS
   =========================================================
   Each layer is 3 columns wide and 2 rows tall, pulled left by its
   column index and up by its row index, so all six land on the
   identical rect and `cover` frames them identically. This relies
   on 3 equal columns, 2 equal rows and no gap.
   ========================================================= */

.fbk-hover-grid-6 > .service-1::after,
.fbk-hover-grid-6 > .service-2::after,
.fbk-hover-grid-6 > .service-3::after,
.fbk-hover-grid-6 > .service-4::after,
.fbk-hover-grid-6 > .service-5::after,
.fbk-hover-grid-6 > .service-6::after {
    content: "";

    position: absolute;
    top: 0;

    width: 100vw;                /* full width of the screen */
    height: 200%;

    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;

    opacity: 0;

    z-index: 1;
    pointer-events: none;

    transition:
        opacity 0.9s ease,
        transform 0.9s ease;
}


/* Section 1 image - the permanent base. Never fades out, so every
   transition always has something solid underneath it. */
.fbk-hover-grid-6 > .service-1::after {
    left: calc((300% - 100vw) / 2);
    opacity: 1;

    background-image: url(https://fbk-sa.co.za/wp-content/uploads/2026/11/inside-thread-brush--e1793705466147.webp);
}


/* Section 2 image */
.fbk-hover-grid-6 > .service-2::after {
    left: calc((100% - 100vw) / 2);

    background-image: url(https://fbk-sa.co.za/wp-content/uploads/2026/10/meat.webp);
}


/* Section 3 image */
.fbk-hover-grid-6 > .service-3::after {
    left: calc((-100% - 100vw) / 2);

    background-image: url(https://fbk-sa.co.za/wp-content/uploads/2026/10/Bakery-.webp);
}


/* Section 4 image (row 2, column 1) - replace URL */
.fbk-hover-grid-6 > .service-4::after {
    left: calc((300% - 100vw) / 2);
    top: -100%;

    background-image: url(https://fbk-sa.co.za/wp-content/uploads/2026/10/Dairy.webp);
}


/* Section 5 image (row 2, column 2) - replace URL */
.fbk-hover-grid-6 > .service-5::after {
    left: calc((100% - 100vw) / 2);
    top: -100%;

    background-image: url(https://fbk-sa.co.za/wp-content/uploads/2026/10/Beverage-.webp);
}


/* Section 6 image (row 2, column 3) - replace URL */
.fbk-hover-grid-6 > .service-6::after {
    left: calc((-100% - 100vw) / 2);
    top: -100%;

    background-image: url(https://fbk-sa.co.za/wp-content/uploads/2026/10/seafood.webp);
}


/* =========================================================
   IMAGE HOVER STATES
   =========================================================
   The incoming layer lifts to z-index 2 so it covers the outgoing
   one. No "hide the others" rules are needed - the other layers
   just revert to 0.

   scale(1.05) is the slow zoom on the active image. All layers
   share the same rect, so they scale about the same point and
   stay aligned. Delete the transform lines to remove it.
   ========================================================= */

.fbk-hover-grid-6:has(.service-1:hover) > .service-1::after {
    transform: scale(1.05);
}

.fbk-hover-grid-6:has(.service-2:hover) > .service-2::after,
.fbk-hover-grid-6:has(.service-3:hover) > .service-3::after,
.fbk-hover-grid-6:has(.service-4:hover) > .service-4::after,
.fbk-hover-grid-6:has(.service-5:hover) > .service-5::after,
.fbk-hover-grid-6:has(.service-6:hover) > .service-6::after {
    opacity: 1;
    z-index: 2;
    transform: scale(1.05);

    transition:
        opacity 1.2s ease,
        transform 1.2s ease;
}


/* =========================================================
   COLUMN OVERLAYS
   ========================================================= */

.fbk-hover-grid-6 > .service-1::before,
.fbk-hover-grid-6 > .service-2::before,
.fbk-hover-grid-6 > .service-3::before,
.fbk-hover-grid-6 > .service-4::before,
.fbk-hover-grid-6 > .service-5::before,
.fbk-hover-grid-6 > .service-6::before {
    content: "";
    position: absolute;
    inset: 0;

    background: rgba(20, 25, 35, 0);

    z-index: 3;                  /* above every image layer */
    pointer-events: none;

    transition: background 1.2s ease;
}


/* Elementor uses every container's ::before for its own
   "Background Overlay" and gives it a fixed width/height. The
   size is released here and set only by the edges below. */
.fbk-hover-grid-6 > .service-1::before,
.fbk-hover-grid-6 > .service-2::before,
.fbk-hover-grid-6 > .service-3::before,
.fbk-hover-grid-6 > .service-4::before,
.fbk-hover-grid-6 > .service-5::before,
.fbk-hover-grid-6 > .service-6::before {
    width: auto !important;
    height: auto !important;
    top: 0 !important;
    bottom: 0 !important;
}

/* Outer tiles (1, 3, 4, 6): the overlay covers the whole tile and
   runs past the screen edge. The section cuts it off exactly at
   the edge. */
.fbk-hover-grid-6 > .service-1::before,
.fbk-hover-grid-6 > .service-4::before {
    right: 0 !important;
    left: -100vw !important;
}

.fbk-hover-grid-6 > .service-3::before,
.fbk-hover-grid-6 > .service-6::before {
    left: 0 !important;
    right: -100vw !important;
}


/* Default: Section 1 overlay (#FD7F17) */
.fbk-hover-grid-6 > .service-1::before {
    background: #FD7F17;
}


/* Only the hovered column is tinted - each tile has its own solid colour */
.fbk-hover-grid-6:has(.service-1:hover) > .service-1::before {
    background: #FD7F17;
}

.fbk-hover-grid-6:has(.service-2:hover) > .service-2::before {
    background: #0176E8;
}

.fbk-hover-grid-6:has(.service-3:hover) > .service-3::before {
    background: #A298EF;
}

.fbk-hover-grid-6:has(.service-4:hover) > .service-4::before {
    background: #E92E35;
}

.fbk-hover-grid-6:has(.service-5:hover) > .service-5::before {
    background: #23A640;
}

.fbk-hover-grid-6:has(.service-6:hover) > .service-6::before {
    background: #000000;
}


/* Non-hovered sections remain clear */
.fbk-hover-grid-6:has(.service-1:hover) > .service-2::before,
.fbk-hover-grid-6:has(.service-1:hover) > .service-3::before,

.fbk-hover-grid-6:has(.service-2:hover) > .service-1::before,
.fbk-hover-grid-6:has(.service-2:hover) > .service-3::before,

.fbk-hover-grid-6:has(.service-3:hover) > .service-1::before,
.fbk-hover-grid-6:has(.service-3:hover) > .service-2::before,

.fbk-hover-grid-6:has(.service-4:hover) > .service-1::before,
.fbk-hover-grid-6:has(.service-5:hover) > .service-1::before,
.fbk-hover-grid-6:has(.service-6:hover) > .service-1::before {
    background: rgba(20, 25, 35, 0);
}


/* =========================================================
   CONTENT
   ========================================================= */

.fbk-hover-grid-6 > .service-1 > *,
.fbk-hover-grid-6 > .service-2 > *,
.fbk-hover-grid-6 > .service-3 > *,
.fbk-hover-grid-6 > .service-4 > *,
.fbk-hover-grid-6 > .service-5 > *,
.fbk-hover-grid-6 > .service-6 > * {
    position: relative;
    z-index: 4;                  /* above the overlay (3) */

    opacity: 1 !important;
    visibility: visible !important;

    transition: opacity 1.2s ease;
}


/* =========================================================
   BOTTOM ALIGNMENT
   ========================================================= */

.fbk-hover-grid-6 > .service-1 > .e-con-inner,
.fbk-hover-grid-6 > .service-2 > .e-con-inner,
.fbk-hover-grid-6 > .service-3 > .e-con-inner,
.fbk-hover-grid-6 > .service-4 > .e-con-inner,
.fbk-hover-grid-6 > .service-5 > .e-con-inner,
.fbk-hover-grid-6 > .service-6 > .e-con-inner {
    position: absolute !important;

    left: 0 !important;
    right: 40px !important;
    bottom: 40px !important;

    width: auto !important;
    height: auto !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: flex-start !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    z-index: 5 !important;
}


/* Keep widgets in stack */
.fbk-hover-grid-6 > .service-1 > .e-con-inner > *,
.fbk-hover-grid-6 > .service-2 > .e-con-inner > *,
.fbk-hover-grid-6 > .service-3 > .e-con-inner > *,
.fbk-hover-grid-6 > .service-4 > .e-con-inner > *,
.fbk-hover-grid-6 > .service-5 > .e-con-inner > *,
.fbk-hover-grid-6 > .service-6 > .e-con-inner > * {
    flex-shrink: 0;
}


/* Direct widgets */
.fbk-hover-grid-6 > .service-1 > .elementor-widget,
.fbk-hover-grid-6 > .service-2 > .elementor-widget,
.fbk-hover-grid-6 > .service-3 > .elementor-widget,
.fbk-hover-grid-6 > .service-4 > .elementor-widget,
.fbk-hover-grid-6 > .service-5 > .elementor-widget,
.fbk-hover-grid-6 > .service-6 > .elementor-widget {
    flex-shrink: 0;

    opacity: 1 !important;
    visibility: visible !important;
}


/* Maintain bottom position on hover */
.fbk-hover-grid-6 > .service-1:hover > .e-con-inner,
.fbk-hover-grid-6 > .service-2:hover > .e-con-inner,
.fbk-hover-grid-6 > .service-3:hover > .e-con-inner,
.fbk-hover-grid-6 > .service-4:hover > .e-con-inner,
.fbk-hover-grid-6 > .service-5:hover > .e-con-inner,
.fbk-hover-grid-6 > .service-6:hover > .e-con-inner {
    bottom: 40px !important;
    justify-content: flex-end !important;
}


/* =========================================================
   DESCRIPTIONS
   =========================================================
   The description stays in the layout at all times and animates
   its height via grid-template-rows: 0fr -> 1fr. Because
   .e-con-inner is anchored to the bottom, growing the description
   slides the number and heading upward.

   `display: none` cannot be transitioned, which is why the old
   version needed a keyframe animation and still popped.
   ========================================================= */

.fbk-hover-grid-6 .service-description {
    display: grid !important;
    grid-template-rows: 0fr;

    opacity: 0;

    transition:
        grid-template-rows 0.5s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.35s ease;
}


/* The <p> is the grid item that gets clipped. Its padding has to
   collapse too, or the closed state keeps a 15px dead gap. */
.fbk-hover-grid-6 .service-description > * {
    overflow: hidden;
    min-height: 0;

    margin: 0 !important;
    padding-top: 0;

    transition: padding-top 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}


/* Section 1 is the default-active column, so it opens on load */
.fbk-hover-grid-6 > .service-1 .service-description {
    grid-template-rows: 1fr;
    opacity: 1;
}

.fbk-hover-grid-6 > .service-1 .service-description > * {
    padding-top: 15px;
}


/* ...but it collapses as soon as another column takes over, so only
   one column is ever expanded. Wins on specificity (0,5,0 vs 0,3,0)
   because :has() inherits the weight of its most specific argument. */
.fbk-hover-grid-6:has(.service-2:hover) > .service-1 .service-description,
.fbk-hover-grid-6:has(.service-3:hover) > .service-1 .service-description,
.fbk-hover-grid-6:has(.service-4:hover) > .service-1 .service-description,
.fbk-hover-grid-6:has(.service-5:hover) > .service-1 .service-description,
.fbk-hover-grid-6:has(.service-6:hover) > .service-1 .service-description {
    grid-template-rows: 0fr;
    opacity: 0;
}

.fbk-hover-grid-6:has(.service-2:hover) > .service-1 .service-description > *,
.fbk-hover-grid-6:has(.service-3:hover) > .service-1 .service-description > *,
.fbk-hover-grid-6:has(.service-4:hover) > .service-1 .service-description > *,
.fbk-hover-grid-6:has(.service-5:hover) > .service-1 .service-description > *,
.fbk-hover-grid-6:has(.service-6:hover) > .service-1 .service-description > * {
    padding-top: 0;
}


/* Sections 2 to 6 open on their own hover */
.fbk-hover-grid-6 > .service-2:hover .service-description,
.fbk-hover-grid-6 > .service-3:hover .service-description,
.fbk-hover-grid-6 > .service-4:hover .service-description,
.fbk-hover-grid-6 > .service-5:hover .service-description,
.fbk-hover-grid-6 > .service-6:hover .service-description {
    grid-template-rows: 1fr;
    opacity: 1;

    transition:
        grid-template-rows 0.5s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.4s ease 0.1s;
}

.fbk-hover-grid-6 > .service-2:hover .service-description > *,
.fbk-hover-grid-6 > .service-3:hover .service-description > *,
.fbk-hover-grid-6 > .service-4:hover .service-description > *,
.fbk-hover-grid-6 > .service-5:hover .service-description > *,
.fbk-hover-grid-6 > .service-6:hover .service-description > * {
    padding-top: 15px;
}


/* Description text */
.fbk-hover-grid-6 .service-description,
.fbk-hover-grid-6 .service-description p {
    color: #ffffff !important;
}


/* =========================================================
   BUTTON BASE
   =========================================================
   width stays `auto` in every state and min-width does the
   animating. `width: 50px -> auto` is not an animatable pair,
   which is why the button used to snap instead of expand.
   ========================================================= */

.fbk-hover-grid-6 .hover-button .elementor-button {
    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: auto !important;
    height: 50px !important;

    min-width: 50px !important;
    min-height: 50px !important;

    padding: 0 !important;

    background: transparent !important;

    border: none !important;
    border-radius: 0;

    color: #ffffff !important;

    overflow: hidden;

    transition:
        min-width 0.5s ease,
        padding 0.5s ease,
        background-color 0.5s ease,
        border-color 0.5s ease,
        color 0.5s ease,
        transform 0.5s ease;
}


/* Button text */
.fbk-hover-grid-6 .hover-button .elementor-button-text {
    color: #ffffff !important;
    transition: opacity 0.5s ease;
}


/* Button arrow */
.fbk-hover-grid-6 .hover-button .elementor-button-icon {
    color: #ffffff !important;

    opacity: 1;

    transition:
        opacity 0.5s ease,
        width 0.5s ease,
        margin 0.5s ease;
}


/* =========================================================
   SECTION 2 TO 6 NORMAL ARROW BUTTONS
   ========================================================= */

.fbk-hover-grid-6 > .service-2 .hover-button,
.fbk-hover-grid-6 > .service-3 .hover-button,
.fbk-hover-grid-6 > .service-4 .hover-button,
.fbk-hover-grid-6 > .service-5 .hover-button,
.fbk-hover-grid-6 > .service-6 .hover-button {
    display: inline-block !important;

    opacity: 1 !important;
    visibility: visible !important;

    z-index: 10 !important;
}


.fbk-hover-grid-6 > .service-2 .hover-button .elementor-button,
.fbk-hover-grid-6 > .service-3 .hover-button .elementor-button,
.fbk-hover-grid-6 > .service-4 .hover-button .elementor-button,
.fbk-hover-grid-6 > .service-5 .hover-button .elementor-button,
.fbk-hover-grid-6 > .service-6 .hover-button .elementor-button {
    width: auto !important;
    height: 50px !important;

    min-width: 50px !important;
    min-height: 50px !important;

    padding: 0 !important;

    background: transparent !important;

    border: none !important;

    color: #ffffff !important;

    opacity: 1 !important;
    visibility: visible !important;
}


/* Arrows */
.fbk-hover-grid-6 > .service-2 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-3 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-4 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-5 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-6 .hover-button .elementor-button-icon {
    width: auto !important;
    margin: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    color: #ffffff !important;
}


/* Custom arrow SVG for sections 2 to 6 (resting state) */
.fbk-hover-grid-6 > .service-2 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-3 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-4 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-5 .hover-button .elementor-button-icon,
.fbk-hover-grid-6 > .service-6 .hover-button .elementor-button-icon {
    width: 50px !important;
    height: 50px;

    background: url(https://fbk-sa.co.za/wp-content/uploads/2026/10/Group-3.svg) center / contain no-repeat;
}

.fbk-hover-grid-6 > .service-2 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6 > .service-3 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6 > .service-4 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6 > .service-5 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6 > .service-6 .hover-button .elementor-button-icon > * {
    display: none !important;
}


/* Hide original button text */
.fbk-hover-grid-6 > .service-2 .hover-button .elementor-button-text,
.fbk-hover-grid-6 > .service-3 .hover-button .elementor-button-text,
.fbk-hover-grid-6 > .service-4 .hover-button .elementor-button-text,
.fbk-hover-grid-6 > .service-5 .hover-button .elementor-button-text,
.fbk-hover-grid-6 > .service-6 .hover-button .elementor-button-text {
    opacity: 0 !important;
    color: transparent !important;
}


/* EXPLORE label is present but transparent until hover, so it can
   fade instead of popping. `content: none` cannot be transitioned. */
.fbk-hover-grid-6 > .service-2 .hover-button .elementor-button::after,
.fbk-hover-grid-6 > .service-3 .hover-button .elementor-button::after,
.fbk-hover-grid-6 > .service-4 .hover-button .elementor-button::after,
.fbk-hover-grid-6 > .service-5 .hover-button .elementor-button::after,
.fbk-hover-grid-6 > .service-6 .hover-button .elementor-button::after {
    content: "EXPLORE" !important;

    position: absolute;
    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0.3px;

    white-space: nowrap;

    opacity: 0;
    z-index: 5;

    transition: opacity 0.4s ease;
}


/* =========================================================
   SECTION 1 EXPLORE BUTTON
   ========================================================= */

.fbk-hover-grid-6 > .service-1 .hover-button {
    display: inline-block !important;

    position: relative;

    opacity: 1 !important;
    visibility: visible !important;

    z-index: 10 !important;
}


.fbk-hover-grid-6 > .service-1 .hover-button .elementor-button {
    width: auto !important;
    height: 50px !important;

    min-width: 126px !important;
    min-height: 50px !important;

    padding: 12px 25px !important;

    background: #004A9C !important;

    border-color: #004A9C !important;

    color: #ffffff !important;
}


/* Hide original text */
.fbk-hover-grid-6 > .service-1 .hover-button .elementor-button-text {
    opacity: 0 !important;
    color: transparent !important;
}


/* Hide arrow */
.fbk-hover-grid-6 > .service-1 .hover-button .elementor-button-icon {
    width: 0 !important;
    margin: 0 !important;
    opacity: 0 !important;
}


/* Section 1 Explore text */
.fbk-hover-grid-6 > .service-1 .hover-button .elementor-button::after {
    content: "EXPLORE" !important;

    position: absolute;
    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0.3px;

    white-space: nowrap;

    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;

    z-index: 5;
}


/* Section 1 hands the active state over when another column takes
   it, so only one purple EXPLORE pill is ever on screen. */
.fbk-hover-grid-6:has(.service-2:hover) > .service-1 .hover-button .elementor-button,
.fbk-hover-grid-6:has(.service-3:hover) > .service-1 .hover-button .elementor-button,
.fbk-hover-grid-6:has(.service-4:hover) > .service-1 .hover-button .elementor-button,
.fbk-hover-grid-6:has(.service-5:hover) > .service-1 .hover-button .elementor-button,
.fbk-hover-grid-6:has(.service-6:hover) > .service-1 .hover-button .elementor-button {
    min-width: 50px !important;

    padding: 0 !important;

    background: transparent !important;

    border-color: #ffffff !important;
}


/* Arrow comes back */
.fbk-hover-grid-6:has(.service-2:hover) > .service-1 .hover-button .elementor-button-icon,
.fbk-hover-grid-6:has(.service-3:hover) > .service-1 .hover-button .elementor-button-icon,
.fbk-hover-grid-6:has(.service-4:hover) > .service-1 .hover-button .elementor-button-icon,
.fbk-hover-grid-6:has(.service-5:hover) > .service-1 .hover-button .elementor-button-icon,
.fbk-hover-grid-6:has(.service-6:hover) > .service-1 .hover-button .elementor-button-icon {
    width: 50px !important;
    height: 50px;
    margin: 0 !important;
    opacity: 1 !important;

    background: url(https://fbk-sa.co.za/wp-content/uploads/2026/10/Group-3.svg) center / contain no-repeat;
}

.fbk-hover-grid-6:has(.service-2:hover) > .service-1 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6:has(.service-3:hover) > .service-1 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6:has(.service-4:hover) > .service-1 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6:has(.service-5:hover) > .service-1 .hover-button .elementor-button-icon > *,
.fbk-hover-grid-6:has(.service-6:hover) > .service-1 .hover-button .elementor-button-icon > * {
    display: none !important;
}


/* EXPLORE label fades out */
.fbk-hover-grid-6:has(.service-2:hover) > .service-1 .hover-button .elementor-button::after,
.fbk-hover-grid-6:has(.service-3:hover) > .service-1 .hover-button .elementor-button::after,
.fbk-hover-grid-6:has(.service-4:hover) > .service-1 .hover-button .elementor-button::after,
.fbk-hover-grid-6:has(.service-5:hover) > .service-1 .hover-button .elementor-button::after,
.fbk-hover-grid-6:has(.service-6:hover) > .service-1 .hover-button .elementor-button::after {
    opacity: 0 !important;
}


/* =========================================================
   HOVERED BUTTON - ALL SIX SECTIONS
   ========================================================= */

.fbk-hover-grid-6 .service-1:hover .hover-button .elementor-button,
.fbk-hover-grid-6 .service-2:hover .hover-button .elementor-button,
.fbk-hover-grid-6 .service-3:hover .hover-button .elementor-button,
.fbk-hover-grid-6 .service-4:hover .hover-button .elementor-button,
.fbk-hover-grid-6 .service-5:hover .hover-button .elementor-button,
.fbk-hover-grid-6 .service-6:hover .hover-button .elementor-button {
    width: auto !important;
    height: 50px !important;

    min-width: 126px !important;
    min-height: 50px !important;

    padding: 12px 25px !important;

    background: #004A9C !important;

    border-color: #5B5BC7 !important;

    color: #ffffff !important;

    opacity: 1 !important;
    visibility: visible !important;
}


/* Hide original text on hover */
.fbk-hover-grid-6 .service-1:hover .hover-button .elementor-button-text,
.fbk-hover-grid-6 .service-2:hover .hover-button .elementor-button-text,
.fbk-hover-grid-6 .service-3:hover .hover-button .elementor-button-text,
.fbk-hover-grid-6 .service-4:hover .hover-button .elementor-button-text,
.fbk-hover-grid-6 .service-5:hover .hover-button .elementor-button-text,
.fbk-hover-grid-6 .service-6:hover .hover-button .elementor-button-text {
    opacity: 0 !important;
    color: transparent !important;
}


/* Hide arrow on hover */
.fbk-hover-grid-6 .service-1:hover .hover-button .elementor-button-icon,
.fbk-hover-grid-6 .service-2:hover .hover-button .elementor-button-icon,
.fbk-hover-grid-6 .service-3:hover .hover-button .elementor-button-icon,
.fbk-hover-grid-6 .service-4:hover .hover-button .elementor-button-icon,
.fbk-hover-grid-6 .service-5:hover .hover-button .elementor-button-icon,
.fbk-hover-grid-6 .service-6:hover .hover-button .elementor-button-icon {
    width: 0 !important;
    margin: 0 !important;
    opacity: 0 !important;
}


/* White EXPLORE text fades in */
.fbk-hover-grid-6 .service-1:hover .hover-button .elementor-button::after,
.fbk-hover-grid-6 .service-2:hover .hover-button .elementor-button::after,
.fbk-hover-grid-6 .service-3:hover .hover-button .elementor-button::after,
.fbk-hover-grid-6 .service-4:hover .hover-button .elementor-button::after,
.fbk-hover-grid-6 .service-5:hover .hover-button .elementor-button::after,
.fbk-hover-grid-6 .service-6:hover .hover-button .elementor-button::after {
    content: "EXPLORE" !important;

    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}


/* Button hover */
.fbk-hover-grid-6 .hover-button .elementor-button:hover {
    background: #004A9C !important;
    border-color: #5B5BC7 !important;
    color: #ffffff !important;

    transform: translateY(-2px);
}


/* =========================================================
   KEEP ALL SECTION CONTENT VISIBLE
   ========================================================= */

.fbk-hover-grid-6:hover > .service-1 > .e-con-inner,
.fbk-hover-grid-6:hover > .service-2 > .e-con-inner,
.fbk-hover-grid-6:hover > .service-3 > .e-con-inner,
.fbk-hover-grid-6:hover > .service-4 > .e-con-inner,
.fbk-hover-grid-6:hover > .service-5 > .e-con-inner,
.fbk-hover-grid-6:hover > .service-6 > .e-con-inner {
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 5 !important;
}


.fbk-hover-grid-6:hover > .service-1 > .e-con-inner > *,
.fbk-hover-grid-6:hover > .service-2 > .e-con-inner > *,
.fbk-hover-grid-6:hover > .service-3 > .e-con-inner > *,
.fbk-hover-grid-6:hover > .service-4 > .e-con-inner > *,
.fbk-hover-grid-6:hover > .service-5 > .e-con-inner > *,
.fbk-hover-grid-6:hover > .service-6 > .e-con-inner > * {
    opacity: 1 !important;
    visibility: visible !important;
}


/* =========================================================
   NON-HOVERED SECTION CONTENT STAYS VISIBLE
   ========================================================= */

.fbk-hover-grid-6:has(.service-1:hover) > .service-2 > .e-con-inner,
.fbk-hover-grid-6:has(.service-1:hover) > .service-3 > .e-con-inner,

.fbk-hover-grid-6:has(.service-2:hover) > .service-1 > .e-con-inner,
.fbk-hover-grid-6:has(.service-2:hover) > .service-3 > .e-con-inner,

.fbk-hover-grid-6:has(.service-3:hover) > .service-1 > .e-con-inner,
.fbk-hover-grid-6:has(.service-3:hover) > .service-2 > .e-con-inner {
    display: flex !important;

    opacity: 1 !important;
    visibility: visible !important;

    z-index: 5 !important;
}


/* =========================================================
   TEXT INSET - tiles 2, 3, 5, 6
   =========================================================
   Moves the text 20px in from the left edge of these tiles so it
   doesn't sit against the overlay edge. Overlays are untouched.
   Desktop only - tablet and mobile keep their own spacing.
   ========================================================= */

@media (min-width: 1025px) {

    .fbk-hover-grid-6 > .service-2 > .e-con-inner,
    .fbk-hover-grid-6 > .service-3 > .e-con-inner,
    .fbk-hover-grid-6 > .service-5 > .e-con-inner,
    .fbk-hover-grid-6 > .service-6 > .e-con-inner {
        left: 20px !important;
    }
}


/* =========================================================
   TABLET
   ========================================================= */

@media (min-width: 768px) and (max-width: 1024px) {

    .fbk-hover-grid-6 {
        min-height: 445px;
    }

    .fbk-hover-grid-6 > .service-1,
    .fbk-hover-grid-6 > .service-2,
    .fbk-hover-grid-6 > .service-3,
    .fbk-hover-grid-6 > .service-4,
    .fbk-hover-grid-6 > .service-5,
    .fbk-hover-grid-6 > .service-6 {
        min-height: 445px;
        padding: 40px;
    }

    .fbk-hover-grid-6 > .service-1 > .e-con-inner,
    .fbk-hover-grid-6 > .service-2 > .e-con-inner,
    .fbk-hover-grid-6 > .service-3 > .e-con-inner,
    .fbk-hover-grid-6 > .service-4 > .e-con-inner,
    .fbk-hover-grid-6 > .service-5 > .e-con-inner,
    .fbk-hover-grid-6 > .service-6 > .e-con-inner {
        left: 40px !important;
        right: 40px !important;
        bottom: 25px !important;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 1024px) {

    .fbk-hover-grid-6 {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        min-height: auto;
    }

    .fbk-hover-grid-6 > .service-1,
    .fbk-hover-grid-6 > .service-2,
    .fbk-hover-grid-6 > .service-3,
    .fbk-hover-grid-6 > .service-4,
    .fbk-hover-grid-6 > .service-5,
    .fbk-hover-grid-6 > .service-6 {
        grid-column: 1;
        grid-row: auto;
    }

    .fbk-hover-grid-6 > .service-1::before,
    .fbk-hover-grid-6 > .service-2::before,
    .fbk-hover-grid-6 > .service-3::before,
    .fbk-hover-grid-6 > .service-4::before,
    .fbk-hover-grid-6 > .service-5::before,
    .fbk-hover-grid-6 > .service-6::before {
        left: 0 !important;
        right: 0 !important;
    }

    .fbk-hover-grid-6 > .service-1,
    .fbk-hover-grid-6 > .service-2,
    .fbk-hover-grid-6 > .service-3,
    .fbk-hover-grid-6 > .service-4,
    .fbk-hover-grid-6 > .service-5,
    .fbk-hover-grid-6 > .service-6 {
        flex: 0 0 332px !important;

        width: 100%;
        min-height: 322px;

        padding: 30px;

        border: none !important;
    }

    /* Columns are stacked now, so each shows its OWN image at its
       own size. The 300% x 200% offset trick only makes sense in the
       grid. Without this, every column shows image 1. */
    .fbk-hover-grid-6 > .service-1::after,
    .fbk-hover-grid-6 > .service-2::after,
    .fbk-hover-grid-6 > .service-3::after,
    .fbk-hover-grid-6 > .service-4::after,
    .fbk-hover-grid-6 > .service-5::after,
    .fbk-hover-grid-6 > .service-6::after {
        width: 100% !important;
        height: 100% !important;
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;

        opacity: 1 !important;
        z-index: 1 !important;

        transform: none !important;
        transition: none !important;
    }

    /* Every column keeps its own tint - no hover on touch */
    .fbk-hover-grid-6 > .service-1::before,
    .fbk-hover-grid-6 > .service-2::before,
    .fbk-hover-grid-6 > .service-3::before,
    .fbk-hover-grid-6 > .service-4::before,
    .fbk-hover-grid-6 > .service-5::before,
    .fbk-hover-grid-6 > .service-6::before {
        background: rgba(20, 25, 35, 0.45) !important;
        transition: none !important;
    }

    .fbk-hover-grid-6 > .service-1 > .e-con-inner,
    .fbk-hover-grid-6 > .service-2 > .e-con-inner,
    .fbk-hover-grid-6 > .service-3 > .e-con-inner,
    .fbk-hover-grid-6 > .service-4 > .e-con-inner,
    .fbk-hover-grid-6 > .service-5 > .e-con-inner,
    .fbk-hover-grid-6 > .service-6 > .e-con-inner {
        left: 30px !important;
        right: 30px !important;
        bottom: 30px !important;

        width: auto !important;
        height: auto !important;

        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;

        opacity: 1 !important;
        visibility: visible !important;

        z-index: 5 !important;
    }

    /* Mobile descriptions - all open, no animation */
    .fbk-hover-grid-6 .service-description {
        grid-template-rows: 1fr !important;
        opacity: 1 !important;
        transition: none !important;
    }

    .fbk-hover-grid-6 .service-description > * {
        padding-top: 15px !important;
        transition: none !important;
    }

    /* All six buttons show the full EXPLORE pill - no hover on touch */
    .fbk-hover-grid-6 > .service-1 .hover-button,
    .fbk-hover-grid-6 > .service-2 .hover-button,
    .fbk-hover-grid-6 > .service-3 .hover-button,
    .fbk-hover-grid-6 > .service-4 .hover-button,
    .fbk-hover-grid-6 > .service-5 .hover-button,
    .fbk-hover-grid-6 > .service-6 .hover-button {
        display: inline-block !important;

        opacity: 1 !important;
        visibility: visible !important;
    }

    .fbk-hover-grid-6 > .service-1 .hover-button .elementor-button,
    .fbk-hover-grid-6 > .service-2 .hover-button .elementor-button,
    .fbk-hover-grid-6 > .service-3 .hover-button .elementor-button,
    .fbk-hover-grid-6 > .service-4 .hover-button .elementor-button,
    .fbk-hover-grid-6 > .service-5 .hover-button .elementor-button,
    .fbk-hover-grid-6 > .service-6 .hover-button .elementor-button {
        width: auto !important;
        min-width: 126px !important;
        height: 50px !important;

        padding: 12px 25px !important;

        background: #5B5BC7 !important;

        border-color: #5B5BC7 !important;

        color: #ffffff !important;
    }

    .fbk-hover-grid-6 > .service-1 .hover-button .elementor-button-icon,
    .fbk-hover-grid-6 > .service-2 .hover-button .elementor-button-icon,
    .fbk-hover-grid-6 > .service-3 .hover-button .elementor-button-icon,
    .fbk-hover-grid-6 > .service-4 .hover-button .elementor-button-icon,
    .fbk-hover-grid-6 > .service-5 .hover-button .elementor-button-icon,
    .fbk-hover-grid-6 > .service-6 .hover-button .elementor-button-icon {
        width: 0 !important;
        margin: 0 !important;
        opacity: 0 !important;
    }

    .fbk-hover-grid-6 > .service-1 .hover-button .elementor-button::after,
    .fbk-hover-grid-6 > .service-2 .hover-button .elementor-button::after,
    .fbk-hover-grid-6 > .service-3 .hover-button .elementor-button::after,
    .fbk-hover-grid-6 > .service-4 .hover-button .elementor-button::after,
    .fbk-hover-grid-6 > .service-5 .hover-button .elementor-button::after,
    .fbk-hover-grid-6 > .service-6 .hover-button .elementor-button::after {
        content: "EXPLORE" !important;

        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
    }

    /* Space between stacked sections */
    .fbk-hover-grid-6 > .service-1,
    .fbk-hover-grid-6 > .service-2,
    .fbk-hover-grid-6 > .service-3,
    .fbk-hover-grid-6 > .service-4,
    .fbk-hover-grid-6 > .service-5 {
        margin-bottom: 35px !important;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .fbk-hover-grid-6 *,
    .fbk-hover-grid-6 *::before,
    .fbk-hover-grid-6 *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-70a1f27 */.elementor-4459 .elementor-element.elementor-element-70a1f27 {
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}/* End custom CSS */