:root {
  --primary-color: #3B4FA2;
  --secondary-color: #d4ac0d;
  --black-color: #292929;
  --light-black-color: #343536;
  --dark-color: #000000;
  --body-color: #5A5A5A;
  --gray-color: #777F81;
  --light-color: #e9e4d1;
  --white-color: #ffffff;
  --dark-orange-color:#ee9219;
  --title-color:#2F3F82;
  --success: #0abb75;
  --soft-success: rgba(10, 187, 117, 0.15);
  --info: #25bcf1;
  --soft-info: rgba(37, 188, 241, 0.15);
	--warning: #ffc519;
	--soft-warning: rgba(255, 197, 25, 0.15);
	--danger: #ef486a;
	--soft-danger: rgba(239, 72, 106, 0.15);
	

  /* Bootstrap Theme Color  */
  --bs-gray-100: #F6F6F6;
  --bs-gray-300: #DCDCDC;
  --bs-primary-text-emphasis: var(--primary-color);
  --bs-body-color-rgb: 90, 90, 90;
  --bs-light-rgb: rgba(255, 255, 255, 1);
  --bs-dark-rgb: 41, 41, 41;
  --bs-primary-rgb: 178, 142, 113;
  --text-color:#000;
}


/* Custom styles to override or complement Bootstrap */
body {
    font-family: "Roboto", sans-serif;
    color: #fff;
    line-height: 1.6;
}

/* Header Styles */

/* CSS for the header wrapper */
/* Hero Section Styles */
.hero-section {
    position: relative;
    height: 100vh;
    background: url('../banner/metal-background.gif') no-repeat center center/cover;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px;
}

.header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 23px 30px; /* Increased padding for better spacing */
    background: rgba(255, 255, 255, 0.9);
    border-radius: 10px;
    width: 90%; /* Increased width */
    max-width: 1200px; /* Optional: prevents it from becoming too wide on large screens */
    margin: 0 auto;
}

.logo {
    display: flex;
    align-items: center;
}

.logo-img {
   width: 177px;

    height: auto;
    margin-right: 10px;
}

.logo-text {
    font-size: 14px;
    line-height: 1.2;
}

.logo-text .highlight {
    color: #0078d4;
    font-weight: bold;
}

.nav-menu {
    display: flex;
    gap: 40px;
}

.nav-menu a {
    text-decoration: none;
	font-size: 14px;
    color: #000000;
    font-weight: 500;
}

.nav-menu .search-icon {
    color: #0078d4;
    font-size: 18px;
}

.search-bar {
	background:var(--white-color);
    border: 1px solid #E9E9E9;
    border-radius: 8px;
    padding: 0px 8px 20px;
    display: none;
    align-items: center;
    position: absolute;
    top: 84px;
    right: 190px;
    z-index: 10;
    width: 356px;
    height: 108px;
    border: 1px solid #E9E9E9;
	transition: top 0.4s ease;
}

.search-bar input {
    flex-grow: 1;
    margin-right: 10px;
    margin-top: -22px;
    border: 1px solid #E9E9E9;
    padding: 8px 12px 8px 28px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 400;
    color: #4D4D4D;
	outline:none;
}

.search-bar input:focus{
	border: 1px solid #E9E9E9;
	box-shadow:unset;
}

.close-search {
    cursor: pointer;
    margin-top: -26px;
}

.serach-link{
	position: absolute;
    top: 26px;
    left: 19px;
}

.hero-text {
    text-align: center;
    padding: 50px;
}

.hero-text h1 {
    font-size: 46px;
    font-weight: 700;
    margin-bottom: 20px;
}

.hero-text p {
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 30px;
}

.buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
}



.sell-btn {
    background-color: var(--primary-color);
    color: var(--white-color);
}

.sell-btn:hover{
	background-color: var(--primary-color);
	color: var(--white-color);
}

.buy-btn {
    background-color: transparent;
    color: var(--white-color);
    border: 1px solid var(--white-color);
}
.buy-btn:hover{
	border: 1px solid var(--white-color);
	color: var(--white-color);
}
/* Mobile Responsiveness */
.nav-toggle {
    display: none;
    cursor: pointer;
    font-size: 24px;
    color: #333;
}
/* Ensure text is readable over the background */
.hero-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.hero-text, .header-content {
    position: relative;
    z-index: 2;
}

.hero-text{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  
}

.section-title{
	text-align:center;
}

.section-title h2{
	font-size: 32px;
    font-weight: 700;
    color: var(--title-color);
}

/* Stats Section Styles */
.stats-section {
    background: #f8f9fa; /* Light gray background */
    padding: 40px 0;
    position: relative;
    overflow: hidden;
}

.stats-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('../bg/stats-ov.jpg') repeat;
    opacity: 0.1;
    z-index: 0;
}

.stats-section .container {
    position: relative;
    z-index: 1;
}

.stats-section .stats-itembox{
	display: flex;
	justify-content: center;
    gap: 20px;
	padding: 16px 0;
}

.stat-circle {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--primary-color);
    color: #fff;
    border-radius: 50%;
    width: 65px;
    height: 65px;
    justify-content: center;
}

.stat-circle img{
	width: 32px;
    height: 32px;
}

.stats-content h2{
	font-size: 32px;
    font-weight: 700;
    color: var(--dark-color);
    margin-bottom: 0px;
}

.stats-content p{
	font-size: 16px;
    font-weight: 500;
    color: var(--dark-color);
    margin-bottom: 0px;
}


/* Value Proposition & Introduction Section Styles */
.value-section {
    background: var(--primary-color);
    padding: 70px 0;
    position: relative;
	overflow: hidden;
}

/*.value-section h2 {
    font-size: 32px;
    font-weight: 700;
    display: inline-block;
    margin-bottom: 40px;
	position: relative;
}
*/

