.elementor-kit-6{--e-global-color-primary:#000000;--e-global-color-secondary:#FFFFFF;--e-global-color-text:#999999;--e-global-color-accent:#1D1D1D;--e-global-color-7b7508c:#4D4D4D;--e-global-color-61ac04b:#BFCFCB;--e-global-color-893981e:#EFEFEF;--e-global-typography-primary-font-family:"Inter";--e-global-typography-primary-font-weight:300;--e-global-typography-secondary-font-family:"Inter Tight";--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-text-transform:uppercase;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Inter Tight";--e-global-typography-accent-font-weight:500;--e-global-typography-accent-text-transform:uppercase;}.elementor-kit-6 e-page-transition{background-color:var( --e-global-color-primary );}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );text-transform:var( --e-global-typography-accent-text-transform );border-radius:0px 0px 0px 0px;padding:20px 32px 20px 32px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1344px;}.e-con{--container-max-width:1344px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){margin-block-end:24px;}.elementor-element{--widgets-spacing:24px 24px;--widgets-spacing-row:24px;--widgets-spacing-column:24px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.grecaptcha-badge { 
    visibility: hidden;
}

html.lenis {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-scroll] {
  will-change: transform;
}



body{
    overflow-x: hidden !important;
}

html{
    font-size: 62.5%; 
}




/*------------------------------------*
  #TYPOGRAPHY
*------------------------------------*/

.small-text p,
.e-n-tab-title-text,
.elementor-testimonial__cite,
p.small-text {
	font-size: 1.4rem !important;
    line-height: 2.4 !important;
}

p, 
td,
li,
ol,
.elementor-field-label,
.small-text h1 {
    font-size: clamp(1.5rem, 2.5vw, 1.7rem) !important;
    line-height: 1.7 !important;
}
p {
    padding-top: 1rem;
}

.h6-h1 h1, h6 {
	font-size: 1.4rem !important;
	line-height: 2.4rem !important;
	text-transform: uppercase;
	letter-spacing: 1.6px;
}
h5,
.post-navigation__next--label,
.post-navigation__prev--label{
	font-size: 1.8rem !important;
	line-height: 2.8rem !important;
}

h4 {
	font-size: 2rem !important;
	line-height: 3.2rem !important;
}
h3 {
	font-size: 2.8rem !important;
	line-height: 3.8rem !important;
}
.h2-h1 h1, h2 {
    font-size: clamp(2.2rem, 2.8vw, 4.6rem) !important;
    line-height: 1.15 !important;
}
.large h2{
    font-size: clamp(2.8rem, 5.4vw, 5.4rem) !important;
	line-height: 1.3 !important;
}

h1{
    font-size: clamp(2.8rem, 5.4vw, 5.4rem) !important;
    line-height: 1.2 !important;
}
.hero h1,
.hero h2,
.post-navigation__next--title,
.post-navigation__prev--title{
    font-size: 9vw !important;
	line-height: 11vw !important;
}


@media only screen and (min-width: 768px) {
    .hero h1,
    .hero h2,
    .post-navigation__next--title,
    .post-navigation__prev--title{
        font-size: 7vw !important;
	    line-height: 9vw !important;
    }
}

@media only screen and (min-width: 1024px) {
 
    h5,
    .post-navigation__next--label,
    .post-navigation__prev--label{
    	font-size: 2.2rem !important;
    	line-height: 3.4rem !important;
    }
    h4 {
    	font-size: 2.8rem !important;
    	line-height: 3.8rem !important;
    }
    h3 {
    	font-size: 3.2rem !important;
    	line-height: 4.2rem !important;
    }
    .hero h1,
    .hero h2,
    .post-navigation__next--title,
    .post-navigation__prev--title{
        font-size: 5vw !important;
	    line-height: 5.5vw !important;
    }
}

.grey-text {
    color: #999 !important;
}

mark {
  background: none;
  color: #999 !important;
}

.text a,
.contact-form p.small-text a{
    color: #ACBAB7 !important;
}


/*------------------------------------*
  #SPACING
*------------------------------------*/

:root {
    --padding-sm: 15px;
    --padding-md: 15px;
    --padding-lg: 30px;
    
    --margin-sm: 15px;       
    --margin-md: 15px;   
}

@media only screen and (min-width: 768px) {
    :root {
        --padding-sm: 30px;
        --padding-md: 30px;
        --padding-lg: 60px;

        --margin-sm: 30px;   
        --margin-md: 30px;  
    }
}

@media only screen and (min-width: 1024px) {
    :root {
        --padding-md: 4.1666666667vw;
        --padding-lg: 8.3333333334vw;
        
        --margin-md: 4.1666666667vw;
    }
}

/**
 * small padding
 */
.padding-sm {
    padding: var(--padding-sm);
}
.padding-lr-sm {
    padding-left: var(--padding-sm);
    padding-right: var(--padding-sm);
}
.padding-l-sm {
    padding-left: var(--padding-sm);
}
.padding-r-sm {
    padding-right: var(--padding-sm);
}
.padding-tb-sm {
    padding-top: var(--padding-sm);
    padding-bottom: var(--padding-sm);
}
.padding-t-sm {
    padding-top: var(--padding-sm);
}
.padding-b-sm {
    padding-bottom: var(--padding-sm);
}

/**
 * medium padding
 */
.padding-md {
    padding: var(--padding-md);
}
.padding-lr-md {
    padding-left: var(--padding-md);
    padding-right: var(--padding-md);
}
.padding-l-md {
    padding-left: var(--padding-md);
}
.padding-r-md {
    padding-right: var(--padding-md);
}
.padding-tb-md {
    padding-top: var(--padding-md);
    padding-bottom: var(--padding-md);
}
.padding-t-md {
    padding-top: var(--padding-md);
}
.padding-b-md {
    padding-bottom: var(--padding-md);
}

/**
 * large padding
 */
.padding-lg {
    padding: var(--padding-lg);
}
.padding-lr-lg {
    padding-left: var(--padding-lg);
    padding-right: var(--padding-lg);
}
.padding-l-lg {
    padding-left: var(--padding-lg);
}
.padding-r-lg {
    padding-right: var(--padding-lg);
}
.padding-tb-lg {
    padding-top: var(--padding-lg);
    padding-bottom: var(--padding-lg);
}
.padding-t-lg {
    padding-top: var(--padding-lg);
}
.padding-b-lg {
    padding-bottom: var(--padding-lg);
}

