.hero-section-product {
   /* background: rgba(0, 0, 0, 0.5); */
   background: radial-gradient(ellipse at center,
         rgba(0, 0, 0, 0.6) 0%,
         rgba(0, 0, 0, 0.3) 40%,
         rgba(0, 0, 0, 0.0) 100%);
   position: relative;
   overflow: hidden;
}

.retaillife-vertical-overlay {
   background: linear-gradient(140deg, rgba(0, 0, 0, 0.8), transparent);
}

#hero-image-product {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   z-index: -1;
}

@media (max-width: 991px) {
   #hero-image-product {
      object-position: right center;
   }
}

.hero-content-product-wrapper {
   padding-top: 200px;
   padding-bottom: 200px;
}


/* Footer */
.gradient-background {
   background: rgb(235, 232, 232) !important;
}

/* Body */
.bg-rlf-landing {
   background: #F9F9F9
}

.bgcolor-rlf {
   background: #0068ce !important
}

.custom-icon-rlf {
   height: 64px !important;
   width: 64px !important;
   color: #0068ce;
}

.custom-icon-rlf:hover {
   color: #305170;
}

.color-rlf {
   color: #0068ce !important;
}

.badge-rlf {
   background-color: #0068ce !important;
   color: #fff !important;
}

.rlf-price-border {
   border-right: none !important
}

.rlf-price-border {
   border-right: 1px solid #D5D8DB
}

.rlf-pricing-background {
   background-color: #fdfdfd;
}

.retaillife-background {
   background: #0068ce22;
}

.retaillife-background img {
   height: 450px;
}

.retail-landing-image {
   background-image: url('/images/overlay/rbs-overlay/rbs-landing-tab.png') !important;
}

.retail-landing-image {
   background-image: url('/images/overlay/rbs-overlay/rbs-landing.jpg');
   position: relative;
   background-position: left center;
   -webkit-background-size: contain;
   background-size: contain;
   background-repeat: no-repeat;
   padding-top: 90px;
   padding-bottom: 90px
}

.header-text-hero {
   font-family: 'Noto Sans', sans-serif;
   font-weight: 700;
   font-style: normal;
   font-size: 40px;
   line-height: 130%;
   letter-spacing: -0.03em;
}

.sub-header-text {
   font-family: 'Noto Sans', sans-serif;
   font-weight: 400;
   font-style: normal;
   font-size: 1.5rem;
   line-height: 100%;
   letter-spacing: -0.02em;
}

@media (min-width: 768px) and (max-width: 1023px) {
   .retail-landing-image {
      background-image: url("/images/overlay/rbs-overlay/rbs-landing-tab.png") !important;
   }
}

.crm-retail {
   margin-right: -160px;
   border: 4px solid rgba(204, 204, 204, 1);
}

.top-plan-change-section ul li a.active {
   background-color: #0068ce !important;
   color: white;
   font-weight: 500;
   border: 1px solid #0068ce !important;
   z-index: 1;
}

.text-rlf {
   color: #0068ce;
}

/* Price */
label.radio-card {
   cursor: pointer;
}

label.radio-card .card-content-wrapper {
   background: #fff;
   border-radius: 5px;
   min-height: 139px;
   border: 1px solid #e9e9e9;
   padding: 15px;
   box-shadow: 0 2px 4px 0 rgba(219, 215, 215, 0.04);
   transition: 100ms linear;
   display: flex;
}

label.radio-card .check-icon {
   width: 17px;
   height: 17px;
   display: inline-block;
   border: solid 2px #e3e3e3;
   border-radius: 50%;
   transition: 200ms linear;
   position: relative;
}