.value-section h2::after {
    background: url(../heading-img/heading-design.svg) !important;
    background-repeat: no-repeat !important;
    background-size: 100% auto !important;
}

.value-item {
    padding: 20px;
}

.value-section .value-img{
	margin-bottom:15px;
}

.value-section .value-img img{
	width:80px;
	height:80px;
}

.border-right{
	border-right: 1px solid #E9E9E9;
}

.icon-circle {
    background: #fff;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.icon-circle img{
    width:33px;
	height:33px;
}

.value-item h3 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 8px;
}

.value-item p {
    font-size: 16px;
	font-weight: 400;
    max-width: 300px;
    margin: 0 auto;
	line-height: 20px;
	color:#fff;
}

/* Decorative Circles */
.circle-decor-left,
.circle-decor-right {
    position: absolute;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
}

.circle-decor-left {
    width: 200px;
    height: 200px;
    top: -100px;
    left: -100px;
}

.circle-decor-right {
    width: 150px;
    height: 150px;
    bottom: -75px;
    right: -75px;
}
/* Waste Section Styles */
.waste-section {
    background: #fff;
    padding: 70px 0;
    color: #1e3a8a;
}

/*.waste-section h2 {
    font-size: 32px;
    font-weight: 700;
    color: var(--title-color);
    position: relative;
    display: inline-block;
    margin-bottom: 60px;
}

.waste-section h2::after {
    content: "";
    width: 100%;
    height: 100%;
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    position: absolute;
    bottom: -45px;
    left: 108px;
}*/

.waste-card {
    background: #fff;
    border-bottom: 2px solid #3B4FA2;
    border-radius: 8px;
    padding: 14px;
    transition: transform 0.3s ease;
    box-shadow: 0px 2px 12px 0px #0000001F;
	height:100%;
}

.waste-card .waste-topcontent{
	display: flex;
    align-items: center;
	gap:10px;
	margin-bottom:10px;
}

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

.waste-card .waste-img img{
	width:40px;
	height:40px;
}

.waste-card .icon-circle {
	width: 40px;
    height: 40px;
    background: var(--primary-color);
    margin:0;
}

.waste-card .icon-circle img{
	width: 23px;
    height: 23px;
}

.waste-card .icon-circle i {
    color: #fff;
}

.waste-card h3 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 0;
}

.waste-card p {
    font-size: 16px;
	font-weight: 400;
    color: #4D4D4D;
	margin-bottom: 0;
	line-height:18px;
}
/* Hidden Cost Section Styles */
.hidden-cost-section {
    background: #F5F6FB;
    padding: 70px 0;
    color: #1e3a8a;
}

.heading-inline h2 {
    font-size: 32px;
    font-weight: 700;
    position: relative;
    display: inline-block;
    margin-bottom: 80px;
}

.heading-inline h2::after {
    content: "";
    width: 100%;
   
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    position: absolute;
       height: 20px;
    background-size: 100% auto;
    bottom: -25px;
    left: 0;
}

.cost-card {
    background: var(--white-color);
    border: 1px solid #E9E9E9;
    border-top-left-radius: 40px;
    border-bottom-right-radius: 40px;
    padding: 16px;
    box-shadow: 0px 2px 12px 0px #0000001F;
    transition: transform 0.3s ease;
    position: relative;
	height: 100%;
}

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

.cost-card .number-circle {
    background: var(--white-color);
    color: var(--dark-color);
    border-radius: 40px;
    width: 93px;
    height: 63px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 700;
    margin: 0 auto 20px;
	position: absolute;
    top: 0px;
    left: 50%;
    transform: translate(-50%, -50%);
	box-shadow: 0px 2px 12px 0px #00000029;
}

.cost-card p {
    font-size: 16px;
    color: var(--dark-color);
    max-width: 332px;
    margin: 0 auto;
    padding-top: 28px;
    line-height: 24px;
}
/* Benefits Section Styles */
.benefits-section {
    background: var(--white-color);
    padding: 70px 0;
    color: #1e3a8a;
}

/*.benefits-section h2 {
    font-size: 32px;
    font-weight: 700;
    position: relative;
    display: inline-block;
    margin-bottom: 60px;
}

.benefits-section h2::after {
    content: "";
    width: 300px;
    height: 100%;
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    bottom: -30px;
    left: -60px;
}*/


.benefit-card {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    transition: transform 0.3s ease;
}

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

