@font-face {
    font-family: "Barlow"; 
    src: url(fonts/Barlow-Regular.ttf);
}
@font-face {
    font-family: "Barlow Light"; 
    src: url(fonts/Barlow-Light.ttf);
}
h1,h2,h3,h4,p{text-wrap: pretty}
:root{
    --cnvs-themecolor: #28447b;
    --cnvs-themecolor-rgb: 40, 68, 123;
    --cnvs-body-font: Manrope, "Open Sans", "system-ui", "Segoe UI", Roboto, Oxygen, Ubuntu, "Fira Sans", "Droid Sans", "Helvetica Neue", sans;
    --cnvs-primary-font: 'Barlow', "Inter",sans-serif;
    --bs-body-bg: #FFF /*#EEF1F9*/;
    --cnvs-secondary-font: 'Barlow', "Inter",sans-serif;
}
.error404{
    font-size: inherit;
    line-height: inherit;
    letter-spacing: normal;
}
.dotted-bg::before {
    content: "";
    position: absolute;
    display: block;
    top: 40%;
    left: 35%;
    width: 110%;
    height: 120%;
    background-size: 12px 12px;
    background-position: center;
    transform: translate(-50%, -50%);
    background-image: radial-gradient(#3D80E4 14%, transparent 14%);
    -webkit-mask-image: radial-gradient(rgba(0,0,0,1),rgba(0,0,0,0) 75%);
    mask-image: radial-gradient(rgba(0,0,0,1),rgba(0,0,0,0) 75%);
    z-index: 0;
}
.dotted-bg::before { background-image: radial-gradient(rgba(255, 255, 255, 0.2) 14%, transparent 14%); }
.dotted-bg.dotted-bg-dark::before { background-image: radial-gradient(rgba(4, 4, 4, 0.2) 14%, transparent 14%); }

form .form-group p,
.wpcf7 p{margin-bottom: 0;}
.aspect-3-2{aspect-ratio: 300 / 200!important;}
.aspect-1-1{aspect-ratio: 800 / 800!important;}
.aspect-16-19{aspect-ratio: 1600 / 900!important;}

#top-bar a[href^="tel:"] {
  color: #FFF; /* 将电话号码的颜色设置为黑色 */
  text-decoration: none; /* 移除下划线 */
}

#header{
    --cnvs-primary-menu-font-size: 1rem;
    --cnvs-primary-menu-font-weight: 400;
}
.is-expanded-menu #header .primary-menu:not(.on-click) .menu-item:not(.mega-menu) .sub-menu-container,
.is-expanded-menu #header .primary-menu:not(.on-click) .mega-menu-content {
    box-shadow: none;
    opacity: 0;
    border-top: 0;
    margin-top: 0;
    transform: scaleY(0);
    will-change: transform;
    transform-origin: top center;
    transition: transform .2s .1s linear !important;
    background-color: #FFF;
}

.is-expanded-menu #header .primary-menu:not(.on-click) .menu-item:hover:not(.mega-menu) .sub-menu-container,
.is-expanded-menu #header .primary-menu:not(.on-click) .menu-item:hover .mega-menu-content {
    transform: scaleY(1);
    opacity: 1;
}
.fbox-icon a, .fbox-icon i, .fbox-icon img{height: auto;}

.fancy-title-custom{}
.fancy-title-custom h2 span{font-size: 11px;}
.fancy-title-custom::before, .fancy-title-custom::after{ border-top-color: var(--cnvs-themecolor);}
.fancy-title-custom .bi-icon {position: absolute; right: -0.6rem; font-size: 1.5rem;}

/* Front Page */
.counter{
    --cnvs-counter-font-size: 20px;
}
.cats-wrap a img {
    aspect-ratio: 384 / 288;
}
.solutions .feature-box.media-box.fbox-bg {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    box-shadow: 0 1px 1px 0 rgba(10, 16, 34, .2);
    -webkit-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    border-radius: 5px;
}
.solutions .feature-box.media-box.fbox-bg:hover {
    box-shadow: 0 10px 30px -5px rgba(10, 16, 34, .2);
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}
.solutions .media-box.fbox-bg .fbox-media img{ 
    aspect-ratio: 384 / 288;
}
.solutions .feature-box h3 { font-size: 17px; }
.solutions .feature-box h3 span.subtitle {font-size: 14px;}

