

/*
video slider
*/
@media only screen and (min-width:768px) {
   .tik-tok .kb-slide-item img{
        opacity:.6;
        scale: .87;
        transition:all 150ms ease;
    
    }
    .tik-tok .is-next img{
        scale: 1;
        opacity:1;
    }
    .tik-tok .is-next .kb-has-image-ratio-port23::after{ 
        content:url('data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgNDQ4IDUxMiIgZmlsbD0id2hpdGUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgcm9sZT0iaW1nIj48dGl0bGU+UGxheTwvdGl0bGU+PHBhdGggZD0iTTQyNC40IDIxNC43TDcyLjQgNi42QzQzLjgtMTAuMyAwIDYuMSAwIDQ3LjlWNDY0YzAgMzcuNSA0MC43IDYwLjEgNzIuNCA0MS4zbDM1Mi0yMDhjMzEuNC0xOC41IDMxLjUtNjQuMSAwLTgyLjZ6Ij48L3BhdGg+PC9zdmc+');
        position:absolute;
        left:50%;
        top:50%;
        translate:-50% -50%;
        z-index: 9;
        width: 50px;
        height: 50px;
        transition:all 300ms ease;
    }
    .tik-tok .is-next .kb-has-image-ratio-port23::before{ 
        content:'';
        position:absolute;
        background:rgba(0,0,0,.4);
        left:50%;
        top:50%;
        translate:-50% -50%;
        z-index: 5;
        width: 100%;
        height: 100%;
        transition:all 300ms ease;
    }
    .tik-tok .is-next .kb-has-image-ratio-port23:hover::before{ 
        background:rgba(0,0,0,.6);
     }
}






.kb-gallery-ul .kadence-blocks-gallery-item .kadence-blocks-gallery-item-inner figure .kb-gallery-image-ratio-port23 {
    padding-bottom: 160%!important;
}

/*
Homepage
*/
.capability-card-row {
    & h3 {
        background: linear-gradient(70deg, #f1ebe1 60%, #fff 75%, #f1ebe1 90%) !important;
        background-size: 200% 200% !important;
        background-position:0 0;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
        white-space: nowrap;
        transition:all 250ms ease;
    }
    .wp-block-kadence-column:hover {
        .kt-inside-inner-col {
            translate: 0 -35px;
            box-shadow: 0 15px 25px -10px #936337aa, 0 35px 25px -10px #936337aa;
            cursor:pointer;
        }
       & h3 {
            background-position:100% 100%!important;
            text-shadow: 1px 1px 20px rgba(255, 255, 255, .4);
        }
        @media only screen and (max-width:480px) {
            .kt-inside-inner-col {
                translate: 0 0;
            } 
        }
    } 

}


::selection {
    color: white;
    background: #59abdd;
  }
.kt-button.button {
    background: linear-gradient(180deg, rgba(227,105,49,1) 0%,
     rgba(227,105,49,1) 25%, rgba(234,166,6,1) 25%,
     rgba(234,166,6,1) 50%, rgba(66,167,86,1) 50%,
     rgba(66,167,86,1) 75%, rgba(89,171,221,1) 75%,
     rgba(89,171,221,1) 100%)!important;
     background-size:400% 400%!important;
     background-position:0% 0%;
     color:#F1EBE1!important;
     transition:background-position 650ms ease-out, box-shadow 200ms ease!important;
     will-change:background-position!important;
     font-weight:900;
}
.kt-button.button:hover {
    box-shadow: 0 5px 8px 0 rgba(147, 99, 55, .2), 0 5px 16px 0 rgba(147, 99, 55, .4), 0 0 8px 0 rgba(255, 255, 255, .1), 0 0 16px 0 rgba(255, 255, 255, .3)!important;
    background-position:100% 100%!important;
}
@keyframes play {
    100% { background-position: -13000px; }
 }
 .logo-animation-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    height: 100px;
    width: 100%;
    translate: 0 -100%;
   & p {
    position: absolute;
    bottom: 0;
    width: 480px;
    max-width: 90vw;
    translate: 0 100%;
  }
 }
 .logo-animation {
   background: url('/wp-content/uploads/commune/commune-sprite.webp') left center;
   height:215px;
   width:650px;
   position:absolute;
   display: flex;
   justify-content: center;
   left:50%;
   top:50%;
   scale:.77;
   translate:-50% -65%;
  animation: play 4s steps(20) infinite;
  @media only screen and (max-width:560px) {
    scale:.57;
  }
  @media only screen and (max-width:400px) {
    scale:.46;
  }
 }