/**
 * small margin
 */
.margin-sm {
    margin: var(--margin-sm);
}


/**
 * medium margin
 */
.margin-md {
    margin: var(--margin-md);
}




/*------------------------------------*
  #BACKGROUND-IMAGE
*------------------------------------*/
/*
.background-image{
    position: relative;
}
*/

.img-col:has(.elementor-background-video-container) { 
    min-height: 50vh;
}


.img-col{
    min-height: auto;
}
    
/**
 * Sizing the image (to maintain it's ratio)
 */
.background-image:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.background-image,
.background-image img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.background-image img {
    object-fit: cover;
}




/*------------------------------------*
  #BUTTONS
*------------------------------------*/
/**
 * Styling the buttons
 */
 
.btn-primary,
.btn-primary span,
.btn-primary .elementor-button-text,
.btn-primary::after{
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
} 

.btn-primary {
    overflow: hidden;
}

.btn-primary .elementor-button {
    padding: 16px 32px !important;
    border-radius: 0;
}

/*
** Setting the font size
*/
.btn-primary .elementor-button-text,
.btn-primary::after{
    font-size: clamp(1.5rem, 2.5vw, 1rem) !important;
    line-height: 1.7 !important;
    font-family: var( --e-global-typography-secondary-font-family ), Sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
}

.btn-primary::after{
    content: attr(data-text);
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    text-align: center;
    color: inherit;
    transform: translateY(150%);
    pointer-events: none;
}

.btn-secondary .elementor-button{
    background: transparent !important;
    border: 1px solid #fff;
}

/**
 * btn-primary hover state
 */
.btn-primary:hover .elementor-button{
    background: #BFCFCB !important;
}
.btn-primary:hover span {
    transform: translateY(-70%);
}

.btn-primary:hover::after{
    transform: translateY(-55%);
}

.btn-secondary:hover .elementor-button{
    border: solid 1px #BFCFCB !important;
}

@media only screen and (min-width: 1024px) {
    .btn-primary,
    .btn-secondary{
        margin-top: 30px;
    }
}




/*------------------------------------*
  #PLAY-ICON
*------------------------------------*/
/*
** Positioning the play icon abover the overlay
*/
.play-icon{
    z-index: 1;
    position: absolute;
}

/*
** Positioning/Styling the play icon blue circle
*/
.play-icon::before{
    content: "";
    position: absolute;
    background: var( --e-global-color-primary );
    border-radius: 100%;
    width: 120px;
    height: 120px;
    transition: all .4s cubic-bezier(.4,0,.2,1);
    pointer-events: none;
}

/*
** Styling the play icon 
*/
.play-icon .elementor-icon{
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    padding: 48px 50px 48px 52px;
    width: 120px;
    height: 120px;
}
.play-icon .elementor-icon svg path{
    transition: all .4s cubic-bezier(.4,0,.2,1);
}

/*
** Play icon hover state
*/
.play-icon:hover svg path{
    fill: var( --e-global-color-primary );
}
.play-icon:hover:before{
    transform: scale(0.9);
    background: var( --e-global-color-secondary );
}




/*------------------------------------*
  #DOWN-ARROW
*------------------------------------*/

.scroll-down-arrow {
    height: 64px;
    width: 64px;
    position: fixed;
    bottom: var(--padding-md);
    right: var(--padding-md);
    z-index: 999;
    cursor: pointer;
    transition: background 0.3s;
}
.scroll-down-arrow .down-arrow{
    top: 50%;
}

/*
** Setting the transition styles
*/
.down-arrow,
.down-arrow svg,
.down-arrow::before{
  transition: all 0.5s cubic-bezier(0.47, 1.64, 0.41, 0.8);
}
.down-arrow::after{
  transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.down-arrow{
    top: 0;
    left: 0;
    width: 64px;
    height: 64px;
    position: relative;
    border: 2px solid #000;
    border-radius: 100%;
    padding: 16px;
    z-index: 1;
    opacity: 1;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.3);
}
.down-arrow svg{
    width: 100%;
    height: 100%;
}
.down-arrow svg path{
    fill: #000;
}
.down-arrow::before{
    content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/03/down-arrow.svg");
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translateX(-25%) translateY(-100%);
    border-radius: 100%;
    z-index: 1;
    pointer-events: none;
}

.down-arrow::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000;
    top: 0;
    left: 0;
    border-radius: 100%;
    transform: scale(0);
    z-index: -1;
    pointer-events: none;
}

.down-arrow:hover::after{
    transform: scale(1);
}
.down-arrow:hover{
    opacity: 1; 
}
.down-arrow:hover::before{
    transform: translateX(-25%) translateY(-25%);
}
.down-arrow:hover svg{
    transform: translateY(200%);
}




/*------------------------------------*
  #IMAGES
*------------------------------------*/

img,
.img-col video,
.img-col .elementor-background-video-embed{
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    transition: filter 2s cubic-bezier(0.25, 1, 0.5, 1);
}
/* Disable grayscale on specific page or CPT */
.single-experience img,
.single-experience .img-col video {
    -webkit-filter: none !important;
    filter: none !important;
}

.img-col:hover video,
img:hover,
.img-col:hover .elementor-background-video-embed{
    -webkit-filter: grayscale(0); /* Safari 6.0 - 9.0 */
    filter: grayscale(0);
}




/*------------------------------------*
  #COLOUR-CHANGES
*------------------------------------*/

body {
    background-color: white;
    transition: background-color 0.5s ease, color 0.5s ease;
}

body.dark-mode {
    background-color: black !important;
}

body.light-mode {
    background-color: white !important;
}
body.light-mode h1,
body.light-mode h2,
body.light-mode h3,
body.light-mode h4,
body.light-mode h5,
body.light-mode h6,
body.light-mode p,
body.light-mode .elementor-testimonial span,
body.light-mode .elementor-testimonial__text {
    color: black !important;
    /*transition: color 0.1s linear !important;*/
}


