:root {
  
}




.to-quaternary {
  --uc-gradient-to:#103928
}
.from-quaternary {
  --uc-gradient-from:#103928;
  
  --uc-gradient-stops:var(--uc-gradient-from),var(--uc-gradient-to)
}
.from-gray-700 {
  --uc-gradient-from:rgb(41.4, 41.4, 45.6);
  --uc-gradient-stops:var(--uc-gradient-from),var(--uc-gradient-to)
}
.from-gray-800 {
  --uc-gradient-from:rgb(27.6, 27.6, 30.4);
  --uc-gradient-stops:var(--uc-gradient-from),var(--uc-gradient-to)
}
.to-gray-900 {
  --uc-gradient-to:rgb(13.8, 13.8, 15.2)
}


/* -----------------------------
   Custom Grid System
------------------------------*/

.row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -12px;
    margin-right: -12px;
}

.row > [class*="col"] {
    padding-left: 12px;
    padding-right: 12px;
    box-sizing: border-box;
}

/* Base */

.col {
    flex: 1 0 0%;
}

.col-auto {
    flex: 0 0 auto;
    width: auto;
}

.col-1 { width:8.333333%; }
.col-2 { width:16.666667%; }
.col-3 { width:25%; }
.col-4 { width:33.333333%; }
.col-5 { width:41.666667%; }
.col-6 { width:50%; }
.col-7 { width:58.333333%; }
.col-8 { width:66.666667%; }
.col-9 { width:75%; }
.col-10 { width:83.333333%; }
.col-11 { width:91.666667%; }
/*.col-12 { width:100%; }*/

.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,
.col-7,.col-8,.col-9,.col-10,.col-11,.col-12{
    flex:0 0 auto;
}

/* -----------------------------
   SM ≥576px
------------------------------*/

@media (min-width:576px){

.col-sm-1{width:8.333333%}
.col-sm-2{width:16.666667%}
.col-sm-3{width:25%}
.col-sm-4{width:33.333333%}
.col-sm-5{width:41.666667%}
.col-sm-6{width:50%}
.col-sm-7{width:58.333333%}
.col-sm-8{width:66.666667%}
.col-sm-9{width:75%}
.col-sm-10{width:83.333333%}
.col-sm-11{width:91.666667%}
.col-sm-12{width:100%}

}

/* -----------------------------
   MD ≥768px
------------------------------*/

@media (min-width:768px){

.col-md-1{width:8.333333%}
.col-md-2{width:16.666667%}
.col-md-3{width:25%}
.col-md-4{width:33.333333%}
.col-md-5{width:41.666667%}
.col-md-6{width:50%}
.col-md-7{width:58.333333%}
.col-md-8{width:66.666667%}
.col-md-9{width:75%}
.col-md-10{width:83.333333%}
.col-md-11{width:91.666667%}
.col-md-12{width:100%}

}

/* -----------------------------
   LG ≥992px
------------------------------*/

@media (min-width:992px){

.col-lg-1{width:8.333333%}
.col-lg-2{width:16.666667%}
.col-lg-3{width:25%}
.col-lg-4{width:33.333333%}
.col-lg-5{width:41.666667%}
.col-lg-6{width:50%}
.col-lg-7{width:58.333333%}
.col-lg-8{width:66.666667%}
.col-lg-9{width:75%}
.col-lg-10{width:83.333333%}
.col-lg-11{width:91.666667%}
.col-lg-12{width:100%}

}

/* -----------------------------
   XL ≥1200px
------------------------------*/

@media (min-width:1200px){

.col-xl-1{width:8.333333%}
.col-xl-2{width:16.666667%}
.col-xl-3{width:25%}
.col-xl-4{width:33.333333%}
.col-xl-5{width:41.666667%}
.col-xl-6{width:50%}
.col-xl-7{width:58.333333%}
.col-xl-8{width:66.666667%}
.col-xl-9{width:75%}
.col-xl-10{width:83.333333%}
.col-xl-11{width:91.666667%}
.col-xl-12{width:100%}

}

