@import url('https://fonts.googleapis.com/css2?family=Inknut+Antiqua:wght@300;400;500;600;700;800;900&family=Playwrite+US+Trad:wght@100..400&family=Sen:wght@400..800&display=swap');

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.12.1/font/bootstrap-icons.min.css");
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    font-family: "Poppins", sans-serif !important;
    font-weight: 500;
}
p{
  font-family: "Sen", sans-serif;
}
.card__description{
  font-size: 16px;
    font-weight: 400;
    color: #575555;
      font-family: "Sen", sans-serif;
}
input::placeholder,
textarea::placeholder {
  font-size: 14px;
}
.active{
    color:rgb(14, 13, 13) !important;
  }
  .nav-item a{
    color: rgb(7, 7, 7);;
    font-size: 16px;
  }
 .nav-item a:hover{
  color: rgb(235,25,79)!important;
 }
 .nav-item.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
}
 .space{
     margin: 100px 0px 80px 0px;
  }
  
 /* navbar hamburger================================================================= */

 .navbar-toggler {
  border: 0 !important;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Lines of the Toggler */
.toggler-icon{
  width: 30px;
  height: 3px;
  background-color: #e74c3c;
  display: block;
  transition: all 0.2s;
}

/* Adds Space between the lines */
.middle-bar{
  margin: 5px auto;
}

/* State when navbar is opened (START) */
.navbar-toggler .top-bar {
  transform: rotate(45deg);
  transform-origin: 10% 10%;
}

.navbar-toggler .middle-bar {
  opacity: 0;
  filter: alpha(opacity=0);
}

.navbar-toggler .bottom-bar {
  transform: rotate(-45deg);
  transform-origin: 10% 90%;
}
/* State when navbar is opened (END) */

/* State when navbar is collapsed (START) */
.navbar-toggler.collapsed .top-bar {
  transform: rotate(0);
}

.navbar-toggler.collapsed .middle-bar {
  opacity: 1;
  filter: alpha(opacity=100);
}

.navbar-toggler.collapsed .bottom-bar {
  transform: rotate(0);
}
/* State when navbar is collapsed (END) */

/* Color of Toggler when collapsed */
.navbar-toggler.collapsed .toggler-icon {
  background-color: #777777;
}
.navbar-two{
    position: absolute;
    top: 0px;
}

.backbg {
    transition: all 0.5s linear;
    /* background: #faf7f7; */
    color: white;
    position: fixed;
    top: 0;
    z-index: 9999;
    width: 100%;
    left: 0;

  }
  .download-btn{
    width: 300px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #d85a05;
    border: none;
    z-index: 999;
  }
  .download-home-btn{
    width: 200px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #d85a05;
    border: none;
    z-index: 999;
    font-size: 14px;
  }
  .banner{
    /* background-image:
      url('../images/banners/Mobile-\ Banner.webp'); */
      background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751950307/Mobile-_Banner_jlblsu.webp);
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    color: white;
    overflow-x: hidden;
  }
  .first-step{
    background-image:url('../images/banners/Mobile- First Step.webp');
  background-size: cover;
  background-position: center;
    background-repeat: no-repeat;
  width: 100%;
  /* height: 100%;
  min-height: 120vh !important; */
  color: white;
  overflow-x: hidden;
  /* margin-top: 100px 0px; */
  }
.plot-section{
  /* background-image:
  url('../images/Na-plot/generation-mobile-view.webp'); */
  background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751965183/generation-mobile-view_m72l9n.webp);
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  /* height: 120vh !important; */
  padding: 80px 0px 200px 0px;
}
.master-plan{
  position: relative;
}
.plan-content{
  position: absolute;
  top: 34%;
  left: 5%;
}
  .sea-view{
    margin: 80px 0px ;
    overflow-x: hidden;
  }
  .tagline {
    font-family: "Inknut Antiqua", serif;
    font-weight: 500;
    font-style: normal;
    font-size: 18px;
    line-height: 38px;
    letter-spacing: 3px;
    color: #C08A4E;
    text-transform: uppercase;
}
.tagline-light{
  font-family: "Inknut Antiqua", serif;
  font-weight: 500;
  font-style: normal;
  font-size: 18px;
  line-height: 30px;
  letter-spacing: 3px;
  color: #fff;
  text-transform: uppercase;
}
  .tagline2{
    font-family: "Inknut Antiqua", serif;
  font-weight: 500;
  font-style: normal;
  font-size: 18px;
  line-height: 38px;
  color: #C08A4E;
  }
  .para{
    font-size: 16px;
    line-height: 35px;
    font-weight: 400;
    color: #575555;
   
  }
