@import url('https://fonts.googleapis.com/css2?family=Imperial+Script&family=Inter:wght@100..900&family=Playfair+Display:ital,wght@0,400;0,500;1,400&family=Rajdhani:wght@500&family=Roboto+Serif:ital,opsz,wght@0,8..144,100..900;1,8..144,100..900&family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,700&display=swap');

:root{
  --black: rgba(0,0,0,1);
  --light-black: rgba(0,0,0,0.37);
  --white: rgba(255,255,255,1);

  --fw3: 300;
  --fw4: 400;
  --fw5: 500;
  --fw6: 600;
  --fw7: 700;
  --fw8: 800;
  --fw9: 900;

}

body{
  list-style: none;
  text-decoration: none;
  box-sizing: border-box;
  border: none;
  font-family: "Inter", sans-serif;
  background-color: var(--black) !important;
  color: var(--white) !important;
}
.hero {
  background: linear-gradient(var(--light-black),var(--light-black)), url('img/homepage.jpeg');
  background-position: 10% center; /* Added 'center' for better vertical positioning */
  background-size: cover;
  /* height: 100vh;
  width: 100%;
  position: relative; */
}
a, .right .btn{
  color: var(--white) !important;
}
.black{
  background-color: var(--black) !important;
}
/* .sticky-top.scrolled{
  background-color: rgba(255, 255, 255, 0.25);
  width: 100%;
} */
.brand a{
  /* font-size: 52.43px; */
  font-size: clamp(2rem, 2rem + 3vw, 3.26rem) !important;
  line-height: 63.45px;
  font-weight: var(--fw6);
  height: 63px;
  align-items: center;
}
.brand a span{
  color: var(--black);
  /* font-size: 36.34px; */
  font-size: clamp(1rem, 1.5rem + 1vw, 2.26rem) !important;
  background-color: var(--white);
  /* line-height: 39.04px; */
  /* height: 46.79px; */
  height: 37.79px;
  display: flex;
  align-items: center;
} 
.btn{
  --bs-btn-border-radius:none !important;
}
.trip{
  font-weight: var(--fw7);
  font-size: clamp(3rem, 2.4rem + 5vw, 7rem) !important;
  line-height: 1.2;
  /* font-size: 110.52px; */
  /* width: 592px; */
}
.frame2{
  background-color: rgba(255, 255, 255, 0.25);
  display: flex;
}
h6{
  font-weight: var(--fw7) !important;
}
/* .frame2 div:nth-child(3) , .frame2 div:nth-child(2) {
  border-left: 2.81px solid var(--white);
} */
.polygon{
  display: flex;
  align-items: flex-end;
}
.circle{
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
}
.circle2{
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--black);
  transform: translate(8.5px, 8px);
}

.gallery .circle{
  background: var(--white);
}
.stay .circle{
  /* background-color: var(--light-black); */
  background: rgba(0, 0, 0, 0.5);
}
.text{
  color: var(--white) !important;
  font-size: 20px;
  font-weight: var(--fw5);
  line-height: 26.09px;
  /* text-align: center; */
}
.places, .stay{
  border-bottom: 1px solid var(--white);
}
.places .container-lg{
  background: linear-gradient(rgba(0, 0, 0, .8),rgba(0, 0, 0, .8)), url('img/places\ of\ interest\ bg.png');
  background-position: center; /* Added 'center' for better vertical positioning */
  background-size: cover;
  color: var(--white);
}
.gallery img{
  border-radius: 50%;
  /* background-color: aqua; */
  width: 210px;
  height: 200px;
  max-width: 100%;
}
/* .gallery .col-md-3{
  width: 21% !important;
} */
.vl{
  height: 40px;
  /* text-align: center; */
  width: 0px;
  border-left: 2px solid var(--white);
}
.float-bottom{
  background: var(--light-black);
  width: 90%;
}
.extra span{
  font-weight: var(--fw4);
  font-size: 16px;
}
.bi-star-fill{
  color: goldenrod;
}
.bi-heart-fill{
  vertical-align: -0.4em !important;
  font-size: 1.2rem;
  margin-left: 6px;
}
.frame2 .bi::before, [class*=" bi-"]::before, [class^=bi-]::before{
  vertical-align: -0.3em !important;
}
/* .top-left{
  position: absolute;
  top: 8px;
  /* right: 16px; *
  left:25%;
} */
.float-bottom, .bottom{
  position: absolute;
  bottom: 8px;
  left: 16px;
}
aside ul a , .blog a{
  color: rgba(255, 255, 255, 0.55) !important;
}
.active , .blog .active{
  color: var(--white) !important;
}
img{
  max-width: 100%;
}
.blog .col-md-3 img{
  height: 300px !important;
}
.search_field{
  background-color: var(--white);
  width: 70% ;
}
.search_field input{
  border: none !important;
  width: 100%;
  color: rgba(0, 0, 0, 0.65); 
  font-weight: var(--fw7);

}
.footer .search_field input , .footer .search_field .btn{
  font-size : 14px;
}
.bi-circle-fill{
  font-size: 10px !important;
}
.fs6{
  font-size: 10px !important;
  font-weight: var(--fw4);
  color: rgb(225, 222, 222)
}
.bi-list , .navbar-toggler{
  color: var(--white);
  --bs-navbar-toggler-border-color: var(--white);
}
.first{
  align-content: space-evenly;
}
.mobile-only{
  display: none !important;
}
@media(max-width: 1025px){
  .desktop-only{
    display: none !important;
  }
  .mobile-only{
    display: block !important;
  }
}

@media (max-width: 768px) {
  .collapse{
    background-color: rgba(255, 255, 255, 0.25);
  }
  .links a{
    border-bottom:1px solid var(--white);  
  }
  .trip {
    line-height: 1.1;
    font-weight: var(--fw7);
  }
  .small {
    display: none !important;
  }
  aside.swiper4 .navbar-nav{
    flex-direction: row;
  }/*
  aside .navbar-nav a{
    font-size: 12px !important;

  } */

}
@media (max-width:445px){
  .frame2 div:nth-child(3) , .frame2 div:nth-child(2) {
    border-left: none !important;
  }
  .frame2 , .small{
    display: block !important;
  }
  .small{
    margin: -2rem 15rem;
  }
  .frame2 div{
    display: flex;
    justify-content: space-between;
  }
  .hero .first , .gallery.d-flex.py-5.desktop-only{
    display: none !important;
  }
  .bi-caret-down-fill{
    margin-left:4px  ;
  }
  .trip {
    line-height: 1;
  }
  
}