 @font-face {
 font-family: 'BebasNeuewebfont';
 src: local('BebasNeuewebfont'), url('../fonts/BebasNeuewebfont.woff') format('woff');
}
 @font-face {
 font-family: 'ChangaOne-Regular';
 src: local('ChangaOne-Regular'), url('../fonts/ChangaOne-Regular.woff') format('woff');
}
 @font-face {
 font-family: 'DMSans-Bold';
 src: local('DMSans-Bold'), url('../fonts/DMSans-Bold.woff2') format('woff');
}
 
 @font-face {
 font-family: 'DMSans-Regular';
 src: local('DMSans-Regular'), url('../fonts/DMSans-Regular.woff2') format('woff');
}




/* use this class to attach this font to any element i.e. <p class="fontsforweb_fontid_1962">Text with this font applied</p> */
.fontsforweb_fontid_1962 {
	font-family: 'BebasNeuewebfont' !important;
}
body {
	margin: 0;
}
h1 {
	font-family: 'BebasNeuewebfont';
}
.navbar-custom {
	background-color: #d92121;
	padding: 1rem 2rem;
}
.navbar-nav .nav-link {
	color: white; font-family: 'DMSans-Regular';
	margin-right: 1rem;
	padding: 0.5rem 2rem;
	border-radius: 25px;
	transition: background 0.3s;
}
.navbar-expand-lg .navbar-nav .nav-link {
	padding: 9px 18px;
	text-transform:uppercase;
	border:1px solid rgba(255, 255, 255, 0);
}
.navbar-nav .nav-link:hover,  .navbar-nav .nav-link.active {
	border:1px solid rgba(255, 255, 255, 0.2);
	color: white;
}
.login-btn {
	background-color: #ff9800;
	color: white !important;
	border-radius: 25px;
	padding: 0.5rem 1.5rem;
	font-weight: bold;
	border: none;  font-family: 'DMSans-Regular';
}
.navbar-brand {
	font-weight: bold;
	color: white;
	display: flex;
	align-items: center;
	gap: 0.2rem;
}
.vvs-letter {
	border: 2px solid white;
	padding: 0.2rem 0.5rem;
	transform: rotate(-5deg);
	font-size: 1.5rem;
}
 @media (max-width: 991px) {
 .navbar-nav {
 text-align: center;
}
}
.benefit-section {
	padding: 4rem 1rem;
	position: relative;
	text-align: center;
	background:#FFEFF0;
	text-align:center;
}
.benefit-column {
	position:relative;
}
.benefit-title {
	font-family: 'BebasNeuewebfont';
	font-size: 85px;
	margin-bottom: 2rem;
	color:#000;
	text-align:center;
}
.benefit-card {
	text-align: left;
	margin-bottom: 2rem;
	padding:0 70px;
}
.benefit-icon {
	font-size: 2rem;
	color: #d92121;
	margin-bottom: 0.5rem;
	text-align:center;
}
.benefit-text h5 {
	font-family: 'BebasNeuewebfont';
	font-size: 32px;
	margin-bottom: 7px;
	color:#000;
	text-align:center;
}
.benefit-text p {
	font-size:18px;
	font-family: 'DMSans-Regular';
	color: rgba(0, 0, 0, 0.4);
	text-align:center;
}
.center-image {
	max-width: 100%;
	height: auto;
}
 @media (max-width: 992px) {
 .benefit-column {
 text-align: center;
}
}
.productOuter {
	background:#D71F27;
	padding:60px;
}
.curated-title {
	font-size: 85px;
	color: white;
	margin-bottom: 2rem;
	font-family: 'BebasNeuewebfont';
	text-align:center;
}
.product-card {
	border-radius: 25px;
	padding: 2rem 1rem 1rem;
	text-align: center;
	color: white;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	transition: transform 0.3s;
}
.product-card:hover {
	transform: translateY(-5px);
}
.product-card img {
	width: auto;
	max-width: max-content;
	margin: 0 auto;
}
@media(max-width : 780px){
 .product-card {
     height: 70%;
 } 
 .product-card img{
     height: inherit;
 }
 
}
.product-card h3 {
	font-size: 33px;
	color: white;
	font-family: 'ChangaOne-Regular';
}
.benefit-cardmiddle {
	margin-left: 110px;
	padding: 0;
}
.benefit-cardmiddleright {
	margin-right: 110px;
	padding: 0;
}
.product-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: auto;
	padding:20px 8px 0;
}
.arrow-circle {
	background-color: transparent;
	color: #000;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	border:2px solid #fff;
	padding: 17px 17px;
}
.yellow {
	background-color: #E0A811;
}
.brown {
	background-color: #7C1105;
}
.blue {
	background-color: #242A5A;
}
.orange {
	background-color: #B24B31;
}
.maroon {
	background-color:#720001;
}
.darkbrown {
	background-color:#3e0200;
}
.grey {
	background-color:#5e5d62;
}