body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode p,
body.dark-mode .elementor-testimonial span,
body.dark-mode .elementor-testimonial__text {
    color: white !important;
    /*transition: color 0.1s linear !important;*/
}

body.dark-mode .partner-logos .swiper-slide-inner::after {
    background: black !important;
}

body.dark-mode .testimonial-carousel .elementor-swiper-button-prev::after,
body.dark-mode .testimonial-carousel .elementor-swiper-button-next::after {
    background: rgba(255, 255, 255, 0.20);
}

.dark{
    background: #000 !important;
}
.dark h3,
.dark h5,
.dark p,
.dark .title h2,
.dark .text p,
.dark .feature h5 {
    color: #fff !important;
}

.dark .feature {
    border: 1px solid #fff;
}




/*------------------------------------*
  #CORNERS
*------------------------------------*/

.corner-bottom .elementor-widget-image{
    overflow: hidden;
}
.corner-bottom .elementor-widget-image::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: -60px;
    width: 0; 
    height: 0; 
    border-left: 60px solid transparent;
    border-right: 60px solid transparent;
    border-bottom: 60px solid white;
    transform: rotate(0);
}

.corner-top::after{
    content: "";
    position: absolute;
    top: 0;
    right: -60px;
    width: 0; 
    height: 0; 
    border-left: 60px solid transparent;
    border-right: 60px solid transparent;
    border-bottom: 60px solid white;
    transform: rotate(180deg);
    z-index: 1;
}




/*------------------------------------*
  #PAGE-LINK-THUMB
*------------------------------------*/

.page-link-thumb{
    min-height: 90vw;
    overflow: hidden;
}

.page-link-thumb .background-image{
    mix-blend-mode: luminosity;
    opacity: 0.5;
    transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.page-link-thumb img{
    transition: transform 1s cubic-bezier(0.25, 1, 0.5, 1),
    filter 2s cubic-bezier(0.25, 1, 0.5, 1) ;
}

.page-link-thumb .elementor-widget-image::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.80) 100%);
}

.page-link-thumb:hover img{
    transform: scale(1.1);
    -webkit-filter: grayscale(0); /* Safari 6.0 - 9.0 */
    filter: grayscale(0);
}

.page-link-thumb:hover .background-image{
    opacity: 1;
}

@media only screen and (min-width: 768px) {
    .page-link-thumb{
        min-height: 40vw;
    }
}

@media only screen and (min-width: 1024px) {
    .page-link-thumb{
        min-height: 30vw;
    }
}




/*------------------------------------*
  #TEXT-BANNER-SECTION
*------------------------------------*/

.text-banner{
    height: 70vh;
    justify-content: flex-end;
    overflow: hidden;
}
.text-banner .subtitle p{
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.text-banner .subtitle p:hover{
    color: #fff !important;
}

@media only screen and (min-width: 768px) {
    .text-banner .text{
        width: 100% !important;
    }
}

@media only screen and (min-width: 1024px) {
    .text-banner .text{
        width: 75% !important;
    }
}

@media only screen and (min-width: 1280px) {
    .text-banner .text{
        width: 70% !important;
    }
}




/*------------------------------------*
  #TEXT-IMAGE-BANNER-SECTION
*------------------------------------*/
.text-image-banner .img-col{
    flex: 1;
    align-self: stretch;
}
   /* .text-image-banner .img-col{
        min-height: 100% !important;
        height: 100% !important;
    }*/




/*------------------------------------*
  #SERVICES-BANNER-SECTION
*------------------------------------*/
.services-banner{
    height: calc(100vh - var(--padding-sm));
    width: calc(100vw - var(--padding-sm) - var(--padding-sm));
    margin-bottom: var(--padding-sm);
    padding-bottom: calc(var(--padding-lg) + 84px) !important;
}
.services-banner .background-image{
    height: calc(100%);
    top: auto;
    bottom: 0;
}

@media only screen and (min-width: 1024px){
    .services-banner{
        height: calc(100vh - var(--padding-sm));
        width: calc(100vw - var(--padding-sm) - var(--padding-sm));
        margin-bottom: var(--padding-sm);
        padding-bottom: calc(var(--padding-md) + var(--padding-md) + 64px) !important;
    }
    .services-banner .background-image{
        height: calc(100% - 76px);
    }
}




/*------------------------------------*
  #FIXED-IMAGE-BANNER
*------------------------------------*/
/*
** Fixing the banner in position
*/
.fixed-image-banner{
    position: fixed;
    top: 0;
    height: 70vh;
    z-index: -99;
    overflow: hidden;
}

/*
** Adding the gradient overlays
*/
.fixed-image-banner .background-image::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.80) 100%);
}
.fixed-image-banner .background-image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), linear-gradient(0deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.80) 100%);
    z-index: 99;
}




/*------------------------------------*
  #IMAGE-SECTION
*------------------------------------*/
.image-section{
    overflow: hidden;
    height: 70vh;
    width: calc(100vw - var(--margin-lg)) !important;
}




/*------------------------------------*
  #TEXT-IMAGE-SECTION
*------------------------------------*/

.text-image-section{
    overflow: hidden;
    align-items: stretch;
}
.text-image-section .text-col{
    padding-top: var(--padding-lg);
    padding-bottom: var(--padding-lg);
}
.text-image-section .img-col,
.text-image-section .video-col {
    flex: 1;
}
.text-image-section .img-col img{
    width: 100%;
}
.text-image-section .down-arrow{
    margin-top: 30px;
}

@media only screen and (min-width: 768px) {
    .text-image-section .img-col,
    .text-image-section .text-col,
    .text-image-section .video-col {
        width: 50%;
    }
}




/*------------------------------------*
  #TEXT-IMAGE-GALLERY-SECTION
*------------------------------------*/

/*
** Padding for the section
*/
.text-image-gallery{
    padding-left: var(--padding-md);
    padding-right: var(--padding-sm);
    padding-bottom: var(--padding-sm);
}

/*
** Padding for the text column
*/
.text-image-gallery .text-col{
    padding-top: var(--padding-lg);
    padding-bottom: var(--padding-lg);
    padding-right: var(--padding-md);
}

/*
** Text col text width
*/
.text-image-gallery .text-col .text{
    max-width: 660px !important;
}

/*
** Img col height
*/
.text-image-gallery .img-col{
    min-height: 100vw;
}

