@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* start css*/

* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}

html {

    -webkit-text-size-adjust: 100%;

}



body {

    margin: 0;

    padding: 0;

    font-family: "Roboto", sans-serif;

    background-color: #fff;

}



img {

    max-width: 100%;

    height: auto;

}



p {

    color: #000000;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;

    line-height: 24px;

    font-style: normal;

    font-weight: 400;

}



h4,

h2 {

    color: #a2c046;

    font-family: "Poppins", sans-serif;

    font-size: 35px;

    font-style: normal;

    font-weight: 500;

    letter-spacing: 0px;

}



h2 {

    line-height: 64px;

    font-size: 52px;

}



.btn:focus {

    outline: 0;

    box-shadow: none;

}



/* Full Screen Toggle Menu */

/* ব্র্যান্ড + লোগো baseline ঠিক */

.megaMenu .navbar-brand,

.megaMenu .navbar-brand img {

    display: inline-block;

    vertical-align: middle;

}



    .megaMenu .navbar-brand img.logo-img {

        height: 32px;

        width: auto;

        margin-right: 10px;

    }



/* NAV container — Safari-safe */

.megaMenu .navbar-nav {

    display: flex;

    align-items: center;

    flex-wrap: nowrap; /* এক লাইনে */

    white-space: nowrap; /* টেক্সট ভাঙবে না */

}



    /* gap fallback (পুরোনো Safari) */

    .megaMenu .navbar-nav > .nav-item {

        flex: 0 0 auto;

        margin-right: 24px;

    }



        .megaMenu .navbar-nav > .nav-item:last-child {

            margin-right: 0;

        }



/* নতুন ব্রাউজারে gap ব্যবহার */

@supports (gap: 1rem) {

    .megaMenu .navbar-nav {

        gap: 24px;

    }



        .megaMenu .navbar-nav > .nav-item {

            margin-right: 0;

        }

}



/* লিঙ্ক ব্লক & nowrap */

.megaMenu .navbar-nav .nav-link {

    display: block;

    white-space: nowrap;

}



/* Sticky header */

.megaMenu .navbar {

    position: sticky;

    top: 0;

    z-index: 1050;

    background: #000;

}



/* মোবাইলে wrap করতে দিন */

@media (max-width: 991.98px) {

    .megaMenu .navbar-nav {

        white-space: normal;

        flex-wrap: wrap;

    }

}

/* COLOR TEXT */

/*  nav bar */



.navbar-toggler {

    border: none;

    background: transparent;

    font-size: 24px;

    color: #fff;

}



.navbar-brand {

    color: #fff;

    font-weight: bold;

    font-size: 22px;

}



.navbar-toggler {

    border: none;

    background: transparent;

    font-size: 24px;

    color: #fff;

}





.navbar-nav .nav-link {

    color: #ffffff;

    font-size: 20px;

    font-weight: 200;

    padding: 10px 20px;

    display: block;

    font-size: 14px;

    text-align: left;

    transition: 0.3s;

}



    .navbar-nav .nav-link:hover {

        /*    background: #ffa726;*/

        color: white;

    }



/* Fullscreen Menu */

.mobileMenu {

    position: fixed;

    top: 0;

    left: -100%;

    width: 80%;

    height: 100vh;

    background: #74b51e69;

    /*        display: flex;*/

    text-align: left;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    transition: left 0.3s ease;

    z-index: 1000;

}



    .mobileMenu.show {

        left: 0;

    }



.overlay {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    height: 100vh;

    opacity: 0;

    background: #74b51e;

    visibility: hidden;

    z-index: 999;

}



    .overlay.show {

        opacity: 1;

        visibility: visible;

    }



/* Close Button */

.closeMenu {

    position: absolute;

    left: 100%;

    top: 10px;

    bottom: 50px;

    right: 30px;

    font-size: 30px;

    font-weight: normal;

    color: #ffffff;

    cursor: pointer;

}





/* testing css */

.heroContainer {

    display: flex;

    gap: 20px;

}



.recBox {

    width: 150px;

    overflow: hidden;

    position: relative;

    background-color: #ddd;

}



    .recBox img {

        width: 100%;

        object-fit: cover;

        /* height: auto; */

        height: 100%;

        transition: height 0s forwards;

    }

/* Box 1: Opens from bottom to top */

.recBoxanimation1 {

    height: 0;

    animation: openBottomToTop 1s forwards, moveUp 1s forwards;

}



@keyframes openBottomToTop {

    from {

        height: 0;

    }



    to {

        height: 300px;

    }

}



@keyframes moveUp {

    from {

        transform: translateY(0);

    }



    to {

        transform: translateY(-50px);

    }

}



/* Box 2: Opens from top to bottom */

.recBoxanimation2 {

    height: 0;

    animation: openTopToBottom 1s forwards, moveDown 1s forwards;

}



@keyframes openTopToBottom {

    from {

        height: 0;

    }



    to {

        height: 300px;

    }

}



@keyframes moveDown {

    from {

        transform: translateY(0);

    }



    to {

        transform: translateY(50px);

    }

}



.sectiontitle {

    text-align: center;

    padding-bottom: 35px;

}



    .sectiontitle span {

        color: #000000;

    }



.sectionPadding {

    padding: 35px 0;

}



.navbar {

    position: -webkit-sticky;

    position: sticky;

    top: 0;

    background: #000000;

    color: #ffffff;

    padding: 10px;

    text-align: center;

    z-index: 100;

    -webkit-transform: translateZ(0);

    -webkit-backface-visibility: hidden;

    backface-visibility: hidden;

    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Adds a shadow */

}



.navbar-nav a {

    font-size: 18px;

    text-transform: uppercase;

    font-weight: bold;

    color: #ffffff;

}



.navbar-brand {

    color: #fff;

    font-size: 25px;

    text-transform: uppercase;

    font-weight: bold;

    letter-spacing: 2px;

}