.benefit-card .icon-square{
	background: var(--primary-color);
    border-radius: 8px;
    width: 74px;
    height: 74px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.benefit-card .icon-square img{
	width:40px;
	height:40px;
}

.icon-square {
    background: #1e3a8a;
    border-radius: 10px;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

.icon-square i {
    font-size: 24px;
    color: #fff;
}

.benefit-card h3 {
    font-size: 18px;
    font-weight: 600;
    color: var(--primary-color);
    margin-bottom: 8px;
}

.benefit-card p {
    font-size: 16px;
    font-weight: 400;
    color: var(--dark-color);
    line-height:18px;
    max-width: 300px;
    margin: 0 auto;
}
/* How TrueAngle Works Section Styles */
.how-it-works-section {
    background: #F5F6FB;
    padding: 70px 0;
    position: relative;
}

/*.how-it-works-section h2 {
    font-size: 32px;
    font-weight: 700;
    position: relative;
    display: inline-block;
    margin-bottom: 60px;
}

.how-it-works-section h2::after {
    content: "";
    width: 500px;
    height: 100%;
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    position: absolute;
    bottom: -45px;
    left: -25px;
}*/

.workflow {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 40px;
}

.workflow .nav-tabs{
	border: 1px solid var(--primary-color);
    border-radius: 12px;
    width: 600px;
    height: 60px;
    overflow: hidden;
	justify-content: space-between;
}

.workflow .nav-tabs .nav-item .nav-link{
	font-size:24px;
	font-weight:700;
	color: var(--dark-color);
	padding: 10px 93px;
    background: transparent;
}

.workflow .nav-tabs .nav-item:nth-child(1) .nav-link.active{
	background: #D8DCEC;
	color:var(--primary-color);
	border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
	border-right:1px solid var(--primary-color); 
}

.workflow .nav-tabs .nav-item:nth-child(2) .nav-link.active {
	background: #D8DCEC;
	color:var(--primary-color);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
	border-left:1px solid var(--primary-color); 
}

.workflow .tabs .nav-link.active {
    background: #5a61af;
    color: white;
}

.workflow-step {
    padding: 10px 20px;
    border-radius: 10px;
    font-weight: bold;
    color: #fff;
}

.workflow-step.seller {
    background: #c3d4f0;
    color: #1e3a8a;
}

.workflow-step.buyer {
    background: #1e3a8a;
    color: #fff;
}

.step-card {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
    position: relative;
}

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

.number-circle {
    background: #1e3a8a;
    color: #fff;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: bold;
    margin: 0 auto 20px;
}

.step-card h3 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 10px;
}

.step-card p {
    font-size: 16px;
    color: var(--dark-color);
    max-width: 250px;
    margin: 0 auto;
	padding-top: 28px;
}

/* Workflow Lines */
.workflow-line {
    position: absolute;
    height: 2px;
    background: #1e3a8a;
    z-index: -1;
}

.workflow-line.dashed {
    background: repeating-linear-gradient(
        90deg,
        #1e3a8a 0,
        #1e3a8a 10px,
        transparent 10px,
        transparent 20px
    );
}

.how-it-works-section .steps__container{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.how-it-works-section .steps__container .steps-item__box{
	position:relative;
}

.steps__container .steps-item__box:first-child::after{
	content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 22px;
    left: 300px;
    background: url(../icons/work-line-1.svg);
    background-repeat: no-repeat;
}

.steps__container .steps-item__box:last-child::before{
	content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 42px;
    left: -125px;
    background: url(../icons/work-line-2.svg);
    background-repeat: no-repeat;
}

.how-it-works-section .steps-item__box .number-circle{
	width: 60px;
    height: 60px;
    background: linear-gradient(259.43deg, #FBFBFD 77.37%, #EBEDF6 110.76%);
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    border-bottom-right-radius: 16px;
    padding: 16px;
	font-size: 24px;
    font-weight: 700;
    color: var(--dark-color);
}

.how-it-works-section .steps-item__box .icon-circle{
	width: 100px;
    height: 100px;
    border-radius: 50px;
    padding: 24px;
    background: var(--white-color);
    border: 4px solid var(--primary-color);
}

.how-it-works-section .steps-item__box .icon-circle img{
	width: 52px;
    height: 52px;
}

.how-it-works-section .steps-item__box .content h4{
	font-size: 16px;
    font-weight: 700;
    color: var(--dark-color);
}

.how-it-works-section .steps-item__box .content p{
	font-size: 14px;
    font-weight: 400;
    color: #4D4D4D;
	width: 271px;
    margin: 0 auto;
	line-height: 18px;
}

/* Trust Section Styles */
.trust-section {
    background:var(--white-color);
    padding: 70px 0;
}

/*.trust-section h2 {
    font-size: 32px;
    font-weight: 700;
    position: relative;
    display: inline-block;
    margin-bottom: 60px;
}

.trust-section h2::after {
    content: "";
    width: 100%;
    height: 100%;
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    position: absolute;
    bottom: -45px;
    left: 55px;
}*/

.trust-card {
    
    /*background: var(--white-color);
    border-radius: 8px;
    padding: 16px;
    transition: transform 0.3s ease;
    box-shadow: 0px 4px 16px 0px #00000029;
	height: 239px;
	*/
	background: var(--white-color);
    border-radius: 8px;
    padding: 16px;
    transition: transform 0.3s ease;
    box-shadow: 0px 4px 16px 0px #00000029;
    flex: 1 1 calc(33.333% - 16px); /* Each card takes up 1/3rd of the space, minus the gap */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Aligns content inside the card */
    min-height: 239px; /* Minimum height to ensure consistent size */
    height: auto; /* Allow card to expand with content */
}

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

.trust-card .trust-img{
	margin-bottom:15px;
}

.trust-card .trust-img img{
	width:92px;
	height:92px;
}

.trust-card .icon-circle {
    background: var(--white-color);
    border-radius: 69px;
    padding: 16px;
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    box-shadow: 0px 2px 6px 0px #00000029;
}

.trust-card .icon-circle img{
	width: 40px;
    height: 40px;
}

.trust-card h3 {
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-color);
    margin-bottom: 6px;
}

.trust-card p {
    font-size: 16px;
    font-weight: 400;
    color: var(--dark-color);
    margin-bottom: 10px;
	line-height: 19px;
}

.learn-more {
    text-decoration: underline;
    font-size: 14px;
    font-weight: 400;
    color: var(--primary-color);
    margin-top: auto;
    margin-bottom:5px;
}

.learn-more:hover {
    text-decoration: underline;
}

/* Testimonials Section Styles */
.testimonials-section {
    background: #F5F6FB;
    padding: 70px 0;
	border-bottom-right-radius: 100px;
}

/*.testimonials-section h2 {
    font-size: 32px;
    font-weight: 700;
    position: relative;
    display: inline-block;
    margin-bottom: 60px;
}

.testimonials-section h2::after {
    content: "";
    width: 500px;
    height: 100%;
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    position: absolute;
    bottom: -45px;
    left: -90px;
}*/

.testimonial-card {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0px 2px 8px 0px #0000001F;
    position: relative;
    overflow: hidden;
    color: #333;
    transition: transform 0.3s ease;
}

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

.testimonial-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 30px;
    width: 100%;
    height: 100px;
    background: url(../icons/test-bg_1.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 100% 110%;
    z-index: 0;
}

.testimonial-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: -25px;
    width: 100%;
    height: 100px;
    background: url(../icons/test-bg_2.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 100% 100%;
    z-index: 0;
}

.testimonial-card .testimonial-img__box{
	width: 100px;
    height: 105px;
    background-color: #2f4f6f;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: absolute;
    top: 36px;
    left: 160px;
    z-index: 1;
}

.testimonial-card .testimonial-img {
    width: 95px !important;
    height: 98px;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

.testimonial-card .testimonial-content{
	padding-top: 125px;
}

.testimonial-card h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
}

.testimonial-card .title {
    font-size: 16px;
    color: #666666;
    margin-bottom: 0px;
    line-height: 10px;
}

.testimonial-card .rating {
    font-size: 18px;
    color: #ff9800;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
}

.testimonial-card .testimonial-text {
    font-size: 16px;
    color: #4D4D4D;
    font-weight: 400;
	line-height: 20px;
}

/* Pricing Section Styles */
.pricing-section {
    padding: 70px 0;
}

/*.pricing-section h2 {
    font-size: 32px;
    font-weight: 700;
	color:var(--primary-color);
    position: relative;
    display: inline-block;
    margin-bottom: 50px;
}

.pricing-section h2::after {
    content: "";
    width: 500px;
    height: 100%;
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    position: absolute;
    bottom: -45px;
    left: 0px;
}*/

.offer-badge img{
    width:100%;
	max-width:100%;
}

.offer-badge .offer-percentage {
    font-size: 36px;
    font-weight: bold;
    display: block;
    margin-bottom: 10px;
}

.offer-badge .offer-text {
    font-size: 18px;
    display: block;
}

.offer-badge::before {
    content: '';
    position: absolute;
    top: -10px;
    left: -10px;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #1e3a8a;
}

.offer-badge::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="40" fill="none" stroke="%231e3a8a" stroke-width="5"/></svg>') no-repeat;
    background-size: 80px;
    background-position: center;
    opacity: 0.2;
    z-index: -1;
}

.pricing-card .formula{
    font-size: 18px;
    color: var(--white-color);
    margin-bottom: 15px;
    background: linear-gradient(109.46deg, #3B4FA2 2.76%, #161D3C 96.14%);
    width: 100%;
    border-radius: 8px;
    padding: 12px 16px; 
	text-align:center;
}


.pricing-card .formula span{
    display: block;
    font-size: 20px;
    font-weight: 700;
    color: var(--white-color);
    line-height: 30px;
}

.pricing-card .example {
    font-size: 16px;
    color: var(--dark-color);
    font-weight: 700;
    margin-bottom: 8px;
}

.pricing-card ul{
	padding-left: 0;
    list-style: none;
    display: flex;
    gap: 10px;
}

.pricing-card ul li{
	font-size: 14px;
    font-weight: 500;
    color: #4D4D4D;
    border: 1px solid #B3B3B3;
    padding: 6px 12px;
    border-radius: 50px;
}
/* CTA Section Styles */
.cta-section {
    padding: 70px 0;
   /* position: relative; */
    overflow: hidden;
	background: linear-gradient(110.41deg, rgba(59, 79, 162, 0.8) 20.34%, rgba(30, 40, 81, 0.8) 80.3%);
	border-top-left-radius: 100px;
    border-bottom-right-radius: 100px;
}

.cta-section::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../bg/stats-ov.jpg) no-repeat;
    opacity: 0.1;
    z-index: 0;
}