.new-price{
  font-size: 13px;
}
  .nature{
    background-image:
    url('../images/banners/Mobile-\ Blue\ Print.webp');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  /* margin-top: 100px; */
  }
  .highlight{
color: #161515;
font-size: 23px;
  }
  .video{
    padding: 40px 0px;
  }
  .watch-tower{
    background-image:
    url('../images/background/watch\ tower.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  padding: 80px 0px;
  min-height: 100vh;
  display: flex;
  align-items: center;
  }
  .by-sea{
  
  width: 100%;
  height: 100%;
  padding: 50px 0px;
  /* min-height: 100vh; */
  }
  .contact-detaile{
    position: relative;
    
   }
   
 /* .contact-detaile{
  background-image: url(../images/Bottom.png);
  width: 100%;
  padding: 100px 0px;
  background-size: cover;
  background-repeat: no-repeat;
 } */
 .banner-txt{
  width: 100%;
  height: 600px;
padding-top: 130px;
  /* display: flex;
  justify-content: center;
  align-items: center; */
}
.sml-txt{
  font-size: 14px;
  color: #7B7A7A;
    font-family: "Sen", sans-serif;
}
 .villa-banner{
  background-image: url(../images/background/site-banner.jpg);
  width: 100%;
  height: 100vh;
  padding: 100px 0px;
  background-size: cover;
  background-repeat: no-repeat;
 }
 .amenities-banner{
    background-image: linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.2)),url(../images/villa-comp.webp);
  width: 100%;
  height: 100vh;
  padding: 100px 0px;
  background-size: cover;
  background-repeat: no-repeat;
 }
 .amt-img{
  padding: 100px 0px;
 }
 .first-step{
  padding-top: 50px;
 }
 .first-step-para{
  color: #575555;
  line-height: 30px;
  font-size: 16px;

 }
 .location{
  color: #C08A4E;
  margin-top: 15px;
  font-size: 15px;
 }
 .up-title {
  position: relative;
  top: -30px; 
  z-index: 1;
}
.back-footer{
  background-image: url(../images/Bottom-crop-2.png);
  width: 100%;
  padding: 50px 0px;
  background-size: cover;
  background-repeat: no-repeat;
}
.yoga-banner{
  background-image: url(../images/banners/Yoga-mobile.png);
  width: 100%;
  padding-bottom: 30px;
  background-size: cover;
  background-repeat: no-repeat;
}
.info-section{
  margin-top: 50px;
  margin-bottom: 50px;
}
.information{
  margin-bottom: 340px;
}
.dapoli-banner{
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  /*background-image: url(../images/Dapoli-Page/Banner-img-mobile-view.webp);*/
  background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751965757/Banner-img-mobile-view_g4e3q5.webp);
 
  position: relative;
  
}
.about-banner{
   width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
 background-image: url(../images/banners/About\ Us.webp);
  position: relative;
}
.plot-banner{
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751965183/mobile-banner_ovkkua.webp);
}
.villa-banner{
  width: 100%;
  height: 120vh;
  background-size: cover;
  background-position: center;
  background-image: url(../images/Villa-Page/Villa\ banner.webp);
}
.image-container {
  position: relative;
  height: auto;

  border-radius: 20px !important;
}
.door{
  margin: 80px 0px;
}
.image-shrink {
  width: 100%;
  height: auto;
  max-height: 100%;
    overflow: hidden;
  transition: transform 0.5s ease;
  display: block;
  border-radius: 20px 0px !important;
}

.overlay-text {
  position: absolute;
  bottom: -140px;
  left: 0;
  width: 100%;
  color: #010101;
  text-align: center;
  transition: bottom 0.5s ease;
  border-radius: 0px 0px 20px 20px !important;
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2); 
  z-index: 2;
  padding: 30px;
}

.image-container:hover .overlay-text {
  bottom:5%;
}

.image-container:hover .image-shrink {
  transform: translateY(-120px);
}

.overlay-para {
  font-size: 14px;
}
.image-container {
  margin-bottom: 20px;
}

.cursive{
  font-size: 40px;
  font-family: "Playwrite US Trad", cursive;
  color: #C08A4E;
}