.navbar a:hover {

    color: #89d526;

}



.navbar-nav a {

    font-weight: 200;

}

/* hero section */

/* .carousel-caption {

  position: relative;

} */

/* s */

.bannerContentOne {

    position: relative;

    top: 50%;

    transform: translate(-50%, -50%);

    left: 50%;

    /* bottom: 50%;

    left: 23%;

    padding-right: 200px;*/

}



    .bannerContentOne p {

        color: #fff;

    }



.carousel-item {

    /*max-height: 700px;*/

}



    .carousel-item:nth-child(1)::before {

        content: "";

        position: absolute;

        top: 0;

        left: 0;

        right: 0;

        bottom: 0;

        background: rgba(0, 0, 0, 0.5);

    }



.carousel-caption {

    position: absolute;

    right: 0;

    top: 50%;

    transform:translate(-50%, -50%);

    left:50%;

    padding-top: 1.25rem;

    padding-bottom: 1.25rem;

    color: #fff;

    /* left: 19%;

    right: 0%;

    padding-top: 0;

    padding-bottom: 0;

    top: 20%;*/

}



    .carousel-caption.carouselContent {

  /*      left: 22%;

        right: 0%;

        padding-top: 0;

        padding-bottom: 0;

        top: 30%;*/

    }



.paragraphtext {

    position: absolute;

    font-size: 18px;

    font-family: "Roboto", sans-serif;

    font-weight: light;

    color: white;

    padding-top: 20px;

    display: flex;

    padding-top: 10px;

    z-index: 1;

    /*font-family: "Montserrat", sans-serif;*/

    /* text-align: center;

  left: 22%;

  right: 0%;

  padding-top: 0;

  padding-bottom: 0;

  top: 30%; */

}



.animatedbox {

    position: relative;

    width: 150px;

    height: 385px;

    background: #007bff;

    display: flex;

    justify-content: center;

    align-items: center;

    color: white;

    font-size: 18px;

    font-weight: bold;

    border-radius: 10px;

    opacity: 0; /* Initially hidden */

    transition: all 0.6s ease-in-out;

    animation: slideFromLeft 2s ease-in-out;

}



    .animatedbox:nth-child(1) {

        position: absolute;

        top: -15%;

        right: 90%;

    }



    .animatedbox:nth-child(2) {

        background: #bbff00;

        position: absolute;

        height: 370px;

        top: 5%;

        left: -27%;

    }

/*  - Comes from Left */

.animatedbox1 {

    animation: slideFromLeft 1s ease-out forwards;

}



@keyframes slideFromLeft {

    from {

        opacity: 0;

        transform: translateY(50px);

    }



    to {

        opacity: 1;

        transform: translateY(0);

    }

}



/* Comes from Right */

.animatedbox2 {

    animation: slideFromRight 1s ease-out 0.5s forwards;

}



@keyframes slideFromRight {

    from {

        opacity: 0;

        transform: translateY(-150px);

    }



    to {

        opacity: 1;

        transform: translateY(0);

    }

}



.carousel-caption {

    text-align: center;

}

.carousel-indicators{

    display:none;

}

.carousel-caption .bannerContentOne h5 {

    font-family: "Roboto", sans-serif;

    text-align: center;

    font-size: 45px;

    text-transform: uppercase;

    letter-spacing: 2px;

    padding-top: 0px;

    color: #57910b;

    font-weight: 400;

    padding-left: 148px;

}







.carousel-caption .bannerContentOne p {
    font-family: "Montserrat", sans-serif;
    text-align: center;
    font-size: 25px;
    padding: 2px 0px 0;
    letter-spacing: 1px;
    color: #f4f4f4;
    font-weight:300;
    /*line-height:37px;*/
}



.contentBox {

    width: 90%;

    height: 200px;

    background-color: rgba(0, 255, 34, 0.582);

    position: absolute;

    top: 0%;

    left: 150px;

    animation: moveRight 2s ease-out forwards;

}



@keyframes moveRight {

    0% {

        left: -150px;

    }



    100% {

        left: -50%;

        transform: translateX(0);

    }

}



/*.HeroSection .text {

    font-size: 35px;

    font-family: "Roboto", sans-serif;

    font-weight: 600;

    color: #fff;

    padding-top: 47px;*/

/*padding-top: 30px;*/

/*display: flex;

    gap: 6px;

    letter-spacing: 20px;

    text-align: center;

}*/

.kalyani-heading{

    font-size:40px;

}

.HeroSection .text {

    /*font-size: 35px;

    font-family: "Roboto", sans-serif;

    font-weight: 600;

    color: #fff;

    padding-top: 72px;*/

    /* padding-top: 30px; */

    /*display: flex;

    gap: 35px;

    letter-spacing: 8px;

    text-align: center;

    margin-left: -159px;*/

    font-size: 25px;

    font-family: "Roboto", sans-serif;

    font-weight: 600;

    color: #fff;

    padding-top: 0px;

    /* padding-top: 30px; */

    /*display: flex;*/

    gap: 24px;

    letter-spacing: 5px;

    text-align: center;

    /* margin-left: -159px; */

    /*padding-left: 148px;*/

}



    .HeroSection .text span {

        display: inline-block;

        opacity: 0;

        transform: translateY(-100px);

        animation: fallDown 1s ease-out forwards;

    }



/* Apply different delays to each letter */

.text span:nth-child(1) {

    animation-delay: 0s;

}



.text span:nth-child(2) {

    animation-delay: 0.2s;

}



.text span:nth-child(3) {

    animation-delay: 0.4s;

}



.text span:nth-child(4) {

    animation-delay: 0.6s;

}



.text span:nth-child(5) {

    animation-delay: 0.8s;

}



.text span:nth-child(6) {

    animation-delay: 1s;

}



.text span:nth-child(7) {

    animation-delay: 1.2s;

}



.text span:nth-child(8) {

    animation-delay: 1.5s;

}