.cta-section h2 {
    font-size: 32px;
    font-weight: 700;
	color:var(--white-color);
    position: relative;
    display: inline-block;
    margin-bottom: 40px;
}

.cta-section h2::after {
    content: "";
    width: 100%;
    height: 100%;
    background: url(../heading-img/heading-design.svg);
    background-repeat: no-repeat;
    position: absolute;
    bottom: -45px;
    left: 90px;
}

.cta-section p {
    font-size: 20px;
    font-weight: 400px;
	max-width: 900px;
    line-height: 34px;
    margin: 0 auto 30px;
	color:#fff;
}

.cta-section .btn-outline-light {
    border-radius: 32px;
    padding: 12px 16px;
    font-weight: bold;
    background: var(--white-color);
    color: var(--primary-color);
}

.btn-explore{
	background: transparent;
	border-color: var(--white-color);
}

.btn-explore:hover{
	background: transparent;
	border-color: var(--white-color);
}

/* FAQ Section Styles */
.faq-section {
    padding: 70px 0;
}

.faq-section h1 {
    font-size: 32px;
    font-weight: 700;
	color:var(--primary-color);
    position: relative;
    display: inline-block;
    margin-bottom: 40px;
}

.faq-section h1::after {
    content: "";
    width: 500px;
    height: 100%;
    background: url(../heading-img/heading-line.svg);
    background-repeat: no-repeat;
    position: absolute;
    bottom: -45px;
    left: -145px;
} 

.faq-container {
    padding: 20px;
    display: flex;
    position: relative;
}

.accordion {
    width: 54%;
	background-color: var(--white-color);
    border: 1px solid #E9E9E9;
    box-shadow: 0px 2px 8px 0px #00000029;
    border-radius: 12px
}

.accordion-button:focus {
    box-shadow: none;
}

.accordion-item {
    border-radius: 0px;
    overflow: hidden;
    border: none;               
}