.slider-top{
  width: 80%;
  position: absolute;
  z-index: 2;
  top: 25%;
  left: 10%;
}
.floor-plan{
  padding: 80px 0px;
}
.swiper{
  padding-bottom: 50px !important;
}
.tranding-slider-control .swiper-pagination {
  position: absolute;
  width: 15rem;
  z-index: 1;
  bottom: -5rem !important;
}
.slider-section-new{
  width: 100%;
  padding: 80px 0px;
  background-color: #53630A;
  position: relative;
}
.ownership-card{
  width: 100%;
  height: 350px;
  border: #C6C2C2;
  border-radius: 10px;
  margin-bottom: 20px;
}
.thanks{
    background-image: url(../images/banners/thank-you.webp);
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
  .thank-box{
    width: 90%;
    height: 400px;
     background-color: rgba(0, 0, 0, 0.6);
    border-radius: 10px;


  } 
  .thank-btn{
    width: 200px;
    height: 48px;
    background-color: #7A0D16;
    color: #ffff;
  }
  .borderend{
    border-right: 1px solid gray;
  }


    .video-container {
            position: relative;
            display: inline-block;
            height: 400px;
        }

        .video-container img {
            display: block;
            width: 100%;
              height: 400px;
        }

        .video-container .play-button {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 50px;
            height: 50px;
            background-color: rgba(0, 0, 0, 0.5);
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
            animation: pulse 1.5s infinite;
        }

        .video-container .play-button::before {
            content: '';
            width: 0;
            height: 0;
            border-left: 15px solid white;
            /* Triangle for the play symbol */
            border-top: 10px solid transparent;
            border-bottom: 10px solid transparent;
        }

        /* Pulsing animation for the play button */
        @keyframes pulse {

            0%,
            100% {
                transform: translate(-50%, -50%) scale(1);
                opacity: 1;
            }

            50% {
                transform: translate(-50%, -50%) scale(1.2);
                opacity: 0.8;
            }
        }

        /* Hover effect to make it interactive */
        .video-container .play-button:hover {
            background-color: white;
            animation: none;
        }

        .video-container .play-button:hover::before {
            border-left-color: black;
        }
         .image-container {
  margin-bottom: 0px;
}
  #main-image {
    transition: opacity 0.5s ease;
  }
.image-n {
  position: relative;
  overflow: hidden;

}

.view-n {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 30%;
  background-color: #faf9f8;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateY(100%);
  transition: transform 0.3s ease;
}