label.radio-card .check-icon:before {
   content: '';
   position: absolute;
   inset: 0;
   background-image: url("data:image/svg+xml,%3Csvg width='12' height='9' viewBox='0 0 12 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.93552 4.58423C0.890286 4.53718 0.854262 4.48209 0.829309 4.42179C0.779553 4.28741 0.779553 4.13965 0.829309 4.00527C0.853759 3.94471 0.889842 3.88952 0.93552 3.84283L1.68941 3.12018C1.73378 3.06821 1.7893 3.02692 1.85185 2.99939C1.91206 2.97215 1.97736 2.95796 2.04345 2.95774C2.11507 2.95635 2.18613 2.97056 2.2517 2.99939C2.31652 3.02822 2.3752 3.06922 2.42456 3.12018L4.69872 5.39851L9.58026 0.516971C9.62828 0.466328 9.68554 0.42533 9.74895 0.396182C9.81468 0.367844 9.88563 0.353653 9.95721 0.354531C10.0244 0.354903 10.0907 0.369582 10.1517 0.397592C10.2128 0.425602 10.2672 0.466298 10.3112 0.516971L11.0651 1.25003C11.1108 1.29672 11.1469 1.35191 11.1713 1.41247C11.2211 1.54686 11.2211 1.69461 11.1713 1.82899C11.1464 1.88929 11.1104 1.94439 11.0651 1.99143L5.06525 7.96007C5.02054 8.0122 4.96514 8.0541 4.90281 8.08294C4.76944 8.13802 4.61967 8.13802 4.4863 8.08294C4.42397 8.0541 4.36857 8.0122 4.32386 7.96007L0.93552 4.58423Z' fill='white'/%3E%3C/svg%3E%0A");
   background-repeat: no-repeat;
   background-size: 9px;
   background-position: center center;
   transform: scale(1.3);
   transition: 100ms linear;
   opacity: 0;
}

label.radio-card input[type='radio'] {
   appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
}

label.radio-card input[type='radio']:checked+.card-content-wrapper {
   box-shadow: 0 2px 4px 0 rgba(219, 215, 215, 0.5), 0 0 0 1px #0068ce;
}

label.radio-card input[type='radio']:checked+.card-content-wrapper .check-icon {
   background: #0068ce;
   border-color: #0068ce;
   transform: scale(1.2);
}

label.radio-card input[type='radio']:checked+.card-content-wrapper .check-icon:before {
   transform: scale(1);
   opacity: 1;
}

label.radio-card input[type='radio']:focus+.card-content-wrapper .check-icon {
   box-shadow: 0 0 0 3px rgb(197, 248, 243);
   border-color: #0068ce;
}

label.radio-card .card-content img {
   margin-bottom: 10px;
}

label.radio-card .card-content h4 {
   font-size: 16px;
   letter-spacing: -0.24px;
   color: #0068ce;
   margin-bottom: 10px;
}

label.radio-card .card-content h5 {
   font-size: 14px;
   line-height: 1.4;
   color: #686d73;
   margin-bottom: 0;
}

.top-plan-change-section-rom {
   width: 100%;
   margin-top: 15px;
}

.top-plan-change-section-rom ul {
   padding: 0;
   margin: 0;
   list-style: none;
   text-align: center;
   font-size: 16px;
   line-height: 20px;
}

.top-plan-change-section-rom ul li {
   display: inline-block;
}

.top-plan-change-section-rom ul li a {
   text-decoration: none;
   background-color: #eeeeee;
   padding: 6px 10px;
   border-radius: 5px;
   text-align: center;
   min-width: 150px;
   display: inline-block;
   color: #000;
   position: relative;
   border: 2px solid #eeeeee;
   margin: 0 -6px;
}

.top-plan-change-section-rom ul li a.active {
   background-color: #0068ce;
   color: white;
   font-weight: 500;
   border: 1px solid #0068ce;
   z-index: 1;
}


/* Feature Section 1 */
.scroll-track {
   display: flex;
   animation: scrollLeft 50s linear infinite;
   width: max-content;
}

.scroll-container {
   overflow: hidden;
   position: relative;
}

.card-box {
   width: 350px;
   height: 450px;
   background: none;
   overflow: hidden;
   position: relative;
   border: none;
   border-radius: 8px;
}

.card-box:hover {
   border-color: #0068ce;
   box-shadow: 0 4px 12px #0068ce;
}

.card-label {
   padding: 10px;
   font-weight: 600;
   font-size: 14px;
   text-decoration: none;
   color: #333;
   background-color: #fff;
}

.card-label:hover {
   color: #0068ce;
}

.image-wrapper {
   position: relative;
   width: 100%;
   height: 100%;
}

.card-img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   display: block;
}

.overlay {
   position: absolute;
   top: 0;
   left: 0;
   height: 100%;
   width: 100%;
   background: rgba(27, 27, 27, 0.5);
}