/* -----------------------------
   XXL ≥1400px
------------------------------*/

@media (min-width:1400px){

.col-xxl-1{width:8.333333%}
.col-xxl-2{width:16.666667%}
.col-xxl-3{width:25%}
.col-xxl-4{width:33.333333%}
.col-xxl-5{width:41.666667%}
.col-xxl-6{width:50%}
.col-xxl-7{width:58.333333%}
.col-xxl-8{width:66.666667%}
.col-xxl-9{width:75%}
.col-xxl-10{width:83.333333%}
.col-xxl-11{width:91.666667%}
.col-xxl-12{width:100%}

}

.custom-uc-subnav-pill-whatsapp>.uc-active>a {
   color: #fff !important;
   background-color: #1e9579;
   padding: 10px 20px;
   border-radius: 5px;
}

.custom-uc-subnav-pill>*>a {
    /*border: 1px solid var(--border-color);*/
  border-radius: 4px;
  color: var(--color-gray-900) !important;
}

.custom-uc-subnav-pill>*>a:hover {
  background: rgba(0, 0, 0, 0);
  color: var(--color-gray-900)
}

.custom-uc-subnav-pill>*>a:hover:where(.uc-dark),
:where(.uc-dark) .custom-uc-subnav-pill>*>a:hover {
  color: #fff
}

.custom-uc-subnav-pill>.uc-active>a {
   color: #fff ;
   border: 1px solid;
}
.custom-uc-subnav-pill{
  border-right: 1px solid var(--border-color) !important;
}
.custom-uc-subnav-pill li a svg{
 width: 22px;
 height: 22px;
}

.custom-uc-subnav-pill > li:nth-child(1).uc-active > a {
    border-color: #103928;
    color: #103928 !important;
}

.custom-uc-subnav-pill > li:nth-child(2).uc-active > a {
    border-color: #1a73e8;
    color: #1a73e8 !important;
}

.custom-uc-subnav-pill > li:nth-child(3).uc-active > a {
    border-color: #6f42c1;
    color: #6f42c1 !important;
}

.custom-uc-subnav-pill > li:nth-child(4).uc-active > a {
    border-color: #ea580c;
    color: #ea580c !important;
}

.bg-green-pearl{
  background-color: #E8F5EE;
}
.bg-blue-pearl{
  background-color: #EAF3FF;
}
.bg-purple-pearl{
  background-color: #F3ECFF;
}
.bg-orange-pearl{
  background-color: #FFF2E8;
}


.app-two-mockup::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 50%;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
  width: 450px;
  height: 450px;
  border-radius: 50%;

  background-color: #54545442;
  z-index: 0;
}
.icon-box {
  flex-shrink: 0;
}

/* Benefit Area Style
============================================*/
.benefit-single-item {
  background-color: #fff;
  text-align: center;
  padding: 50px 30px;
  border-radius: 15px;
}
.benefit-single-item .icon {
  margin-bottom: 20px;
}
.benefit-single-item h3, .benefit-single-item .h3 {
  margin: 30px 18px 15px;
  font-size: 22px;
}
.benefit-single-item p {
  font-size: 14px;
}

.benefit-single-item-two {
  background-color: #F2B827;
  padding: 10px;
  border-radius: 15px;
  margin-top: 24px;
}
.benefit-single-item-two img {
  width: 186px;
  border-radius: 10px;
}
.benefit-single-item-two h3, .benefit-single-item-two .h3 {
  font-size: 22px;
  margin-bottom: 20px;
}
.benefit-single-item-two .default-btn:hover {
  background-color: #fff;
}