.text-image-gallery .elementor-widget-slides,
.text-image-gallery .elementor-swiper,
.text-image-gallery .swiper-slide,
.text-image-gallery .swiper-wrapper,
.text-image-gallery .swiper{
    height: 100% !important;
}

.text-image-gallery .swiper-slide-inner{
    padding: var(--padding-md) !important;
    display: flex;
    flex-direction: flex-end;
}

/*
** Styling the image gallery text
*/
.text-image-gallery .elementor-slide-heading{
    display: flex;
    flex-direction: column;
}

/*
.text-image-gallery .swiper-slide-inner .elementor-slide-heading::before{
    counter-increment: slide-counter;
    content: counter(slide-counter) " /";
}*/

/*
** Adding the image col numbers
*/
.swiper-slide-contents{
    display: flex;
    flex-direction: column;
}
.swiper-slide-contents .elementor-slide-description{
    font-size: 35px !important;
    font-weight: var( --e-global-typography-primary-font-weight ) !important;
}

.elementor-slide-heading{
    order: 2 !important;
}

/*
** Positioning the arrows 
*/
.text-image-gallery .elementor-swiper-button-prev{
    right: var(--padding-md) !important;
    left: auto !important;
    top: calc(100% - 112px) !important;
    transform: rotate(90deg) !important;
}
.text-image-gallery .elementor-swiper-button-next{
    top: calc(100% - 192px) !important;
    right: var(--padding-md) !important;
    transform: rotate(-90deg) !important;
}

/*
** Hiding the default arrows 
*/
.text-image-gallery .elementor-swiper-button-prev svg{
    display: none !important;
}

/*
** Adding the new arrows 
*/
.text-image-gallery .elementor-swiper-button-prev::before,
.text-image-gallery .elementor-swiper-button-next::before {
    content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/03/down-arrow.svg");
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.10);
    border-radius: 50%;
    backdrop-filter: blur(10px);
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/*
** Removing default arrow sizing
*/
.text-image-gallery .elementor-swiper-button{
    font-size: 0 !important;
}

/*
** Styling the new arrows 
*/
.text-image-gallery .elementor-swiper-button-prev:hover::before,
.text-image-gallery .elementor-swiper-button-next:hover::before {
    background: rgba(255, 255, 255, 0.30);
    transform: scale(0.9);
}

@media only screen and (min-width: 768px) {
    /*
    ** Img col height
    */
    .text-image-gallery .img-col{
        min-height: 50vw;
    }
}

@media only screen and (min-width: 1024px) {
    /*
    ** Img col height
    */
    .text-image-gallery .img-col{
        min-height: auto;
    }
}




/*------------------------------------*
  #IMAGE-GRID-LIST-SECTION
*------------------------------------*/

.image-grid-list{
    overflow: hidden;
}

/*
** Space above/below text col
*/
.image-grid-list .text-col{
    padding-top: var(--padding-lg);
    padding-bottom: var(--padding-lg);
}

/*
** Adding space and border below text and title
*/
.image-grid-list .text-col .title,
.image-grid-list .text-col .text{
    padding-bottom: 24px;
    border-bottom: 1px solid #000;
}
.image-grid-list.dark .text-col .title,
.image-grid-list.dark .text-col .text{
    border-color: #fff;
}

/*
** Adding the numbers for each list item
*/
.image-grid-list{
    counter-reset: text-counter;
}
.image-grid-list .text-col .text::before{
    counter-increment: text-counter;
    content: counter(text-counter);
}
.image-grid-list.dark .text-col .text::before{
    color: white !important;
}

.image-grid-list .img-col img{
    width: 100%;
}

@media only screen and (min-width: 1024px) {
    .image-grid-list .img-col,
    .image-grid-list .text-col{
        width: 50%;
    }
}




/*------------------------------------*
  #FULL-HEIGHT-SECTION
*------------------------------------*/

.full-height .img-col{
    min-height: 40vh;
}

@media only screen and (min-width: 1024px) {
    .full-height{
        min-height: 100vh;
    }
    .full-height .img-col{
        min-height: auto;
    }
}

/*------------------------------------*
  #HALF-HEIGHT-SECTION
*------------------------------------*/

.half-height .img-col,
.half-height .video-col {
    min-height: 40vh;
}

@media only screen and (min-width: 1024px) {
    .half-height{
        min-height: 50vh;
    }
}




/*------------------------------------*
STATEMENT-SECTION
*------------------------------------*/

.statement-section{
    min-height: 100vh;
    z-index: -1 !important;
    overflow: hidden !important;
}
.statement-section .background-image{
    position: fixed;
    z-index: -1
}
.statement-section .background-image::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);    
    z-index: 0;
}

.statement-section .section-title::after{
    content: '';
    position: absolute;
    bottom: -60px;
    left: 0;
    width: 60px;
    height: 5px;
    background: white;
    z-index: 99;
}




/*------------------------------------*
  #CONTACT-FORM-SECTION
*------------------------------------*/

.contact-form-container {
    position: relative !important;
    bottom: 0;
    overflow: hidden;
    height: 100vh !important; 
    z-index: -1 !important;
    clip-path: inset(0 0 0 0); 
}
.contact-form-template {
    position: fixed;
    height: 100vh;
    top: 50%;
    bottom: 50%;
    transform: translateY(-50%); /* Moves the element back by half its size */
}




/*------------------------------------*
  #RELATED-CASE-STUDIES
*------------------------------------*/
.related-case-studies .elementor-loop-container {
    gap: var(--padding-sm) !important;
}




/*------------------------------------*
  #TITLE-TEXT-SECTION
*------------------------------------*/

.title-text-section img{
    width: 100%;
    height: 40vw;
}

.title-text-section .text-col .title,
.title-text-section .text-col .text {
    padding-left: var(--padding-md);
    padding-right: var(--padding-md);
}

@media only screen and (min-width: 1024px) {
    .title-text-section .text-col .title,
    .title-text-section .text-col .text {
        width: 70%;
        padding-left: 0;
        padding-right: 0;
    }
  
}



/*------------------------------------*
  #TITLE-SECTION
*------------------------------------*/

.title-section{
    overflow: hidden;
}