.card-text {
   position: absolute;
   bottom: 0;
   width: 100%;
   color: #fff;
   padding: 30px 8px;
   text-align: center;
   z-index: 2;
   text-decoration: none;
   cursor: pointer;
   transition: color 0.3s;
}

.card-text:hover {
   color: #0068ce;
}

.card-box:hover .card-img {
   transform: scale(1.05);
}

@keyframes scrollX {
   0% {
      transform: translateX(0);
   }

   100% {
      transform: translateX(-50%);
   }
}

#autoScroll:hover {
   animation-play-state: paused;
}

@keyframes scrollLeft {
   0% {
      transform: translateX(0%);
   }

   100% {
      transform: translateX(-50%);
   }
}

.scroll-container:hover .scroll-track {
   animation-play-state: paused;
}


/* Feature Section 2 */
.bg-color-vertical {
   background-color: #0068ce;
}

.feature-item {
   position: relative;
   padding-left: 16px;
   cursor: pointer;
   border: none;
   border-left: 4px solid transparent;
   transition: background-color 0.3s, border-color 0.3s;
}

.feature-item:hover {
   background-color: rgba(255, 255, 255, 0.1);
}

.feature-item.selected {
   background-color: rgba(255, 255, 255, 0.15);
}

.learn-more-left {
   margin-top: 6px;
}

.learn-more-left a {
   color: #c4cbd4;
   text-decoration: none;
   display: inline-flex;
   align-items: center;
   gap: 6px;
   transition: color 0.3s ease;
}

.learn-more-left a::after {
   content: '→';
   transition: transform 0.3s ease;
}

.learn-more-left a:hover {
   color: #ebe9e9;
}

.learn-more-left a:hover::after {
   transform: translateX(4px);
}

.feature-images {
   display: flex;
   height: 540px;
   opacity: 0;
   transform: translateX(-50px);
   animation: slideIn 0.6s forwards;
   gap: 10px;
   width: 100%;
   margin: 0;
}

.feature-images .left-images {
   flex: 35 0 0;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: 10px;
}

.feature-images .left-images img,
.feature-images .right-image img {
   width: 100%;
   object-fit: cover;
   border-radius: 8px;
}

.feature-images .left-images img {
   height: 50%;
}

.feature-images .right-image {
   flex: 65 0 0;
   display: flex;
}

.feature-images .right-image img {
   height: 100%;
}

.equal-height-row {
   display: flex;
   align-items: stretch;
}

.equal-height-row>[class^="col-"] {
   display: flex;
   flex-direction: column;
}

#leftMenu,
#featureContent {
   height: 100%;
}

.feature-images {
   height: 100%;
}

@keyframes slideIn {
   to {
      opacity: 1;
      transform: translateX(0);
   }
}

/* Apps SSection */
.learn-more-link {
   display: inline-block;
   margin-top: 10px;
   color: #0068ce;
   text-decoration: none;
   font-weight: 500;
   transition: all 0.3s ease;
}

.learn-more-link span {
   display: inline-block;
   transition: transform 0.3s ease;
}

.learn-more-link:hover span {
   transform: translateX(5px);
}

.learn-more-link:hover {
   color: #0351a0;
}

.heading-label {
   display: inline-block;
   border: 1px solid #0068ce;
   padding: 0.3rem 0.8rem;
   border-radius: 0.75rem;
   margin: 0 auto;
}

/* Solutions Section */
.retailife-section {
   padding-left: 40px;
   padding-right: 40px;
}

.image-card {
   position: relative;
   width: 100%;
   overflow: visible;
   transition: all 0.3s ease;
   border-radius: 12px;
}

.image-card img {
   width: 100%;
   height: 300px;
   display: block;
   border-radius: 12px;
}

.image-header {
   position: absolute;
   background-color: #0068ce;
   color: white;
   border-radius: 12px;
   font-size: 14px;
   font-weight: 500;

   cursor: pointer;
   display: flex;

   flex-direction: row;
   align-items: center;
   transition: all 0.4s ease;
   white-space: normal;
   max-width: 90%;
   min-width: 110px;
   gap: 0;
}

.image-header>div {
   width: 100%;
   min-width: unset !important;
}