/* History On About Page */
.owl-carousel{--cnvs-owl-nav-background: #FFF;}
.testimonials-carousel .owl-stage {
    padding: 2rem 0 1.5rem;
}
.testimonials-carousel .owl-item {
    opacity: .6;
    transition: transform .3s ease;
    transform: scale(0.8);
}
.testimonials-carousel .owl-item.active.center {
    opacity: 1;
    transform: scale(1);
}
.testimonial {
    border: 0;
    box-shadow: 0 0 35px rgba(140, 152, 164, 0.2);
    border-radius: 0.25rem;
    padding: 25px;
}
.testimonial-image {
    width: 5rem !important;
    height: auto !important;
    margin: -2.5rem auto 0;
}

/* Product Detail */
.product-excerpt p{margin-bottom: 12px;}
.product-album .fslider.flex-thumb-grid .flex-control-nav.flex-control-thumbs li img{
    aspect-ratio: 300 / 200;
    object-fit: cover;
}

/* About Page  */
.history-block .feature-box-border-vertical .feature-box { position: relative; }

.history-block .feature-box-border-vertical .feature-box:not(.noborder)::before,
.history-block .feature-box-border-vertical .fbox-active.feature-box:not(.noborder)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 35px;
    width: 3px;
    height: 100%;
    background-color: var(--bs-gray-200);
}

.history-block .feature-box-border-vertical .fbox-icon i,
.history-block .feature-box-border-vertical .fbox-border.fbox-light .fbox-icon i {
    position: relative;
    z-index: 5;
    text-align: center;
    box-shadow: 0 0 0 6px #FFF;
    border: 1px solid #EEE;
    background-color: #FFF !important;
}

.history-block .feature-box-border-vertical .fbox-active.feature-box .fbox-icon i,
.history-block .feature-box-border-vertical .fbox-active.feature-box .fbox-border.fbox-light .fbox-icon i,
.history-block .feature-box-border-vertical .fbox-active.feature-box:not(.noborder)::after {
    background-color: var(--cnvs-themecolor) !important;
    border-color: transparent !important;
    color:#FFF;
}

/* Soupport Page */
@media (min-width: 768px) {
    .service-process .feature-box-border-horizontal .feature-box { position: relative; }
    .service-process .feature-box-border-horizontal .feature-box:not(.noborder) .fbox-icon::before,
    .service-process .feature-box-border-horizontal.border-hover-animate .feature-box:not(.noborder) .fbox-icon::after {
        content: "";
        position: absolute;
        top: 31px;
        left: calc(50% + 32px);
        width: calc(100% - 64px);
        height: 2px;
        border: 1px solid #EEE;
        z-index: 0;
    }
    .service-process .feature-box-border-horizontal.border-dashed .feature-box:not(.noborder) .fbox-icon::before,
    .service-process .feature-box-border-horizontal.border-dashed.border-hover-animate .feature-box:not(.noborder) .fbox-icon::after {
        border-style: dashed;
    }
    .service-process .feature-box-border-horizontal.border-hover-animate .feature-box:not(.noborder) .fbox-icon::after {
        display: block;
        border-color: #222;
        width: 0;
        transform-origin: top left;
        transition: width .3s ease-in-out;
    }
    /* .feature-box-border-horizontal .feature-box:not(.noborder):nth-child(1) .fbox-icon::before { background-color: #222; } */
    .service-process .feature-box-border-horizontal.border-hover-animate .feature-box:not(.noborder):hover .fbox-icon::after {  width: calc(100% - 64px); }
    .service-process .feature-box-border-horizontal .fbox-icon i,
    .service-process .feature-box-border-horizontal .fbox-border.fbox-light .fbox-icon i {
        line-height: 60px;
        font-size: 24px;
        z-index: 1;
        text-align: center;
        box-shadow: 0 0 0px 10px #FFF;
    }
    .service-process .feature-box-border-horizontal .feature-box.flex-column:not(.noborder) .fbox-icon::before,
    .service-process .feature-box-border-horizontal.border-hover-animate .feature-box.flex-column:not(.noborder) .fbox-icon::after {
        left: calc(0% + 100px);
    }
}


