:root {
    --h1: clamp(3.125rem, 1.6827rem + 6.4103vw, 9.375rem); /* 50px to 150px */;
    --h2: clamp(1.625rem, 1.1346rem + 2.1795vw, 3.75rem); /* 26px to 60px */;
    --h3: clamp(1.5rem, 1.2692rem + 1.0256vw, 2.5rem); /* 24px to 40px */;
    --h4: clamp(1rem, 0.7692rem + 1.0256vw, 2rem); /* 16px to 32px */;
    --h5: clamp(1.25rem, 1.1635rem + 0.3846vw, 1.625rem); /* 20px to 26px */;
    --h6: clamp(1.125rem, 1.0673rem + 0.2564vw, 1.375rem); /* 18px to 22px */;
    --p: clamp(1rem, 0.9423rem + 0.2564vw, 1.25rem); /* 16px to 20px */;
}

/* Back to Top Button */
#back-to-top { display: flex; position: fixed; bottom: 30px; right: 30px; z-index: 9999; background-image: linear-gradient(90deg, rgba(var(--secondaryrgb), 1) 0%, rgba(var(--primaryrgb), 1) 100%); color: var(--accent-text); border: none; border-radius: 50%; width: 50px; height: 50px; cursor: pointer; align-items: center; justify-content: center; opacity: 0; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition: transform 0.3s ease-out, opacity 0.1s ease-out; transition: transform 0.3s ease-out, opacity 0.1s ease-out; }
#back-to-top.show { opacity: 1; -webkit-transform: translateY(0px); transform: translateY(0px); }
#back-to-top:hover { -webkit-transform: translateY(-3px); transform: translateY(-3px); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2); }
#back-to-top svg { width: 20px; height: 20px; stroke: currentColor; fill: none; color: var(--accent-text); }
/* Responsive */
@media (max-width: 768px) { #back-to-top { bottom: 20px; right: 20px; width: 45px; height: 45px; } }

/* sticky style */
.wpl-sticky { position: sticky !important; top: 0 !important; }

/* higlight effect (mobile) */
* {
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
  -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
  outline: none !important;
}

/* Common Styles */
h1.wpl-heading { font-size: clamp(3.125rem, 1.6827rem + 6.4103vw, 9.375rem); /* 50px to 150px */ line-height: 1.1; font-weight: 500; pointer-events: none;}
h2.wpl-heading { font-size: clamp(1.625rem, 1.1346rem + 2.1795vw, 3.75rem); /* 26px to 60px */ line-height: 1.2; font-weight: 500; pointer-events: none;}
h3.wpl-heading { font-size: clamp(1.5rem, 1.2692rem + 1.0256vw, 2.5rem); /* 24px to 40px */ line-height: 1.1; font-weight: 500; pointer-events: none;}
h4.wpl-heading { font-size: clamp(1rem, 0.7692rem + 1.0256vw, 2rem); /* 16px to 32px */ line-height: 1.1; font-weight: 500; pointer-events: none;}
h5.wpl-heading { font-size: clamp(1.25rem, 1.1635rem + 0.3846vw, 1.625rem); /* 20px to 26px */ line-height: 1.1; font-weight: 500; pointer-events: none;}
h6.wpl-heading { font-size: clamp(1.125rem, 1.0673rem + 0.2564vw, 1.375rem); /* 18px to 22px */ line-height: 1.1; font-weight: 500; pointer-events: none;}
p.wpl-heading { font-size: clamp(1rem, 0.9423rem + 0.2564vw, 1.25rem); /* 16px to 20px */ line-height: 1.6; pointer-events: none;}

/* common button style */
.elementor-widget-button .elementor-button {
    /* background-image: linear-gradient(90deg, rgba(var(--secondaryrgb), 1) 0%, rgba(var(--primaryrgb), 1) 100%); */
    background-image: linear-gradient(to right, rgba(var(--secondaryrgb), 1), rgba(var(--primaryrgb), 1), rgba(var(--primaryrgb), 1), rgba(var(--secondaryrgb), 1));
    border-radius: 50px;
    padding: 16px 36px;
    position: relative;
    background-size: 300% 100%;
    border-radius: 50px;
    -moz-transition: all .4s ease-out;
    -o-transition: all .4s ease-out;
    -webkit-transition: all .4s ease-out;
    transition: all .4s ease-out;
}

.elementor-widget-button .elementor-button:hover {
    background-position: 100% 0;
    -moz-transition: all .4s ease-out;
    -o-transition: all .4s ease-out;
    -webkit-transition: all .4s ease-out;
    transition: all .4s ease-out;
}

.elementor-widget-button .elementor-button span { position: relative; }
.elementor-widget-button .elementor-button:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index: 0; border-radius: 50px; background-color: var(--background); width: calc(100% - 4px); height: calc(100% - 4px); -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }

