html{
scroll-behavior:smooth;
}
:root{
--primary:#0d6efd;
--secondary:#0dcaf0;
--dark:#1f2d3d;
}

.btn-primary{
background:var(--primary);
border:none;
}

.bg-primary{
background:var(--primary);
}

body{
font-family:'Poppins',sans-serif;
background:#f8f9fa;
}

h1,h2,h3,h4,h5{
font-weight:600;
}

section{
padding-top:80px;
padding-bottom:80px;
}

.section-title{
margin-bottom:50px;
}


#home {
  position: relative;
}
/*hero slider*/
.hero-img {
  height: 30vh;
  object-fit: cover;
}

.hero-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  z-index: 2;
}

.carousel::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  top: 0;
  left: 0;
  z-index: 1;
}



/*service section*/
.service-card {
  transition: all 0.3s ease;
}

.service-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

/*staff section*/
/*
.staff-img {
  width: 250px;
  height: 250px;
  object-fit: cover;
  border-radius: 50%;
  margin: auto;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}*/


.staff-card {
  width: 320px;
  border-radius: 12px;
  overflow: hidden;
  transition: 0.3s ease;
}

.staff-card:hover {
  transform: translateY(-8px);
 /* box-shadow: 0 15px 30px rgba(0,0,0,0.15);*/
}

.staff-img {
  width: 100%;
  height: 350px;          /* You can adjust */
  object-fit: contain;    /* IMPORTANT: Shows full image */
  background-color: #f8f9fa; /* Optional light background */
}



/*contact section*/
.scrollable-div {
  max-height: 300px;
  overflow-y: auto;
}

.rating-stars input {
  margin-right: 5px;
}

/*footer*/

footer{
background:linear-gradient(135deg,#1f2d3d,#000);
}

footer a{
transition:.3s;
}

footer a:hover{
color:#0dcaf0;
}

.floating-social {
  position: fixed;
  right: 25px;
  bottom: 40px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  z-index: 999;
}

.social-btn {
  width: 60px;
  height: 60px;
  background: #fff;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 15px rgba(0,0,0,0.15);
  transition: 0.3s ease;
}

.social-btn img {
  width: 35px;
  height: 35px;
}

.social-btn:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 25px rgba(0,0,0,0.25);
}