.text span:nth-child(9) {

    animation-delay: 1.7s;

}



.text span:nth-child(10) {

    animation-delay: 1.8s;

}



.text span:nth-child(11) {

    animation-delay: 2s;

}



.text span:nth-child(12) {

    animation-delay: 2.2s;

}



.text span:nth-child(13) {

    animation-delay: 2.4s;

}



.text span:nth-child(14) {

    animation-delay: 2.6s;

}



.text span:nth-child(15) {

    animation-delay: 2.8s;

}



.text span:nth-child(16) {

    animation-delay: 2.8s;

}



.text span:nth-child(17) {

    animation-delay: 2.8s;

}



.text span:nth-child(18) {

    animation-delay: 2.8s;

}



.text span:nth-child(19) {

    animation-delay: 2.8s;

}



.text span:nth-child(20) {

    animation-delay: 2.8s;

}





@keyframes fallDown {

    0% {

        opacity: 0;

        transform: translateY(-100px);

    }



    100% {

        opacity: 1;

        transform: translateY(0);

    }

}



.carousel-caption.paracaption {

    width: 100%;

    height: 50px;

    background-color: rgba(0, 0, 0, 0.438);

    position: absolute;

    top: 25%;

    left: 0%;

}



    .carousel-caption.paracaption p {

        position: absolute;

        font-family: "Roboto", sans-serif;

        font-size: 24px;

        font-weight: light;

        color: white;

        display: flex;

        left: 35%;

        transform: translateX(-50%);

        padding-top: 10px;

        text-align: center;

        z-index: 1;

        text-transform: uppercase;

        letter-spacing: 1px;

        font-family: "Montserrat", sans-serif;

    }



/* Zoom-In Animation */

.zoom-in {

    animation: zoomIn 1s ease-in-out forwards;

}



@keyframes zoomIn {

    0% {

        transform: scale(0.5);

        opacity: 0;

    }



    100% {

        transform: scale(1);

        opacity: 1;

    }

}

/* .card {

  width: 300px;

  height: 200px;

  background-color: #0000008a;

  color: white;

  font-size: 20px;

  font-weight: bold;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  position: absolute;

  top: 370%;

  right: 0;

  animation: moveRightArrow 2s ease-in-out forwards;

} */



/* @keyframes moveRightArrow {

  from {

    right: 0;

  }

  to {

    right: 50%;

  }

} */

.cardFlex {

    display: flex;

    justify-content: space-evenly;

    align-items: center;

    flex-wrap: wrap;

    position: absolute;

    top: 370%;

    width: 100%;

    padding: 0 10px;

}



.card1 {

    /* width: 0;

  height: 200px;

  background-color: #0000008a;

  color: white;

  font-size: 20px;

  font-weight: bold;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  overflow: hidden;

  white-space: nowrap;

  padding: 0;

  position: absolute;

  top: 370%;

  left: 60px; /* Adjust position */

    width: 0;

    height: 200px;

    background-color: #0000008a;

    color: white;

    font-size: 20px;

    font-weight: bold;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    overflow: hidden;

    white-space: nowrap;

    padding: 0;

    animation: expandCard 2s ease-in-out forwards;

    transform-origin: right;

}

/* .card2 {

  width: 0;

  height: 200px;

  background-color: #0000008a;

  color: white;

  font-size: 20px;

  font-weight: bold;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  overflow: hidden;

  white-space: nowrap;

  padding: 0;

  position: absolute;

  top: 370%;

  left: 51%;

  animation: expandCard 2s ease-in-out forwards;

} */

/* .card3 {

  width: 0;

  height: 200px;

  background-color: #0000008a;

  color: white;

  font-size: 20px;

  font-weight: bold;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  overflow: hidden;

  white-space: nowrap;

  padding: 0;

  position: absolute;

  top: 370%;

  left: 76%; 

  animation: expandCard 2s ease-in-out forwards;

} */

@keyframes expandCard {

    from {

        width: 0;

        padding: 0;

        opacity: 0;

    }



    to {

        width: 22%; /* Adjust width as needed */

        padding: 20px;

        opacity: 1;

    }

}



.learnMore.shopNow {

    margin-left: 0px;

}

/* .carousel-caption h5 {

  font-size: 45px;

  text-transform: uppercase;

  letter-spacing: 2px;

  margin-top: 25px;

}

.carousel-caption p {

  width: 60%;

  margin: auto;

  font-size: 18px;

  line-height: 1.9;

}

.carousel-caption a {

  text-transform: uppercase;

  text-decoration: none;

  background: darkorange;

  padding: 10px 30px;

  display: inline-block;

  color: #000;

  margin-top: 15px;

} */



/* .navbar-light .navbar-brand {

  color: #fff;

  font-size: 25px;

  text-transform: uppercase;

  font-weight: bold;

  letter-spacing: 2px;

}

.navbar-light .navbar-brand:focus,

.navbar-light .navbar-brand:hover {

  color: #fff;

}

.navbar-light .navbar-nav .nav-link {

  color: #fff;

}

.navbar-light .navbar-nav .nav-link:focus,

.navbar-light .navbar-nav .nav-link:hover {

  color: #fff;

}

.w-100 {

  height: 100vh;

}

.navbar-toggler {

  padding: 1px 5px;

  font-size: 18px;

  line-height: 0.3;

  background: #fff;

} */



/* about section css */

.aboutSubtitle {

    padding: 0 45px 150px;

    margin-top: 20px;

    text-align: center;

}



.whyaboutSubtitle {

    padding: 0 45px 120px;

    margin-top: 20px;

    text-align: center;

}



.dottedList {

    display: flex;

    list-style-type: none;

    padding: 50px 50px;

    margin: 0;

    text-align: center;

}



    .dottedList p {

        padding-top: 10px;

        color: #a4a4a4;

        opacity: 1;

    }



