#accordionImg{
height: 70vh;
object-fit: cover;
width: 100%;
}



.possition_top {
	object-position: top;
}
.about_serving_box{
	display: grid;
	grid-template-columns: minmax(300px, auto) minmax(350px, 690px);
	gap:50px;
	align-items: start;
	align-items: stretch;
}
.section-description {
	color: #000;
	font-family: Inter;
	font-size: 24px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: -0.449px;
	margin-top: 150px;
}
.section-description p{
	margin-bottom:30px;
	font-size: 24px !important;
	line-height: normal !important;
}
.counter-number{
	color: #000;
	font-family: "Instrument Serif";
	font-size: 128px;
	font-style: normal;
	font-weight: 400;
	line-height: 90%;
	letter-spacing: -1.061px;
	display: inline-block;
}
.counter_wrp {
	display: flex;
}
span.counte-sing {
	color: #E85B03;
	font-size: 56px;
	line-height: 8px;
	position: relative;
	top: 0;
	font-weight: 200;
}
.counter-container {
	display: flex;
	gap: 96px;
	margin-top: 70px;
	margin-bottom: 75px;
}
span.counter-label {
	font-size: 24px;
	font-style: normal;
	font-weight: 300;
	line-height: 34px;
	letter-spacing: -1.061px; 
}
.about_serving_box g path {
	fill: #000;
}
.about_compromise {
	background: #000;
	color: #fff;
	text-align: center;
}
.about_compromise .container {
	padding: 0 52px;
}
.compromis_wrper {
	display: flex;
	gap: 20px;
	align-items: center;
}
.vertical-slider {
	width: 100%;
	height: 100vh;
	overflow: hidden;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.slider-track {
	display: flex;
	flex-direction: column;
	gap: 20px;
	animation: slideUp 20s linear infinite;
	will-change: transform;
}

.slider-track img {
	width: 400px;
	height: auto;
	border-radius: 15px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
	display: block;
}
.compromis_P p{
	color: rgba(255, 255, 255, 0.30);
	font-family: Inter;
	font-size: 24px !important;
	font-style: normal;
	font-weight: 400;
	line-height: 32.5px !important;
	letter-spacing: -0.449px;
	margin-top: 60px !important;
	max-width: 630px;
	margin: 0 auto;
}
.compromis_P p {
	margin-bottom: 31px;
}
.compromis_P p:last-child{
	margin-bottom:0;
}
.w-100{
	width:100%;
}

.image_right .slider-track {
	display: flex;
	flex-direction: column;
	gap: 20px; 
	will-change: transform;
	animation: slideDown 20s linear infinite;
}
.about_compromise { 
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

/* Animation */
@keyframes slideDown {
	0% {
		transform: translateY(-50%);
	}
	100% {
		transform: translateY(0%);
	}
}

/* Seamless loop animation - no gap at end */
@keyframes slideUp {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(-50%);
	}
}

/* =====================
ACCORDION LAYOUT
===================== */
.accordion-wrapper {
	padding-top: 100px;
	background: #fff;
}

.accordion-inner { 
	display: flex;
	gap: 60px;
	align-items: center;
}

/* LEFT IMAGE */
.accordion-image {
	width: 50%;
}

.accordion-image img {
	max-width: 100%;
	transition: opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1);
	transform: translateZ(0);
}

/* RIGHT CONTENT */
.accordion-content {
	width: 50%;
}