/* bg style */
body:not(.home):before { content: ""; position: absolute; left: 0; top: 0; background: url("https://webpixlab.com/wp-content/uploads/2025/10/slider-grad.webp"); background-repeat: no-repeat; background-position: center center; background-size: cover; width: 100%; height: 100%; height: clamp(21.5625rem, 19.4792rem + 4.3403vw, 24.6875rem); /* 395px */ z-index: 0; pointer-events: none; }
body.home:before { content: ""; position: absolute; left: 0; top: 0; background: url("https://webpixlab.com/wp-content/uploads/2025/10/slider-grad.webp"); background-repeat: no-repeat; background-position: top center; background-size: contain; width: 100%; height: 100%; height: 200vh; z-index: 0; pointer-events: none; }

/* breadcrumb style */
.webpixlab-breadcrumb { text-align: center; padding: 50px 20px 80px; }
.webpixlab-breadcrumb .webpixlab-page-title h1.entry-title {
    font-size: var(--h2);
    margin: 0;
    line-height: 1;
}

.webpixlab-breadcrumb .webpixlab-page-title { padding-bottom: 20px; }
.webpixlab-breadcrumb .webpixlab-nav-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.webpixlab-breadcrumb .webpixlab-nav-link,
.webpixlab-breadcrumb .webpixlab-nav-link a,
.webpixlab-breadcrumb .webpixlab-page-title h1.entry-title {
        color: var(--accent-text);
}

@media screen and (min-width:1281px) {
/* Nav Menu Style */
.elementor-menu-horizontal .wpl-menu > li > a { position: relative; padding: 15px 30px; line-height: 1; }
.elementor-menu-horizontal .wpl-menu > li > a[aria-current="page"] { border-radius: 50px; }
.elementor-menu-horizontal .wpl-menu > li > a:before,
.elementor-menu-horizontal .wpl-menu>li:not(:last-child)>a:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: -1;
    border-radius: 50px;
    opacity: 0;
}
.elementor-menu-horizontal .wpl-menu>li:not(:last-child)>a:before {
    /* background-image: linear-gradient(90deg, rgba(var(--secondaryrgb), 0.5) 0%, rgba(var(--primaryrgb), 0.5) 100%); */
    background-image: linear-gradient(to right, rgba(var(--secondaryrgb), 0.5), rgba(var(--primaryrgb), 0.5), rgba(var(--primaryrgb), 0.5), rgba(var(--secondaryrgb), 0.5));
    background-size: 300% 100%;
    border-radius: 50px;
    -moz-transition: all .4s ease-out;
    -o-transition: all .4s ease-out;
    -webkit-transition: all .4s ease-out;
    transition: all .4s ease-out;
}
.elementor-menu-horizontal .wpl-menu>li:not(:last-child)>a:hover:before {
    background-position: 100% 0;
    -moz-transition: all .4s ease-out;
    -o-transition: all .4s ease-out;
    -webkit-transition: all .4s ease-out;
    transition: all .4s ease-out;
}

.elementor-menu-horizontal .wpl-menu>li:not(:last-child)>a:after { background-color: var(--background); width: calc(100% - 5px); height: calc(100% - 4px); }
.elementor-menu-horizontal .wpl-menu > li:not(:last-child) > a[aria-current="page"]:before,
.elementor-menu-horizontal .wpl-menu>li:not(:last-child)>a[aria-current="page"]:after { opacity: 1; }