.accordion-button{
	background-color: var(--white-color);
	font-size: 16px;
    color: #000;
    font-weight: 400;
    padding: 24px 16px 24px 48px;
    border-radius: 0px;
    transition: background-color 0.3s;
    border-bottom: 1px solid #E9E9E9;
}

.circle-indicator {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: #8995C7;
    transition: background-color 0.3s;
    cursor: pointer;
}

.accordion-button:not(.collapsed) .circle-indicator {
    background-color: var(--primary-color);
}

.accordion-button:not(.collapsed) {
    background-color: #F3F4FA;
    color: #000;
}

.faq-content{
	background-color: #F3F4FA;
    border-radius: 12px;
    padding: 74px 24px 90px 30px;
    width: 46%;
    display: none;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1;
	box-shadow: 0px 0px 4px 1px #00000026;
}
        
.accordion-collapse.show + .faq-content {
    display: block;
}

.accordion-header .accordion-button:not(.collapsed)::after {
    background-image: url('../icons/akar-icons_chevron-right.svg');
    transform: none;
}
.accordion-header .accordion-button::after {
	background-image: url('../icons/akar-icons_chevron-right.svg');
    transform: none;
}

/* Footer Styles */
.footer {
   background: linear-gradient(109.46deg, #3B4FA2 2.76%, #161D3C 96.14%);
   color: #fff;
   padding: 50px 0 20px;
   border-top: 1px solid #E0E0E0;
}

.footer-logo {
    width: 261px;
    height: auto;
}

.footer h5 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 15px;
}

.footer ul {
    padding-left: 0;
}

.footer ul li {
    margin-bottom: 6px;
}

.footer ul li a {
	font-size: 14px;
    font-weight: 400;
    color: var(--white-color);
    text-decoration: none;
}

.footer ul li a:hover {
    text-decoration: underline;
}

.footer p {
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
	color:#fff;
}

.footer .bi {
    margin-right: 5px;
}

.footer .input-group .form-control {
    background: transparent;
    border-bottom: 1px solid #E0E0E0;
    border-bottom-left-radius: 0;
	border-top: none;
    border-left: none;
	border-right: none;
	font-size:14px;
	font-weight:400;
	color:#E0E0E0;
}

.footer .input-group .form-control:focus{
    box-shadow:unset;
    border-color:none;
}

.footer .input-group .form-control::placeholder{
	font-size:14px;
	font-weight:400;
	color:#E0E0E0;
}

.footer .input-group .btn {
    border-radius: 0 5px 5px 0;
    padding: 8px 15px;
}

.footer hr {
    border-top: 1px solid #fff;
}

.footer .social-icons a {
    color: #fff;
    font-size: 20px;
    margin: 0 10px;
}

.footer .social-icons a:hover {
    color: #007BFF;
}

.footer-bottom a{
	font-size: 16px;
    font-weight: 400;
    color: var(--white-color);
}