.image-n:hover .view-n {
  transform: translateY(0%);
}
 @media screen and (min-width: 992px) {
  .about-banner{
   width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-image: url(../images/banners/About\ Us.webp);
  position: relative;
}
   .amenities-banner{
    background-image: url(../images/villa-comp.webp);
 
 }
   .card-container {
      perspective: 1000px;
    }

    .active2 {
      color: #e74c3c !important;
    }

    .card-img {
      position: relative;
      overflow: hidden;
    }

    .card-img {
      position: relative;
      width: 280px;
      margin: 2rem auto;
    }

    .card-img .front img {
      width: 100%;
      border-radius: 1rem;
      display: block;
    }

    .card-dapoli-details {
      width: 280px;
      background-color: var( #fff);
      padding: 1.5rem 2rem;
      box-shadow: 0 8px 24px hsla(0, 0%, 0%, .15);
      border-radius: 1rem;
      position: absolute;
      bottom: -9rem;
      left: 0;
      right: 0;
      margin-inline: auto;
      opacity: 0;
      transition: opacity 1s 1s;
    }

    /* Title and description styling */
    .card-dapoli-details h4 {
      font-size: var(--h2-font-size, 1.5rem);
      font-weight: 500;
      color: var(--title-color, #000);
      margin-bottom: .75rem;
    }

    .card-dapoli-details p {
      font-size: var(--small-font-size, 0.875rem);
      margin-bottom: .25rem;
    }

    /* Hover Animations */
    .card-img:hover .card-dapoli-details {
      animation: show-data 1s forwards;
      opacity: 1;
      transition: opacity .3s;
    }

    .card-img:not(:hover) .card-dapoli-details {
      animation: remove-data 1s forwards;
    }

    /* Keyframe Animations */
    @keyframes show-data {
      50% {
        transform: translateY(-10rem);
      }

      100% {
        transform: translateY(-7rem);
      }
    }

    @keyframes remove-data {
      0% {
        transform: translateY(-7rem);
      }

      50% {
        transform: translateY(-10rem);
      }

      100% {
        transform: translateY(0.5rem);
      }
    }



 .owl-nav {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 10;
}

.owl-theme .owl-nav [class*="owl-"] {
  color: #fff;
  font-size: 20px;
  width: 40px;
  height: 40px;
  background: #918e8e;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border-radius: 50%;
  position: absolute;
  pointer-events: auto;
  transition: background 0.3s ease, color 0.3s ease;
}

.owl-theme .owl-nav .owl-prev {
  left: -50px;
}

.owl-theme .owl-nav .owl-next {
  right: -50px;
}

.owl-theme .owl-nav [class*="owl-"]:hover {
  background: #918e8e;
  color: #fff;
}

.owl-carousel .owl-dots.disabled,
.owl-carousel .owl-nav.disabled {
  display: flex !important;
}

.owl-prev-icon,
.owl-next-icon {
  font-size: 28px;
  font-weight: bold;
  color: white;
}


   .first-step-para{
  width: 40%;
 }
  .dapoli-banner{
 width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  /*background-image: url(../images/Dapoli-Page/Banner-img.webp);*/
   background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751965757/Banner-img_yphvup.webp);
}
   .contact-img{
    padding: 100px 0px 200px;
  }
  .yoga-banner{
  background-image: url(../images/yoga-beach-1.webp);
  width: 100%;
  padding: 50px 0px;
  background-size: cover;
  background-repeat: no-repeat;

}
.new-price{
  font-size: 17px;
}
 .borderend2{
  border-right: 1px solid gray;
 }
.plot-banner{
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751965182/sea-view-na-plots_yfoxtx.webp);
}

  .plot-section{
    /* background-image:
    url('../images/Na-plot/generation.webp'); */
    background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751965183/generation_x6qlbu.webp);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 120vh !important;
    /* padding: 80px 0px 80px 0px; */
  }
   .thank-box{
    width: 40%;
    height: 400px;
     background-color: rgba(0, 0, 0, 0.6);
    border-radius: 10px;

   }
  .ownership-card{
    
    margin-bottom: 120px;
  }
  .beyond-ordinary{
    padding: 100px 0px;
  
  }
  .floor-plan{
    padding: 100px 0px;
  }
  .tagline-light{
    
    font-size: 26px;
    line-height: 50px;
    letter-spacing: 5px;
    color: #fff;
    text-transform: uppercase;
  }
  /* .sand{
    position: relative;
    margin-top:-50px ;
    z-index: 99;
    background-color: #fff;
   
  } */
   .land-owner{
    margin-bottom: 100px;
   }
  .door{
    margin: 100px 0px;
  }
   .space{
            margin: 150px 0px 200px 0px;
        }
  .banner{
    /* background-image:
      url('../images/banners/Home\ Banner.webp'); */
       background-image: url(https://res.cloudinary.com/dpqeqjeze/image/upload/v1751950313/Banner_Varsa_1_sepnrz.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    height: 120%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    color: white;
    overflow-x: hidden;
  }
  .first-step{
    
    background-image:url('../images/new-home/turtle\ background\ 1.png');
  background-size: cover;
  background-position: center;
    background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  min-height: 100vh !important;
  color: white;
  overflow-x: hidden;
  margin-top: 100px 0px;
  }

  .nature{
    background-image:
    url('../images/banners/1400-600px.webp');
  }
  .slider-section-new{
    width: 100%;
    padding: 100px 0px;
    background-color: #53630A;
    position: relative;
  }
  
  .download-btn{
    width: 340px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #d85a05;
    z-index: 999;
  } 
  .download-home-btn{
    width: 280px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #d85a05;
    border: 1px solid #b96606;
    z-index: 999;
    font-size: 16px;
  } 
  .cursive{
    font-size: 50px;
    font-family: "Playwrite US Trad", cursive;
   
  }
  .location{
   font-size: 18px;
   
   }
   .first-step{
    padding-top: 80px;
   }
  .tagline{
    font-size: 28px;
    line-height: 55px;
    letter-spacing: 5px;
  }
  .tagline2{
  font-size: 27px;
  }
  
  .info-section{
    margin-top: 100px;
  }
  .highlight{

    font-size: 24px;
      }
      .yoga-banner{
        
        padding: 100px 0px;
        
      }
      .watch-tower{
       
      padding: 0px;
      width: 100%;
      height: 100%;
      min-height: 100vh;
     
      }
      .video{
        padding: 100px 0px;
      }
      .sea-view{
        margin: 100px 0px ;
      }
      .by-sea{
  
        width: 70%;
        height: 100%;
        margin: 0 auto;
        padding: 80px 0px 50px 0px;
        }
        .wada-style-villa{
          position: relative;
          top: -30px;
          z-index: 1;
        }
        .back-footer{
          background-image: url(../images/Bottom-crop-2.png);
          width: 100%;
          padding: 100px 0px 60px 0px;
          background-size: cover;
          background-repeat: no-repeat;
        }
        .near-dapoli2{
          padding-bottom: 200px;
        }
        
 }
 @media screen and (min-width: 1400px) {
  .tagline, .tagline2{
    font-size: 42px;
    line-height: 55px;
  }
  .information{
    margin-bottom: 400px;
  }
  .plot-section{
    width: 100%;
    height: 100vh;
    
  }
  .near-dapoli {
    padding-bottom: 100px;
  }
 }
  @media screen and (min-width: 1400px) {
    
  .para{
font-size: 18px;
  }
 .yoga-banner {
  /* padding-bottom: 280px; */
  background-image: url(../images/yoga-beach-1.webp);
 
  width: 100%;
  padding: 50px 0px;
  background-size: cover;
  background-repeat: no-repeat;
  height: 110vh;
 }
  
   
  }
    @media  (min-width: 1900px) {
         .up-title2{
          top: -273px !important;
        }
      .back-footer{
        padding: 48px 0px 60px 0px!important;
      }
    }