.cards-section {
    display:flex;
    justify-content: center;
    align-items: center;
    height:500px;
    position: relative;
}

.cards-section  .wp-block-kadence-column.cc-card {
    top:50%;
    left:50%;
    translate:-50% -50%;
    position:absolute;
    width:300px;
    height:400px;
    border-radius: 45px;
    -webkit-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0);
    overflow: hidden;
    display:flex;
    justify-content: center;
    z-index: 3;
    opacity:1;
    background:black;
    box-shadow:0 0 2px 0 rgba(0,0,0,.3), 0 0 10px 0 rgba(0,0,0,.2), 0 0 15px 0 rgba(0,0,0,.3);
    transition:all 300ms ease;
    will-change:z-index, box-shadow, opacity, rotate, translate;
    }
 
    

        /*
Global Styles
*/
h1.case-study-title {
    padding-top:0!important;
}

.kb-buttons-wrap .kb-button.kb-btn-global-fill.button {
    border-radius:10px;
}
.wp-block-group-is-layout-grid {
    align-items:center;
    @media only screen and (max-width:768px) {
        grid-template-columns: 1fr!important;
        & h4 {
            padding-top:0!important;
        }
    }
    @media only screen and (max-width:480px) {
        padding:20px 20px 25px 20px!important;
    }
}
.whitespace {
    white-space:nowrap;
}

.global-cta a, .global-cta {
    cursor:pointer!important;
  }

.mobile-drawer-none {
    display: none!important;
    visibility: hidden!important;
}
  .contact-popup input::placeholder, .contact-popup textarea::placeholder {
    color:white!important;
     }
     .contact-popup input:focus::placeholder, .contact-popup textarea:focus::placeholder {
            color:rgb(0, 0, 0)!important;
             }
             .inside-popup {
                clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);
                -webkit-clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%);
                opacity:1;
                translate:0 100px;
                margin-top:10px;
                transition:-webkit-clip-path 650ms ease, clip-path 650ms ease, opacity 850ms ease 200ms, translate 650ms ease 850ms;
                will-change: opacity, clip-path, -webkit-clip-path, translate;
                @media only screen and (min-width:769px) {
                    position: absolute;
                    top: 50%;
                    translate: 0 -30%;
                }  
                @media only screen and (max-width:480px){
                    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
                -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
                translate:0 50px;
                }
              
            }
            .inside-on {
                clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
                -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
                translate:0 50px;
                opacity:1;
                transition:-webkit-clip-path 700ms ease 220ms, clip-path 700ms ease 220ms, opacity 900ms ease, translate 650ms ease 100ms!important;
            
                @media only screen and (min-width:769px) {
                    position: absolute;
                    top: 50%;
                    translate: 0 -36%;
                }  
            }