.btn-send{
	background: transparent;
    border: none;
    position: absolute;
    right: 0;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
  
    .search-bar{
       
        width: 100%; /* Ensure the box takes up the full width on mobile */
        max-width: 320px; /* Optional: Set a maximum width for mobile to prevent it from being too large */
        top: 60px; /* Adjust top position for mobile view */
        right: 16px; /* Adjust right positioning to have some space from the edge */
        padding: 10px 16px; /* Adjust padding for better mobile spacing */
      
    
    }
    .serach-link {
    position: absolute;
    top: 38px;
    left: 25px;
}
	.heading-inline h2::after {
        bottom: -15px; 
        height: 15px; 
        background-size: contain; 
    }
	.steps__container .steps-item__box:first-child::after {
		display:none;
	}
	.steps__container .steps-item__box:last-child::before {
		display:none;
	}
	.workflow .nav-tabs {
   
    width: 100%;
  
}
	.workflow .nav-tabs .nav-item .nav-link {
   
    padding: 10px 27px;
   
}

	.header-content {
        width: 95%; /* Slightly smaller width for mobile to avoid edge issues */
        padding: 10px 20px;
    }
  .nav-toggle {
        display: block;
    }

    .nav-menu {
        display: none;
        position: absolute;
        top: 70px;
        right: 20px;
        background: rgba(255, 255, 255, 1);
        border-radius: 5px;
        padding: 10px;
        flex-direction: column;
        gap: 10px;
        width: 150px;
    }

    .nav-menu.active {
        display: flex;
    }

    .nav-menu a {
        color: #333;
        padding: 5px 10px;
    }

    .hero-text h1 {
        font-size: 36px;
    }

    .hero-text p {
        font-size: 16px;
    }

    .buttons {
        flex-direction: column;
        gap: 10px;
    }

    .btn {
        width: 200px;
        text-align: center;
    }

    .d-flex.gap-3 {
        flex-direction: column;
    }
	.stats-section .row {
      /*  flex-direction: column;*/
        gap: 1px;
    }
    .stats-section .stats-itembox {
   
    gap: 5px;
   
}
.stats-content h2{
	font-size: 24px;
   
}

.stats-content p{
	font-size: 14px;
   
}

    .stat-circle {
        width: 70px;
        height: 70px;
    }

    .stat-circle i {
        font-size: 25px;
    }
    

    .stat-circle h2 {
        font-size: 20px;
    }

    .stat-circle p {
        font-size: 12px;
    }
	
	.value-section h2 {
        font-size: 28px;
    }

    .value-item h3 {
        font-size: 20px;
    }

    .value-item p {
        font-size: 14px;
    }

    .icon-circle {
        width: 50px;
        height: 50px;
    }

    .icon-circle i {
        font-size: 20px;
    }

    .circle-decor-left,
    .circle-decor-right {
        display: none; /* Hide decorative circles on smaller screens */
    }
	.waste-section h2 {
        font-size: 28px;
    }

    .waste-card h3 {
        font-size: 18px;
    }

    .waste-card p {
        font-size: 12px;
    }

    .waste-card .icon-circle {
        width: 40px;
        height: 40px;
    }

    .waste-card .icon-circle i {
        font-size: 18px;
    }.waste-section h2 {
        font-size: 28px;
    }

    .waste-card h3 {
        font-size: 18px;
    }

    .waste-card p {
        font-size: 12px;
    }

    .waste-card .icon-circle {
        width: 40px;
        height: 40px;
    }

    .waste-card .icon-circle i {
        font-size: 18px;
    }
	.hidden-cost-section h2 {
        font-size: 28px;
    }

    .cost-card p {
        font-size: 14px;
    }

    .number-circle {
        width: 50px;
        height: 50px;
        font-size: 20px;
    }
	.benefits-section h2 {
        font-size: 28px;
    }

    .benefit-card h3 {
        font-size: 18px;
    }

    .benefit-card p {
        font-size: 14px;
    }

    .icon-square {
        width: 50px;
        height: 50px;
    }

    .icon-square i {
        font-size: 20px;
    }
	.how-it-works-section h2 {
        font-size: 28px;
    }

    .step-card h3 {
        font-size: 18px;
    }

    .step-card p {
        font-size: 14px;
    }

    .number-circle {
        width: 50px;
        height: 50px;
        font-size: 20px;
    }

    .workflow {
        flex-direction: column;
        align-items: center;
        gap: 10px;
    }

    .workflow-step {
        width: 100%;
        text-align: center;
    }
    .trust-card {
        flex: 1 1 calc(100% - 16px); /* Cards take full width on mobile */
        padding: 12px;
        min-height: 200px; /* Adjust minimum height for mobile */
    }
	.trust-section h2 {
        font-size: 28px;
    }

    .trust-card h3 {
        font-size: 18px;
    }

    .trust-card p {
        font-size: 14px;
    }

    .trust-card .icon-circle {
        width: 50px;
        height: 50px;
    }

    .trust-card .icon-circle i {
        font-size: 20px;
    }
	.testimonials-section h2 {
        font-size: 28px;
    }

    .testimonial-card h3 {
        font-size: 18px;
    }

    .testimonial-card .title {
        font-size: 14px;
    }

    .testimonial-card .rating {
        font-size: 16px;
    }

    .testimonial-card .testimonial-text {
        font-size: 12px;
    }

    .testimonial-card .testimonial-img {
        width: 60px;
        height: auto;
    }
	.pricing-section h2 {
        font-size: 28px;
    }

    .offer-badge .offer-percentage {
        font-size: 28px;
    }

    .offer-badge .offer-text {
        font-size: 16px;
    }

    .pricing-card .formula {
        font-size: 16px;
    }

    .pricing-card .example {
        font-size: 14px;
    }
	.cta-section h2 {
        font-size: 28px;
    }

    .cta-section p {
        font-size: 16px;
    }

    .d-flex.gap-3 {
        flex-direction: column;
    }

    .btn-lg {
        width: 100%;
        text-align: center;
    }
    .faq-content{
	background-color: #F3F4FA;
    border-radius: 0px;
    padding: 10px 10px 10px 10px;
    width: 100%;
    display: none;
    position: relative;
    right: 0px;
    top: 0%;
    transform: none;
    z-index: 1;
	box-shadow: 0px 0px 4px 1px #00000026;
}
	.faq-section h3 {
        font-size: 28px;
    }
    .circle-indicator {display:none;}
.accordion {
    width:100%;
	background-color: var(--white-color);
    border: 1px solid #E9E9E9;
    box-shadow: 0px 2px 8px 0px #00000029;
    border-radius: 12px
}
    .accordion-button {
        font-size: 16px;
        padding: 10px;
    }

    .accordion-body {
        font-size: 14px;
        padding: 10px;
    }
	.footer .row > div {
        margin-bottom: 20px;
    }

    .footer .input-group {
        max-width: 100%;
    }

    .footer .col-md-4.text-md-end {
        text-align: center !important;
    }
	/* Mobile-first base styles */
.how-it-works-section .steps__container {
    display: grid;
    grid-template-columns: 1fr; /* Single column for mobile */
    gap: 20px; /* Space between steps */
    padding: 15px;
    width: 100%;
}

/* Styling for individual steps (assuming they exist as children) */
.how-it-works-section .steps__container > * {
    width: 100%;
    min-width: 0; /* Prevents overflow */
}

.hero-text{
	z-index: 1;
}

.border-right{
    border-right:none;
}

}