ul {

    list-style-type: none;

    padding: 0;

    display: flex;

    justify-content: space-between;

}



.dottedList li {

    position: relative;

    padding: 6px;

}



.dottedList span {

    font-weight: bold;

    color: #000000;

    font-size: 22px;

    margin-bottom: 20px;

}



.dottedList li:nth-child(1)::after {

    content: "";

    position: absolute;

    left: 50%;

    bottom: 200%;

    height: 25%;

    width: 170px;

    border-top: 3px dashed #74b51e;

    /* transform: translateY(-50%); */

    transform: translateX(50%);

}



.dottedList li:nth-child(2)::after {

    content: "";

    position: absolute;

    left: 60%;

    bottom: 200%;

    height: 25%;

    width: 170px;

    border-top: 3px dashed #74b51e;

    /* transform: translateY(-50%); */

    transform: translateX(50%);

}



.dottedList li:nth-child(3)::after {

    content: "";

    position: absolute;

    left: 67%;

    bottom: 200%;

    height: 25%;

    width: 146px;

    border-top: 3px dashed #74b51e;

    /* transform: translateY(-50%); */

    transform: translateX(50%);

}



.dottedList li:nth-child(1)::before {

    /*font-family: "Font Awesome 6 Free";

    content: "\f4d8";*/ /* Add star before */

    /*font-weight: 900;

    color: #74b51e;

    margin-right: 8px;

    position: absolute;

    bottom: 100%;

    left: 50%;

    font-size: 55px;

    transform: translateX(-50%);*/

    content: "";

    position: absolute;

    bottom: 100%;

    left: 50%;

    transform: translateX(-50%);

    width: 151px;

    height: 151px;

    background-image: url('../images/garden.png');

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

}



.dottedList li:nth-child(2)::before {

    /*    content: "\f279";*/ /* Add star before */

    content: "";

    position: absolute;

    bottom: 100%;

    left: 50%;

    transform: translateX(-50%);

    width: 143px;

    height: 143px;

    background-image: url('../images/acres.png');

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

}



.dottedList li:nth-child(3)::before {

    content: "";

    position: absolute;

    bottom: 100%;

    left: 50%;

    transform: translateX(-50%);

    width: 145px;

    height: 145px;

    background-image: url('../images/worker.png');

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

}



.dottedList li:nth-child(4)::before {

    font-family: "Font Awesome 6 Free";

    content: "\f24e"; /* Add star before */

    font-weight: 900;

    color: #74b51e;

    margin-right: 8px;

    position: absolute;

    bottom: 92%;

    left: 50%;

    font-size: 113px;

    transform: translateX(-50%);

}



.dottedList li:last-child::after {

    border-top: transparent;

}

/*  */

.productD {

    display: flex;

    text-align: left;

    justify-content: space-between;

}



.productimg {

    /*   max-width: 100%;

  transform: translateX(-100px);*/

    width: 450px;

    border-radius: 27px;

    border: 3px solid #89d526;

    height: 450px;

}



.productNewContent {

    margin-left: 90px;

    padding: 89px 80px 0 0;

}



.shopNow {

    background: #89d526;

    border-radius: 15px;

    padding: 10px 25px;

    color: #ffff;

    margin-top: 20px;

    text-transform: uppercase;

    font-weight: 600;

    letter-spacing: 1px;



}



    .shopNow:hover {

        border: 2px solid #ffffff;

        background: #89d526;

        color: #000000;

    }

/* image gallarey */

.gallery {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    gap: 10px;

    margin-top: 20px;

}



    .gallery img {

        width: 200px;

        height: 230px;

        cursor: pointer;

        /*border-radius: 5px;*/

        /*transition: transform 0.6s ease-in-out;*/

        transition: all 0.6s ease-in-out;

        /*border-radius: 5px;*/

        box-shadow: 0 0 0 rgba(0, 0, 0, 0);

        /*transition: transform 0.3s;*/

    }



        .gallery img:hover {

            /*transform: scale(1.1);*/

            /* animation: pulseZoom 0.6s forwards;

            box-shadow: 0 0 25px rgba(0, 150, 136, 0.5);*/

            transform: scale(1.05) rotateZ(0.5deg);

            box-shadow: 0 12px 20px rgba(0, 0, 0, 0.15);

            filter: brightness(1.05) saturate(1.1);

        }



@keyframes pulseZoom {

    0% {

        transform: scale(1);

        box-shadow: 0 0 0 rgba(0, 0, 0, 0);

    }



    50% {

        transform: scale(0.9);

        box-shadow: 0 0 15px rgba(0, 150, 136, 0.3);

    }



    100% {

        transform: scale(1.1);

        box-shadow: 0 0 25px rgba(0, 150, 136, 0.5);

    }

}



/* Lightbox Modal */

.gallery {

    display: flex;

    flex-wrap: wrap;

    gap: 33px;

}



.galleryItem {

    width: 30%;

    cursor: pointer;

}



.lightbox {

    display: none;

    position: fixed;

    z-index: 200;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.384);

}

/* position: fixed;

z-index: 100;

left: 0;

top: 0;

width: 50%;

height: 50%;

background-color: rgba(0, 0, 0, 0.158); */

.lightboxContent {

    position: relative;

    margin: auto;

    max-width: 80%;

    top: 24px;

}



.lightboximage {

    width: 100%;

    margin: auto;

    display: block;

}



.close,

.prev,

.next {

    color: white;

    font-size: 30px;

    padding: 10px;

    cursor: pointer;

    position: absolute;

}



.close {

    top: 10px;

    right: 20px;

}



.prev {

    left: 10px;

    top: 50%;

    transform: translateY(-50%);

}



.next {

    right: 10px;

    top: 50%;

    transform: translateY(-50%);

}

/* why k */

