@charset "utf-8";
/* CSS Document */

/*---------- Google Fonts ----------*/

body {
	font-family: 'SatoshiRegular';
	background-color: #fff;
	color: #000;
}

figure {
	margin: 0;
	/* display: inline-block; */
}

a,
input,
button,
textarea {
	outline: none !important;
}

a {
	text-decoration: none;
	transition: all ease-in-out 300ms;
	-webkit-transition: all ease-in-out 300ms;
	-ms-transition: all ease-in-out 300ms;
	-o-transition: all ease-in-out 300ms;
	-moz-transition: all ease-in-out 300ms;
}

.container-fluid,
.container {
	padding-left: 15px;
	padding-right: 15px;
}

.row {
	margin-left: -15px;
	margin-right: -15px;
}

.row>* {
	padding-left: 15px;
	padding-right: 15px;
}

p {
	font-family: inherit;
	font-size: 18px;
	line-height: 30px;
	color: inherit;
}
p a {
	text-decoration: none;
	color: inherit;
}

p a:hover {
	text-decoration: none;
	color: #C64E0F;
}

ul li,
ol li {
	color: #000;
	list-style-type: none;
}

ul li a,
ol li a {
	text-decoration: none;
	color: inherit;
}

ul li a:hover,
ol li a:hover {
	text-decoration: none;
	color: #C64E0F;
}

h1 {
	font-size: 74px;
	line-height: normal;
	font-weight: 600;
}

h2 {
	font-size: 74px;
	line-height: normal;
	font-weight: 500;
}

h3 {
	font-size: 56px;
	line-height: normal;
	font-weight: 600;
}

h4 {
	font-size: 48px;
	line-height: normal;
	font-weight: 600;
}

h5 {
	font-size: 32px;
	line-height: normal;
	font-weight: 500;
}