.contact-popup::after {
    content:'';
    position: absolute;
    top:0;
    left:0;
    z-index: -2;
    width:100%;
    opacity:.9;
    height:100%;
    filter: brightness(.5);
    background-color:hsla(18,85%,57%, 0.6);
background-image:
radial-gradient(at 16% 51%, hsla(51,93%,60%, 0.6) 0px, transparent 50%),
radial-gradient(at 52% 45%, hsla(197,79%,68%, 0.7) 0px, transparent 50%),
radial-gradient(at 70% 94%, hsla(160,45%,47%, 0.6) 0px, transparent 50%),
radial-gradient(at 55% 61%, hsla(197,79%,68%, 0.7) 0px, transparent 50%),
radial-gradient(at 34% 87%, hsla(99,46%,56%, 0.6) 0px, transparent 50%),
radial-gradient(at 97% 2%, hsla(18,100%,57%, 0.6) 0px, transparent 50%),
radial-gradient(at 0% 99%, hsla(18,100%,57%, 0.6) 0px, transparent 50%),
radial-gradient(at 84% 48%, hsla(23,100%,54%, 0.6) 0px, transparent 50%),
radial-gradient(at 51% 18%, hsla(205,64%,66%, 0.8) 0px, transparent 50%),
radial-gradient(at 98% 90%, hsla(51,100%,60%, 0.6) 0px, transparent 50%),
radial-gradient(at 0% 7%, hsla(205,100%,65%, 0.8) 0px, transparent 50%);


}
.contact-popup {
    width:100vw;
    height:100vh;
    background:#00000085;
    position:fixed;
    top:0;
    color:white;
    left:0;
    z-index:9999;
    opacity:0;
    pointer-events:none;
    display:flex;
    flex-wrap:wrap;
    justify-content: center;
    align-items: center;
    transition:all 300ms ease 600ms;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    .close-pop-div {
        position: absolute;
        top: 0;
        left: 0;
        height: 100vh;
        width: 100vw;
        z-index: -1;
        background: transparent;
    }
    .wpcf7 form .wpcf7-response-output {
        animation: errorfade 2.5s ease-in-out forwards;
        animation-iteration-count: 1;
        border: none;
        padding: 0;
        margin: 0;
        margin-top: 20px;
        font-size: 18px;
        color: #f1ebe1;
        left: 50%;
        position: absolute;
        translate: -50% -30%;
      }
      .wpcf7-form-control::placeholder {
        color:red;
      }
      .wpcf7-not-valid {
        border-color: #dc3232 !important;
      }
    & h1, & h2 {
        -webkit-text-fill-color:#fff;
    }
    & div {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            text-align: center;
            padding: 0 20px;
            width:100%;
            max-width: 95vw;
            
    }
    .inside-popup {
        width: 450px;
        padding: 15px 0;
        margin: 0;
}
    & hr {
        width: 100%;
        background: transparent;
        color: transparent;
        border:none;
    }
    & div.wpcf7 {
        flex-basis:100%;
        padding-bottom:50px;
    }
    & p {
        margin:0;
    }
    & p.close {
        position: absolute;
        top: 15px;
        right: 15px;
        color: #fff;
        font-size: 200%!important;
        line-height: 1 !important;
        cursor:pointer;
    }
    & p.close:hover {
        opacity:.5;
    }
    & h2 {
        
        padding-top:0!important;
        padding-bottom:15px;
    }
    & a.kb-button {
        padding: 12px 45px;
        color: white!important;
        border-radius: 10px;
        font-size: 170% !important;
        font-weight:100!important;
        display:none;
        font-family: var(--global-heading-font-family)!important;
        @media only screen and (max-width:768px) {
            background:#59ABDD!important;
        }
    }
    & p.wp-block-kadence-advancedheading {
        padding: 0;
        margin: 0;
        font-size: 150% !important;
        display:none;
    }
    .wpcf7 {
        & input {
            border-color:#afa9a0;
            background:#ffffff87;
            text-indent: 10px;
            border-bottom: 1px solid #ffffffbb;
        }
        & input, & label, .wpcf7-form-control-wrap {
            width:100%;
            border-radius:0;
        }
        & input[name="your-name"] {
            border-radius:10px 10px 0 0;
        }
        & label {
            display:flex;
        }
        & textarea {
            max-height:120px;
            max-width:450px;
            border-color:#afa9a0;
            background:#ffffff87;
            border-radius:0 0 10px 10px;
            width:100%!important;
            text-indent: 10px;
        }
        & select {
            width: 100%;
            background-color:#ffffff87;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none' stroke-width='2' stroke='%23fff'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");            text-indent: 10px;
            border: none;
            color:white;
            padding: 7px 10px;
            border-bottom: 1px solid #ffffffbb;
        }
        & input.wpcf7-submit {
            margin-top:10px;
            color:white;
            border-radius: 10px;
            border-bottom: none;
            font-family: Outfit, sans-serif!important;
            @media only screen and (max-width:768px) {
                background:#59ABDD!important;
             }
        }
        .wpcf7-spinner {
            translate: 55px -33px;
        }
    
        & input:focus, & textarea:focus {
            background:#f1ebe1;
      
        }
        .wpcf7-not-valid-tip {
            display:none;
        }
    }
    & div.cf7-cf-turnstile {
        margin: 0 !important;
        padding: 0 !important;
        translate: 0 -10px;
        & div {
            margin:0;
            padding:0;
            width: auto;
            border-radius: 20px;
            overflow: hidden;
            border: 1px solid #797979;
        }
    }
}

