
.erp-dashboard-section {
    background-image: url("../../default/newhomepage/homebanner.png");
    background-size: 100% 100%, cover;
    background-position: center, center;
    background-repeat: no-repeat, no-repeat;
}


.headache {
   position: relative;
   padding: 20px 0px 0px 0px;
   text-align: center;
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
}

.head-font {
   font-family: "Caveat";
}

.headache::before {
   content: '';
   position: absolute;
   top: 35%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 350px;
   height: 200px;
   background-size: cover;
   opacity: 0.2;
   pointer-events: none;
   -webkit-transform: translate(-50%, -50%);
   -moz-transform: translate(-50%, -50%);
   -ms-transform: translate(-50%, -50%);
   -o-transform: translate(-50%, -50%);
}

.schedule {
   background-image: linear-gradient(to right, #ce5234, #90331c);
   border: none;
   color: white;
   padding: 0px 20px;
   font-size: 16px;
   font-weight: bold;
   text-align: center;
   line-height: 50px;
   cursor: pointer;
   border-radius: 10px;;
   -webkit-border-radius: 10px;
   -moz-border-radius: 10px;
   -ms-border-radius: 10px;
   -o-border-radius: 10px;
}

.schedule:hover {
   background-image: linear-gradient(to right, #90331c, #90331c);
}

.arrow {
   position: relative;
   margin: 0 auto;
   width: 100px;
   transform: scaleX(-1);
}

.arrow .curve {
   border: 2px solid #BE5F4B;
   border-color: transparent transparent transparent #BE5F4B;
   height: 360px;
   width: 1200px;
   border-radius: 230px 0 0 150px;
}

.arrow .point {
   position: absolute;
   left: 40px;
   top: 315px;
}

.arrow .point:before,
.arrow .point:after {
   border: 1px solid #BE5F4B;
   content: "";
   position: absolute;
}

.arrow .point:before {
   top: -11px;
   left: -11px;
   transform: rotate(-74deg);
   -webkit-transform: rotate(-74deg);
   -moz-transform: rotate(-74deg);
   -ms-transform: rotate(-74deg);
}

.arrow .point:after {
   top: -20px;
   left: 5px;
   transform: rotate(12deg);
   -webkit-transform: rotate(12deg);
   -moz-transform: rotate(12deg);
   -ms-transform: rotate(12deg);
}

.startfree {
   text-align: center;
   width: 200px;
   transform: rotate(-15deg);
}

.parent {
   display: flex;
   justify-content: center;
   align-items: center;
}

.headngtag1, .headngtag5{
   margin-top: 0;
   margin-bottom: .5em;
   font-weight: 500;
}

.headngtag5 {
   font-size: 22px;
   line-height: 28px;
}

.margtop {  
   margin-top: 1.5rem !important;
}

.freetrl {
   color: #000;
  
}

.freetrl:hover{
   color: #90331c;
   text-decoration: none !important;
}

.trail {
   font-weight: bolder;
}

.btnclrchngemode {
   color: white;
}

.btnclrchngemode:hover {
   color: white !important;
   text-decoration: none;
}


.flipped-image {
   transform: scaleX(-1);
   width: 50px;
}


/* =========================================
   FEATURE ICON COLORS
   Mega Menu Features
========================================= */

.feature-icon {
    width: 75px;
    height: 75px;

    margin: 25px auto 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 20px;

    font-size: 30px;

    transition: all .35s ease;
}


/* 01 - Accounting Software */
.accounting-icon {
    color: #2563eb;
    background: #eaf1ff;
}


/* 02 - Inventory & Warehouse */
.inventory-icon {
    color: #16a34a;
    background: #e9f8ed;
}


/* 03 - Sales Management */
.sales-icon {
    color: #90331c;
    background: #fbe9e4;
}


/* 04 - Purchase Management */
.purchase-icon {
    color: #ea580c;
    background: #fff0e8;
}


/* 05 - Actual Vs Budget */
.budget-icon {
    color: #7c3aed;
    background: #f1eaff;
}


/* 06 - Task Management */
.task-icon {
    color: #0891b2;
    background: #e5f8fb;
}


/* 07 - Cloud Based & Offline */
.cloud-icon {
    color: #0284c7;
    background: #e7f6fc;
}


/* 08 - Project Management */
.project-icon {
    color: #9333ea;
    background: #f5eaff;
}


/* 09 - TAX Compliance */
.tax-icon {
    color: #dc2626;
    background: #fdeaea;
}


/* 10 - HR & Payroll */
.hr-icon {
    color: #db2777;
    background: #fdeaf4;
}


/* 11 - Dashboard & Reports */
.dashboard-icon {
    color: #ca8a04;
    background: #fff8df;
}


/* 12 - Payments & Receipts */
.payment-icon {
    color: #059669;
    background: #e7f8f2;
}


/* 13 - Multi-Currency Management */
.currency-icon {
    color: #15803d;
    background: #eaf8ed;
}


/* 14 - Recurring Invoices */
.recurring-icon {
    color: #4f46e5;
    background: #ecebff;
}


/* 15 - Lead Management */
.lead-icon {
    color: #d97706;
    background: #fff4df;
}


/* 16 - Shadobooks AI Assistance */
.ai-icon {
    color: #7c3aed;
    background: #f1eaff;
}


/* 17 - Security Management */
.security-icon {
    color: #2563eb;
    background: #eaf1ff;
}


/* 18 - Multi User Management */
.user-icon {
    color: #0891b2;
    background: #e6f8fa;
}


/* 19 - Custom Fields Generation */
.custom-fields-icon {
    color: #0284c7;
    background: #e7f5fc;
}


/* 20 - Business Management Software */
.business-icon {
    color: #90331c;
    background: #fbe9e4;
}


/* =========================================
   HOVER
========================================= */

.cards:hover .feature-icon {
    transform: translateY(-6px) scale(1.05);

    box-shadow:
        0 12px 25px rgba(0, 0, 0, .10);
}

.hp-partners-viewall {
         display: inline-block;
         padding: 10px 28px;
         background: #90331c;
         color: #fff;
         border-radius: 30px;
         font-size: 0.9rem;
         font-weight: 600;
         text-decoration: none;
         transition: background .25s;
      }
      .hp-partners-viewall:hover {
         background: #7a2a16;
         color: #fff;
         text-decoration: none;
      }



/* Home Carousal Section */

.carousalbody {
   margin-top: 50px;
   display: grid;
   overflow: hidden;
}

.carouselslide {
   width: 400%;
}

.slider-track {
   display: flex;
   width: calc(300px * 18);
   animation: scroll 60s linear infinite;
}

@keyframes scroll {
   0% {
      transform: translateX(0);
   }
   100% {
      transform: translateX(calc(-300px * 13)); 
   }
}

.cards {
   height: 100% !important;
   width: 12rem;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   text-align: center;
   border-radius: 20px;
   box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
   -webkit-border-radius: 20px;
   -moz-border-radius: 20px;
   -ms-border-radius: 20px;
   -o-border-radius: 20px;
}

.slides {
   display: flex;
   align-items: stretch;
   padding: 15px;
}

.card p {
   margin-top: 10px;
   font-weight: bold;
}

.features {
   max-width: 40%;
   height: auto;
   margin-top: 30px;
}

.crdbody {
   /* margin-top: 20px; */
   flex: 1 1 auto;
   padding: 1rem;
}


@media(max-width:992px){
    .cards{ --card-w:170px; }
    .feature-icon{ width:50px; height:50px; font-size:20px; }
    .crdbody{ padding:0.5rem 0.75rem 0.75rem; }
    .crdbody p{ font-size:14px; }
}

@media(max-width:576px){
    .carousalbody{ margin-top:30px; }
    .cards{ --card-w:140px; border-radius:14px; box-shadow:rgba(0,0,0,0.2) 0px 2px 6px; }
    .slides{ padding:10px; }
    .feature-icon{ width:44px; height:44px; font-size:18px; margin-bottom:6px; }
    .crdbody p{ font-size:13px; }
}

@media(max-width:420px){
    .cards{ --card-w:100px; }
    .feature-icon{ width:38px; height:38px; font-size:16px; }
    .crdbody{ padding:0.4rem 0.5rem 0.6rem; }
    .crdbody p{ font-size:12px; }
}