.accordion-item {
	border-bottom: 1px solid #000;
	transition: border-color 0.3s ease;
	padding-right: 50px;
}
.accordion-item:first-child {border-top: 1px solid #000;}

.accordion-item:hover {
	border-color: #bbb;
}

.accordion-title {
	width: 100%;
	background: none;
	border: none;
	padding: 44px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	transition: color 0.3s ease;
	color: #0A0A0A;
	font-family: "Instrument Serif";
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: 32px;
	letter-spacing: 0.07px;
	text-align: start;
	gap:10px;
}

.accordion-title span {
	font-size: 24px;
	transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.accordion-item.active .accordion-title span {
	transform: rotate(90deg);
}
.accordion-item.active svg line:first-child {
	display: none;
}
.accordion-body p {
	margin-bottom: 20px;
}
.accordion-body p:last-child  {
	margin-bottom: 0px;
}
.accordion-body {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.8s cubic-bezier(0.23, 1, 0.32, 1), 
		padding-bottom 0.8s cubic-bezier(0.23, 1, 0.32, 1),
		opacity 0.6s cubic-bezier(0.23, 1, 0.32, 1);
	padding-bottom: 0;
	opacity: 0;
	will-change: max-height, padding-bottom, opacity;
	transform: translateZ(0);
	max-width: 750px;
}

.accordion-item.active .accordion-body {
	max-height: 400px;
	padding-bottom: 40px;
	opacity: 1;
	margin-top: -20px;
}
.accordion-item.active .accordion-title{
	color:#E85B03;
}
.accordion-item.active svg line {
	stroke: #E85B03;
}
.accordion-body p {
	font-family: Inter;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 26px;
	letter-spacing: -0.449px;
	color: #000000c7;
}

/* Overall container styling */


.guarantee_wrap {
	display: grid;
	grid-template-columns: minmax(300px, 901px) minmax(350px, 581px);
	justify-content: space-between;
	align-items: center;
	gap: 50px;
	border-radius: 35px;
	background: #000;
	padding: 52px;
	color: #fff;
}

.guarantee_wrap .description {
	margin: 34px 0 42px;
	color: #FFF;
	font-family: Inter;
	font-size: 20px;
	font-style: normal;
	font-weight: 300;
	line-height: 32.5px;
	letter-spacing: -0.449px;
}

.description p{
	max-width: 790px;
}
.guarantee_wrap .sub-heading {
	margin-left: 10px;
	display: inline-block;
	color: #E85B03;
	font-size: 24px;
	font-style: normal;
	font-weight: 400;
	line-height: 32px;
	letter-spacing: 0.07px;
	font-family: Inter;
}
.guarantee_wrap .our_work_image_wrap {
	height: clamp(200px, 100vh, 300px);
}
.about_serving .section-title {
	position: sticky;
	top: 90px;
}
.image-section img {
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: 30px;
}
.guarantee_wrap .our_work_image_wrap img.our_work_image {
	top: -50%;
}
.brands_content {
	text-align: center;
}
.brands_content p {
	max-width: 659px;
	margin: auto;
	text-align: center;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 32.5px;
	letter-spacing: -0.449px;
	margin-top: 40px;
}

.brand-grid {
	display: grid;
	grid-template-columns: repeat(7, minmax(191px, 218px));
	gap: 0;
	margin-top: 50px;
	width: 100%;
	margin-top: 66px;
	padding: 0 47px;
	justify-content: center;
}

.brand-box {
	background: white;
	width: 100%;
	min-height: 186px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
}

/* First column gets left border */
.brand-box:nth-child(7n+1) {
	border-left: 1px solid #000;
}

/* First row gets top border */
.brand-box:nth-child(-n+7) {
	border-top: 1px solid #000;
}

/* No special border removal needed - all boxes have all borders */

.brand-box:hover {
	/*             box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
	transform: translateY(-2px);
	z-index: 10; */
}

.brand-box img {
	max-width: 80%;
	max-height: 80%;
	width: auto;
	height: auto;
	object-fit: contain;
	transition: transform 0.3s ease;
}

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

/* Responsive Design */

@-webkit-keyframes scroll {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(calc(-100px * 7))
	}
}
@keyframes scroll {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(calc(-100px * 7))
	}
}


@keyframes scroll-2 {
	0% {
		transform: translateY(calc(-100px * 7));
	}
	100% {
		transform: translateY(0);
	}
}
.slider {
	height: 100svh;
	overflow: hidden;
}
/* .slider::before, .slider::after {
background: linear-gradient(to top, #ffffff99 50%, rgba(255, 255, 255, 0) 100%);
content: "";
width: 100%;
position: absolute;
height: 50px;
z-index: 2;
} */
.slider::after {
	right: 0;
	top: 0;
	transform: rotateZ(180deg);
}
.slider::before {
	left: 0;
	top: 0;
}

.slider .slide-track {
/* 	-webkit-animation: scroll 10s linear infinite;
	animation: scroll 10s linear infinite; */
	display: flex;
	height: calc(250px * 14);
	flex-direction: column;
	width: 289px;
	gap: 17px;
}
.slider .slide {
	height: 100px;
	width: 250px;
}
.slide-track img {
	border-radius: 30px;
}
.image_right .slide-track{
/* 	animation: scroll-2 10s linear infinite; */
}
.compromis_wrper .char.filled{
	color: #fff;
}