/* Max width 767px */
@media only screen and (max-width: 767px) {
  .benefit-single-item {
    text-align: center;
    padding: 20px;
    border-radius: 10px;
  }
  .benefit-single-item .icon {
    margin-bottom: 20px;
  }
  .benefit-single-item h3, .benefit-single-item .h3 {
    margin: 20px 18px 15px;
    font-size: 18px;
  }
  .benefit-single-item-two h3, .benefit-single-item-two .h3 {
    font-size: 18px;
  }
}
/* Min width 768px to Max width 992px */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .benefit-single-item {
    padding: 25px;
  }
  .benefit-single-item h3, .benefit-single-item .h3 {
    font-size: 20px;
    margin-left: 0;
    margin-right: 0;
  }
  .benefit-single-item-two h3, .benefit-single-item-two .h3 {
    font-size: 20px;
  }
}
/* Min width 1200px to Max width 1399px */
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .benefit-single-item {
    padding: 25px;
  }
  .benefit-single-item h3, .benefit-single-item .h3 {
    font-size: 20px;
    margin-left: 0;
    margin-right: 0;
  }
  .benefit-single-item-two h3, .benefit-single-item-two .h3 {
    font-size: 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .benefit-single-item-two {
    max-width: 528px;
    margin-top: 0;
  }
  .benefit-single-item.mt-50 {
    margin-top: 50px;
  }
  .benefit-single-item.position-relative {
    top: -50px;
  }
}
/* Dark Mode Area Style
============================================*/
[data-theme=dark] .benefit-single-item {
  background-color: #0C1427;
}

.min-w-60px {
  min-width: 60px !important
}

.feature-nav-link.active{
  color: #333 !important;
}






.button-light {
    transition: all 0.3s ease;
}

.button-light:hover {
    box-shadow:
        0 0 0 2px rgba(221, 255, 154, 0.4),
        0 8px 20px rgba(221, 255, 154, 0.2);
}


.post-title-small,
        .post-title-small a {
            display: -webkit-box !important;
            -webkit-line-clamp: 1 !important;
            -webkit-box-orient: vertical !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            white-space: normal !important;
            line-height: 1.4 !important;
            max-height: 2.8em !important;
        }
.list-unstyled {
    list-style: none;
    padding: 0;
    margin: 0;
}

.list-unstyled li {
    position: relative;
    padding-left: 1.5rem;
}

.list-unstyled li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--color-primary);
    font-weight: bold;
}

