html {
    scroll-behavior: smooth;
  }

  body {
    margin: 0;
    font-family: 'Lexend', sans-serif;
  }

  /* Header */
  .header {
  background: linear-gradient(45deg, #e522ab, #8f00b4);
padding: 10px 30px;
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 1000;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

  .logo img {
    height: 40px;
  }

  .nav-links a {
    margin: 0 10px;
    text-decoration: none;
    color: #ffffff;
    font-weight: 600;
    font-size: 1rem;
  }

  .nav-links i {
    margin-right: 6px;
  }

  .social-icons i {
    margin-left: 15px;
    font-size: 1.2rem;
    color: #fff;   /*#f91eea;*/
  }

  /*.after-header-space {
    height: 20px;
  }
*/
  /* Carousel */
.dual-slide-container {
min-height: 600px;
height: 600px;
position: relative;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(to right, #ffe6f7, #f5d0ff);
}


.carousel-img-box {
flex: 1;
height: 100%;
overflow: hidden;
}

.carousel-img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
border-radius: 0; /* or add custom rounding if needed */
}

.carousel-center-logo {
flex-shrink: 0;
z-index: 2;
margin: 20px;
}

.carousel-logo {
width: 220px;
height: 220px;
border-radius: 50%;
object-fit: cover;
box-shadow: 0 0 15px rgba(255, 255, 255, 0.5), 0 0 30px rgba(255, 116, 214, 0.5);
transition: box-shadow 0.3s ease;
}

  .text-content {
    background-color: #f1f1f1;
    padding: 30px;
  }

  /* Section Styling */
  section {
    padding: 50px 20px;
    position: relative;
  }

  section h2 {
    font-family: 'Pacifico', cursive;
    text-align: center;
    font-size: 2.8rem;
    margin-bottom: 15px;
    font-weight: 700;
    color: #f91eea;
    letter-spacing: 0.5px;
  }

  section p {
    font-size: 1.1rem;
    color: #555;
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    line-height: 1.7;
    font-weight: 400;
  }

  #home { 
    position: relative;
    background: linear-gradient(to bottom right, rgb(255 50 193), rgb(199 39 255 / 88%)), url(images/img01.jpg) no-repeat center center / cover;
     padding: 0; /* remove extra padding */
    background-color: #9b819d; 
  
  }
  #services { 
    position: relative;
    background: linear-gradient(to bottom right, rgb(255 255 255), rgb(234 187 235 / 88%)), url(images/img01.jpg) no-repeat center center / cover;
     padding: 1; /* remove extra padding */
    background-color: #ffe5fd; 
    border-top: 1px solid #e0d7ff; 
    border-bottom: 1px solid #e0d7ff;
   }
  #contact { background-color: #fff4f9; }
  #about { 
    background: linear-gradient(to right, #e993ff6b, #ff74d6);
    padding: 60px 20px;
border-top: none;
  }
#about h2 {
color: #f91eea;
}
  /* Service Cards */
  .service-card {
    transition: all 0.3s ease;
    border-radius: 12px;
    overflow: hidden;
  }

  .service-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  }

  .service-card img {
    height: 200px;
    object-fit: cover;
  }
  #instagram {
background-color: #fff;
border-top: 1px solid #ddd;
padding: 60px 20px;
}

#instagram h2 {
text-align: center;
font-size: 2.5rem;
margin-bottom: 20px;
font-weight: 700;
color: #f91eea;
}

#instagram p {
text-align: center;
font-size: 1.1rem;
color: #555;
}
.footer {
background-color: #d182e5;
font-size: 0.95rem;
}
.footer .text-muted {
color:rgb(0 0 0) !important;
}
.footer a {
text-decoration: none;
transition: color 0.3s ease;
}

.footer a:hover {
color: #ff74d6;
}
#backToTopBtn {
display: none;
position: fixed;
bottom: 30px;
right: 30px;
z-index: 999;
border: none;
outline: none;
background-color: #ff74d6;
color: white;
cursor: pointer;
padding: 12px 14px;
border-radius: 50%;
font-size: 16px;
box-shadow: 0 4px 10px rgba(0,0,0,0.2);
transition: background-color 0.3s ease;
}

#backToTopBtn:hover {
background-color: #e653c2;
}

.circle-content {
width: 425px;
height: 425px;
background-color: rgba(255, 255, 255, 0.1);
border-radius: 50%;
padding: 30px;
display: flex;
flex-direction: column;
align-items: center;      /* horizontally center */
justify-content: center;  /* vertically center */
text-align: center;
backdrop-filter: blur(10px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
border: 2px solid rgba(255, 255, 255, 0.2);
color: #fff;
position: absolute;
top: 50%;
left: 45%;
transform: translate(-30%, -50%);
z-index: 2;
}



.circle-content h2,
.circle-content p {
color: #fff;
}

.circle-image {
border: 4px solid rgba(255, 255, 255, 0.5);
}

.site-title {
font-family: 'Pacifico', cursive;
font-size: 1.50rem;
color: #fff;
margin: 0;
}
.circle-image {
width: 120px;
height: 120px;
object-fit: cover;
border-radius: 50%;
border: 4px solid rgba(255, 255, 255, 0.5);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}
#contact i {
color: rgb(191 14 211) !important;
}
.list-group-item {
font-family: 'Oleo+Script', cursive;
background-color: transparent !important;
border: var(--bs-list-group-border-width) solid #ffcbf4;
}
.card {
background-color: transparent !important;
border: 1px solid #ff04ee21;
} 
.card h5 {
font-family: 'Oleo+Script', cursive;
font-weight: bold;
color:#ff1af6;
font-size:1.60rem;
} 
.card-body {
background-color: transparent !important;
backdrop-filter: blur(6px);
color: #fff;
border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.logo-circle {
width: 120px;
height: 120px;
object-fit: cover;
border-radius: 50%;
border: 2px solid rgba(255, 255, 255, 0.7);
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}
.logo {
display: flex;
align-items: center;
}

.hr-decorator {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 20px;
}

.hr-icon {
margin-bottom: 6px;
opacity: 0;
transform: translateY(10px);
transition: opacity 0.6s ease, transform 0.95s ease;
}

.hr-decorator.visible .hr-icon {
opacity: 1;
transform: translateY(0);
}
.full-height-img {
height: 500px;
object-fit: cover;
}

.carousel-logo-centered {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 10;
}


.carousel-img-box {
position: relative;
overflow: hidden; /* ensure overlay doesn't spill outside */
}

.carousel-img-box::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/* Use a gradient overlay (adjust colors/opacity as needed) */
background: linear-gradient(
  to bottom, 
  rgba(38, 2, 49, 0.158), 
  rgba(0, 0, 0, 0.918)
);
pointer-events: none; /* allows clicks to pass through */
}
.navbar-toggler {
  border-color: rgba(255, 255, 255, 0.8); /* Optional: white border */
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

@media (max-width: 768px) {
    .header {
      flex-direction: column;
      align-items: center;
    }

    .nav-links {
      margin: 10px 0;
    }

    .carousel-item img {
      max-width: 100%;
      height: auto;
    }

    section {
      padding: 60px 20px;
    }

    section h2 {
      font-size: 2rem;
    }

    section p {
      font-size: 1rem;
    }
    .full-height-img {
  height: 250px;
}

.carousel-logo {
  width: 140px;
  height: 140px;
  /*border: 6px solid #fff;*/
}
.brandlg {
  font-size: 1.20rem;
}
.footer .text-end {
  text-align: center !important;
}
.footer {
  font-size: 0.85rem;
  color: #fff !important;
}
  }