.elementor-menu-horizontal .wpl-menu>li:last-child>a {
    background-image: linear-gradient(to right, rgba(var(--secondaryrgb), 1), rgba(var(--primaryrgb), 1), rgba(var(--primaryrgb), 1), rgba(var(--secondaryrgb), 1));
    background-size: 300% 100%;
    border-radius: 50px;
    -moz-transition: all .4s ease-out;
    -o-transition: all .4s ease-out;
    -webkit-transition: all .4s ease-out;
    transition: all .4s ease-out;
}

.elementor-menu-horizontal .wpl-menu>li:last-child>a:hover {
    background-position: 100% 0;
    -moz-transition: all .4s ease-out;
    -o-transition: all .4s ease-out;
    -webkit-transition: all .4s ease-out;
    transition: all .4s ease-out;
}

}

@media screen and (max-width:1280px) {
    .elementor-widget-container:has(nav) { border-color: var(--accent-text) !important; }
}

/* elementor pannel style */
body.elementor-editor-active #elementor-panel-categories { display: grid !important; }
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-layout {
    order: 1;
}
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-basic {
    order: 2;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-wpl-category {
    order: 3;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-general {
    order: 4;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-pro-elements {
    order: 5;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-link-in-bio {
    order: 6;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-theme-elements {
    order: 7;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-theme-elements-single {
    order: 8;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-woocommerce-elements {
    order: 9;
} 
body.elementor-editor-active #elementor-panel-categories #elementor-panel-category-wordpress {
    order: 10;
} 

/* footer styles */
.wpl-footer .wpl-toggle-accordion__item { border: 0; }
.wpl-footer .wpl-toggle-accordion__item .wpl-toggle-accordion__title { font-size: clamp(1.125rem, 0.9519rem + 0.7692vw, 1.875rem); /* 18px to 30px */ padding: 0; }
.wpl-toggle-accordion__item .wpl-toggle-accordion__title .wpl-toggle-accordion__icon { line-height: 0; }
.wpl-footer .wpl-toggle-accordion__content { padding: 0 !important; }
.wpl-toggle-accordion__item ul { padding: 0; margin: 0; }
.wpl-toggle-accordion__item li { list-style: none; }
.wpl-footer .wpl-toggle-accordion__icon { display: none; }
.wpl-footer .wpl-toggle-accordion__title { justify-content: start; }
.wpl-footer .wpl-toggle-accordion__content .wpl-toggle-accordion__sub-item { font-size: clamp(1rem, 0.7143rem + 0.4464vw, 1.25rem); /* 16px to 20px */ color: var(--accent-text); }
.wpl-footer .wpl-toggle-accordion__content .wpl-toggle-accordion__sub-item a { color: var(--accent-text); }
.wpl-footer .wpl-toggle-accordion__item ul { display: flex; flex-direction: column; gap: 10px; }
.site-footer a.elementor-button { padding: 0; border-radius: 50%; width: 150px; height: 150px; display: flex; align-items: center; justify-content: center; font-size: clamp(1rem, 0.7143rem + 0.4464vw, 1.25rem); /* 16px to 20px */ }
.site-footer a.elementor-button:before { border-radius: 50%; }
@media screen and (min-width:1024px) { .wpl-footer .wpl-toggle-accordion__content { max-height: 100% !important; opacity: 1 !important; visibility: visible !important; min-height: 100% !important; padding-top: 20px !important; } }
.site-footer ul { padding: 0; margin: 0; }
@media screen and (max-width:1024px) {
    .wpl-footer .wpl-toggle-accordion__item { -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
    .wpl-footer .wpl-toggle-accordion__item.active .wpl-toggle-accordion__title {
        padding: 0 0 20px;
    }
    .wpl-footer .wpl-toggle-accordion__item .wpl-toggle-accordion__title {
        justify-content: center;
    }
    .wpl-footer .wpl-toggle-accordion__content {
        text-align: center;
    }
}

/* why us style */
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box { flex-direction: row; gap: clamp(0.625rem, -0.6731rem + 5.7692vw, 6.25rem); /* 10px to 100px */ }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box > div { width: 50%; }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box-image { align-items: center; gap: clamp(0.9375rem, 0.7212rem + 0.9615vw, 1.875rem) !important; }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box-image img { width: 100%; max-width: clamp(4.375rem, 3.0769rem + 5.7692vw, 10rem); /* 70px to 160px */ border-radius: 50%; }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box-image h3 { font-size: clamp(1.375rem, 1.1154rem + 1.1538vw, 2.5rem); /* 22px to 40px */  }
.wpl-image-box-wrapper.wpl-style2 { counter-reset: wpl-flex-banner-option; }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box-image h3::before { counter-increment: wpl-flex-banner-option; content: "0" counter(wpl-flex-banner-option)"."; padding-right: clamp(0.3125rem, 0.2404rem + 0.3205vw, 0.625rem); /* 5px to 10px */ }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box { position: relative; }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: linear-gradient(90deg, rgba(var(--primaryrgb),0.5) 0%, rgba(var(--secondaryrgb),0.5) 100%); backdrop-filter: blur(2px); z-index: -1; -webkit-transform: scaleX(1) scaleY(0); transform: scaleX(1) scaleY(0); -webkit-transition: transform 0.3s ease-out; transition: transform 0.3s ease-out; }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box:hover:before { -webkit-transform: scaleX(1) scaleY(1); transform: scaleX(1) scaleY(1); }
.wpl-image-box-wrapper.wpl-style2 .wpl-image-box-description { font-size: var(--p); }

/* about icon style */
.wpl-icon-box-carousel.wpl-style2 .wpl-icon-box-icon svg,
.wpl-icon-box-wrapper.wpl-style2 .wpl-icon-box-icon svg,
.wpl-icon-box-wrapper.wpl-style1 svg { fill: none; }
.wpl-icon-box-wrapper.wpl-style1 .wpl-icon-box-content h3 { font-size: clamp(1.375rem, 1.1154rem + 1.1538vw, 2.5rem); line-height: 1.2; margin-bottom: 15px; position: relative; }
.wpl-icon-box-wrapper.wpl-style1 .wpl-icon-box-content h3:before { content: ""; position: absolute; top: 0; bottom: 0; left: -45px; margin: auto; width: 10px; height: 10px; border-radius: 50%; background-color: rgba(var(--primaryrgb),1); -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.wpl-icon-box-wrapper.wpl-style1 .wpl-icon-box-content h3:after { content: ""; position: absolute; top: 0; bottom: 0; left: -55px; margin: auto; width: 30px; height: 30px; border-radius: 50%; background-color: transparent; border: 1px solid rgba(var(--primaryrgb),1); -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.wpl-icon-box-wrapper.wpl-style1 .wpl-icon-box:hover .wpl-icon-box-content h3:after { -webkit-transform: scale(1.2); transform: scale(1.2); }
.wpl-icon-box-wrapper.wpl-style1 .wpl-icon-box-content p { font-size: var(--p); }
.elementor-widget-container .wpl-icon-box-wrapper.wpl-style1 .wpl-icon-box .wpl-icon-box-icon { font-size: 56px; padding-bottom: clamp(1.25rem, 0.9183rem + 1.4744vw, 2.6875rem); }
.wpl-icon-box-wrapper.wpl-style1 { border-left: 1px solid rgba(var(--borderrgb),0.8); padding-left: 40px; }

/* heading style */
p.wpl-heading { font-size: clamp(1rem, 0.9423rem + 0.2564vw, 1.25rem); /* 20px */ }

/* our service */
.wpl-icon-box-carousel.wpl-style2 .wpl-icon-box,
.wpl-icon-box-wrapper.wpl-style2 .wpl-icon-box {
    padding: clamp(1.875rem, 1.5865rem + 1.2821vw, 3.125rem) clamp(1.25rem, 0.8173rem + 1.9231vw, 3.125rem);
    /* 20px to 50px */
    background-image: linear-gradient(120deg, rgba(var(--primaryrgb), 0.5) 0%, rgba(var(--secondaryrgb), 0.5) 100%);
    backdrop-filter: blur(2px);
    border-radius: clamp(1.25rem, 1.1058rem + 0.641vw, 1.875rem);
    /* 30px */
    -webkit-transition: transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
}

.wpl-icon-box-carousel.wpl-style2 .wpl-icon-box-content h3,
.wpl-icon-box-wrapper.wpl-style2 .wpl-icon-box-content h3 { font-size: var(--h3); line-height: 1.2; padding-bottom: 20px; pointer-events: none; }

.wpl-icon-box-carousel.wpl-style2 .wpl-icon-box-content p,
.wpl-icon-box-wrapper.wpl-style2 .wpl-icon-box-content p { font-size: var(--p); pointer-events: none; }

.wpl-icon-box-carousel.wpl-style2 .wpl-icon-box-icon,
.wpl-icon-box-wrapper.wpl-style2 .wpl-icon-box-icon { font-size: 55px; padding-bottom: 30px; }

/* blog style */
.wpl-blog-post { padding: clamp(1.875rem, 1.5865rem + 1.2821vw, 3.125rem) clamp(1.25rem, 0.8173rem + 1.9231vw, 3.125rem); /* 20px to 50px */ border-radius: clamp(1.25rem, 1.1058rem + 0.641vw, 1.875rem); /* 30px */ border: 2px solid rgba(var(--borderrgb),0.8); background-image: linear-gradient(120deg, rgba(var(--primaryrgb), 0.5) 0%, rgba(var(--secondaryrgb), 0.5) 100%); backdrop-filter: blur(2px); pointer-events: none; }
.wpl-blog-post .thumbnail img { border: 2px solid var(--border); border-radius: clamp(0.625rem, 0.4808rem + 0.641vw, 1.25rem); }
.wpl-blog-post .excerpt,
.wpl-blog-post .title { margin: 0px; }
.wpl-blog-post .title { font-size: var(--h3); padding-bottom: 10px; line-height: 1.2; }
.wpl-blog-post .excerpt { font-size: var(--p); }
.wpl-blog-post .thumbnail { padding-bottom: 25px; line-height: 0; }

/* testimonial style */
.wpl-advance-carousel.style3 { padding: 20px; position: relative; }
.wpl-advance-carousel.style3:before,
.wpl-advance-carousel.style3:after { content: ""; position: absolute; top: 0; bottom: 0; margin: auto; width: 50px; height: 100%; background-image: linear-gradient(90deg, rgba(var(--backgroundrgb)) 60%, rgba(var(--secondaryrgb), 0) 90%); z-index: 2; pointer-events: none; }
.wpl-advance-carousel.style3:before { left: -20px; }
.wpl-advance-carousel.style3:after { right: -20px; transform: scaleX(-1); }
.wpl-advance-carousel.style3 .pagination-area { display: none; }
.wpl-advance-carousel.style3 .title-wrapper h3 { font-size: clamp(1rem, 0.8558rem + 0.641vw, 1.625rem); }
.wpl-advance-carousel.style3 .subtitle-wrapper h6 { font-size: clamp(0.875rem, 0.7596rem + 0.5128vw, 1.375rem); }
.wpl-advance-carousel.style3 .content-wrapper .description-wrapper { padding-bottom: 30px; }
.wpl-advance-carousel.style3 .content-wrapper .description-wrapper p { font-size: var(--p); }
.wpl-advance-carousel.style3 .content-wrapper .media-wrapper img { width: 60px; height: 60px; border-radius: 50%; }
.wpl-advance-carousel.style3 .content-wrapper .media-wrapper { position: absolute; right: 0; top: calc(100% - clamp(5.25rem, 4.8173rem + 1.9231vw, 7.125rem)); left: calc(100% - clamp(5.25rem, 4.8173rem + 1.9231vw, 7.125rem)); }
.wpl-advance-carousel.style3 .swiper-wrapper .swiper-slide:nth-child(odd) .content-wrapper { background-color: var(--accent-text); }
.wpl-advance-carousel.style3 .swiper-wrapper .swiper-slide:nth-child(even) .content-wrapper { background-color: var(--background); }
.wpl-advance-carousel.style3 .swiper-wrapper .swiper-slide:nth-child(odd) .title-wrapper h3,
.wpl-advance-carousel.style3 .swiper-wrapper .swiper-slide:nth-child(odd) .subtitle-wrapper h6,
.wpl-advance-carousel.style3 .swiper-wrapper .swiper-slide:nth-child(odd) .content-wrapper .description-wrapper p { color: var(--background); }
.wpl-advance-carousel.style3 .swiper-wrapper .swiper-slide:nth-child(odd) { -webkit-transform: rotate(-2deg); transform: rotate(-2deg); -webkit-transition: transform 0.3s ease-out; transition: transform 0.3s ease-out; }
.wpl-advance-carousel.style3 .swiper-wrapper .swiper-slide:nth-child(even) { -webkit-transform: rotate(2deg); transform: rotate(2deg); -webkit-transition: transform 0.3s ease-out; transition: transform 0.3s ease-out; }

.wpl-advance-carousel.style3 .content-wrapper .description-wrapper p {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* marquee style */
.wpl-marquee .marquee-inner.wpl-style1 .marquee-item .marquee-text { font-size: var(--h1); }
.wpl-center-logo img { max-width: clamp(6.25rem, 4.0865rem + 9.6154vw, 15.625rem) !important; /* 100px to 250px */ }


/* responsive */

@media screen and (min-width:1281px) {
    /* why us style */
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box-image img { -webkit-transform: scale(0); transform: scale(0); -webkit-transition: transform 0.3s ease-out; transition: transform 0.3s ease-out; transform-origin: left center; }
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box:hover .wpl-image-box-image img { -webkit-transform: scale(1); transform: scale(1); }
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box-image h3 { -webkit-transform: translateX(-190px); transform: translateX(-190px); -webkit-transition: transform 0.3s ease-out; transition: transform 0.3s ease-out; }
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box:hover .wpl-image-box-image h3 { -webkit-transform: translateX(0); transform: translateX(0); }
    .wpl-icon-box-carousel.wpl-style2 .wpl-icon-box:hover,
    .wpl-icon-box-wrapper.wpl-style2 .wpl-icon-box:hover { -webkit-transform: translateY(-10px); transform: translateY(-10px); }
}

@media screen and (min-width:1281px) and (max-width:1540px) {
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box-image h3 { -webkit-transform: translateX(-150px); transform: translateX(-150px); }
}


@media screen and (max-width:1280px) {
    /* why us style */
    .wpl-image-box-wrapper.wpl-style2 { gap: 20px !important; }
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box:before,
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box:hover:before { -webkit-transform: scaleX(1) scaleY(1); transform: scaleX(1) scaleY(1); }
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box { padding: 30px 20px !important; border: 2px solid rgba(var(--borderrgb),0.8) !important; border-radius: 20px !important; overflow: hidden; }
}

@media screen and (max-width:767px) {
    /* why us style */
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box .wpl-image-box-image,
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box { flex-direction: column; }
    .wpl-image-box-wrapper.wpl-style2 .wpl-image-box > div { width: 100%; }
    
}



.site-content:after {
    content: "";
    position: fixed;
    left: auto;
    right: -150px;
    top: 45%;
    width: 300px;
    height: 300px;
    border: 30px solid transparent;
    border-radius: 20px;
    background: linear-gradient(#040009 0 0) padding-box, linear-gradient(180deg, #ff0080, #7928ca) border-box;
    background-clip: padding-box, border-box;
    background-clip: padding-box, border-box;
    border-radius: 50% 0 0 50%;
    filter: blur(20px);
    z-index: -1;
    opacity: 0.1;
    pointer-events: none;
}

.site-content:before {
    content: "";
    position: fixed;
    right: auto;
    left: -150px;
    top: 75%;
    width: 300px;
    height: 300px;
    border: 30px solid transparent;
    border-radius: 20px;
    background: linear-gradient(#040009 0 0) padding-box, linear-gradient(180deg, #ff0080, #7928ca) border-box;
    background-clip: padding-box, border-box;
    background-clip: padding-box, border-box;
    border-radius: 0 50% 50% 0;
    filter: blur(20px);
    z-index: -1;
    opacity: 0.1;
    pointer-events: none;
}