.kalyaniBoxcontent {

    padding-left: 15px;

    padding-right: 15px;

    width: 100%;

    background-color: #ffffff;

    height: 235px;

}



    .kalyaniBoxcontent h5 {

        color: #5c5c5c;

        font-size: 22px;

        padding-top: 20px;

    }



    .kalyaniBoxcontent p {

        margin-top: 18px;

        color: #5c5c5c;

        font-family: "Montserrat", sans-serif;

        font-size: 14px;

        min-height: 30px;

    }



.imageContainer img {

    width: 415px;

    height: 300px;

    /*  max-width: 100%;

  max-height: 100%;*/

    object-fit: cover;

}

/* send email section */

.contactSection {

    position: relative;

    width: 100%;

    max-height: 750px;

    background: url("../images/contact-us-bg.jpeg") center/cover no-repeat;

}



    .contactSection::before {

        content: "";

        position: absolute;

        top: 0;

        left: 0;

        right: 0;

        bottom: 0;

        background: rgba(0, 0, 0, 0.5);

    }



    .contactSection h5 {

        position: relative;

        z-index: 1;

        color: #ffffff;

        font-size: 54px;

    }



    .contactSection .emailContact {

        position: relative;

        z-index: 1;

        padding-top: 20px;

    }



.form {

    background: #ffffff00;

    padding: 10px;

    border-radius: 8px;

    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

}



input.inputDashed {

    width: 100%;

    padding: 10px;

    margin: 25px 0;

    border: none;

    border-bottom: 1px solid #ccc;

    outline: none;

    background-color: transparent;

    box-sizing: border-box;

    letter-spacing: 0.5px;

    font-size: 15px;

    font-family: "Montserrat", sans-serif;

    color: #fff;

}



    input.inputDashed:focus {

        border-bottom: 1px solid #89d526;

        border-color: #89d526;

        background-color: transparent;

    }



    input.inputDashed::placeholder,

    textarea.inputDashed::placeholder {

        color: #ffffff;

        opacity: 1;

    }



        input.inputDashed::placeholder:focus {

            color: #89d526;

            opacity: 1;

        }



textarea.inputDashed {

    border: none;

    border-bottom: 1px solid #ffffff;

    outline: none;

    padding: 8px;

    width: 100%;

    box-sizing: border-box;

    background-color: transparent;

    letter-spacing: 0.5px;

    font-size: 15px;

    font-family: "Montserrat", sans-serif;

}



    textarea.inputDashed:focus {

        border-bottom: 1px solid #89d526;

        border-color: #89d526;

        background-color: transparent;

    }



    textarea.inputDashed::placeholder {

        color: #ffffff;

        opacity: 1;

    }



        textarea.inputDashed::placeholder:focus {

            color: #89d526;

            opacity: 1;

        }



.contactSection .shopNow {

    font-family: "Montserrat", sans-serif;

    padding: 10px 50px;

}



    .contactSection .shopNow:hover {

        color: #000000;

        border: 2px solid #ffffff;

        background: #89d526;

    }



.contactSection button a {

    font-size: 16px;

    font-family: "Montserrat", sans-serif;

    color: #ffffff;

    text-decoration: none;

    letter-spacing: 0.5;

    text-transform: uppercase;

}

/* footer */

footer {

    position: relative;

    z-index: 1;

    margin-top: 20px;

    text-align: center;

}



    footer p {

        font-family: "Montserrat", sans-serif;

        font-size: 16px;

        font-weight: 300;

        color: #ffffff;

        margin-bottom: 10px;

    }



.footerCopy {

    margin-top: 50px;

}



/* ========CTC PAGE CSS START =====  */



.timeline {

    position: relative;

    width: 100%;

    height: 100%;

    margin-top: 10%;

    opacity: 0;

    /*    overflow: hidden;*/

}



    .timeline.visible {

        opacity: 1;

        transform: translateY(0);

    }

/*.timeline-image img {

    border-radius: 50%;

    width: 200px;

    height: 200px;

    object-fit: cover;

    opacity: 0;*/

/*    transform: scale(0.8);

    transition: opacity 0.8s ease, transform 0.8s ease;*/

/*}*/

.timeline-item img {

    position: relative;

    width: 300px;

    height: 300px;

    border-radius: 50%;

    object-fit: cover;

    /*transform: translateX(-251px);*/ /* Moves images closer to the timeline */

    border: 7px solid #83c52c;

    /*    transform: scale(1);*/

    /*    transition: opacity 0.8s ease, transform 0.8s ease;*/

}



@keyframes bounceIn {

    0% {

        /*        transform: scale(0.9) translateX(0);*/

        opacity: 0;

    }



    100% {

        /*        transform: scale(1) translateX(0);*/

        opacity: 1;

    }

}



.timeline-item.visible img {

    /*    animation: bounceIn 0.8s ease-out forwards;*/

    transform: scale(1);

    opacity: 1;

}

/* Staggered delay for images */

.timeline-item:nth-child(1) img {

    animation-delay: 0.4s;

}



.timeline-item:nth-child(2) img {

    animation-delay: 0.6s;

}



.timeline-item:nth-child(3) img {

    animation-delay: 0.8s;

}



.timeline-item:nth-child(4) img {

    animation-delay: 1s;

}



.timeline-item:nth-child(5) img {

    animation-delay: 1.2s;

}



.timeline-item {

    /*min-height: 200px;*/ /* Increased height */

    /*padding: 20px 0;*/

    display: flex;

    align-items: flex-start; /* Aligns content at the top */

    justify-content: space-between;

    min-height: auto;

    opacity: 0;

    transform: translateY(50px);

    transition: opacity 1s ease-out, transform 1s ease-out;

    /*    animation: fadeInUpTimeline 1s ease-out forwards;*/

}



@keyframes fadeInUpTimeline {

    from {

        opacity: 0;

        /*        transform: translateY(50px);*/

    }



    to {

        opacity: 1;

        /*        transform: translateY(0);*/

    }

}