@keyframes errorfade {
    70% {
      opacity:1;
    }
    100%{
      opacity:0;
    }
  }
img {
    user-select: none;
    pointer-events:none;
}
.sticky {
    position: sticky;
    top: 150px;
}
.video-divider::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    translate: -50% 0;
    background: #f1ebe1;
    height: 35vw;
    bottom: 0;
    max-height:410px;
}

.form-on {
    opacity:1;
    pointer-events:auto;
    transition-delay: unset!important;
}

.body-toggle {
pointer-events:none;
overflow:hidden;
}


/*Portfolio pages*/
@keyframes mock-scroll {
    0% {
      background-position:0 0;
    }

    100% {
        background-position:100% 100%;
    }
  }
  .newspaper-wrapper, .ipad-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        width: 1150px;
        max-width: 100%;
        background: url('/wp-content/uploads/2024/11/Newspaper-2.jpg');
        background-size: cover;
        padding: 40px 30px 10%;
        border-radius: 25px;
        margin: 50px 0;
        @media only screen and (max-width:767px) {
            margin: -25px 0;
            border-radius: 0;
            max-width: unset;
            width:100vw;
            padding: 40px 30px 12%;
        }
  }
  .ipad-wrapper {
    background:transparent;
    padding:0 40px;
    @media only screen and (max-width:1000px) {
        padding:0;
        margin: -20px 0 -33px;
    }
  }
  img.newspaper {
    width: 925px;
    height: auto;
    max-width: 102.5%;
    margin-bottom: 10px;
    opacity:.9;
  }
  .scrolling-mock, .scrolling-pie {
    width:900px;
    height:600px;
    max-width:100%;
    background-color:black;
    background-image: url('/wp-content/uploads/2024/12/SB-Spadea-OutdoorsSoIn-1.jpg');
    background-position:0 0;
    background-size:101%;
    background-repeat:no-repeat;
    border-radius:10px;
    overflow:hidden;
    animation: mock-scroll 25s linear infinite forwards;
  }
  .scrolling-pie {
    background: url('/wp-content/uploads/2024/12/Lauries_Web_mock.jpg');
    background-position:0 0;
    background-size: 101%;
    background-repeat: no-repeat;
    position: absolute;
    width: 852px;
    height: 590px;
    border-radius: 0 0 10px 10px;
    top: 50%;
    left: 50%;
    translate: -46.6% -48.5%;
    animation: mock-scroll 15s linear infinite forwards;
    @media only screen and (max-width:1000px) {
        width: 510px;
        height: 355px;
        translate: -46.6% -46.5%;
    }
    @media only screen and (max-width:600px) {
        border-radius: 0 0 5px 5px;
        width: 290px;
        height: 200px;
        translate: -46.6% -45.1%;
    }
  }
  .scrolling-pie::after {
    content:'';
    width:100px;
    height:5px;
    background:black;
    position: absolute;
    bottom:10px;
    left:50%;
    translate:-50% 0;
    border-radius: 15px;
    box-shadow: 0 0 10px 0 #00000080;
  }
  img.ipad {
    max-width:unset;
    @media only screen and (max-width:1000px) {
        width:600px;
      }
      @media only screen and (max-width:600px) {
        width:340px;
      }
  }
.full-bleed-video figure:has(> video) {
	height:100%;
	width:100%;
	& video {
		height:100%;
		width:100%;
		object-fit:cover;
	}
}

.full-bleed-img figure:has(> img) {
	height:100%;
	width:100%;
	& img {
		height:100%;
		width:100%;
		object-fit:cover;
	}
}