.darkorange {
	background-color:#cfa000;
}




.food2 {
	background-image: url(../images/food2.jpg);
	height: 960px;
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
	z-index: 3;
	position: relative;
	display:flex;
	align-items:center;
}
@media(max-width:780px){
    .food2{
        height: 500px;
    }
}
.lineleftl {
	position:absolute;
	top: 55px;
	right: -65px;
--e-transform-flipX: -1;
transform: perspective(var(--e-transform-perspective, 0)) rotate(var(--e-transform-rotateZ, 0)) rotateX(var(--e-transform-rotateX, 0)) rotateY(var(--e-transform-rotateY, 0)) translate(var(--e-transform-translate, 0)) translateX(var(--e-transform-translateX, 0)) translateY(var(--e-transform-translateY, 0)) scaleX(calc(var(--e-transform-flipX, 1) * var(--e-transform-scaleX, var(--e-transform-scale, 1)))) scaleY(calc(var(--e-transform-flipY, 1) * var(--e-transform-scaleY, var(--e-transform-scale, 1)))) skewX(var(--e-transform-skewX, 0)) skewY(var(--e-transform-skewY, 0));
	transform-origin: var(--e-transform-origin-y) var(--e-transform-origin-x);
}
.lineleft2  {
	position:absolute;
	right: 0;
	bottom: 63%;
--e-transform-flipX: -1;
transform: perspective(var(--e-transform-perspective, 0)) rotate(var(--e-transform-rotateZ, 0)) rotateX(var(--e-transform-rotateX, 0)) rotateY(var(--e-transform-rotateY, 0)) translate(var(--e-transform-translate, 0)) translateX(var(--e-transform-translateX, 0)) translateY(var(--e-transform-translateY, 0)) scaleX(calc(var(--e-transform-flipX, 1) * var(--e-transform-scaleX, var(--e-transform-scale, 1)))) scaleY(calc(var(--e-transform-flipY, 1) * var(--e-transform-scaleY, var(--e-transform-scale, 1)))) skewX(var(--e-transform-skewX, 0)) skewY(var(--e-transform-skewY, 0));
	transform-origin: var(--e-transform-origin-y) var(--e-transform-origin-x);
}

 .lineleft21 {
	position:absolute;
	right: 0;
	bottom: 37%;
--e-transform-flipX: -1;
transform: perspective(var(--e-transform-perspective, 0)) rotate(var(--e-transform-rotateZ, 0)) rotateX(var(--e-transform-rotateX, 0)) rotateY(var(--e-transform-rotateY, 0)) translate(var(--e-transform-translate, 0)) translateX(var(--e-transform-translateX, 0)) translateY(var(--e-transform-translateY, 0)) scaleX(calc(var(--e-transform-flipX, 1) * var(--e-transform-scaleX, var(--e-transform-scale, 1)))) scaleY(calc(var(--e-transform-flipY, 1) * var(--e-transform-scaleY, var(--e-transform-scale, 1)))) skewX(var(--e-transform-skewX, 0)) skewY(var(--e-transform-skewY, 0));
	transform-origin: var(--e-transform-origin-y) var(--e-transform-origin-x);
}
.lineleft3 {
	position:absolute;
	right: -120px;
	bottom: 45px;
--e-transform-flipX: -1;
transform: perspective(var(--e-transform-perspective, 0)) rotate(var(--e-transform-rotateZ, 0)) rotateX(var(--e-transform-rotateX, 0)) rotateY(var(--e-transform-rotateY, 0)) translate(var(--e-transform-translate, 0)) translateX(var(--e-transform-translateX, 0)) translateY(var(--e-transform-translateY, 0)) scaleX(calc(var(--e-transform-flipX, 1) * var(--e-transform-scaleX, var(--e-transform-scale, 1)))) scaleY(calc(var(--e-transform-flipY, 1) * var(--e-transform-scaleY, var(--e-transform-scale, 1)))) skewX(var(--e-transform-skewX, 0)) skewY(var(--e-transform-skewY, 0));
	transform-origin: var(--e-transform-origin-y) var(--e-transform-origin-x);
}
.linerightl {
	position:absolute;
	top: 55px;
	left: -50px;
}
.lineright2  {
	position:absolute;
	left: -40px;
	bottom: 63%;
}
.lineright21 {
	position:absolute;
	left: -40px;
	bottom: 37%;
}
.lineright3 {
	position:absolute;
	left: -120px;
	bottom: 65px;
}
.promo-section {
	background-color: #834a00;
	color: white;
	padding: 5rem 1rem;
}
.promo-img {
	max-width: 100%;
	height: auto;
}
.promo-section h3 {
	font-size: 85px;
	font-weight:normal;
	color: white;
	margin-bottom: 2rem;
	text-align:center;
	font-family: 'BebasNeuewebfont';
}
.highlight {
	color: #ffc107;
}
.buy-btn {
	background-color: white;
	color: #b20000;
	padding: 13px 35px 15px 35px;
	border-radius: 100px;
	font-weight: 600;
	text-decoration: none;
	display: inline-block;
	margin-top: 1.5rem;
	transition: background 0.3s;
	font-size: 20px; font-family: 'DMSans-Regular';
}
.buy-btn:hover {
	background-color: #b20000;
	color: #fff;
}
ul.promo-list {
	list-style: none;
	padding-left: 1.5rem;
	font-size:16px;
	font-family:"Inter";
	color:#fff;
	text-align:center;
	line-height:1.5;
}
ul.promo-list li {
	padding: 0 0 12px;
	font-family: 'DMSans-Bold';
	font-size:38px;
}
.healthy-section iframe {
	border:10px solid #000;
	border-radius:50px;
}
.healthy-section {
	background-color: #D71F27;
	color: white;
	padding: 6rem 1rem;
}
.healthy-section h3 {
	font-size: 85px;
	font-weight:normal;
	color: white;
	margin-bottom: 2rem;
	text-align:center;
	font-family: 'BebasNeuewebfont';
}
.healthy-section p {
	padding: 0 0 12px;
	font-family: 'DMSans-Bold';
	font-size:30px;
	text-align:center;
	line-height: normal;
	
}
.testimonialBg {
	background:#D71F27;
	padding: 6rem 1rem;
	text-align:center;
}
.testimonialBg h2 {
	font-size: 85px;
	text-align:center;
	color: #ffd200;
	margin-bottom: 2rem;
	font-family: 'BebasNeuewebfont';
}
.testimonialBg p {
	color:#fff;
	text-align:center;
	font-style:italic;
	padding: 0 0 12px;
	font-family: 'DMSans-Bold';
	font-size:20px; line-height: 31px;
}
.testimonialBg h5 {
	color: #ffd200;
	font-family: 'DMSans-Bold';
	margin:0;
}
.video-wrapper {
	position: relative;
	width: 100%;
	height: 1080px;
	overflow: hidden;
}
.footer {
	background-color: #ffffff;
	
	padding: 2rem 3rem; font-size:16px;
}
.footer h6 {
	 color:#000;
	margin-bottom: 1rem; font-family: 'DMSans-Bold';
}
.footer ul {
	list-style: none;
	padding: 0;
}
.footer ul li {
	margin-bottom: 0.5rem; font-family: 'DMSans-Bold'; color:#616166;
}