@media (max-width: 480px) {
    .hero h1 {
        font-size: 28px;
    }

    .hero p {
        font-size: 14px;
    }
	.stats-section .row {
        gap: 0px;
    }

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

    .stat-circle i {
        font-size: 20px;
    }

    .stat-circle h2 {
        font-size: 18px;
    }

    .stat-circle p {
        font-size: 10px;
    }
	/*.value-section h2 {
        font-size: 24px;
    }*/

    .value-item h3 {
        font-size: 18px;
    }

    .value-item p {
        font-size: 12px;
    }

    .icon-circle {
        width: 40px;
        height: 40px;
    }

    .icon-circle i {
        font-size: 18px;
    }
	/*.waste-section h2 {
        font-size: 18px;
    }*/

    .waste-card h3 {
        font-size: 16px;
    }

    .waste-card p {
        font-size: 12px;
    }

    .waste-card .icon-circle {
        width: 35px;
        height: 35px;
    }

    .waste-card .icon-circle i {
        font-size: 16px;
    }
	/*.hidden-cost-section h2 {
        font-size: 24px;
    }*/

    .cost-card p {
        font-size: 12px;
    }

    .number-circle {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
	/*.benefits-section h2 {
        font-size: 24px;
    }*/

    .benefit-card h3 {
        font-size: 16px;
    }

    .benefit-card p {
        font-size: 12px;
    }

    .icon-square {
        width: 40px;
        height: 40px;
    }

    .icon-square i {
        font-size: 18px;
    }
	/*.how-it-works-section h2 {
        font-size: 24px;
    }*/

    .step-card h3 {
        font-size: 16px;
    }

    .step-card p {
        font-size: 12px;
    }

    .number-circle {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }

    .workflow-step {
        width: 100%;
        text-align: center;
    }
	/*.trust-section h2 {
        font-size: 24px;
    }*/

    .trust-card h3 {
        font-size: 16px;
    }

    .trust-card p {
        font-size: 12px;
    }

    .trust-card .icon-circle {
        width: 40px;
        height: 40px;
    }

    .trust-card .icon-circle i {
        font-size: 18px;
    }
	/*.testimonials-section h2 {
        font-size: 24px;
    }*/

    .testimonial-card h3 {
        font-size: 16px;
    }

    .testimonial-card .title {
        font-size: 12px;
    }

    .testimonial-card .rating {
        font-size: 14px;
    }

    .testimonial-card .testimonial-text {
        font-size: 12px;
    }

    
	
    .offer-badge .offer-percentage {
        font-size: 24px;
    }

    .offer-badge .offer-text {
        font-size: 14px;
    }

    .pricing-card .formula {
        font-size: 14px;
    }

    .pricing-card .example {
        font-size: 12px;
    }
	/*.cta-section h2 {
        font-size: 24px;
    }*/

    .cta-section p {
        font-size: 14px;
    }
	.faq-section h3 {
        font-size: 24px;
    }

    .accordion-button {
        font-size: 14px;
        padding: 8px;
    }

    .accordion-body {
        font-size: 12px;
        padding: 8px;
    }
	.footer .row > div {
        margin-bottom: 20px;
    }

    .footer .input-group {
        max-width: 100%;
    }

    .footer .col-md-4.text-md-end {
        text-align: center !important;
    }

    .footer h5 {
        font-size: 16px;
    }

    .footer p {
        font-size: 12px;
    }

    .footer .bi {
        font-size: 16px;
    }

    .footer .social-icons a {
        font-size: 18px;
    }
	/* Mobile-first base styles */
.how-it-works-section .steps__container {
    display: grid;
    grid-template-columns: 1fr; /* Single column for mobile */
    gap: 20px; /* Space between steps */
    padding: 15px;
    width: 100%;
}

/* Styling for individual steps (assuming they exist as children) */
.how-it-works-section .steps__container > * {
    width: 100%;
    min-width: 0; /* Prevents overflow */
}
.heading-inline h2 {
	font-size: 18px;
}

}


@media screen and (min-width: 768px) and (max-width: 1023px) {
    .heading-inline h2::after {
        bottom: -20px;
        height: 18px;
    }
}

.products-section{
	padding:70px 0;
}

.products-section .owl-stage-outer{
	padding-bottom:20px;
}

.products-tabs {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 40px;
}

.products-tabs .nav-tabs{
	border: 1px solid var(--primary-color);
    border-radius: 12px;
    overflow: hidden;
}

.products-tabs .nav-tabs .nav-item .nav-link {
    font-size: 24px;
    font-weight: 700;
    color: var(--dark-color);
    padding: 10px 70px;
    background: transparent;
}
@media (max-width: 768px) {
    .products-tabs .nav-tabs .nav-item .nav-link {
        font-size: 16px;
        padding: 9px 30px;
    }
}

.products-tabs .nav-tabs .nav-item:nth-child(1) .nav-link.active {
    background: #D8DCEC;
    color: var(--primary-color);
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 1px solid var(--primary-color);
}

.products-tabs .nav-tabs .nav-item:nth-child(2) .nav-link.active {
    background: #D8DCEC;
    color: var(--primary-color);
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    border-left: 1px solid var(--primary-color);
}

.products-card{
	background: var(--white-color);
    border: 1px solid #E9E9E9;
    box-shadow: 0px 2px 12px 0px #0000001F;
    border-radius: 20px;
    overflow: hidden;
}

.products-card .products-img__box{
	width: 100%;
    height: 250px;
    overflow: hidden;
}

.products-card .products-img__box img{
	min-width: 100%;
    max-width: 100%;
    min-height: 100%;
    max-height: 100%;
    object-fit: cover;
}

.products-card .products-content{
    padding: 16px;	
	text-align: center;
}

.products-card .products-content h3{
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-color);
    margin-bottom: 10px;
    margin-top: 8px;	
}

.products-card .products-content .products-descr{
	font-size: 1rem;
    color: var(--light-black-color);
   margin-bottom: 8px;
    line-height: 24px;
}

.products-descr{
	font-size: 1rem;
    color: var(--light-black-color);
   margin-bottom: 8px;
    line-height: 24px;
}

.view-all-link{
	margin-bottom: 17px;
    display: block;
    font-size: 16px;
    color: var(--primary-color);
    text-decoration: underline;
}