.overlap-right-img img{
    translate: 20% 0;
    z-index: 99;
    scale: 1.4;
    @media only screen and (max-width:768px) {
        translate:0;
        scale: 1;
    }
}

.overlap-left-img img{
	translate: -10% 0;
	z-index: 99;
	scale: 1.2;
	@media only screen and (max-width:768px) {
		translate:0;
		scale:1;
	}
}

.left-img-resize img{
	translate: -10 0%;
	scale: 1;
	}


.center-img-resize img{
	translate: 0%;
	scale: 1.4;
	@media only screen and (max-width:768px) {
		translate:0;
		scale:1.2;
	}
}


/*Header*/
@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
     opacity: 1;
    }
}
.kadence-svg-iconset:hover svg {
    color:#59ABDD!important;
}
.drawer-inner {
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
}
nav li{
  
    font-size: 16px;
}
.transparent-header {
    
    .main-navigation .primary-menu-container > ul > li.menu-item > a {
        color:#1d1b1b;
    }
    .main-navigation .primary-menu-container > ul > li.menu-item > a:hover {
        color:#59ABDD;
    }
    .main-navigation .primary-menu-container > ul > li.menu-item.current-menu-item > a {
        color:#59ABDD;
        border-color:#59ABDD;
    }
    #masthead.reveal-hdr {
        .main-navigation .primary-menu-container > ul > li.menu-item > a {color:#59ABDD;}
        .main-navigation .primary-menu-container > ul > li.menu-item > a:hover {
            color:#f1ebe1;
                border-color:#f1ebe1;
        }
        .site-header-row-container-inner {
            backdrop-filter: blur(15px);
            -webkit-backdrop-filter: blur(15px);
            background:rgba(0,0,0,.6)!important;
            transition:all 350ms ease;
            .main-navigation .primary-menu-container > ul > li.menu-item.current-menu-item > a {
                color:#f1ebe1;
                border-color:#f1ebe1;
            }
        }
     .kadence-svg-iconset svg {
        color:#59ABDD;
     }
     .kadence-svg-iconset:hover svg {
        color: white !important;
    }
    }

} 
.transparent-header  #masthead.reveal-hdr.hdr-top {
    .main-navigation .primary-menu-container > ul > li.menu-item > a {color:black;}
    .site-header-row-container-inner {
        backdrop-filter: blur(0);
        -webkit-backdrop-filter: blur(0);
        background:transparent!important;
        .main-navigation .primary-menu-container > ul > li.menu-item.current-menu-item > a {
            color:#59ABDD;
            border-color:#59ABDD;
        }
    }
    .kadence-svg-iconset svg {
        color:#1d1b1b;
     }
     .kadence-svg-iconset:hover svg {
        color: #59ABDD!important;
    }
    .main-navigation .primary-menu-container > ul > li.menu-item > a:hover {
        color:#59ABDD;
            border-color:#59ABDD;
    }
}
/*Mobile*/    
.site-header-section .mobile-toggle-open-container .menu-toggle-open:hover {
    color:#59ABDD;
}
@media only screen and (max-width:768px) {
    .menu-item-1107 {
        position:relative;
        & a {
            border-bottom: none;
            background: #f1ebe1;
            margin-top: 30px;
            border-radius: 15px;
            color: black;
            -webkit-text-fill-color:black;
            position: absolute;
            width: 100%;
        }

    }
    ul.menu {
        max-width: 450px;
        margin: 0 auto!important;
    }
    ul.sub-menu li a {position:relative;}
    ul.sub-menu li a::before {
        content: '';
        background: #59ABDD;
        width: 9px;
        height: 10px;
        display: block;
        position: absolute;
        left: 50%;
        top: 50%;
        translate: -1050% -52%;
        clip-path: polygon(100% 50%, 0 0, 0 100%);
        -webkit-clip-path: polygon(100% 50%, 0 0, 0 100%);
    }
    .drawer-content .site-header-item .mobile-navigation{
        translate: 0 -27%;
    }
}
.sub-menu {
    background:#f1ebe1!important;
    translate: 0 18px;
    border-radius: 0 0 10px 10px!important;
    overflow:hidden;
    @media only screen and (max-width:768px){
        background:transparent!important;
        -webkit-text-fill-color: #f1ebe1;
        border-radius: 0 !important;
        translate: 0 0;
    }
    
    & li a{
       color:#1d1b1b!important;

       @media only screen and (max-width:768px){
        -webkit-text-fill-color: #f1ebe1;
        }
    }
    & li a:hover{
        color:#f1ebe1!important;
        background:#59ABDD!important;
     }
      li.menu-item.current-menu-item > a {
        background:transparent!important;
    }
    li.menu-item.current-menu-item > a:hover {
        background:#59ABDD!important;
    }
}