.title-section .title{
    width: calc(100% - 30px);
}




/*------------------------------------*
  #SERVICES-PAGE-SECTION-LINKS
*------------------------------------*/

/*
** Setting the transition styles
*/
.section-link .service-title p,
.section-link .number p,
.section-link .service-title::after,
.section-link .number::after,
.section-link .plus-icon svg{
    transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

/*
** Positioning the section link buttons
*/
.sticky-wrapper {
  position: relative;
}
#stickyElement {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    transition: all 0.3s ease;
    overflow: scroll;
    scroll-snap-align: center;

}
/*
** Stopping the section links at the end
*/
#stickyElement.stopped {
  position: absolute;
  bottom: 0;
  top: auto;
}

/*
** Styling the section links
*/
.section-links {
    padding: 0;
    flex-direction: row;
    flex-wrap: nowrap;
    max-width: 400vw !important;
    overflow-x: scroll !important;
    scroll-snap-align: center;
}
.section-links-container{
    padding: var(--padding-md);
    padding-top: 0;
}

/*
** Styling the section links
*/
.button-container .section-link{
    width: calc(90vw - var(--padding-lg) - var(--padding-md)) !important;
    max-width: calc(100vw - var(--padding-lg)) !important;
    display: flex;
    flex: none;
    flex-wrap: nowrap;
    padding: 15px 30px;
    background: var(--black-30, rgba(0, 0, 0, 0.30));
    backdrop-filter: blur(50px);
    gap: 8px;
}
/*
** Setting the colour of the line
*/
.button-container .section-link svg rect{
    fill: #fff !important;
}
/*
** Setting the button overflow
*/
.section-link .service-title,
.section-link .number{
    height: 30px !important;
    overflow: hidden;
}
/*
** Positioning the plus icon
*/
.section-link .service-title{
    margin-right: auto;
}
/*
** Styling the secondary text elements
*/
.section-link .service-title:after,
.section-link .number::after {
    content: attr(data-text);
    font-size: clamp(1.5rem, 2.5vw, 1.7rem) !important;
    line-height: 1.7 !important;
    font-family: var( --e-global-typography-secondary-font-family ), Sans-serif !important;
    font-weight: 500;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    text-align: left;
    transform: translateY(-20px);
    pointer-events: none;
    color: #fff !important;
    opacity: 0;
}
.section-link .service-title:after{
    transform: translateY(20px);
}

/*
** Hover states
** Changing the backgorund colour and blur strength
*/
.button-container .section-link:hover{
    background: var(--white-60, rgba(255, 255, 255, 0.60));
    backdrop-filter: blur(25px);
}
/*
** Changing the text colour
*/
.button-container .section-link:hover p{
    color: #000 !important;
}
/*
** Changing the line colour
*/
.button-container .section-link:hover svg rect{
    fill: #000 !important;
}
/*
** Transitioning the number    
*/
.section-link:hover .number p {
    transform: translateY(20px);
    opacity: 0;
}
/*
** transitioning the service title
*/
.section-link:hover .service-title p{
    transform: translateY(-20px);
    opacity: 0;
}
/*
** Transitioning the secondary elements
*/
.section-link:hover .service-title::after,
.section-link:hover .number::after {
    transform: translateY(0);
    opacity: 1;
    color: #000 !important;
}
/*
** Changing the icon colour
*/
.section-link:hover .plus-icon svg path{
    fill: #000 !important;
}

@media only screen and (min-width: 1024px) {
    /*
    ** Styling the section links
    */
    .section-links {
        flex-direction: row;
        flex-wrap: nowrap;
        width: 100% !important;
        overflow-x: hidden !important;
    }
    
    /*
    ** Styling the section links
    */
    .button-container .section-link{
        display: flex;
        flex: 1;
        padding: 15px 30px;
        background: var(--black-30, rgba(0, 0, 0, 0.30));
        backdrop-filter: blur(50px);
        gap: 8px;
    }
    
}




/*------------------------------------*
  #TABBED-CONTENT-SECTION
*------------------------------------*/

.tabbed-content .e-n-tabs-heading::after{
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
    pointer-events: none;
}

.tabbed-content .e-n-tabs-heading{
    margin-bottom: 24px;
}

.features-container{
    gap: 0 !important;
}

.features-container p{
    text-align: left;
    border-bottom: 1px solid #000;
    padding: 16px 0;
}
.features-container p::before{
    content: "+";
    padding-right: 8px;
}
.tabbed-content .text-col .features{
    transition: background 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: pointer;
}

.dark.tabbed-content .text-col .features-container p{
    border-bottom: 01px solid #333;
}




/*------------------------------------*
  #CENTERED-FEATURES-SECTION
*------------------------------------*/

.centered-features .feature{
    border: none !important;
    padding: 48px;
    height: 100%;
    background: rgba(0, 0, 0, 0.06);
    transition: background 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: pointer;
}

.dark.centered-features .feature{
    background: rgba(255, 255, 255, 0.1);
}

.centered-features .feature .elementor-widget-container {
    display: flex;
    align-items: center;
    justify-content: center;
}
.centered-features .feature .elementor-widget-container p {
    max-width: 200px;
}

.centered-features .title{
    max-width: 1024px !important;
}
.centered-features .grid-container,
.centered-features .text{
    max-width: 888px !important;
}

.centered-features .feature:hover{
    background: rgba(0, 0, 0, 0.1);
}
.dark.centered-features .feature:hover{
    background: rgba(255, 255, 255, 0.2);
}




/*------------------------------------*
  #OUR-PROCESS-SECTION
*------------------------------------*/

.our-process .section-title{
    max-width: 70% !important;
}

.our-process .process-step{
    gap: 16px;
}

.our-process .process-step .text p,
.our-process .process-step .process-number p{
    color: var( --e-global-color-7b7508c ) !important;
}
.our-process .process-step .process-number p{
    width: 32px !important;
    height: 32px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
    font-weight: 500;
}
.our-process .process-step .process-number::after {
    content: "";
    position: absolute;
    width: 32px;
    height: 32px;
    top: 0;
    border-radius: 100%;
    background: rgba(0, 0, 0, 0.06);
}