.timeline-item.visible {

    animation: fadeInUpTimeline 1s ease-out forwards;

    opacity: 1;

    transform: translateY(0);

}

/* Staggered delay for items */

.timeline-item:nth-child(1) {

    animation-delay: 0.2s;

}



.timeline-item:nth-child(2) {

    animation-delay: 0.4s;

}



.timeline-item:nth-child(3) {

    animation-delay: 0.6s;

}



.timeline-item:nth-child(4) {

    animation-delay: 0.8s;

}



.timeline-item:nth-child(5) {

    animation-delay: 1s;

}



.timeline::before {

    content: "";

    position: absolute;

    left: 50%;

    width: 4px;

    background-color: #83c52c;

    bottom: 0;

    height: 0;

    transform: translateX(-50%);

    transition: height 2s ease-out;

}



.timeline.visible::before {

    animation: growLine 1s ease-out forwards;

    bottom: auto;

    top: 0;

    height: 100%;

}



@keyframes growLine {

    from {

        height: 0;

        top: 0;

    }



    to {

        height: 100%;

        top: 0;

    }

}



.timeline-item::before {

    content: "";

    position: absolute;

    left: 50%;

    width: 30px;

    height: 30px;

    background-color: #83c52c;

    border-radius: 50%;

    transform: translateX(-50%);

    z-index: 1;

}



.timeline-item:nth-child(odd)::before {

    top: 0%;

}



.timeline-item:nth-child(even)::before {

    top: 0%;

}



.timeline-item {

    display: flex;

    align-items: center;

    margin: 15px 0;

    position: relative;

}



    .timeline-item .content {

        /*background: white;*/

        flex-grow: 1;

        padding: 15px;

        border-radius: 8px;

        /*box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);*/

        width: 58%;

    }



    .timeline-item:nth-child(odd) {

        flex-direction: row-reverse; /* Image right, content left */

        text-align: left;

    }



    .timeline-item:nth-child(even) {

        flex-direction: row; /* Image left, content right */

        text-align: left;

    }



        .timeline-item:nth-child(even) img {

            transform: translateX(220px);

            bottom: 100px; /* Moves even images closer */

        }



    .timeline-item:nth-child(odd) img {

        transform: translateX(-220px);

        bottom: 100px; /* Moves even images closer */

    }



    .timeline-item:nth-child(odd) .content {

        margin-left: 10%;

        margin-bottom: 10%;

        margin-right: 32%;

        /*padding: 0px 365px 24px 100px;*/

    }



    .timeline-item:nth-child(even) .content {

        margin-left: 10%;

        margin-bottom: 10%;

        padding: 0px 108px 67px 259px;

    }



/*===== video backround ======*/

.video-container {

    display: flex;

    justify-content: center;

    align-items: center;

    height: 100vh;

    background: #222;

}



@media (max-width: 480px) {

    .video-container {

        display: flex;

        justify-content: center;

        align-items: center;

        height: 80vh;

        background: #222;

    }

}



video {

    width: 100vw;

    height: 100vh;

    object-fit: cover;

}



/* Add text over the video */

.video-content {

    position: relative;

    z-index: 1;

    color: white;

    text-align: center;

    font-size: 2rem;

    font-family: Arial, sans-serif;

    padding-top: 20%;

}



/* == ctc card ===*/

.ctc-card {

    text-align: center;

    height: 100%;

}



.timeline.grenntea-timeline {

    position: relative;

    width: 100%;

    height: 100%;

    margin-top: 11%;

    /* overflow: hidden; */

}



.timeline-item.grenntea-timeline-item:nth-child(odd) {

    flex-direction: row-reverse;

    text-align: right;

}



    .timeline-item.grenntea-timeline-item:nth-child(odd) .content {

        margin-left: 10%;

        margin-bottom: 26%;

        padding-top: 0px;

        /*padding: 2px 389px 0 0px;*/

    }



.timeline-item.grenntea-timeline-item:nth-child(even) .content {

    margin-left: 10%;

    margin-bottom: 20%;

    padding: 0px 108px 0 248px;

}



/* ==== green tea banner =====*/



.green-tea-banner-overlay-image {

    position: absolute;

    bottom: -50px;

    left: 50%;

    transform: translateX(-50%);

    width: 100px;

    height: 100px;

    border-radius: 50%;

    border: 4px solid white;

    background: url('') no-repeat center/cover;

}



.green-tea-banner {

    position: relative;

    width: 100%;

    height: 520px;

    /*    background-image: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)), url('/assets/images/imageGallarey/gallareyimg1.jpg');*/

    background-size: cover;

    background-position: center;

    display: flex;

    justify-content: center;

    align-items: center;

    padding-left: 50px;

    overflow: hidden;

    color: white;

    flex-direction: column;

    padding: 0;

    /*    animation: blurEffect 3s infinite alternate ease-in-out;*/

}



.green-tea-banner-image {

    position: absolute;

    width: 100%;

    height: 100%;

    background-image: url('/assets/images/imageGallarey/gallareyimg1.jpg');

    background-size: cover;

    background-position: center;

    display: flex;

    flex-direction: column;

}





.green-tea-banner::after {

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: rgba(0, 0, 0, 0.5);

    /*        background: linear-gradient(120deg, rgba(255, 255, 255, 0.2), transparent);*/

    /*        animation: shineEffect 3s infinite linear;*/

}

/*@keyframes shineEffect {

    0% {

        left: -100%;

    }



    100% {

        left: 100%;

    }

}*/



.green-tea-banner-text {

    font-family: Roboto;

    font-weight: 100;

    font-size: 60px;

    color: #fff;

    text-align: left;

    padding: 0 600px 50px 0;

    /*    font-size: 24px;

    font-weight: bold;

    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);*/

}



.green-tea-btn:first-child .shopNow {

    text-transform: uppercase;

    margin-right: 5px;

}