/* 1600px screen - 6 boxes */
@media (max-width: 1650px) {
	.brand-grid {
		padding: 0px;
	}
}
@media (max-width: 1600px) {
	.brand-grid {
		grid-template-columns: repeat(6, minmax(191px, 318px));
	}

	.brand-box:nth-child(8n+1) {
		border-left: 0;
	}

	.brand-box:nth-child(6n+1) {
		border-left: 1px solid #000;
	}

	.brand-box:nth-child(-n+8) {
		border-top: 0;
	}

	.brand-box:nth-child(-n+6) {
		border-top: 1px solid #000;
	}
	.slider .slide-track{
		width: 240px;
	}
.brand-box:nth-child(7n+1) {
    border-left: 0px solid #000;
}
.brand-box:first-child {
    border-left: 1px solid #000;
}
}

/* 1400px screen - 5 boxes */
/* @media (max-width: 1400px) {
.brand-grid {
grid-template-columns:repeat(5, minmax(191px, 311px));
}

.brand-box:nth-child(6n+1) {
border-left: 0;
}

.brand-box:nth-child(5n+1) {
border-left: 1px solid #000;
}

.brand-box:nth-child(-n+6) {
border-top: 0;
}

.brand-box:nth-child(-n+5) {
border-top: 1px solid #000;
}
} */

/* 1200px screen - 4 boxes */
@media (max-width: 1200px) {
	.brand-grid {
		grid-template-columns: repeat(6, minmax(155px, 218px));
	}
	.brand-box:nth-child(5n+1) {
		border-left: 0;
	}
	.brand-box:nth-child(6n+1) {
		border-left: 1px solid #000;
	}
	.brand-box:nth-child(-n+5) {
		border-top: 0;
	}
	.brand-box:nth-child(-n+6) {
		border-top: 1px solid #000;
	}
	.slider .slide-track{
		width: 160px;
	}
	.about_compromise .container {
		padding: 0 0px;
	}
}

/* 992px screen - 3 boxes */
@media (max-width: 992px) {
	.brand-grid {
		grid-template-columns: repeat(4, minmax(155px, 518px));
	}

	.brand-box:nth-child(4n+1) {
		border-left:  1px solid #000;
	}
	.brand-box:nth-child(3n+1) {
		border-left: 0px solid #000;
	}
	.brand-box:nth-child(-n+6) {
		border-top: 0px solid #000;
	}
	.brand-box:nth-child(-n+4) {
		border-top: 1px solid #000;
	}
	.brand-box:nth-child(4n+1) {
		border-left: 1px solid;
	}
}

/* 768px screen - 2 boxes */
@media (max-width: 768px) {
#accordionImg {
    height: auto;
max-height: 350px;
object-fit: cover;
}
.guarantee_wrap .our_work_image_wrap img.our_work_image {
    top: -10%;
}
.bt_gradiant:after{
		content: "";
		background: linear-gradient(#00000000 0%,  #000000 40%, #000000 70%, #00000000 100%);
		height: 200px;
		width: 100%;
		position: absolute;
		left: 0;
		bottom: -100px;
		z-index: 10;
	}
	.bt_gradiant .compromis_P{
		position: relative;
		z-index: 9999 !important;
	}
	.bt_gradiant{
		position: relative;
	}
	.brand-grid {
		grid-template-columns: repeat(3, minmax(155px, 518px));
	}
	.brand-box:nth-child(4n+1) {
		border-left: 0;
	}
	.brand-box:nth-child(3n+1) {
		border-left: 1px solid #000;
	}
	.brand-box:nth-child(-n+4) {
		border-top: 0;
	}
	.brand-box:nth-child(-n+3) {
		border-top: 1px solid #000;
	}
	.brand-box img {
		max-width: 100%;
		max-height: 90%;
	}
	.brand-box{
		min-height: 143px;
	}
	.compromis_wrper .padding_100 {
		order: 2;
	}
	.iamge_left{
		order: 9 !important;
	}
	.image_right{
		order: 10 !important;
	}
	.about_compromise {
    		background-repeat: no-repeat;
		background-position: top;
    		background-size: 430px;
	}
}

/* 480px screen - 1 box */
@media (max-width: 480px) {
	.brand-grid {
		grid-template-columns:repeat(2, minmax(120px, 518px));
	}
	.brand-box:nth-child(3n+1) {
		border-left: 0;
	}
	.brand-box:nth-child(2n+1) {
		border-left: 1px solid #000;
	}
	.brand-box:nth-child(-n+3) {
		border-top: 0;
	}
	.brand-box:nth-child(-n+2) {
		border-top: 1px solid #000;
	}
}

/* Loading animation */
@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* =====================
RESPONSIVE
===================== */

@media (max-width: 768px) {
	.slider-track img {
		width: 300px;
	}
}