.our-process .process-step .process-number,
.our-process .process-step .process-number::after {
    display: flex;
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.our-process .process-step:hover .process-number::after{
    width: 40px;
    height: 40px;
    transform: translateY(-4px) translateX(-4px);
}




/*------------------------------------*
  #INSIGHTS-POST-CONTENT
*------------------------------------*/

.post-content h5,
.post-content .quote{
    margin-top: var(--padding-md) !important;
}




/*------------------------------------*
  #ACCORDION-SECTION
*------------------------------------*/

.accordion-section{
    padding: var(--padding-lg) var(--padding-md) var(--padding-lg);
    gap: var(--padding-lg);
}

/*
** Styling the section title
*/
.accordion-section .title-col .title h2,
.accordion-section .title-col .title h3{
    padding-left: var(--padding-sm);
    border-left: 1px solid #000;
}
.accordion-section.dark .title-col .title h2,
.accordion-section.dark .title-col .title h3{
    border-left: 1px solid #fff;
}


.accordion-section .accordion-css {
    max-width: 100%;
    position: relative;
}

.accordion-section .accordion-css__list {
  grid-column-gap: .5em;
  grid-row-gap: .5em;
  flex-flow: column;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  display: flex;
  position: static;
}

/*
** Accordion colour
*/
.accordion-section .accordion-css__item {
  list-style: none;
}

.accordion-section .accordion-css__item-top {
  grid-column-gap: 1em;
  grid-row-gap: 1em;
  cursor: pointer;
  justify-content: space-between;
  align-items: center;
  padding: var(--padding-sm) 0;
  display: flex;
  border-bottom: 1px solid #333;
}

/*
** Styling the title
*/
.accordion-section .accordion-css__item-h5 {
    margin-top: 0;
    margin-bottom: 0;
    font-family: var( --e-global-typography-primary-font-family ), Sans-serif;
    transition: all 0.5s cubic-bezier(0.47, 1.64, 0.41, 0.8);
    color: #000;
}
.accordion-section.dark .accordion-css__item-h5 {
    color: #fff;
}

/*
** Styling the text
*/
.accordion-css__item-p{
    color: #fff;
}



/*
** Styling the icon
*/
.accordion-section .accordion-css__item-icon {
    transition: transform 0.6s cubic-bezier(0.625, 0.05, 0, 1);
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: 40px !important;
    height: 40px;
    display: flex;
    transform: rotate(180deg);
}


/*
** Circle bg behind icon
*/
.accordion-section .accordion-css__item-icon::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: var( --e-global-color-893981e );
    transition: all 0.6s cubic-bezier(0.625, 0.05, 0, 1);
}   
.accordion-section.dark .accordion-css__item-icon::before {
    background: var( --e-global-color-accent );
}   

/*
** Adding the plus icon
*/
.accordion-section .accordion-css__item-icon::after {
    content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/04/plus-black.svg");
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
    transition: all 0.5s cubic-bezier(0.47, 1.64, 0.41, 0.8);
    font-size: 0 !important;
    line-height: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
.accordion-section.dark .accordion-css__item-icon::after {
    content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/04/plus.svg");
}

.accordion-section [data-accordion-status="active"] .accordion-css__item-icon::after {
    transform: rotate(45deg);
}

.accordion-section .accordion-css__item-bottom {
  transition: grid-template-rows 0.6s cubic-bezier(0.625, 0.05, 0, 1);
  grid-template-rows: 0fr;
  display: grid;
  position: relative;
  overflow: hidden;
}

.accordion-section [data-accordion-status="active"] .accordion-css__item-bottom {
    grid-template-rows: 1fr;
}

.accordion-section .accordion-css__item-bottom-wrap {
    flex-flow: column;
    height: 100000%;
    display: flex;
    position: relative;
    overflow: hidden;
}

.accordion-section .accordion-css__item-bottom-content {
    padding: var(--padding-sm);
}

/*
** Adding the numbers for each list item
*/
.accordion-section .accordion-css__item-bottom-content{
    counter-reset: text-counter;
}
.accordion-section .grid-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
    gap: 1em;
    margin-top: 24px;
}

/*
** Styling the text
*/
.accordion-section .grid-container .title {
    margin-bottom: 0;
    font-family: var( --e-global-typography-text-font-family ), Sans-serif;
}
.accordion-section.dark .grid-container .title {
  color: #fff;
}

/*
** Space above the grid container
*/
.accordion-section .grid-container .text{
    padding-top: 24px;    
}

/*
** border-line under grid items
*/
.accordion-section .accordion-css__item-bottom-content .title,
.accordion-section .grid-container .text{
    border-bottom: 1px solid #000;
    padding-bottom: 12px;
}
.accordion-section .accordion-css__item-bottom-content .title,
.accordion-section.dark .grid-container .text{
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
}

/*
** Adding the numbers for grid items
*/
.accordion-section .grid-container .text::before{
    counter-increment: text-counter;
    content: counter(text-counter);
    position: absolute;
    top: 0;
}
/*
** Styling the grid numbers for dark bg
*/
.accordion-section.dark .grid-container .text::before{
    color: #fff;
}



/*
** Title hover state
*/
.accordion-css__item:hover .accordion-css__item-h5{
    padding-left: 16px;
}
[data-accordion-status="active"]:hover .accordion-css__item-h5,
[data-accordion-status="active"] .accordion-css__item-h5{
    padding-left: var(--padding-sm);
}

.accordion-css__item:hover .accordion-css__item-icon::before {
    transform: scale(1.2);
    background: rgba(255, 255, 255, 0.4);
}


@media only screen and (min-width: 768px) {
    .accordion-section{
        padding: var(--padding-lg) var(--padding-md) var(--padding-lg) var(--padding-lg);
        gap: var(--padding-lg);
    }
    .accordion-section .title-col{
        padding-left: var(--padding-lg);
    }
    .accordion-section .title-col,
    .accordion-section .accordion-col{
        width: 50% !important;
    }
}




/*------------------------------------*
  #MODAL-SECTION
*------------------------------------*/

/*
** Spacing for the section
*/
.modal-section{
    padding: var(--padding-lg) var(--padding-md);
    gap: var(--padding-md);
    overflow: hidden;
}


.modal-section .btn-group,
.modal-section .intro-text{
    z-index: 2;
}