.menu-item-1016::before {
    content: '';
    width: 100%;
    height: 100%;
    background: transparent;
    position: absolute;
    top: 75%;
}
.drawer-inner {
    .mobile-navigation ul li > a {
        color:white;
    }
   .mobile-wrapper {
    position: absolute;
    bottom: 0;
    left: 50%;
    translate: -50% 0;
    text-align: center;
    font-size: 12px !important;
    width: 100%;
    padding-bottom: 25px;
    & a.kb-button {
        color:white;
    }
    & img {
        margin: 0 auto;
        width: 150px;
        pointer-events:none;
        translate: 0 -3px;
    }
    & div {
            font-size:125%;
        }
   }
}
        /*
Global typography
*/
@media only screen and (max-width:480px) {
    h1 {
        font-size:2.55em!important;
    }
    p {
        font-size:.9em!important;
    }
}
.xl {
    font-size:400%;
    @media only screen and (max-width:600px) {
        font-size:200%;
    }
}
h1, h2 {
    line-height:1!important;
}

h1, h2, h3, h5, h6, h7 {
	font-weight:400;
	margin:0 0 18px!important;
    word-break: normal!important;
}
h3 {
    max-width:500px;
}

p {
    line-height:1.5!important;
    word-break: normal!important;
}
/* team post grids*/
.team-members-grid {
    display: flex;
    max-width: 1400px;
    justify-content: center;
    flex-wrap: wrap;
    margin: 0 auto;
    column-gap: 25px;
    row-gap: 50px;
    padding:80px 15px 0;
   
    .team-member-card {
        display:flex;
        justify-content:center;
        flex-wrap:wrap;
        width: 300px;
        .team-member-inner-card {
            width: 300px;
            height: 325px;
            border-radius: 30px;
            display: flex;
            justify-content: center;
            flex-basis:100%;
            background-size: cover;
            box-shadow:0 0 5px 0 rgba(0,0,0,.08)
         }
         .team-member-content {
            & h1, & p {
                text-align:center;
            }
            & p.title {
                font-weight:bold;
                font-size:150%;
                margin:8px 0 0;
            }
         }
    }
    
}
/* case studies grids*/
.case-studies-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-content: center;
    margin: 0 auto;
    justify-items: center;
    gap: 25px;
    padding:80px 0 0;
    @media only screen and (max-width:1150px) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    @media only screen and (max-width:780px) {
        grid-template-columns: 1fr;
    }
    .case-study-item::after {
        content:'';
        width:calc(100% + 15px);
        height:calc(100% + 15px);
        position:absolute;
        left:50%;
        top:50%;
        translate:-50% -50%;
        background: #42A756;
        z-index: -1;
        border-radius: 35px;
        transition: all 300ms cubic-bezier(0.075, 0.820, 0.165, 1.000);
        clip-path: polygon(50% 0, 50% 0, 50% 0, 50% 0);
        -webkit-clip-path: polygon(50% 0, 50% 0, 50% 0, 50% 0);
    }
    .case-study-item.yellow::after {
        background: #EAA606;
    }
    .case-study-item.orange::after {
        background: #E36931;
    }
    .case-study-item.blue::after {
        background: #59ABDD;
    }
    .case-study-item:hover::after {
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    }
    .case-study-item {
        position:relative;
        height: 475px;
        border-radius: 30px;
        display: flex;
        justify-content: center;
        align-items: flex-end;
        padding: 15px;
        width:100%;
        background-size: cover!important;
        background-position:50% 50%!important;
        & a {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            border-radius: 30px;
            z-index: 999;
        }
        .case-study-content {
            background: #42A756;
            padding: 20px 50px 20px 20px;
            border-radius: 25px;
            width: 100%;
            position:relative;
            text-transform:uppercase;
            & h1, .case-study-client {
                color:white;
            }
            & h1 {
                padding: 0 !important;
                max-width: 270px;
                font-size: clamp(1.5rem, -0.5rem + 10vw, 1.8rem)!important;
                margin: 3px !important;
                margin-left:0!important;
              
            }
        }
        .case-study-content::after {
            content: '';
            width: 20px;
            height: 25px;
            transform-origin:right center;
            transition:all 350ms ease;
            background: white;
            z-index: 9;
            position: absolute;
            right: 13px;
            top: 50%;
            translate: 0 -50%;
            clip-path: polygon(0 0, 0% 100%, 100% 50%);
            -webkit-clip-path: polygon(0 0, 0% 100%, 100% 50%);
            animation: arrow 900ms ease-out infinite forwards;
            animation-play-state: paused;
        
        }
    }
    .case-study-item:hover .case-study-content::after {
        animation-play-state: running;        
    }
     
}
@keyframes arrow {
    0% {
        translate:0 -50%;
    }
    50% {
        translate:-10px -50%;
    }
    100% {
        translate:0 -50%;
    }
}
/* Footer */
.sbi_carousel {
    z-index: 999!important;
}
.sbi_inner_wrap {
    border-radius: 25px;
    overflow:hidden;
    .sbi_caption_wrap {
        background: white;
        min-height:65px;
        @media only screen and (max-width:900px) {
            height:85px;
        }
    }
    @media only screen and (max-width:600px) {
        border-radius: 15px;
    }
}
.sbi-owl-dots {
    text-align: right;
    padding:8px;
    margin-top:15px;
    position:relative;
    @media only screen and (max-width:768px) {
        text-align: center;
        padding-bottom: 80px;
    }
    .sbi-owl-dot {
        scale:2.5;
        margin:5px;
        & span {
            background:#f1ebe1;
        }
    }
}