.image-card.expanded .image-header {
   position: absolute;
   flex-direction: column;
   align-items: flex-start;
   padding: 12px 16px;
   white-space: normal;
   max-width: 260px;
   gap: 10px;
   z-index: 999;
}

.image-header p {
   display: none;
   margin: 0;
   white-space: normal;
}

.image-card.expanded .image-header p {
   display: block;
}

.pos-random-1 {
   top: 0;
   left: 0;
}

.pos-random-2 {
   top: 0;
   right: 0;
}

.pos-random-3 {
   top: 10%;
   left: 10%;
}

.pos-random-4 {
   top: 0;
   right: 10%;
}

.pos-random-5 {
   top: 0;
   right: 0;
}

.pos-random-6 {
   top: 5%;
   left: 5%;
}

/* ----------------- Feature Section ----------------- */
.rlf-feature-section {
   background: #f9f9f9;
}

.rlf-feature-section .row.align-item-center {
   align-items: stretch;
}

.rlf-feature-list {
   height: 500px;
   max-height: 100%;
   overflow-y: auto;
   padding-right: 35px;
}

.rlf-feature-item {
   background: #fff;
   border-radius: 10px;
   padding: 20px;
   margin-bottom: 15px;
   cursor: pointer;
   transition: all 0.3s ease;
}

.rlf-feature-item.active {
   border-left: 3px solid #0068ce;
   background: #eef5ff;
}

.rlf-feature-item ul {
   margin-left: 20px;
   padding-left: 15px;
}

.rlf-feature-item ul li {
   margin-bottom: 6px;
}

.rlf-feature-image-wrapper {
   border-radius: 15px;
   transition: 0.5s ease-in-out;
   height: 100%;
}

.rlf-feature-image-wrapper img {
   border-radius: 15px;
   width: 100%;
   height: 100%;
   object-fit: cover;
}

/* signup section */
.freeTrail {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rbs/retail-free-background.jpg') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailClothingStore {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/clothing-store-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailShoeShop {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/shoe-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailBags {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/bags-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailEyewear {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/eyewear-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailHandicrafts {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/crafts-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailOutdoor {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/outdoor-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailGadget {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/gadget-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailBeauty {
   background: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)),
      url('/images/block/rlf/vertical/beauty-free-trail.webp') no-repeat center center;
   background-size: cover;
   padding: 0 30px;
}

.freeTrailBox {
   max-width: 700px;
   background: rgba(0, 0, 0, 0.6);
   border-radius: 10px;
   padding: 0 30px;
   color: white;
}

.review-card {
   background: white;
   color: black;
   padding: .5rem 2rem;
   border-radius: 8px;
   transition: background 0.3s ease;
   cursor: pointer;
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: 15px;
}