/*
** Setting the text colour
*/
.modal-section .intro-text .text {
    padding-bottom: var(--padding-sm);
    border-bottom: 1px solid #000;
}

/*
** Styling the modal links
*/
.modal-section .modal-btn{
    padding-left: 20px;
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: pointer;
}

/*
** Adding the modal links plus icon
*/
.modal-section .modal-btn::before{
    content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/04/plus-black.svg");
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 16px;
    height: 16px;
    font-size: 0 !important;
    line-height: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

/*
** Modal link positioning when active
*/
.modal-section .modal-btn[data-modal-status="active"] {
    padding-left: 30px;
}
/*
** Hover state for the modal link
*/
.modal-section .modal-btn:hover{
    padding-left: 30px;
}
.modal-section .modal-btn:hover::before{
    transform: translateY(-50%);
}
.modal-section .modal-btn[data-modal-status="active"]::before {
        transform: translateY(-50%) rotate(45deg);
}
.modal-section .modal-btn[data-modal-status="active"]:hover::before {
        transform: translateY(-50%) rotate(45deg);
}
    
/*
** Styling and positiong the modal;
*/
.modal-section .modal {
    z-index: 100;
    opacity: 0;
    pointer-events: none;
    visibility: hidden;
    justify-content: center;
    align-items: center;
    display: flex;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 100vw;
    overflow: hidden;
    transform: translateX(100%);
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.modal-section-centered .modal {
    height: 100vh;
    transform: none;
    position: fixed;
    left: 0;
    cursor: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/03/scroll-cursor.svg") 0 48, grab !important;
    transition: all 0.2s linear;
}

/*
** Positiong the modal on the left;
*/
.modal-section .modal-left{
    right: auto;
    left: 0;
    transform: translateX(-100%);
}

/*
** Showing the modal when 'Active';
*/
.modal-section .modal[data-modal-group-status="active"] {
    opacity: 1;
    visibility: visible !important;
    transform: translateX(0);
}

/*
** Sizing the overlay/background
*/
.modal-section .modal__dark {
    opacity: 1;
    pointer-events: auto;
    cursor: pointer;
    background-color: #000;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    cursor: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/05/close-cursor-three.svg") 0 48, grab !important;
}
.modal-section-centered .modal__dark {
    opacity: 0.9;
    background-color: #fff;
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}


/*
** Sizing the Modal Card;
*/
.modal-section .modal__card {
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  padding: 0 var(--padding-lg);
  display: none;
  position: relative;
  pointer-events: none;
}
.modal-section-centered .modal__card {
    width: 80%;
    max-width: 888px;
    max-height: 80%;
    background: #000;
    position: relative;
    padding: 0;
    pointer-events: none;
}

/*
** Adding the gradient overlay (to fade-out the text);
*/
.modal-section .modal__card::after,
.modal-section .modal__card::before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--padding-lg);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, #000 100%);
    z-index: 2;
}

/*
** Rotating and positiong the top gradient;
*/
.modal-section .modal__card::before{
    bottom: auto;
    top: 0;
    transform: rotate(180deg);
}

.modal-section .modal__card[data-modal-status="active"] {
  display: flex;
}

.modal-section .modal__scroll {
    grid-column-gap: 1.5em;
    grid-row-gap: 1.5em;
    flex-flow: column;
    width: 100%;
    max-height: 100%;
    display: flex;
    position: relative;
    overflow: scroll;
    pointer-events: auto;
    cursor: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/03/scroll-cursor.svg") 0 48, grab !important;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE 10+ */
}
.modal-section-centered .modal__scroll {
    padding: var(--padding-lg);
}

/*
** Hiding the modal content scrollbars
*/
.modal-section .modal__scroll::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

/*
** Styling the modal content
*/
.modal-section .modal__content {
  grid-column-gap: 1.5em;
  grid-row-gap: 1.5em;
  flex-flow: column;
  display: flex;
  padding-top: var(--padding-lg);
  padding-bottom: var(--padding-lg);
}

/*
** Styling the modal text colours
*/
.modal-section .modal__content .title h5,
.modal-section .modal__content .text p{
    color: white !important;
    padding: 0 !important;
}


/*
** Styling the horizontal lines
*/
.modal-section .modal__content  hr{
    margin-top: 12px !important;
    margin-bottom: 12px !important;
    height: 1px;
    border-width: 0;
    color: white;
    background-color: rgba(255, 255, 255, 0.4);
}

/*
** Removing the default margin from the buttons

.modal-section .modal__content .btn-primary {
    margin-top: 0 !important;
}*/

/*
** Sizing the close button
*/
.modal-section .modal__btn-close,
.modal-section .modal__btn-close svg {
  width: 32px;
  height: 32px;
  display: flex;
}
/*
** Positiong the close button
*/
.modal-section .modal__btn-close{
    position: absolute;
    top: var(--padding-sm);
    right: var(--padding-sm);
    z-index: 99;
    pointer-events: auto; 
    cursor: pointer;
}

.modal-section-centered .modal__btn-close {
    background-color: #efeeec;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    width: 3.5em;
    height: 3.5em;
    display: flex;
    position: absolute;
    top: 2.5em;
    right: 2.5em;
    z-index: 99;
}

/*
** Adding the close button background
*/
.modal-section .modal__btn-close::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-8px, -8px);
    width: 100%;
    height: 100%;
    border-radius: 50%;
    padding: 24px;
    z-index: -1;
    background: var( --e-global-color-accent );
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
/*
** Rotating the close button
*/
.modal-section .modal__btn-close svg {
    transform: rotate(45deg);
}
/*
** Hover state for the close button
*/
.modal-section .modal__btn-close:hover::after{
    background: var( --e-global-color-61ac04b );
}

@media only screen and (min-width: 1024px) {
    .modal-section .btn-group,
    .modal-section .intro-text{
        width: 50%;
    }
    /*
    ** Setting the modal width for desktop
    */
    .modal-section .modal {
        width: 50vw;
    }
    .modal-section-centered .modal {
        width: 100vw;
    }
    .modal-section-centered .modal .modal__content {
        padding-top: 0;
    }
}




/*------------------------------------*
  #PAGE-LINKS-SECTION
*------------------------------------*/