/*notify*/
.aiz-notify {
    min-width: 350px;
    max-width: 350px;
    padding-right: 50px;
    border-radius: 0.25rem;
    overflow: hidden;
    border: 0;
    color: var(--white);
    box-shadow: 0 5px 20px 0 rgba(38, 45, 58, 0.2);
    -webkit-box-shadow: 0 5px 20px 0 rgba(38, 45, 58, 0.2);
    padding: 1.25rem 1.25rem;
    font-size: 0.875rem;
    z-index: 1060 !important;
}
[dir="rtl"] .aiz-notify {
    text-align: right !important;
}
.aiz-notify .close {
    top: 50% !important;
    height: 20px;
    width: 20px;
    margin-top: -10px;
    font-size: 20px;
    line-height: 20px;
    color: var(--white);
    opacity: 0.7;
    right: 15px !important;
    text-shadow: none;
}
[dir="rtl"] .aiz-notify .close {
    right: auto !important;
    left: 15px !important;
}
.aiz-notify .close:before {
    content: "";
    position: absolute;
    border-radius: 50%;
    background-color: #fff;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: -1;
    opacity: 0;
}
.aiz-notify .close:hover {
    color: var(--dark);
    opacity: 1;
}
.aiz-notify .close:hover:before {
    opacity: 1;
    background-color: #fff;
    width: 170%;
    height: 170%;
    top: -35%;
    left: -35%;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.aiz-notify .progress {
    height: 3px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    border-radius: 0;
    background-color: transparent;
}
.aiz-notify .progress-bar {
    background-color: var(--white-color);
}
.aiz-notify.alert-success {
    background-color: var(--success);
}
.aiz-notify.alert-danger {
    background-color: var(--danger);
}
.aiz-notify.alert-primary {
    background-color: var(--primary-color);
}
.aiz-notify.alert-warning {
    background-color: var(--warning);
}
.aiz-notify.alert-secondary-base {
    background-color: var(--secondary-color);
}
.aiz-notify.alert-info {
    background-color: var(--info);
}
.aiz-notify.alert-dark {
    background-color: var(--dark-color);
}
.aiz-notify.alert-secondary {
    background-color: var(--secondary-color);
}
.aiz-notify.alert-light,
.aiz-notify.alert-light .close {
    background-color: var(--light-color);
    color: var(--dark-color);
}
.aiz-notify.alert-light .progress-bar {
    background-color: var(--primary-color);
}
@media (max-width: 575px) {
    .aiz-notify {
        width: calc(100% - 40px);
        min-width: auto;
    }
    .h-sm-auto {
        height: auto;
    }
}
.bootstrap-select .dropdown-menu .notify {
    width: calc(100% - 20px);
    margin: 0 10px;
    min-height: 26px;
    padding: 8px 12px;
    background: #f2f3f8;
    border: 1px solid #e3e3e3;
    border-radius: 3px;
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: 1;
}
.bootstrap-select .notify.fadeOut {
    -webkit-animation: bs-notify-fadeOut 2s linear 0.2s;
    -o-animation: bs-notify-fadeOut 2s linear 0.2s;
    animation: bs-notify-fadeOut 2s linear 0.2s;
}

.featured-products{
	padding:70px 0 0;
}

.featured-products-card{
	background: var(--white-color);
    border: 1px solid #E9E9E9;
    box-shadow: 0px 2px 12px 0px #0000001F;
    border-radius: 20px;
    overflow: hidden;
	transition: transform 0.3s ease;
	text-align: center;
}


.featured-products .owl-stage-outer{
	padding-bottom:20px;
}


.featured-products-card .featured-products-img__box{
	width: 100%;
    height: 250px;
    overflow: hidden;
}

.featured-products-card .featured-products-img__box img{
	min-width: 100%;
    max-width: 100%;
    min-height: 100%;
    max-height: 100%;
    object-fit: cover;
}

.featured-products-card .featured-products-content{
    padding: 16px;
    text-align: center;	
}

.featured-products-card .featured-products-content h3{
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-color);
    margin-bottom: 10px;
    margin-top: 8px;	
}

.featured-products-card .featured-products-content ul{
	padding-left:0;
	list-style:none;
}

.featured-products-card .featured-products-content ul li{
	color: var(--primary-color);
    font-weight: 600;
}

.featured-products-card .featured-products-content .price{
	font-size: 18px;
	color: var(--primary-color);
    font-weight: 600;
}

.featured-products-card .view-more-link{
    text-align: center;	
	color: var(--primary-color);
    display: block;
    padding-bottom: 16px;
}


.featured-products-slider .owl-nav .owl-prev{
	position: absolute;
    top: -58px;
    right: 40px;
    color: var(--primary-color) !important;
    font-size: 25px !important;
}

.featured-products-slider .owl-nav .owl-next{
	position: absolute;
    top: -58px;
    right: 0px;
    color: var(--primary-color) !important;
    font-size: 25px !important;
}
/* Button Style */
.learn-more {
    display: inline-block;
    margin-top: 10px;
    padding: 5px 15px;
    background-color: var(--primary-color);
    color: #fff ;
    text-decoration: none;
    font-weight: 500;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

.learn-more:hover {
    background-color: #0056b3;
}

.learn-more:focus {
    outline: none;
}
/* Flexbox for category and grade */
.products-meta {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.products-category,
.products-grade {
    font-size: 1rem;
    color: var(--light-black-color);
    margin-bottom: 6px;
}


.products-grade {
    color: var(--light-black-color);;
}
/*your custom css goes here*/ 

.cta-section .btn-outline-light {
    border-radius: 32px;
    padding: 12px 16px;
    font-weight: bold;
    background: var(--white-color);
    color: var(--primary-color);
}
.cta-section .btn-explore {
    border-radius: 32px;
    padding: 12px 16px;
    font-weight: bold;
    background: var(--white-color);
    color: var(--primary-color);
}/*your custom css goes here*/ 


h1.fw-600.h4 {
    color: #000;
}

.contact-page-info-item .fs-5.mt-5.mb-3 h5 b i {
    color: #000;
}

.fs-5.mt-5.mb-3 {
    color: #000;
}
.contact-page-info-item h5 {
    color: #000;
}