h6 {
	font-size: 21px;
	line-height: normal;
	font-weight: 400;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.form-control:focus {
	box-shadow: none;
	border-color: transparent;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

textarea
{
   resize: none;
}

.main-title {
	font-family: 'ClashDisplaySemibold';
	font-size: 58px;
	line-height: 120%;
	color: #fff;
	letter-spacing: -0.58px;
}

.main-title * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.section-title {
	font-family: 'ClashDisplaySemibold';
	font-size: 62px;
	line-height: 70px;
	color: #000;
}

.section-title * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.block-title {
	font-family: 'SatoshiMedium';
	font-size: 42px;
	line-height: 147.619%;
	color: #000;
}

.block-title * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.section-detail {
	font-family: 'SatoshiMedium';
	font-size: 32px;
	line-height: 120%;
	color: #000;
}

.section-detail * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.small-title {
	font-family: 'ClashDisplaySemibold';
	font-size: 24px;
	line-height: 30px;
	color: #000;
}

.small-title * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.common-title {
	font-family: 'SatoshiMedium';
	font-size: 20px;
	line-height: 144%;
	color: #000;
}

.common-title * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.common-detail {
	font-family: 'SatoshiRegular';
	font-size: 18px;
	line-height: 25px;
	letter-spacing: -0.54px;
	color: rgba(0, 0, 0, 0.60);
}

.common-detail * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.detail {
	font-family: 'SatoshiRegular';
	font-size: 16px;
	line-height: 140.625%;
	color: #767A8F;
}

.detail * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.small-detail {
	font-family: 'SatoshiMedium';
	font-size: 14px;
	line-height: 142.857%;
	color: #fff;
}

.small-detail * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.title-tag {
	font-family: 'ClashDisplayMedium';
	font-size: 13px;
	line-height: 18px;
	color: #000;
	letter-spacing: 5px;
	text-transform: uppercase;
	position: relative;
	padding: 0 0 0 18px;
}

.title-tag * {
	font-size: inherit;
	line-height: inherit;
	font-family: inherit;
	font-weight: inherit;
	margin: 0;
}

.title-tag::before {
	content: "";
	position: absolute;
	top: 5px;
	left: 0;
	width: 6px;
	height: 6px;
	background-color: #000;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
}


/* buttons */

.btn {
	font-family: 'SatoshiBold';
	font-size: 16px;
	line-height:  150%;
	letter-spacing: -0.16px;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	-ms-border-radius: 100px;
	-o-border-radius: 100px;
	padding: 13px 15px;
	max-width: 200px;
	width: 100%;
	text-align: center;
	border: 1px solid transparent;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-ms-transition: 0.4s;
	-o-transition: 0.4s;
}

.btn-white {
	color: #9E3600;
	background-color: #fff;
}

.btn-white:hover {
	background-color: transparent;
	border-color: #fff;
	color: #fff;
}

.btn-border {
	border-color: #fff;
	color: #fff;
}

.btn-border:hover {
	background-color: #fff;
	color: #9E3600;
}

.btn-blue {
	background: linear-gradient(180deg, #C64E0F 5.56%, #B73F00 109.88%);
	border-radius: 8px !important;
	-webkit-border-radius: 8px !important;
	-moz-border-radius: 8px !important;
	-ms-border-radius: 8px !important;
	-o-border-radius: 8px !important;
	color: #fff;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-ms-transition: 0.4s;
	-o-transition: 0.4s;
}

.btn-blue:hover{
	background: transparent;
	border-color: #9E3600;
	color: #9E3600;
}

.link {
	font-family: 'SatoshiBold';
	color: #B73F00;
	font-size: 16px;
	line-height: 22px;
}

.link svg {
	color: #B73F00;
	margin: 0 0 0 5px;
}

.link:hover {
	color: #000;
}

.link,
.link svg,
.link svg path {
	transition: 0.4s;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-ms-transition: 0.4s;
	-o-transition: 0.4s;
}

.link:hover svg path {
	fill: #000;
}

/* buttons */


/*==================================================================*/
/*========== Header Start ==========*/
/*==================================================================*/

.navbar {
	margin: 0;
	padding: 0;
}

.navbar-brand {
	padding: 0;
	margin: 0;
}

.header .btn-border {
	border-color: #DBDBDB;
	color: #000;
	width: 117px;
	max-width: 100%;
	padding: 8px 15px;
}

.header .btn-border:hover {
	color: #B73F00;
	border-color: #B73F00;
}

.header {
	position: absolute;
	top: 30px;
	left: 0;
	right: 0;
	width: 100%;
	height: auto;
}

.header .btn-blue {
	display: none;
}

.header .navbar {
	border-radius: 200px;
	border: 1px solid rgba(255, 255, 255, 0.09);
	background: linear-gradient(0deg, #FFF 0%, #FFF 100%), linear-gradient(89deg, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.16) 99.83%);
	/* backdrop-filter: blur(25px); */
	-webkit-border-radius: 200px;
	-moz-border-radius: 200px;
	-ms-border-radius: 200px;
	-o-border-radius: 200px;
	padding: 17px 32px;
	z-index: 999;
}

.navbar-nav .nav-item .nav-link {
	padding: 0;
	color: #000;
	font-size: 16px;
	font-family: 'SatoshiMedium';
	line-height: 150%;
	letter-spacing: -0.16px;
}

.navbar-nav .nav-item .nav-link.active {
	color: #B73F00;
	font-family: 'SatoshiBold';
}

.navbar-nav .nav-item .nav-link:hover {
	color: #B73F00;
}

.navbar-nav .nav-item {
	margin: 0 42px 0 0;
}

.navbar-nav .nav-item:last-child {
	margin-right: 0;
}

.header.header-nav .navbar {
	backdrop-filter:unset;
	padding: 17px 32px;
}

/*==================================================================*/
/*========== Header End ==========*/
/*==================================================================*/


/*==================================================================*/
/*========== New Class Add Start ==========*/
/*==================================================================*/

.banner-wrp {
	padding: 110px 0 0 0;
	position: relative;
	/* z-index: 9; */
}
	
.banner-wrp::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 775px;
	background-color: #8A2E00;
}

.banner-wrp::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: url('../images/banner-bg-shap.webp');
	opacity: 0.08;
	width: 100%;
	height: 775px;
	z-index: 1;
}

.banner-main {
	position: relative;
	z-index: 9;
	padding: 90px 0 0;
	margin: 0 0 40px 0;
}

.banner-top-1 {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 9;
	opacity: 0.2;
}

.banner-btns .btn-white {
	margin: 0 18px 0 0;
}

.banner-btns {
	padding: 22px 0 0 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.banner-main .common-detail {
	color: rgba(255, 255, 255, 0.80);
	font-family: 'SatoshiMedium';
}

.banner-main .banner-right {
	max-width: 418px;
	width: 100%;
	margin: 0 0 -100px auto;
	position: relative;
	z-index: 99;
}
	
.banner-main .common-detail {
	padding: 0 40px 0 0;
}

.banner-main .row {
	align-items: flex-end;
}

.banner-img {
	padding: 40px 0 0 0;
}

.banner-img img {
	border-radius: 13px;
	-webkit-border-radius: 13px;
	-moz-border-radius: 13px;
	-ms-border-radius: 13px;
	-o-border-radius: 13px;
}

.banner-screen-img image {
	max-width: 100%;
	width: 100%;
	height: 100%;
	max-height: 100%;
}

/* same-title */

.same-title {
	max-width: 800px;
	width: 100%;
	margin: 0 auto;
}

.same-title .detail {
	padding: 15px 0 0 ;
}

/* same-title */

/* global-brands */

.global-brands-main {
	padding: 41px 0 146px;
}

.global-brands-wrp {
	position: relative;
}

.global-brands-shap {
	position: absolute;
	top: -160px;
	right: 0;
	z-index: 9;
}

.global-brands-shap-left {
	position: absolute;
	bottom: 0;
	left: 0;
	opacity: 0.3;
}

.carouselTicker__item {
	border: none !important;
	border-radius: 8.698px;
	background: #F6F7F9;
	-webkit-border-radius: 8.698px;
	-moz-border-radius: 8.698px;
	-ms-border-radius: 8.698px;
	-o-border-radius: 8.698px;
	display: flex !important;
	justify-content: center;
	align-items: center;
}

.carouselTicker__item figure {
	display: flex;
	justify-content: center;
	align-items: center;
}

.bottom-coin .carouselTicker__list {
	margin: 0;
}

.global-brands-logo-mobile {
	position: relative;
}

.global-brands-logo-mobile::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	z-index: 99;
}

.global-brands-block {
	display: flex;
	padding: 0;
	justify-content: center;
	align-items: center;
	border-radius: 23px;
	background: #F6F7F9;
	-webkit-border-radius: 23px;
	-moz-border-radius: 23px;
	-ms-border-radius: 23px;
	-o-border-radius: 23px;
	position: relative;
	z-index: 9;
	min-height: 131px;
}

.global-brands-block figure {
	max-width: 168px;
	height: 56px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.global-brands-block figure img {
	max-height: 100%;
	object-fit: contain;
}

.global-brands-logo {
	padding: 58px 0 0 0;
}

.global-brands-logo-bottom {
	padding: 28px 0 0 0;
}

.global-brands-logo .row {
	margin: 0 -14px;
}

.global-brands-logo .row >* {
	padding: 0 14px;
}

/* global-brands */

/* business-partner */

.business-partner-wrp {
	max-width: 1287px;
	width: 100%;
	margin: 10px auto 0;
	border-top: 1px solid #E4E6F1;
	border-right: 1px solid #E4E6F1;
	border-left: 1px solid #E4E6F1;
	padding-bottom: 148px;
	position: relative;
}

/* .title-tag {
	margin: 11px 0;
} */

.business-partner-main {
	padding: 11px 0 100px;
	position: relative;
}

.line-top-1 {
	position: absolute;
	top: 37px;
	width: 100%;
	height: 1px;
	background-color: #E4E6F1;
}

.line-left-1 {
	position: absolute;
	top: 0;
	left: -18px;
	width: 1px;
	height: 100%;
	background-color: #E4E6F1;
}

.line-right-1 {
	position: absolute;
	top: 0;
	right: -18px;
	width: 1px;
	height: 100%;
	background-color: #E4E6F1;
}

.line-bottom-1 {
	position: absolute;
	bottom: 148px;
	width: 100%;
	height: 1px;
	background-color: #E4E6F1;
}

.line-bottom-2 {
	position: absolute;
	bottom: 185px;
	width: 100%;
	height: 1px;
	background-color: #E4E6F1;
}

.business-partner-section {
	padding: 48px 0 0 0;
}

.business-partner-section .block-title {
	padding: 42px 0;
}

.business-partner-section .block-title * {
	padding: 0 0 70px;
}

.business-partner-section .block-title *:last-child {
	padding: 0;
}

/* business-partner */

/* number start */
.numbers-wrapper {
	position: relative;
	padding: 143px 0 115px;
	overflow: hidden;
}

.title-container .detail {
	width: 100%;
	max-width: 700px;
}

.title-container {
	margin: 0 0 74px 0;
}

.number-box .row>* {
	padding-left: 14px;
	padding-right: 14px;
}

.number-box .number-bg {
	width: 100%;
	height: calc(100% - 28px);
	margin: 0 0 28px 0;
	padding: 30px 34px;
	border-radius: 23px;
	background: #F6F7F9;
	-webkit-border-radius: 23px;
	-moz-border-radius: 23px;
	-ms-border-radius: 23px;
	-o-border-radius: 23px;
}

.number-bg .common-title {
	text-transform: uppercase;
	color: rgba(0, 0, 0, 0.60);
	line-height: 110%;
	letter-spacing: -0.6px;
	margin: 0 0 20px 0;
}

.number-bg .common-detail {
	line-height: normal;
}

.number-bg .main-title {
	margin: 0 0 28px 0;
	color: #000;
	font-family: 'StaatlichesRegular';
	font-size: 80px;
	line-height: 120%;
	letter-spacing: 0.8px;
	text-transform: uppercase;
	display: flex;
	align-items: center;
}

.number-bg .main-title .plus-icon {
	color: #B73F00;
	height: 34px;
	width: 34px;
}

/* number end */

/* join now start */

.join-wrapper {
	position: relative;
	overflow: hidden;
	padding: 116px 0;
}

.join-wrapper::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: #8A2E00;
	z-index: -2;
}

/* .join-wrapper::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: url('../images/banner-bg-shap.png');
	opacity: 0.08;
	width: 100%;
	height: 100%;
	z-index: -1;
} */

.join-main .content-box {
	height: 100%;
	width: 100%;
	padding: 0 60px 0 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.join-main .form-div {
	padding: 36px;
	border-radius: 20px;
	background: #FFF;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
}

.form-div .form-main {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.form-main .form-control {
	color: #000;
	font-family: 'SatoshiMedium';
	font-size: 16px;
	line-height: 150%;
	letter-spacing: -0.16px;
	padding: 13px 16px;
	border: none;
	border-radius: 8px;
	background: linear-gradient(0deg, #F0F0F0 0%, #F0F0F0 100%), linear-gradient(180deg, #C64E0F 5.56%, #B73F00 109.88%);
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-ms-border-radius: 8px;
	-o-border-radius: 8px;
}

.form-main .form-control::placeholder {
	color: #9C9C9C;
}

.form-main button {
	width: 100%;
	max-width: 100%;
}

.content-box .detail {
	color: #fff !important;
	margin: 16px 0 0 0;
}

.form-shape {
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: -1;
	opacity: 0.3;
}

/* join now end */


/* our-products */

.our-products-wrp {
	position: relative;
	padding: 140px 0 112px;
	background-color: #EEF1F3;
	overflow: hidden;
}

.our-products-title .section-title {
	padding: 43px 0 25px;
}

.our-products-section {
	padding: 50px 0 0 0;
}

.our-products-block {
	padding: 40px 40px 0 40px;
	background-color: #fff;
	border-radius: 23px;
	-webkit-border-radius: 23px;
	-moz-border-radius: 23px;
	-ms-border-radius: 23px;
	-o-border-radius: 23px;
	margin: 0 0 28px;
	height: calc(100% - 28px);
	position: relative;
}

.polygon-2 {
	position: absolute;
	bottom: 0;
	right: 0;
	border-radius: 0 0 23px 0;
	-webkit-border-radius: 0 0 23px 0;
	-moz-border-radius: 0 0 23px 0;
	-ms-border-radius: 0 0 23px 0;
	-o-border-radius: 0 0 23px 0;
}

.polygon-3 {
	position: absolute;
	top: 92px;
	left: 0;
}

.coming-soon {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	border-radius: 20.835px;
	border: 1px solid rgba(232, 232, 232, 0.47);
	background: linear-gradient(210deg, rgba(255, 255, 255, 0.18) 4.7%, rgba(255, 255, 255, 0.08) 81.5%);
	backdrop-filter: blur(25.5px);
	-webkit-border-radius: 20.835px;
	-moz-border-radius: 20.835px;
	-ms-border-radius: 20.835px;
	-o-border-radius: 20.835px;
	width: 100%;
	height: calc(100% - 40px);
	padding: 40px;
	-webkit-backdrop-filter: blur(25.5px);
}

.promote-marketing {
	max-width: 159px;
}

.coming-soon .section-detail {
	font-family: 'ClashDisplaySemibold';
}

.our-products-top {
	padding: 0 0 50px;
}

.our-products-top .detail {
	padding: 10px 0;
}

.our-products-bottom {
	border-radius: 12.316px 12.316px 0 0;
	border-top: 4px solid rgba(101, 101, 101, 0.10);
	border-left: 4px solid rgba(101, 101, 101, 0.10);
	border-right: 4px solid rgba(101, 101, 101, 0.10);
	-webkit-border-radius: 12.316px 12.316px 0 0;
	-moz-border-radius: 12.316px 12.316px 0 0;
	-ms-border-radius: 12.316px 12.316px 0 0;
	-o-border-radius: 12.316px 12.316px 0 0;
	position: relative;
	z-index: 9;
}

.our-products-bottom img {
	border-radius: 8px 8px 0 0;
	-webkit-border-radius: 8px 8px 0 0;
	-moz-border-radius: 8px 8px 0 0;
	-ms-border-radius: 8px 8px 0 0;
	-o-border-radius: 8px 8px 0 0;
	position: relative;
	z-index: -1;
}

.our-products-section .row {
	margin: 0 -14px;
}

.our-products-section .row>* {
	padding: 0 14px;
}

.products-shap {
	position: absolute;
	bottom: 30px;
	left: 0;
}

.products-shap-top {
    position: absolute;
    top: -100px;
    right: 0;
    max-width: 17%;
    width: 100%;
}

/* our-products */

/* testimonials */

.testimonials-main {
	padding: 160px 0 197px;
}

.testimonials-block {
	padding: 0 0 40px ;
	margin: 0 0 66px;
	border-bottom: 1px solid #C1C1C1;
}

.testimonials-right .testimonials-block:last-child {
	margin: 0;
}

.testimonials-block .star {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin: 0;
	padding: 0;
}

.testimonials-block .star li {
	margin: 0 3px 0 0;
}

.testimonials-block .star li:last-child {
	margin: 0;
}

.testimonials-block .section-detail {
	padding: 30px 0;
	line-height: 150%;
}

.testimonials-block .testimonial-bottom .common-title span {
	color: #717780;
}

.testimonials-right {
	display: flex;
	flex-direction: column;
	max-width: 618px;
	width: 100%;
	margin: 0 0 0 auto;
}

.testimonials-left .section-title {
	padding: 40px 0 15px 0;
}

.testimonials-wrp {
	position: relative;
}

.testimonial-shap {
	position: absolute;
	top: 503px;
	left: 0;
}

.see-more {
	font-family: 'SatoshiMedium';
	font-size: 16px;
	line-height: 20px;
	display: inline-block;
	text-align: center;
	cursor: pointer;
	color: #B73F00;
	text-decoration: none;
	position: relative;
	max-width: 110px;
	width: 100%;
	margin: 0 auto;
	text-decoration: none !important;
}

.open.see-more::before {
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	top: 4px;
}

.see-more::before {
	content: "";
	position: absolute;
	top: 2px;
	right: 0;
	background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path fill="%230d4efe" d="M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z"/></svg>');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 16px;
	height: 16px;
}

.see-more:hover {
	text-decoration: underline;	
}

/* testimonials */

/* choose-codalify */

.choose-codalify-wrp {
	padding: 140px 0 130px;
	position: relative;
}

.bg-D0D2FF {
	background-color: #FFEAD2;
}

.bg-EAFFCD {
	background-color: #EAFFCD;
}

.bg-F3DAFF {
	background-color: #F3DAFF;
}

.bg-FFE8D2 {
	background-color: #FFE8D2;
}

.choose-codalify-main {
	padding: 0 0 50px;
}

.choose-codalify-section {
	max-width: 1180px;
	width: 100%;
	margin: 0 auto;
	counter-reset: block-counter;
	position: relative;
}

.choose-codalify-section .choose-codalify-block:nth-child(odd) {
	margin-top: 77px;
}

.choose-codalify-section .choose-codalify-block:nth-child(2) {
	margin-top: 31px;
}

.choose-codalify-section {
	opacity: 0;
}

.choose-codalify-section.slick-initialized {
	opacity: 1;
}

.choose-codalify-block {
	position: relative;
	padding: 34px 25px;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	-ms-border-radius: 30px;
	-o-border-radius: 30px;
	margin: 0 10px;
	min-height: 372px !important;
}

.slick-arrow {
	background-color: #fff;
	width: 34px;
	height: 34px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	cursor: pointer;
	box-shadow: 0px 2.125px 6.375px 1.062px rgba(0, 0, 0, 0.12);
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	z-index: 99;
	transition: 0.4s;
	-webkit-transition: 0.4s;
	-moz-transition: 0.4s;
	-ms-transition: 0.4s;
	-o-transition: 0.4s;
}

.slick-arrow:hover svg path {
	fill: #000;
}

.slick-arrow.slick-prev {
	left: -60px;
	right: auto;
}

.slick-arrow.slick-next {
	left: auto;
	right: -60px;
}

.choose-codalify-block .block-title {
	font-family: 'ClashDisplayMedium';
	font-size: 48px;
	line-height: 50px;
	padding: 0 0 40px;
}
	
.choose-codalify-block .block-title h6::before {
    counter-increment: block-counter; 
    content: counter(block-counter, decimal-leading-zero);
}

.choose-codalify-block .small-title {
	font-family: 'SatoshiBold';
	padding: 0 0 12px 0;
}

.codalify-inner-shap {
	position: absolute;
	top: 0;
	right: 0;
	mix-blend-mode: multiply;
	border-radius: 0 30px 0 0;
	-webkit-border-radius: 0 30px 0 0;
	-moz-border-radius: 0 30px 0 0;
	-ms-border-radius: 0 30px 0 0;
	-o-border-radius: 0 30px 0 0;
}

.choose-codalify-shap {
	position: absolute;
	right: 0;
	bottom: 0;
	opacity: 0.3;
}

/* choose-codalify */


/* div-relative */

.div-relative-img img {
	border-radius: 20px 20px 0 0;
	-webkit-border-radius: 20px 20px 0 0;
	-moz-border-radius: 20px 20px 0 0;
	-ms-border-radius: 20px 20px 0 0;
	-o-border-radius: 20px 20px 0 0;
	width: 100%;
	height: 100%;
	max-height: 350px;
	object-fit: cover;
}

.div-relative-detail .link {
	color: #B73F00;
}

.div-relative-detail .link:hover {
	color: #000;
}

.div-relative-detail .link:hover svg path {
	stroke: #000;
}

.blog-title {
	padding: 0 0 50px ;
}

.blog-block {
	border-radius: 20px;
	border: 1px solid #E1E9F4;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
}

.div-relative-detail {
	padding: 45px 45px 38px 45px;
}

.div-relative-detail .small-title {
	padding: 33px 0 64px;
	font-family: 'SatoshiMedium';
}

.div-relative-detail .detail {
	font-size: 12px;
	line-height: 12px; /* 100% */
	letter-spacing: 1.2px;
	text-transform: uppercase;
}

.blog-wrp {
	padding: 120px 0 203px;
}

.blog-title .row {
	align-items: center;
}

.blog-btn {
	text-align: end;
}

.blog-right ul {
	margin: 0;
	padding: 0;
}

.blog-right ul li {
	display: flex;
	/* max-width: 414px; */
	justify-content: space-between;
	align-items: center;
	padding: 40px 0 44px 0;
	border-bottom: 1px solid #E1E9F4;
}

.blog-right ul li:first-child {
	padding-top: 0;
}

.blog-right ul li span {
	font-family: 'SatoshiMedium';
	flex: 0 0 414px;
	color: #000;
	font-size: 20px;
	line-height: 144%;
}

.blog-right ul li .link {
	padding: 12px 22px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 225.6px;
	border: 1px solid #E1E9F4;
	-webkit-border-radius: 225.6px;
	-moz-border-radius: 225.6px;
	-ms-border-radius: 225.6px;
	-o-border-radius: 225.6px;
}

.blog-right ul li .link:hover {
	border-color: #B73F00;
	background-color: #B73F00;
}

.blog-right ul li .link:hover svg path {
	stroke: #fff;
}

.blog-right {
	max-width: 542px;
	width: 100%;
	margin: 0 0 0 auto;
}

.blog-wrp {
	position: relative;
}

.blog-shap {
    position: absolute;
    bottom: -35px;
    left: 45px;
    z-index: -9;
}

/* div-relative */

/* solution start */

.solution-wrapper {
	position: relative;
	padding: 116px 0 137px;
}

.solution-wrapper::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: #8A2E00;
	z-index: -2;
}

.solution-wrapper::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	/* background-image: url('../images/banner-bg-shap.webp'); */
	opacity: 0.08;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.title-main {
	margin: 0 0 90px 0;
}

.title-main .title-tag {
	margin: 0 0 52px 0;
	color: #fff;
}

.title-main .title-tag::before {
	background-color: #fff;
}

.title-main .section-title {
	line-height: normal;
	color: #fff;
}

.timeline-main {
	position: relative;
}

.solution-right {
	position: absolute;
	top: 0;
	right: 0;
	z-index: -1;
	opacity: 0.3;
}



.timeline-main .dashed-line {
	width: 100%;
	max-width: 1440px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
}

.timeline-main .timeline-box {
	display: flex;
}
.timeline-main .timeline-box .timeline-item:last-child::before {
	display: none;
}

.timeline-main .timeline-box .timeline-item:nth-child(even) {
	flex-direction: column-reverse;
	margin: 300px 0 0 0;
}

.timeline-main .timeline-box .timeline-item:nth-child(even) .item-shape {
	flex-direction: column-reverse;
	justify-content: flex-end;
	padding: 22px 14px;
	margin: 0 auto 42px auto;
}

.timeline-main .timeline-box .timeline-item:nth-child(even) .small-detail {
	margin: 0 0 0 0;
}
.timeline-main .timeline-box .timeline-item:nth-child(even) .section-detail {
	margin: 0 0 0 0;
}

.timeline-main .timeline-item {
	position: relative;
	width: 100%;
	max-width: 265px;
	display: flex;
	flex-direction: column;
}

.timeline-item .small-detail {
	margin: 0 0 22px 0;
	text-align: center !important;
	min-height: 120px;
	display: flex;
	align-items: flex-end;
}
.timeline-main .timeline-box .timeline-item:nth-child(even) .small-detail {
	align-items: flex-start;

}
.item-shape {
	height: 235px;
	width: 100%;
	max-width: 204px;
	padding: 40px 14px 22px 14px;
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	margin: 0 auto;
	filter: drop-shadow(11.682px 18.054px 0px #000);
}

.shape-img-1 {
	background-image: url(../images/item-shape1.png);
}

.shape-img-2 {
	background-image: url(../images/item-shape2.png);
}

.shape-img-3 {
	background-image: url(../images/item-shape3.png);
}

.shape-img-4 {
	background-image: url(../images/item-shape4.png);
}

.shape-img-5 {
	background-image: url(../images/item-shape5.png);
}

.item-shape .small-title {
	text-align: center;
}

.item-shape .main-title {
	color: rgba(0, 0, 0, 0.20);
	text-align: center;
	font-family: 'ClashDisplaySemibold';
	font-size: 50px;
	line-height: normal;
	margin: 0 0 4px 0;
}

/* solution end */

/* stack */

.stake-wrappper {
	position: relative;
	overflow: hidden;
	padding: 99px 0 86px 0;
	background: #EEF1F3;
}
.stack-shape { 
    position: absolute;
    top: -78px;
    right: 0px;
    z-index: 1;
    width: 100%;
	max-width: 180px;
}

.stack-container {
	position: relative;
}

.stack-container::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	z-index: 99;
}


.stack-title {
	margin: 0 0 80px 0;
	display: flex;
	align-items: end;
	position: relative;
	z-index: 5;
}

.stack-title .title-tag {
	margin: 0 0 29px;
}

.title-right .detail {
	color: #2C374F;
	width: 100%;
	max-width: 456px;
	margin: 0 0 0 0;
	padding: 0 0 0 30px;
}

.stack-slider {
	position: relative;
}

.stack-slider::before {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	content: " ";
	background: linear-gradient(90deg, #EEF1F3 0%, rgba(255, 255, 255, 0.00) 20%, rgba(255, 255, 255, 0.00) 80%, #EEF1F3 100%);
	z-index: 1;
}

.stack-slider ul {
	margin: 0 auto;
}

.stack-slider ul li {
	height: 80px !important;
	width: auto;
	margin: auto 16px auto 16px;
	background-color: transparent;
	display: flex !important;
	align-items: center;
}

.stack-slider ul li figure {
	height: 100%;
}

.stack-slider .stack-img {
	max-height: 100%;
	object-fit: contain;
}

/* stack */

.number-shape-purple {
	position: absolute;
    top: -50px;
    left: -50px;
    z-index: -1;
	width: 100%;
	max-width: 313px;
	opacity: 0.2;
}


.block-title .letter {
	/* display: inline-block; */
	padding: 0;
	opacity: 1;
}


/*==================================================================*/
/*========== New Class Add End ==========*/
/*==================================================================*/


/*==================================================================*/
/*========== Footer Start ==========*/
/*==================================================================*/

.footer {
	position: relative;
	padding: 110px 0 62px 0;
}

.top-part {
	margin: 0 0 90px 0;
}

.blog-title .section-title {
	padding: 40px 0 14px;
}

.top-part .title-data {
	margin: -17px 0 0 0;
	width: 100%;
	max-width: 327px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
}

.title-data .logo-div img {
	width: 100%;
	max-width: 210px;
}

.title-data .detail {
	font-family: 'FigtreeRegular';
	letter-spacing: normal;
	color: rgba(106, 106, 106, 0.90);
}

.title-block {
	margin: 0 0 50px 0;
}

.social-icon {
	display: flex;
	gap: 14px;
}

.social-icon .icon-div {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 38px;
	height: 38px;
	border-radius: 100%;
	color: #000;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	-ms-border-radius: 100%;
	-o-border-radius: 100%;
	border: 1px solid #00000012;
}

.social-icon .icon-div:hover {
	color: #B73F00;
	border-color: #B73F00;
}

.wrapper .detail {
	font-family: 'SatoshiBlack';
	color: #000;
	line-height: 150%;
	margin: 0 0 16px 0;
}

.wrapper ul {
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.wrapper a {
	color: #000;
	font-family: 'SatoshiRegular';
	font-size: 16px;
	line-height: 150%;
}

.bottom-part a {
	color: #707174;
	text-align: right;
	font-family: 'SatoshiRegular';
	font-size: 16px;
	line-height: 150%;
	letter-spacing: -0.16px;
}

.top-part ul {
	margin: 0;
	padding: 0;
}

.logo-div {
	display: inline-block;
}

/* .title-data figure {
	display: inline-block;
} */

/*==================================================================*/
/*========== Footer End ==========*/
/*==================================================================*/

/* Custom Services Block Hover Effect */
.our-products-block {
	transition: all 0.3s ease-in-out !important;
}
.our-products-block:hover {
	transform: translateY(-8px) !important;
	box-shadow: 0 12px 30px rgba(183, 63, 0, 0.1) !important;
	border-color: #B73F00 !important;
}

/* Custom Subpage Banner Styles */
.subpage-banner {
	position: relative;
	padding: 160px 0 100px;
	background-color: #8A2E00;
	background-image: url('../images/banner-bg-shap.webp');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	color: #fff;
	text-align: center;
	overflow: hidden;
}
.subpage-banner::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(138, 46, 0, 0.93); /* Theme rust-orange overlay */
	z-index: 1;
}
.subpage-banner .container {
	position: relative;
	z-index: 2;
}
.subpage-banner h1 {
	font-family: 'ClashDisplaySemibold';
	font-size: 56px;
	color: #fff !important;
	margin-bottom: 15px;
	letter-spacing: -1px;
}
.subpage-banner p {
	font-family: 'SatoshiMedium';
	font-size: 18px;
	color: rgba(255, 255, 255, 0.8) !important;
	max-width: 800px;
	margin: 0 auto;
	line-height: 1.6;
}
@media (max-width: 768px) {
	.subpage-banner h1 {
		font-size: 40px;
	}
	.subpage-banner p {
		font-size: 15px;
	}
}
.subpage-banner a {
	color: #fff !important;
}

/* Footer Ticker */
.footer-ticker-wrp {
	background-color: #B73F00;
	color: #fff;
	overflow: hidden;
	padding: 14px 0;
	position: relative;
	width: 100%;
	z-index: 10;
	font-family: 'ClashDisplaySemibold', sans-serif;
	font-size: 16px;
	letter-spacing: 2px;
	text-transform: uppercase;
	border-bottom: 2px solid #8A2E00;
}
.footer-ticker-container {
	display: flex;
	width: 100%;
}
.footer-ticker-inner {
	display: flex;
	white-space: nowrap;
	width: max-content;
	animation: footerMarquee 25s linear infinite;
}
.footer-ticker-inner span {
	display: inline-block;
	padding-right: 40px;
}
@keyframes footerMarquee {
	0% {
		transform: translate3d(0, 0, 0);
	}
	100% {
		transform: translate3d(-50%, 0, 0);
	}
}

/* Core Values Section & Cards */
.values-section {
	padding: 80px 0 50px;
	background-color: #ffffff;
	position: relative;
}
.value-card {
	background: #ffffff;
	border: 1px solid #E4E6F1;
	border-radius: 20px;
	padding: 40px 30px;
	transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), border-color 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
	height: 100%;
	position: relative;
	overflow: hidden;
	box-shadow: 0 5px 20px rgba(0, 0, 0, 0.02);
}
.value-card:hover {
	transform: translateY(-10px);
	border-color: #B73F00;
	box-shadow: 0 20px 40px rgba(183, 63, 0, 0.12);
}
.value-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: #B73F00;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s ease;
}
.value-card:hover::before {
	transform: scaleX(1);
}
.value-icon {
	width: 65px;
	height: 65px;
	border-radius: 16px;
	background: rgba(183, 63, 0, 0.08);
	color: #B73F00;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 26px;
	margin-bottom: 25px;
	transition: all 0.4s ease;
}
.value-card:hover .value-icon {
	background: #B73F00;
	color: #fff;
	transform: rotate(5deg) scale(1.05);
}
.value-card h4 {
	font-family: 'ClashDisplaySemibold';
	font-size: 22px;
	color: #000;
	margin-bottom: 15px;
}
.value-card p {
	font-family: 'SatoshiMedium';
	font-size: 15px;
	color: #555;
	line-height: 1.6;
	margin: 0;
}

/* Journey Section & Alternating Vertical Nodes */
.journey-section {
	padding: 50px 0 80px;
	background-color: #F8F9FC;
	position: relative;
	overflow: hidden;
}
.journey-container {
	position: relative;
	max-width: 1000px;
	margin: 50px auto 0;
	padding: 20px 0;
}
.journey-container::after {
	content: '';
	position: absolute;
	width: 4px;
	background-color: #E4E6F1;
	top: 0;
	bottom: 0;
	left: 50%;
	margin-left: -2px;
	border-radius: 2px;
}
.journey-item {
	position: relative;
	width: 50%;
	padding: 20px 40px;
	box-sizing: border-box;
}
.journey-item.left {
	left: 0;
}
.journey-item.right {
	left: 50%;
}
.journey-item::after {
	content: '';
	position: absolute;
	width: 20px;
	height: 20px;
	right: -10px;
	background-color: #fff;
	border: 4px solid #B73F00;
	top: 40px;
	border-radius: 50%;
	z-index: 2;
	transition: all 0.3s ease;
}
.journey-item.right::after {
	left: -10px;
}
.journey-item:hover::after {
	background-color: #B73F00;
	transform: scale(1.3);
}
.journey-card {
	padding: 30px;
	background-color: #fff;
	position: relative;
	border-radius: 20px;
	border: 1px solid #E4E6F1;
	box-shadow: 0 4px 15px rgba(0,0,0,0.02);
	transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), border-color 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.journey-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 15px 35px rgba(0, 0, 0, 0.06);
	border-color: rgba(183, 63, 0, 0.3);
}
.journey-year {
	font-family: 'ClashDisplaySemibold';
	font-size: 28px;
	color: #B73F00;
	margin-bottom: 8px;
	display: inline-block;
}
.journey-card h4 {
	font-family: 'ClashDisplaySemibold';
	font-size: 19px;
	color: #000;
	margin-bottom: 12px;
}
.journey-card p {
	font-family: 'SatoshiMedium';
	font-size: 15px;
	color: #555;
	line-height: 1.6;
	margin: 0;
}

@media screen and (max-width: 768px) {
	.journey-container::after {
		left: 31px;
	}
	.journey-item {
		width: 100%;
		padding-left: 70px;
		padding-right: 20px;
	}
	.journey-item.left {
		left: 0;
	}
	.journey-item.right {
		left: 0;
	}
	.journey-item::after {
		left: 21px;
		right: auto;
	}
	.journey-item.right::after {
		left: 21px;
	}
}

/* Horizontal Scroll Section Pinning (Desktop only) */
@media (min-width: 992px) {
	.our-products-wrp.horizontal-pin-section {
		height: 100vh !important;
		min-height: 700px;
		display: flex;
		flex-direction: column;
		justify-content: flex-start; /* Title starts at the top, never pushed off-screen */
		padding: 50px 0 !important;
		box-sizing: border-box;
	}

	.our-products-wrp.horizontal-pin-section .our-products-main {
		display: flex;
		flex-direction: column;
		height: auto;
	}

	.our-products-title {
		padding-bottom: 15px !important;
	}

	.our-products-title .section-title {
		padding: 10px 0 10px !important;
	}

	/* Force viewport to stretch edge-to-edge across the screen */
	.our-products-viewport {
		overflow: hidden;
		width: 100vw;
		position: relative;
		left: 50%;
		right: 50%;
		margin-left: -50vw;
		margin-right: -50vw;
	}

	/* Add white/transparent gradient shadow masks to prevent cards from looking cut off at edges */
	.our-products-viewport::before,
	.our-products-viewport::after {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		width: 150px;
		z-index: 10;
		pointer-events: none;
	}

	.our-products-viewport::before {
		left: 0;
		background: linear-gradient(to right, #EEF1F3 25%, rgba(238, 241, 243, 0));
	}

	.our-products-viewport::after {
		right: 0;
		background: linear-gradient(to left, #EEF1F3 25%, rgba(238, 241, 243, 0));
	}

	.our-products-track {
		display: flex !important;
		flex-wrap: nowrap !important;
		width: max-content !important;
		gap: 30px !important;
		margin: 0 !important;
		padding: 20px 0 35px !important;
		/* Padding aligns the first card precisely with the standard bootstrap container margins */
		padding-left: calc((100vw - 1140px) / 2) !important;
		padding-right: 150px !important;
	}

	@media (min-width: 1400px) {
		.our-products-track {
			padding-left: calc((100vw - 1320px) / 2) !important;
		}
	}

	@media (max-width: 1199.98px) {
		.our-products-track {
			padding-left: calc((100vw - 960px) / 2) !important;
		}
	}

	.our-products-track > div {
		width: 460px !important;
		flex-shrink: 0;
		margin-bottom: 0 !important;
		max-width: none !important;
	}

	.our-products-track > div .our-products-block {
		height: 100% !important;
		margin-bottom: 0 !important;
		padding: 30px 30px 0 30px !important; /* reduce padding inside card on desktop */
	}

	.our-products-track > div .our-products-top {
		padding-bottom: 30px !important; /* reduce padding inside card on desktop */
	}
}

/* Testimonials Left Pinned Sidebar (Desktop only) */
@media (min-width: 992px) {
	.testimonials-left-pinned {
		position: -webkit-sticky;
		position: sticky;
		top: 120px !important;
		align-self: flex-start;
		width: 100%;
		max-width: 420px;
		will-change: transform;
	}
	.testimonials-wrp figure {
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		margin: 0;
		pointer-events: none;
	}
	.testimonial-shap {
		position: -webkit-sticky;
		position: sticky;
		top: 200px !important;
		left: 0;
		z-index: 1;
		will-change: transform;
	}
}

/* Enable 3D perspective on the existing testimonials background shape icon */
.testimonial-shap {
	perspective: 1000px;
	transform-style: preserve-3d;
	will-change: transform;
}