.page-links{
    gap: 24px;
}
.page-links .link-col{
    min-height: 150px;
    padding: var(--padding-sm);
    pointer-events: auto;
    cursor: pointer;
}
.page-links .link-col::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: black;
    opacity: 0;
}
.page-links .link-col img{
    display: none;
}
.page-links .link-col .title{
    z-index: 2 !important;
    transform: translateY(12px);
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.page-links .link-col .title p{
    color: #000 !important;
}
.page-links .link-col .elementor-icon{
    position: absolute;
    width: 24px;
    height: 24px;
    transform: translateX(-12px) translateY(24px) rotate(-90deg);
    opacity: 0;
}

.page-links .link-col .elementor-icon svg{
    width: 24px;
    height: 24px;
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);

}
.page-links .link-col .elementor-icon svg path{
    fill: #000;
}
.page-links .link-col:hover{
    background: #BFCFCB !important;
}

.page-links .link-col:hover .title{
    transform: translateY(-12px);
}

.page-links .link-col:hover .elementor-icon{
    opacity: 1;
    transform: translateX(-12px) translateY(0) rotate(-135deg);
}

@media only screen and (min-width: 1024px) {
    .page-links .link-col{
        min-height: 250px;
    }
}




/*------------------------------------*
  #TEXT-AND-GALLERY-SECTION
*------------------------------------*/

.text-gallery .img-col{
    overflow: hidden !important;
    margin-top: 24px;
}
.text-gallery .img-col img{
    object-fit: cover;
}

.text-gallery .img-col .elementor-image-carousel-wrapper{
    overflow: hidden !important;
}

.text-gallery .text-col{
    margin-top: 24px;
}

@media only screen and (min-width: 1024px) {
    .text-gallery {
        padding-left: 48px
    }
    .text-gallery .text-col,
    .text-gallery .img-col{
        width: 50%;
        margin-top: 0;
    }
    .text-gallery .img-col img{
        height: calc(50vw - 32px) !important;
        width: calc(50vw - 32px) !important;
    }
}




/*------------------------------------*
  #TESTIMONIAL-SECTION
*------------------------------------*/

/*
** Min height for the section
*/
.testimonial-carousel,
.testimonial-carousel .swiper-slide{
    height: 100vh !important;
    align-content: center;
}

/*
** Styling the text
*/
.testimonial-carousel .elementor-testimonial__text{
    font-style: normal !important;
    color: var( --e-global-color-primary ) !important;
	font-size: 1.8rem !important;
	line-height: 2.8rem !important;
	text-align: center;
    padding: var(--padding-lg);
    max-width: 1280px !important;
    margin-left: auto;
    margin-right: auto;

}
.testimonial-carousel.dark .elementor-testimonial__text,
.testimonial-carousel.dark  .elementor-testimonial__title{
    color: #fff !important;
}

.testimonial-carousel .elementor-testimonial__cite{
    text-align: center;
    display: flex;
    flex-direction: column;
    margin-top: 24px;
    font-style: normal;
}

/*
** Removing default arrow sizing
*/
.testimonial-carousel .elementor-swiper-button{
    font-size: 0 !important;
}

/*
** Positioning the arrows 
*/
.testimonial-carousel .elementor-swiper-button-prev{
    left: var(--padding-sm) !important;
    z-index: 3 !important;
}
.testimonial-carousel .elementor-swiper-button-next{
    right: 0 !important;
    z-index: 3 !important;
}

/*
** Hiding the default arrows 
*/
.testimonial-carousel .elementor-swiper-button-prev svg{
    display: none !important;
}

/*
** Adding the new arrows 
*/
.testimonial-carousel .elementor-swiper-button-prev::before,
.testimonial-carousel .elementor-swiper-button-next::before {
    content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/05/down-arrow-black.svg");
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(-90deg) scale(0.6);
}
.testimonial-carousel.dark .elementor-swiper-button-prev::before,
.testimonial-carousel.dark .elementor-swiper-button-next::before {
    content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/03/down-arrow.svg");
}

/*
** Rotating the previous arrow 
*/
.testimonial-carousel .elementor-swiper-button-prev::before{
    transform: rotate(90deg) scale(0.6);
}

/*
** Adding the arrow backgrounds 
*/
.testimonial-carousel .elementor-swiper-button-prev::after,
.testimonial-carousel .elementor-swiper-button-next::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.04);
    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    z-index: -1;
}

.testimonial-carousel.dark .elementor-swiper-button-prev::after,
.testimonial-carousel.dark .elementor-swiper-button-next::after {
    background: rgba(255, 255, 255, 0.20);
}

.testimonial-carousel .elementor-main-swiper.swiper {
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

/*
** Hover states for the arrows
*/
.testimonial-carousel .elementor-swiper-button-prev:hover::after,
.testimonial-carousel .elementor-swiper-button-next:hover::after {
    background: rgba(0, 0, 0, 0.1);
    transform: scale(0.9);
}

/*
** Hover states for the arrows
*/
.testimonial-carousel.dark .elementor-swiper-button-prev:hover::after,
.testimonial-carousel.dark .elementor-swiper-button-next:hover::after {
    background: var(--black-30, rgba(255, 255, 255, 0.30));
}

@media only screen and (min-width: 1024px) {
    .testimonial-carousel .elementor-testimonial__text{
    	font-size: 3.2rem !important;
    	line-height: 4.2rem !important;
    }
    /*
    ** Adding the new arrows 
    */
    .testimonial-carousel .elementor-swiper-button-prev::before,
    .testimonial-carousel .elementor-swiper-button-next::before {
        content: url("https://stg-uncoded-staging.kinsta.cloud/wp-content/uploads/2025/05/down-arrow-black.svg");
        width: 64px;
        height: 64px;
        transform: scale(1) rotate(-90deg);
    }
    /*
    ** Rotating the previous arrow 
    */
    .testimonial-carousel .elementor-swiper-button-prev::before{
        transform: rotate(90deg) scale(1);
    }
    /*
    ** Positioning the arrows 
    */
    .testimonial-carousel .elementor-swiper-button-prev{
        left: var(--padding-sm) !important;
    }
    .testimonial-carousel .elementor-swiper-button-next{
        right: var(--padding-sm) !important;
    }
}/* End custom CSS */