.review-display-box {
   height: 300px;

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

.center-content {
   display: flex;
   flex-direction: column;
}

.review-list {
   display: flex;
   flex-direction: column;
}

.review-card-link {
   text-decoration: none;
   color: inherit;
   display: block;
}

.review-cards {
   display: flex;
   flex-direction: column;
}

@keyframes infiniteScroll {
   0% {
      transform: translateY(0);
   }

   100% {
      transform: translateY(-50%);
   }
}

.platform-icon {
   width: 30px;
   height: 30px;
   object-fit: contain;
   margin-bottom: 4px;
}

.custom-stars {
   color: #037ef8;
   font-size: 18px;
   font-family: Arial, sans-serif;
}

.bg-custom-primary {
   background-color: #003a72 !important;
   color: #fff !important;
}

/* Customer section */
.customer-brand-logo {
   max-width: 120px;
   min-height: 120px;
}


/* FAQ */
.faq-answer {
   display: none;
   transition: all 0.3s ease;
   max-width: 100%;
   font-size: 1rem;
}

.faq-answer.show {
   display: block;
}

.faq-question {
   cursor: pointer;
   padding: 0.5rem 0;
   font-size: 1.05rem;
}

.faq-question span {
   transition: transform 0.3s ease;
}

.faq-question.open span {
   transform: rotate(180deg);
}

.faq-item {
   border-bottom: 1px dashed #ccc;
   padding: 0.5rem 0;
}



/* For Vertical Business-type */
.custom-box-ul {
   list-style: none;
   padding-left: 0;
}

.custom-box-ul li {
   display: flex;
   align-items: flex-start;
   gap: 0.5rem;
   margin-bottom: 1.5rem;
   flex-wrap: wrap;
}

.feature-title {
   font-weight: 500;
   font-size: 1.25rem;
   margin: 0;
   flex: 1 1 auto;
}

.custom-box-ul li p.mb-3 {
   flex-basis: 100%;
   margin-top: 0.3rem;
}

.row.align-items-center {
   align-items: stretch;
}

.col-md-7 {
   display: flex;
   justify-content: center;
   align-items: start;
}

.custom-dot {
   position: relative;
   padding-left: 20px;
   margin-bottom: 10px;
}

.custom-dot::before {
   content: "";
   position: absolute;
   left: 0;
   top: 8px;
   width: 10px;
   height: 10px;
   background-color: #0068ce;
   border-radius: 2px;
}



/* Stories */
.slider-section-new {
   position: relative;
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   min-height: 550px;
   transition: background-image 0.1s ease-in-out;
}

.slider-section-new .overlay {
   position: absolute;
   inset: 0;
   background: rgba(0, 0, 0, 0.6);
   z-index: 1;
}

.slider-section-new .z-index-2 {
   position: relative;
   z-index: 2;
}

.arrow-container .arrow {
   background-color: white;
   color: black;
   font-size: 24px;
   width: 40px;
   height: 40px;
   border-radius: 50%;
   line-height: 36px;
   text-align: center;
   cursor: pointer;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
   transition: background 0.5s;
}

.arrow:hover {
   background: #ddd;
}

.see-all-link {
   font-weight: 500;
   text-decoration: none;
}


.arrow-container {
   display: flex;
   justify-content: center;
   gap: 10px;
   margin-top: 15px;
}

.arrow {
   background-color: white;
   color: black;
   font-size: 24px;
   width: 40px;
   height: 40px;
   border-radius: 50%;
   line-height: 32px;
   text-align: center;
   cursor: pointer;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
   transition: background 0.3s;
}


.arrow-left {
   left: 20px;
}

.arrow-right {
   right: 20px;
}

.arrow:hover {
   background: #ddd;
}

.transition-slide {
   transition: transform 0.5s ease, opacity 0.5s ease;
}

.slide-left {
   transform: translateX(-40px);
   opacity: 0;
}

.slide-right {
   transform: translateX(40px);
   opacity: 0;
}




/* Retailgo Outlets */
.outlet-hero-gradient {
   background: linear-gradient(to right, rgb(47, 101, 172), #788eaa, #619bd1);
}

.bg-light-blue {
   background-color: #eff6ff;
}

.text-blue-100 {
   color: #dbeafe;
}

.text-blue-50 {
   color: #eff6ff;
}

.card-hover:hover {
   transform: translateY(-2px);
   box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
   transition: all 0.3s ease;
}

.icon-large {
   font-size: 3rem;
}

.icon-medium {
   font-size: 2.5rem;
}

.icon-small {
   font-size: 2rem;
}





/* For Apps Section */
/* Business Portal*/

.rlf-apps-portal-bg {
   position: relative;
   background-color: #96a6b3;
   z-index: 1;
}

.rlf-apps-portal-bg .row {
   min-height: 500px;
   align-items: stretch;
}

.rlf-apps-portal-bg .col-md-6 {
   display: flex;
}

.rlf-apps-portal-bg .col-lg-6 {
   display: flex;
   flex-direction: column;
   justify-content: center;
}

.rlf-apps-portal-bg img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.text-retail {
   color: #0068ce !important;
}

.text-retaillife-primary {
   color: #107be6 !important;
}

.bg-retaillife-primary {
   background-color: #0068ce !important;
}

.btn-retaillife-primary {
   background-color: #0068ce;
   border-color: #0068ce;
   color: #fff;
}

.btn-retaillife-primary:hover {
   background-color: #0068ce;
   border-color: #0068ce;
}

.pos-icon.feature-icon {
   font-size: 3rem;
   color: #0068ce;
}

.icon-wrapper-bh {
   width: 70px;
   height: 70px;
   border-radius: 10%;
   background: rgb(221, 221, 221);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
   display: flex;
   justify-content: center;
   align-items: center;
   margin: 0 auto;
}

.icon-wrapper-bh i {
   font-size: 40px;
   line-height: 1;
   padding: 0;
   margin: 0;
   color: #0068ce;
}

.icon-wrapper-bh-2 {
   width: 70px;
   height: 70px;
   border-radius: 10%;
   background: white;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
   display: flex;
   justify-content: center;
   align-items: center;
   flex-shrink: 0;
}

.icon-wrapper-bh-2 i {
   font-size: 32px;
   color: #0068ce;
}

.playstore-rating {
   font-size: 1.5rem !important;
   font-weight: normal;
}

.playstore-stars .fas {
   color: #FFC107;
}

.jumbotron {
   border-radius: 0;
   margin-bottom: 0;
}

.feature-card {
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
   border: none;
   padding: 20px;
   transition: transform 0.3s;
   height: 100%;
}

.feature-card:hover {
   transform: translateY(-5px);
}

.retail-apps svg {
   height: auto;
   width: 20px;
   fill: #ffffff !important;
}

/* BackOffice App */
.bg-gradient-blue-light {
   background: linear-gradient(to bottom, #f0fdf4, #ffffff);
}

.bg-gradient-blue-dark {
   background: linear-gradient(to right, #2d445a, #1b62a5);
}

.text-blue-600 {
   color: #055596;
}

.bg-blue-100 {
   background-color: #dceefc;
}

.text-blue-800 {
   color: #163f65;
}

.bg-blue-500 {
   background-color: #2276c5;
}

.text-blue-200 {
   color: #bbdcf7;
}

.text-blue-100 {
   color: #dce7fc;
}

.text-yellow-400 {
   color: #facc15;
}

.rounded-3xl {
   border-radius: 1.3rem;
}

.shadow-2xl {
   box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.shadow-xl {
   box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.badge-custom {
   padding: .5em .75em;
   font-size: 0.875rem;
   font-weight: 600;
}

.card-feature {
   background-color: rgba(255, 255, 255, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.2);
   color: white;
}

.card-feature .text-green-200 {
   color: #bbf7d0;
}

.main-section svg {
   color: inherit;
   stroke: currentColor;
   fill: white;
}

.last-section svg.lucide-star {
   color: inherit;
   stroke: #0068ce;
   fill: #0068ce;
   width: 16px;
   height: 16px;
}

.card-feature svg.lucide {
   color: #86c0ef;
   stroke: currentColor;
   fill: none;
   width: 36px;
   height: 36px;
}

.real-time-insights .lucide,
.manage-multiple-stores .lucide,
.in-depth-sales-analytics .lucide,
.monitor-active-staff-sessions .lucide,
.product-catalog-updates .lucide,
.order-history-access .lucide,
.generate-export-reports .lucide,
.manage-promotions-offers .lucide,
.customize-your-brand .lucide {
   color: inherit;
   stroke: #0068ce;
   fill: none;
   width: 36px;
   height: 36px;
}


/* POS page */
.bg-restrogreen-primary {
   background-color: #00897b !important;
}

.text-retailgo-primary {
   color: #003a72 !important;
}

:root {
   --primary-violet: #7C3AED;
   --primary-violet-dark: #5B21B6;
   --accent-emerald: #10B981;
   --neutral-slate: #64748B;
   --neutral-light: #F8FAFC;
   --text-dark: #1E293B;
}

.pos-feature-card {
   background: white;
   border-radius: 16px;
   padding: 40px 30px;
   box-shadow: 0 10px 40px rgba(124, 58, 237, 0.1);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
   height: 100%;
}

.pos-feature-card:hover {
   transform: translateY(-8px);
   box-shadow: 0 20px 60px rgba(124, 58, 237, 0.15);
}

.pos-feature-icon {
   width: 80px;
   height: 80px;
   background: linear-gradient(135deg, var(--primary-violet), var(--accent-emerald));
   border-radius: 20px;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 24px;
   font-size: 32px;
   color: white;
}

.btn-primary-custom {
   background: var(--primary-violet);
   border: none;
   padding: 16px 32px;
   border-radius: 12px;
   font-weight: 600;
   font-size: 18px;
   transition: all 0.3s ease;
}

.btn-primary-custom:hover {
   background: var(--primary-violet-dark);
   transform: translateY(-2px);
   box-shadow: 0 8px 25px rgba(124, 58, 237, 0.3);
}

.pos-section-bg-light {
   background-color: var(--neutral-light);
}

.pos-feature-image {
   border-radius: 16px;
   box-shadow: 0 15px 50px rgba(0, 0, 0, 0.1);
   max-width: 100%;
   height: auto;
   object-fit: cover;
}

/* ========== Large (992px – 1023px) ========== */
@media (min-width: 992px) and (max-width: 1023px) {
   .card-box {
      width: 280px;
      height: 380px;
   }
}

/* ========== Large to XL (1024px – 1439px) ========== */
@media (min-width: 1024px) and (max-width: 1439px) {
   .card-box {
      width: 300px;
      height: 400px;
   }
}

/* ========== XL (1440px – 1919px) ========== */
@media (min-width: 1440px) and (max-width: 1919px) {
   .card-box {
      width: 320px;
      height: 420px;
   }
}

/* ========== XXL (1920px – 2560px) ========== */
@media (min-width: 1920px) and (max-width: 2560px) {
   .card-box {
      width: 320px;
      height: 420px;
   }
}

@media (min-width: 769px) and (max-width: 991px) {
   .card-box {
      width: 250px;
      height: 350px;
   }
}

@media (max-width: 768px) {
   .pos-feature-card {
      padding: 30px 20px;
      margin-bottom: 30px;
   }

   .pos-feature-image {
      height: 250px;
      margin-bottom: 30px;
   }

   .card-box {
      width: 250px;
      height: 350px;
   }

   .hero-content-product-wrapper {
      padding-top: 100px;
      padding-bottom: 100px;
   }

   .rlf-feature-section .row.align-items-center {
      flex-direction: column;
   }

   .rlf-feature-image-wrapper {
      width: 100%;
      height: auto;
      margin-bottom: 20px;
   }

   .rlf-feature-list {
      width: 100%;
      max-height: 400px;
   }
}

@media (max-width: 576px) {
   .faq-answer {
      max-width: 100%;
   }

   .pos-feature-card {
      padding: 25px 15px;
   }

   .hero-content-product-wrapper {
      padding-top: 50px;
      padding-bottom: 50px;
   }

   .card-box {
      width: 200px;
      height: 300px;
   }
}

@media (min-width: 768px) {
   .faq-answer {
      max-width: 700px;
      font-size: 1rem;
   }
}

@media (min-width: 1200px) {
   .faq-answer {
      max-width: 800px;
      font-size: 1.05rem;
   }
}


.playstore-rating {
   font-size: 2.5rem;
   font-weight: bold;
}

.playstore-stars .fas {
   color: #FFC107;
}

.jumbotron {
   border-radius: 0;
   margin-bottom: 0;
}

.feature-card {
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
   border: none;
   padding: 20px;
   transition: transform 0.3s;
   height: 100%;
}

.feature-card:hover {
   transform: translateY(-5px);
}


@media (max-width: 767.98px) {
   .jumbotron h1 {
      font-size: 2.5rem;
   }

   .jumbotron p.lead {
      font-size: 1.1rem;
   }

   .pos-icon.feature-icon {
      font-size: 2.5rem;
   }

   .playstore-rating {
      font-size: 2rem;
   }
}


.hover-lift {
   transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
   transform: translateY(-10px);
   box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}




/* Solutions */
.icon-wrapper-sol {
   transform: rotate(180deg);
   display: inline-block;
}

.bp-hero-section-a {
   background: linear-gradient(to right, #0159ac, #42729e);
   color: #f8f9fa;
}

.bp-hero-section-b {
   background: linear-gradient(to right, #42729e, #0159ac);
   color: #f8f9fa;
}

.sales-trend-card {
   background: #fff;
   border-top: 3px solid rgb(187, 215, 245);
   border-radius: 0;
   box-shadow: none;
}

.beauty-trend-card {
   background: #f8f9fa;
   border-top: 3px solid rgb(187, 215, 245);
   border-radius: 0;
   box-shadow: none;
}