.site-footer-wrap {
    background:#1D1B1B;
.site-footer-top-section-1 {
    display:flex;
    justify-content: space-between;
    align-items: flex-end;
    padding:0 13px;
    @media only screen and (max-width:768px){
        flex-wrap: wrap;
    }
    .footer-widget-area-inner {
        display:flex;
        align-items: flex-end;
        }
    }
    .site-middle-footer-inner-wrap {
        padding:10px 0 0;
    }
    .xl {
        translate:-7px 20px;
    }
    .site-bottom-footer-inner-wrap {
        padding-bottom:15px;
    }
.footer-widget-area-inner {
    white-space:nowrap;
    }
}

  
@media only screen and (max-width:768px) {

    .footer-widget-area figure{
        margin:0 auto!important;
        flex-basis:100%;
        max-width:unset!important;
        display:flex;
        justify-content: center;
        & img {
            max-width:150px;
        
        }
        & img:last-child {
            margin-top:15px;
        
        }
}
#block-15, #block-18, .global-cta, .footer-widget3, .footer-widget2, .xl.wp-block-kadence-advancedheading {
    width:100%;
    text-align:center!important;
}
.site-footer-wrap {
    .address > .kt-row-column-wrap {
        grid-template-columns:1fr!important;
        & h3, & p {
            text-align:center!important;
            max-width:unset!important;
        }
    }
}
    .site-footer-middle-section-1 {
        flex-wrap:wrap;
        text-align:center!important;
        row-gap:25px;
    }
    .footer-widget-area {
        margin: 0 !important;
    }
    .site-middle-footer-inner-wrap {
        padding-top:20px;
    }
    .wp-block-kadence-advancedbtn {
        padding-top:25px;
        & span {
            min-height: 40px;
            display:flex;
            align-items: center;
        }
    }
   
  }
  .sbi-owl-dots::before {
    top: 70px;
    left: 50%;
    text-align: center;
    translate: -50% 0;
  }