/* Floating Contact added by TITSTUDIO.COM 20250306 */
.floating-btn-box form {font-size: 12px; margin-bottom: 0;}
.floating-btn-open #wrapper::after {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.75);
}
.floating-btn-wrap {
    --cnvs-floating-btn-size: 3rem;
    --cnvs-floating-btn-pos-right: 2rem;
    --cnvs-floating-btn-pos-bottom: 4rem;
    --cnvs-floating-btn-transition: .3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    --cnvs-floating-btn-bg-color: var(--cnvs-themecolor);
    --cnvs-floating-btn-icon-color: #FFF;
    --cnvs-floating-btn-bg-active-color: var(--bs-dark);
    --cnvs-floating-btn-box-width: 25rem;
    --cnvs-floating-btn-box-padding: 2rem;
    --cnvs-floating-btn-box-radius: .3rem;
    --cnvs-floating-btn-box-bg: #FFF;
    --cnvs-floating-btn-box-shadow: 0px 0px 13px 3px rgba(0,0,0,0.07);
    position: fixed;
    right: 1rem;
    bottom: var(--cnvs-floating-btn-pos-bottom);
    z-index: 199;
}

.floating-btn-wrap .floating-btn {
    position: absolute;
    right: 0;
    top: 0;
    width: var(--cnvs-floating-btn-size);
    height: var(--cnvs-floating-btn-size);
    border-radius: var(--cnvs-floating-btn-size);
    background-color: var(--cnvs-floating-btn-bg-color);
    color: var(--cnvs-floating-btn-icon-color);
    cursor: pointer;
    z-index: 3;
    transform: translate(-50%, -50%);
    transition: transform .3s ease;
}

.floating-btn-wrap .floating-btn:hover,
.floating-btn-open .floating-btn-wrap .floating-btn {
    transform: translate(-50%, -50%) scale(1.1);
    background-color: var(--cnvs-floating-btn-bg-active-color);
}

.floating-btn-wrap .floating-btn .floating-btn-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: calc(var(--cnvs-floating-btn-size) * .5);
    -webkit-transition: var(--cnvs-floating-btn-transition);
    transition: var(--cnvs-floating-btn-transition);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-backface-visibility: hidden;
}

.floating-btn-wrap .floating-btn .floating-btn-icon.btn-active,
.floating-btn-open .floating-btn-wrap .floating-btn .floating-btn-icon {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.floating-btn-open .floating-btn-wrap .floating-btn .floating-btn-icon.btn-active {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
}

.floating-btn-wrap .floating-btn-box {
    opacity: 0;
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--cnvs-floating-btn-box-width);
    background-color: var(--cnvs-floating-btn-box-bg);
    border-radius: var(--cnvs-floating-btn-box-radius);
    z-index: 1;
    padding: var(--cnvs-floating-btn-box-padding);
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    box-shadow: var(--cnvs-floating-btn-box-shadow);
    -webkit-transform: scale(.01);
    transform: scale(.01);
    -webkit-transition: all var(--cnvs-floating-btn-transition);
    transition: all var(--cnvs-floating-btn-transition);
    -webkit-backface-visibility: hidden;
}

.floating-btn-open .floating-btn-wrap .floating-btn-box {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.floating-btn-wrap + #gotoTop {
    left: 40px;
    right: auto;
}

@media (max-width: 767.98px) {
    h1, .h1, h1.display-4 {
        font-size: 1.75rem;
    }
    .display-5{
        font-size: 1.5rem
    }

    .service-process .fbox-content h3{font-size: 12px;  margin-bottom: 0 !important;}
    .service-process .feature-box{ --cnvs-featured-box-icon: 2rem;}
    .service-process .fbox-icon i{font-size: 1rem;}
    .service-process .feature-box-border-horizontal .feature-box:not(.noborder) .fbox-icon::before, .service-process .feature-box-border-horizontal.border-hover-animate .feature-box:not(.noborder) .fbox-icon::after{
        content: "";
        position: absolute;
        top: 15px;
        left: calc(50% + 32px);
        width: calc(100% - 64px); 
        height: 2px;
        border: 1px solid #EEE;
        z-index: 0;
    }
    .service-process p.small{font-size: 12px;}

    .faqs-custom .fs-5{font-size: 16px!important;}
    .faqs-custom .toggle-header .h6,
    .faqs-custom .toggle-content .small{font-size: 12px;}
    .wp-block-table table{font-size: 12px;}
    .product h2.fs-5{font-size: 12px!important;}
    .emphasis-title h1, .emphasis-title .h1, .emphasis-title h2, .emphasis-title .h2{font-size: 2rem;}
    .emphasis-title .lead{font-size: 1rem;}
}