@media (max-width: 480px) {
	.slider-track img {
		width: 250px;
	}
}
@media (max-width: 1600px) {
	.section-description{
		margin-top: 51px;
	}
	.accordion-wrapper {
		padding-top: 20px;
	}
	.accordion-title{
		padding: 34px 0;
	}
	.accordion-title span svg {
		width: 25px;
	}
}
@media (max-width: 1440px) {
	.section-description {
		margin-top: 0px;
	}
	.counter-number {
		font-size: 80px;
	}
	.counter-container {
		margin-top: 50px;
		margin-bottom: 50px;
	}
	.section-description{
		font-size: 22px;
	}
	.accordion-item{
		padding-right: 0px;
	}
	.guarantee_wrap .sub-heading {
		display: block;
		margin: 0;
	}
	.guarantee_wrap .description{
		margin: 22px 0 24px;
		font-size: 18px; 
		line-height: 26.5px; 
	}
}
@media (max-width: 1366px) {
	.section-description {
		font-size: 20px;
	}
	.compromis_P{
		font-size: 22px;
		line-height: 29.5px;
	}
	.accordion-title{
		font-size: 22px;
	}
	.accordion-title {
		padding: 19px 0;
	}
	.accordion-body p{
		font-size: 18px;
	}
	.accordion-item.active .accordion-body{
		margin-top: -10px;
		padding-bottom: 19px;
	}
	.guarantee_wrap{
		grid-template-columns: minmax(470px, 818px) minmax(350px, 536px);
		gap: 30px;
	}
}
@media (max-width: 1024px) {
	.counter-number {
		font-size: 65px;
	}
	span.counter-label {
		font-size: 20px;
	}
	.about_serving_box {
		grid-template-columns: minmax(154px, auto) minmax(350px, 690px);
	}
	.section-description {
		font-size: 20px;
	}
	.compromis_P{
		font-size: 20px;
		line-height: 28.5px;
		margin-top: 32px !important;
	}
	.slider-track img {
		width: 300px;
	}
	.accordion-inner{
		gap: 30px;
	}
	.guarantee_wrap {
		grid-template-columns: 100%;
		gap: 49px;
	}
	.brands_content p{
		line-height: 26.5px;
		font-size: 18px;
		margin-top: 17px;
	}
}

@media (max-width: 768px) {
	.counter-number {
		font-size: 45px;
	}        
	span.counter-label {
		font-size: 18px;
	}
	.counter-container {
		margin-top: 30px;
		margin-bottom: 30px;
		gap: 18%;
	}
	.about_serving_box{
		grid-template-columns: 100%;
		gap:25px;
	}
	span.counte-sing{
		font-size: 40px;
	}
	.section-description{
		font-size: 18px;
	}
	.section-description p {
		margin-bottom: 20px;
	}
	/* 	.iamge_left, .image_right {
	display: none;
} */
	.about_compromise .container{
		padding:0;
	}
	.accordion-inner {
		flex-direction: column;
	}
	.accordion-image,
	.accordion-content {
		width: 100%;
	}
	.compromis_P {
		font-size: 18px;
		line-height: 26.5px;
	}
	.compromis_P p {
		margin-bottom: 20px;
	}
	.accordion-inner{
		gap: 40px; 
	}
	.accordion-title {
		font-size: 20px;
		line-height: 26px;
	}
	.accordion-body p {
		font-size: 16px;
		line-height: 21px;
	}
	.accordion-body p {
		margin-bottom: 15px;
	}
	.accordion-title span svg {
		width: 16px;
		vertical-align: bottom;
	}
	.guarantee_wrap{
		padding: 40px 20px 20px;
		gap: 30px;
	}
	.guarantee_wrap .sub-heading{
		font-size: 22px;
		line-height: 23px;
		margin-top: 4px;
	}
	.compromis_wrper .padding_100 {
		order: 2;
		grid-column: span 2; 
	}
	.compromis_wrper{
		display: grid;
		grid-template-columns: 48% 48%;
		column-gap: 4%;
		row-gap: 0;
	}
	.vertical-slider{
		height: 400px;
	}
	.slider .slide-track {
		width: 100%;
		max-width: 200px;
	}

}   

@media (max-width: 500px) {
	.guarantee_wrap .our_work_image_wrap{
		height: clamp(200px, 25vh, 278px);
	}	
}
@media (max-width: 425px) {
	.guarantee_wrap .our_work_image_wrap {
		height: clamp(200px, 100vh, 200px);
	}
}


@media (max-width: 1600px) {}
@media (max-width: 1440px) {}
@media (max-width: 1024px) {}