/*07/ AUG/2026*/



        .rounded-5 {
            border-radius: 28px !important;
        }

        

        

        @media(max-width:991px) {

            .card {
                min-height: auto;
            }

        }

        .list-none {
            list-style: none !important;
        }

        .hero-scroll-item {
            will-change: transform, opacity;
            transition: transform .08s linear;
        }

        .try-folder {
            position: relative;
            width: 320px;
            margin: auto;
            perspective: 1000px;
        }

        .connector-wrap {
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
            position: relative;
        }

        .connector-svg {
            width: 100%;
            height: 150px;
            display: block;
            overflow: visible;
        }

        .connector-svg path.line {
            fill: none;
            stroke: #e2e5e9;
            stroke-width: 2;
        }

        .connector-svg .dot {
            fill: #12362b;
        }

        .connector-svg .arrow {
            fill: #e2e5e9;
        }

        .integration-wrap {
            display: grid;
            grid-template-columns: repeat(7, 1fr);
            gap: 20px;
            max-width: 1200px;
            margin: 0 auto;
        }

        .integration-wrap.row-two {
            margin-top: 20px;
        }

        .integration-wrap.row-two .pos-2 {
            grid-column: 2 / span 1;
        }

        .integration-wrap.row-two .pos-3 {
            grid-column: 3 / span 1;
        }

        .integration-wrap.row-two .pos-4 {
            grid-column: 4 / span 1;
        }

        .single-integration:hover {
            transform: translateY(-4px);
            box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
        }

        .single-integration img {
            height: 50px;
        }

        @media (max-width:991px) {
            .home5-integration-section {
                padding: 70px 0 40px;
            }

            .section-title {
                margin-bottom: 50px;
            }

            .section-title h2 {
                font-size: 1.9rem;
            }

            .connector-wrap {
                display: none;
            }

            .hub-circle {
                width: 72px;
                height: 72px;
            }

            .hub-circle svg {
                width: 32px;
                height: 32px;
            }

            .integration-wrap,
            .integration-wrap.row-two {
                grid-template-columns: repeat(3, 1fr);
                gap: 16px;
            }

            .integration-wrap.row-two .pos-2,
            .integration-wrap.row-two .pos-3,
            .integration-wrap.row-two .pos-4 {
                grid-column: auto;
            }

            .single-integration {
                padding: 22px 8px 16px;
            }
        }

        @media (max-width:575px) {
            .home5-integration-section {
                padding: 56px 0 32px;
            }

            .section-title span {
                font-size: .85rem;
            }

            .section-title h2 {
                font-size: 1.5rem;
                line-height: 1.3;
                padding: 0 8px;
            }

            .hub-circle {
                width: 60px;
                height: 60px;
            }

            .integration-wrap,
            .integration-wrap.row-two {
                grid-template-columns: repeat(2, 1fr);
                gap: 12px;
            }
        }

        @media (max-width:380px) {
            .section-title h2 {
                font-size: 1.3rem;
            }

            .integration-wrap,
            .integration-wrap.row-two {
                gap: 10px;
            }
        }




        .benefit-card {
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
        }

        .benefit-icon {
            width: 58px;
            height: 58px;
            transition: .4s;
            flex-shrink: 0;
        }

        .benefit-hover {
            inset: 0;
            transform: translateY(100%);
            transition: .7s;
        }

        .benefit-card:hover .benefit-hover {
            transform: translateY(0);
        }

        .benefit-hover .benefit-icon {
            background: rgba(255, 255, 255, .12);
        }

        .benefit-stat-card {
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            display: flex;
            align-items: flex-end;
            padding: 20px;
        }

        .benefit-stat-box {
            padding: 14px;
            border-radius: 10px;
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
            background: rgba(154, 122, 193, .55);
            color: #fff;
        }

        .benefit-stat-box h3{
            margin-bottom: 0;
        }



        @media (max-width:991px) {

            .benefits-grid {
                grid-template-columns: 1fr;
                grid-template-rows: auto;
            }

            .benefits-grid>* {
                grid-column: auto !important;
                grid-row: auto !important;
            }

            .benefit-card {
                min-height: 250px;
            }

            .benefit-stat-card {
                min-height: 500px;
            }

        }

        @media (max-width:767px) {

            .benefit-card {
                min-height: 220px;
            }

            .benefit-stat-card {
                min-height: 380px;
            }

            .benefit-card h4 {
                font-size: 20px;
            }

            .benefit-stat-box h3 {
                font-size: 28px;
            }

        }

        .benefit-img {
            height: 170px;
            padding-left: 58px;
        }


        .benefits-grid.benefits-grid2 {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-auto-rows: 300px;
            gap: 20px;
        }

        .ab {
            grid-column: 1 / 4;
            /* spans 3 columns */
        }

        .c {
            grid-column: 4;
        }

        .d {
            grid-column: 1;
        }

        .ef {
            grid-column: 2 / 5;
            /* spans last 3 columns */
        }

        @media (max-width: 1199px) {
            .benefits-grid.benefits-grid2 {
                grid-template-columns: 1fr 1fr;
                grid-template-rows: auto;
                grid-auto-rows: auto;
            }

            .ab {
                grid-column: 1 / 3;
                grid-row: auto;
                min-height: 280px;
            }

            .c,
            .d {
                grid-column: auto;
                min-height: 280px;
                aspect-ratio: 1 / 1;
            }

            .ef {
                grid-column: 1 / 3;
                grid-row: auto;
                min-height: 280px;
            }
        }

        @media (max-width: 767px) {
            .benefits-grid.benefits-grid2 {
                grid-template-columns: 1fr;
                gap: 16px;
            }

            .ab,
            .c,
            .d,
            .ef {
                grid-column: 1;
                grid-row: auto;
                min-height: 250px;
            }

            .c,
            .d {
                aspect-ratio: 1 / 1;
                min-height: unset;
            }
        }