.copyrights{

border-top: 1px solid #ccc; font-family: 'DMSans-Regular'; font-size:14px; text-align:left; color:#616166;  padding: 40px 0 0;
    margin-top: 40px;

}


.followus h6{text-align:right;}

.followus a{ background:#FCF9F0; border-radius:100%;padding: 11px 13px 12px 13px;

}




.productOuter .swiper-slide {
  height: auto;
}
.product-card {
  border-radius: 8px;
  overflow: hidden;
}


 
 
 .productOuter {
  position: relative;
}




@media (max-width: 768px) {
 
}


.journeyBg {
    background: #ffd200;
    padding: 6rem 1rem;
    text-align: center;
}
.journeyBg h3 {
    text-align: center;
    color: #000; font-size: 85px;
    margin-bottom: 2rem;
    font-family: 'BebasNeuewebfont';
}


.masonry-section {

}

.masonry-grid {
   
  gap: 20px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: masonry;
  
  
  list-style: none;
  margin: 0;
  padding: 0;
}


 .masonry-item.card1 {
    margin: 10% 0 10% 23%;
}

.masonry-item.card3 {
    margin: 21% 24% 8% 0 ;
}

.masonry-item.card4 {
    margin:-11% 0 0 12%;
}

.masonry-item.card6 {
    margin:-9% 29% 0 0;
}
.masonry-item.card2{
 
 height:330px;
}

.masonry-item.card5{
     margin: -25% 0 0 0;
 height:330px;
}
 

.masonry-item {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: #000;
}

.masonry-item > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.masonry-item:hover >img {
  transform: scale(1.05);
}