#roto {

    position: relative;

}



    #roto::before {

        content: "";

        position: absolute;

        width: 100%;

        height: 0;

        bottom: 0;

        left: 0;

        pointer-events: none;

        background: linear-gradient(0deg, #fff, transparent);

        opacity: 0;

        z-index: 4;

        transition: 0.2s all ease;

    }



    #roto.active::before {

        opacity: 1;

        height: 50%;

    }

.HeroSection{

    padding-top:0px;

}

.slide {

    width: 100%;

    /*min-height: 80vh;*/

    position: relative;

    overflow: hidden;

    background-color: #000;

}



    .slide .mainImage {

        position: absolute;

        width: 100%;

        height: 100%;

        object-fit: cover;

        object-position: center;

        left: 50%;

        top: 50%;

        transform: translate(-50%, -50%);

        animation-name: rotate;

        animation-timing-function: cubic-bezier(0.02, 0.63, 0.23, 0.99);

        animation-iteration-count: 1;

        animation-duration: 1.1s;

    }



    .slide .roundOuter {

        position: absolute;

        width: 86vw;

        height: 86vw;

        overflow: hidden;

        border-radius: 50%;

        left: calc(50% - 43vw);

        top: calc(50% - 43vw);

        filter: brightness(0.9);

        z-index: 1;

        border: 1px solid rgba(255, 255, 255, 0.2);

    }



        .slide .roundOuter img {

            position: absolute;

            width: 130vw;

            height: 130vw;

            left: 50%;

            top: 50%;

            transform: translate(-50%, -50%);

            object-fit: cover;

            object-position: center;

            animation-name: rotate;

            animation-timing-function: cubic-bezier(0.02, 0.63, 0.23, 0.99);

            animation-iteration-count: 1;

            animation-duration: 1.3s;

        }



    .slide .roundInner {

        position: absolute;

        width: 50vw;

        height: 50vw;

        overflow: hidden;

        left: calc(50% - 25vw);

        top: calc(50% - 25vw);

        border-radius: 50%;

        border: 1px solid rgba(255, 255, 255, 0.2);

        z-index: 2;

    }



        .slide .roundInner img {

            position: absolute;

            width: 130vw;

            height: 130vw;

            left: 50%;

            top: 50%;

            transform: translate(-50%, -50%);

            object-fit: cover;

            object-position: center;

            animation-name: rotate;

            animation-timing-function: cubic-bezier(0.02, 0.63, 0.23, 0.99);

            animation-iteration-count: 1;

            animation-duration: 1.2s;

        }



    .slide .slideText {

        position: absolute;

        z-index: 3;

        width: 100%;

        height: 100%;

        display: grid;

        place-content: center;

        text-align: center;

        background-color: rgba(0, 0, 0, 0.3);

    }



        .slide .slideText h1 {

            font-size: 5vw;

            font-weight: 400;

            text-transform: uppercase;

            letter-spacing: 5vw;

            text-align: center;

            padding-left: 5vw;

            animation-delay: 1s;

            color: #89d526;

            /*filter: drop-shadow(0 2px 10px #000);*/

            position: relative;

        }



            .slide .slideText h1::after {

                content: "";

                position: absolute;

                width: 40vw;

                height: 1px;

                background-color: #fff;

                bottom: 0;

                left: 50%;

                transform: translateX(-50%);

            }



        .slide .slideText p {

            font-family: Montserrat SemiBold;

            text-align: center;

            font-size: 34px;

            padding: 20px 0px 0;

            letter-spacing: 1px;

            color: #f4f4f4;

            /*  text-align: center;

            letter-spacing: 20px;

            font-weight: 600;

            font-size: 1.3rem;

            padding-left: 1.3rem;

            text-transform: uppercase;

            animation-delay: 1.5s;

            color: #ffff;*/

            /*            filter: drop-shadow(0 2px 10px #000);*/

        }



        .slide .slideText .buttonNav {

            display: flex;

            justify-content: center;

            gap: 12px;

            animation-delay: 1.7s;

        }



            .slide .slideText .buttonNav button {

                border: none;

                background: transparent;

                color: #fff;

                font-size: 1.3rem;

                filter: drop-shadow(0 2px 10px #000);

            }



            .slide .slideText .buttonNav span {

                display: grid;

                width: 1px;

                flex: 0 0 1px;

                background-color: #fff;

                filter: drop-shadow(0 2px 10px #000);

            }



@keyframes rotate {

    0% {

        transform: translate(-50%, -50%) rotate(0deg) scale(5);

    }



    100% {

        transform: translate(-50%, -50%) rotate(360deg) scale(1);

    }

}



#about {

    color: #999;

    padding-top: 80px;

    padding-bottom: 80px;

}



    #about h2 {

        color: #000;

    }



    #about img {

        width: 100%;

        height: 100%;

        object-fit: cover;

        object-position: center;

    }





/* === ABOUT SECTION =====*/

/*.aboutcard-container {

    perspective: 1000px;

}

.about-card {

    width: 250px;

    height: 350px;

    position: relative;

    transform-style: preserve-3d;

    transition: transform 0.6s;

}



.aboutcard-container:hover .about-card {

    transform: rotateY(180deg);

}



.about-card-front, .about-card-back {

    width: 100%;

    height: 100%;

    position: absolute;

    backface-visibility: hidden;

    display: flex;

    justify-content: center;

    align-items: center;

    font-size: 20px;

    font-weight: bold;

    color: white;

    border-radius: 10px;

}



.about-card-front {

    background: url('assets/images/imageGallarey/gallareyimg5.jpg') center/cover;

}



.about-card-back {

    background-color: #ff6b6b;

    transform: rotateY(180deg);

}

*/

.aboutcard-container {

    width: 350px;

    height: 350px;

    perspective: 1000px; /* 3D Effect */

}



.about-card {

    width: 100%;

    height: 100%;

    position: relative;

    transform-style: preserve-3d;

    transition: transform 0.6s ease-in-out;

}