.masonry-item .info {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 15px;
  background: linear-gradient(to top, rgba(0,0,0,0.6), transparent);
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.masonry-item .info h3 {
  margin: 0;
 text-align:left;
  font-weight: normal;
  font-size: 24px;
    color: white;
    font-family: 'ChangaOne-Regular';
}


 




/* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.timeline {
  white-space: nowrap;
  overflow-x: hidden;   font-family: 'DMSans-Regular';
}

.timeline ol {
  font-size: 0;
  width: 100vw;
  padding: 250px 0;
  transition: all 1s;
}

.timeline ol li {
  position: relative;
  display: inline-block;
  list-style-type: none;
  width: 160px;
  height: 5px;
  background: #d5d5d5;
    border-radius: 11px;
}

.timeline ol li:first-child{   

}


.timeline ol li:last-child {
 
}

.timeline ol li:not(:first-child) {
  margin-left: 14px;
}

.timeline ol li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(100% + 1px);
  bottom: 0;
  width: 12px;
  height: 12px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: #f00;
}

.timeline ol li div {
  position: absolute;
  left: calc(100% + 7px);
  width: 280px;
  padding: 15px;
  font-size: 1rem;
  white-space: normal;
  color: black;
  background: white; text-align: left;
    box-shadow: 0 1px 10px -1px #4e4e4e21;
}

.timeline ol li div::before {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
}



.timeline ol li:nth-child(odd) div {
  top: -16px;
  transform: translateY(-100%);
}

.timeline ol li:nth-child(odd) div::before {
  top: 100%;
  border-width: 12px 12px 0 0;
  border-color: #ff0000 transparent transparent transparent;
}

.timeline ol li:nth-child(even) div {
  top: calc(100% + 16px);
}

.timeline ol li:nth-child(even) div::before {
    top: -12px;
    border-width: 12px 0 0 12px;
    border-color: transparent transparent transparent #ff0000;
}

.timeline time {
  display: block;
  font-size: 19px;
  font-weight: bold;
  margin-bottom: 4px;
}

/* TIMELINE ARROWS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.timeline .arrows {
  display: flex;     margin-top: 20px;
  justify-content: center;
  margin-bottom: 20px;cursor: pointer;
}

.timeline .arrows .arrow__prev {
  margin-right: 20px; 
}

.timeline .disabled {
  opacity: 0.5;
}

.timeline .arrows img {
  width: 24px;
  height: 24px;
}

/* GENERAL MEDIA QUERIES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@media screen and (max-width: 599px) {
  .timeline ol,
  .timeline ol li {
    width: auto;
  }

  .timeline ol {
    padding: 0;
    transform: none !important;
  }

  .timeline ol li {
    display: block;
    height: auto;
    background: transparent;
  }

  .timeline ol li:first-child {
    margin-top: 25px;
  }

  .timeline ol li:not(:first-child) {
    margin-left: auto;
  }

  .timeline ol li div {
    position: static;
    width: 94%;
    height: auto !important;
    margin: 0 auto 25px;
  }

  .timeline ol li:nth-child(odd) div {
    transform: none;
  }

  .timeline ol li:nth-child(odd) div::before,
  .timeline ol li:nth-child(even) div::before {
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border: none;
    border-left: 1px solid white;
    height: 25px;
  }

  .timeline ol li:last-child,
  .timeline ol li:nth-last-child(2) div::before,
  .timeline ol li:not(:last-child)::after,
  .timeline .arrows {
    display: none;
  }
}

	
 





/* FOOTER STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.page-footer {
  position: fixed;
  right: 0;
  bottom: 20px;
  display: flex;
  align-items: center;
  padding: 5px;
  color: black;
  background: rgba(255, 255, 255, 0.65);
}

.page-footer a {
  display: flex;
  margin-left: 4px;
}


.timeline ol li div img{width: 50%;}
.timeline ol li div strong{
	    display: block;
    font-size: 15px;
    text-transform: inherit;
    margin: 0 0 9px;
}











@media screen and (max-width: 767px) { 

	.testimonialBg h2, .journeyBg h3, .healthy-section h3, .benefit-title, .curated-title {
    font-size: 50px;

	}

	.journeyBg {
 
    padding: 6rem 3rem;
 
}

.product-card img {
    width: auto;
    max-width: max-content;
    margin: 0 auto;
}
.benefit-section .row {
    display: block;
}


.lineleftl, .lineleft2, .lineleft3, .linerightl, .lineright2, .lineright3{
	display:none;
}

h3{
	font-size: 40px;
}

.product-card > img{

	max-width:100%;
 
}

.productOuter {
 
    padding: 35px 10px;
    height: 700px;
}

.benefit-cardmiddleright {
    margin-right: 0;
  
}
.benefit-cardmiddle {
    margin-left: 0;
  
}
.benefit-card {
 
    padding: 0 0;
}

ul.promo-list li {
  
    font-size: 22px;
}

ul.promo-list {
 
    padding-left: 0;
  
}

.masonry-grid {
 
    grid-template-columns: repeat(1, 1fr);
   
}
.masonry-item{
	margin:0 !important;
}

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

.healthy-section, .promo-section {
    padding: 35px 0.5rem;
}
.testimonialBg p{
    font-size: 16px;
}


}



.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: var(--swiper-navigation-top-offset, 58%);
}