.aboutcard-container:hover .about-card {

    transform: rotateY(180deg);

}



.about-card-front, .about-card-back {

    width: 100%;

    height: 100%;

    position: absolute;

    backface-visibility: hidden;

    display: flex;

    justify-content: center;

    align-items: center;

    font-size: 20px;

    font-weight: bold;

    color: white;

    border-radius: 10px;

}



.about-card-front {

    background: url('assets/images/imageGallarey/gallareyimg5.jpg') center/cover;

    background-size: cover;

    cursor: pointer;

}



.about-card-back {

    background-color: #a2c046;

    transform: rotateY(180deg);

}



.about-card-overlay {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background: rgba(0, 0, 0, 0.5);

    z-index: 5;

    /*    transition: background 0.4s ease-in-out;*/

}



.mainVideo {

    width: 100%;

    height: 100%;

    object-fit: cover;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 0;

}

/*.about-card-front:hover .about-card-overlay {

    background: rgba(0, 0, 0, 0.5);*/ /* Dark overlay effect */

/*}*/

.image-hover-card {

    position: relative;

    overflow: hidden;

    border-radius: 8px;

    display: inline-block;

    width: 85%;

    height: 300px;

    max-width: 100%;

}



    .image-hover-card img {

        width: 100%;

        /* height: auto;*/

        transition: transform 0.4s ease;

        display: block;

    }



    .image-hover-card::after {

        content: "";

        position: absolute;

        top: 0;

        left: 0;

        width: 100%;

        height: 100%;

        background: rgb(65 123 65 / 20%);

        opacity: 0;

        transition: opacity 0.3s ease;

        z-index: 1;

    }



    .image-hover-card:hover img {

        transform: scale(1.05);

    }



    .image-hover-card:hover::after {

        opacity: 1;

    }



.logo-img {

    width: 31%;

    height: 50px;

}



.our-estae-img {

    width: 309px;

    height: 200px;

    border-radius: 20px;

    padding-right: 50px;

}



    .our-estae-img img {

        width: 350px;

        height: 200px;

        border-radius: 20px;

        object-fit: cover;

    }



.our-estate-content {

    display: block;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 10px;

}



    .our-estate-content p {

        padding-top: 10px;

        padding-bottom: 10px;

        margin-bottom: 0px;

        font-size: 20px;

        font-weight: 600;

        cursor: pointer;

    }



    .our-estate-content span {

    }



.card-border-estate {

    border: 1px solid #89d526;

    padding: 20px;

    border-radius: 8px;

    background: #f6ffeb;

}





.our-estae-content-img {

    width: 400px;

    height: 250px;

    border-radius: 20px;

    /*padding-right: 50px;*/

}



    .our-estae-content-img img {

        width: 450px;

        height: 250px;

        border-radius: 20px;

        object-fit: cover;

    }



.estates-heading {

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    /*justify-content:space-evenly;*/

}



.mr-right {

    margin: 0px 0px 0px 88px;

}



.flip-card {

    perspective: 1000px;

}



.flip-card-inner {

    position: relative;

    width: 100%;

    height: 300px;

    transition: transform 0.6s;

    transform-style: preserve-3d;

}



.flip-card:hover .flip-card-inner {

    transform: rotateY(180deg);

}



.flip-card-front, .flip-card-back {

    /*position: absolute;*/

    width: 450px;

    height: 300px;

    border-radius: 20px;

    backface-visibility: hidden;

}



    .flip-card-front img {

        width: 450px;

        height: 300px;

        border-radius: 20px;

        object-fit: cover;

    }



.flip-card-back {

    background-color: #89d52626;

    display: flex;

    align-items: center;

    justify-content: center;

    transform: rotateY(180deg);

    border: 1px solid #89d526;

}



.map-link {

    color: #000;

    font-size: 18px;

    text-decoration: none;

}

/*.padding-820 {

    padding: 0px!important;

}

*/

.position-absolute {

    position: absolute;

}



.ks-about-shape-2 {

    content: '';

    width: 70%;

    height: 78%;

    background-color: #74b51e14;

    /*   opacity: 0.07;*/

    bottom: 187px;

    left: 0;

}



.ks-about-content {

    margin-top: 10px;

}



.accordion-flex {

    display: flex;

    align-items: center;

    justify-content: space-between;

}



.abt-k {

    color: #a2c046;

    font-size: 40px;

}



.accordion-row {

    position: relative;

}



    .accordion-row .accordion-icon {

        content: '';

        position: absolute;

        right: 15px;

        top: 50%;

        transform: translateY(-50%);

    }

/*.dottedList li {

    flex: 1;

    margin: 0 20px;

    position: relative; 

    opacity: 0; 

    transform: translateY(50px);

}*/

.k-content-color h6 {

    color: #2a6a39 !important;

    font-size: 20px;

}



.sarwastipur-teastates {

    display: flex;

    justify-items: center;

    justify-content: center;

    flex-wrap: wrap;

    padding-bottom: 15px;

}



.saraswatipur-tea-resort h5 {

    margin-top: 30px;

    margin-right: 15px;

}

.bullet-point::before {

    content: "•";

    color: #a2c046;

    font-size:35px;

    font-weight: 600;

    margin-right: 8px;

}



.slideText .text {

    font-size: 40px;

    font-family: "Roboto", sans-serif;

    font-weight: 600;

    color: #fff;

    padding-top: 0px;

    letter-spacing: 5px;

    text-align: center;

}

.with-bullet {

    position: relative;

    padding-left: 1.6rem; 

    margin: 0.2rem 0;

    font-size: 1rem;

}



    .with-bullet::before {

        content: "•";

        position: absolute;

        left: 0;

        top: 50%;

        transform: translateY(-50%);

        font-size: 1.6rem;

        line-height: 1;

        /* color, weight ইত্যাদি প্রয়োজনমতো বদলান */

    }