/* ====== New Star Mandap Decorations Custom Styles ====== */
:root{
  --primary:#7817c2;
  --secondary:#ff5e9c;
  --accent:#ffd166;
  --dark:#1d1b22;
  --light:#f6f7fb;
}
.text-justify{
  text-align: justify;
}

html{scroll-behavior:smooth}
body{
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--dark);
}

.script{font-family:'Great Vibes',cursive}
.section-title{font-family:'Playfair Display',serif;font-weight:800}
.section-title .script{color:var(--primary)}
.text-accent{color:var(--accent)}

/* Topbar / Brand */
.topbar{background:linear-gradient(90deg,var(--primary),var(--secondary))}
.logo-badge{
  display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;font-weight:700;
}
.brand-text .script{font-size:1.15rem;color:var(--primary)}
.navbar .nav-link{font-weight:500}
.navbar .btn-gradient{margin-top:2px}

/* Buttons */
.btn-gradient{background:linear-gradient(90deg,var(--primary),var(--secondary));border:none;color:#fff}
.btn-gradient:hover{opacity:.9;color:#fff}

/* ==================== HERO (GLOBAL) ==================== */
.hero-carousel .carousel-item{
  height:80vh;min-height:420px;position:relative;
  background-size:cover;background-position:center;
}
.hero-carousel .overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.6));
}

/* Home page banners ONLY – used on index */
.banner-1{background-image:url('../images/banner11.jpg'),linear-gradient(135deg,#ffb6d9,#ffe8f2)}
.banner-2{background-image:url('../images/banner12.jpg'),linear-gradient(135deg,#c6e6ff,#f1f8ff)}
.banner-3{background-image:url('../images/banner10.png'),linear-gradient(135deg,#fbe0c3,#fff3e0)}

/* ==================== ABOUT PAGE HERO ==================== */
.about-hero {
  position: relative;
  overflow: hidden;
}

.about-hero .carousel-item {
  position: relative;
  height: 52vh;
  min-height: 360px;
  background: url('../images/banner-bg.png') center center / cover no-repeat;
}

@media (min-width: 992px) {
  .about-hero .carousel-item {
    height: 60vh;
  }
}

.about-hero .overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 1;
}

.about-hero .container {
  position: relative;
  z-index: 2;
}

.about-hero .page-title {
  text-shadow: 0 6px 20px rgba(0,0,0,.45);
}

.about-hero .breadcrumb,
.about-hero .breadcrumb .breadcrumb-item a {
  color: rgba(255,255,255,.9);
  text-decoration: none;
}

.about-hero .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  color: rgba(255,255,255,.75);
}

/* About section spacing after hero */
.section-after-hero {
  padding-top: 3rem;
  margin-top: 0;
}

/* ==================== CONTENT ==================== */
.about-card{background:#fff;border:1px solid #eee}
.service-card i{color:var(--primary)}

/* Services with images */
.service-card2{background:#fff;border:1px solid #eee}
.service-media{position:relative;margin:0}
.service-media img{
  display:block;height:230px;width:100%;object-fit:cover;transition:transform .6s ease
}
.service-media figcaption{
  position:absolute;left:1rem;right:1rem;bottom:1rem;
  background:rgba(0,0,0,.55);color:#fff;padding:.5rem .75rem;
  border-radius:.75rem;font-weight:600;letter-spacing:.2px
}
.service-card2:hover .service-media img{transform:scale(1.05)}
@media (min-width:992px){.service-media img{height:200px}}

.iconbox i{color:var(--secondary)}
.counter-card{background:#fff}
.counter{color:var(--primary)}

gallery.html-grid img{
  transition:transform .35s ease,box-shadow .35s ease;border-radius:1rem
}
gallery.html-grid img:hover{
  transform:translateY(-6px);box-shadow:0 10px 25px rgba(0,0,0,.15)
}






/* Map */
.map-wrapper iframe{border:0}

/* Footer */
.footer{background:radial-gradient(1200px circle at 10% 10%,#2d2230,#17141b 60%)}
.footer-links li{margin:.35rem 0}
.footer a{text-decoration:none}
.footer a:hover{text-decoration:underline}

/* Utilities */
.rounded-4{border-radius:1rem}
.shadow-sm{box-shadow:0 10px 25px rgba(0,0,0,.04)!important}

/* ==================== RESPONSIVE TWEAKS ==================== */
@media (max-width:575.98px){
  /* Shorter hero on mobile for HOME only; keep About separate */
  .hero-carousel:not(.about-hero) .carousel-item{height:60vh}
  .about-hero .carousel-item{height:48vh}      /* mobile About height */
  .navbar-brand .brand-text{display:none}
}






/* Fancy filter pills */
.pill-btn{
  border:0;
  padding:.55rem 1.1rem;
  border-radius:999px;
  font-weight:600;
  display:inline-flex; align-items:center; gap:.35rem;
  color:#fff;
  box-shadow:0 6px 16px rgba(0,0,0,.12);
  transition:transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.pill-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(0,0,0,.16); opacity:.95 }
.pill-btn:focus{ outline:0; box-shadow:0 0 0 .2rem rgba(120,23,194,.25) }

/* Variants */
.pill-all{ background:linear-gradient(90deg,var(--primary),var(--secondary)) }
.pill-img{ background:linear-gradient(90deg,#0ea5e9,#60a5fa) }     /* cyan → blue */
.pill-vid{ background:linear-gradient(90deg,#f97316,#ef4444) }     /* orange → red */

/* Active state */
.pill-btn.active{
  filter:saturate(1.1);
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}

/* Make the nav spacing neat on small screens */
#filterPills .nav-item{ display:inline-flex }










/* Guard horizontal overflow just in case */
html, body { overflow-x: clip; }
@supports not (overflow-x: clip){ html, body { overflow-x: hidden; } }

/* Container */
.contact-fabs{
  position: fixed;
  right: 16px;
  bottom: 16px;
  display: grid;
  gap: 12px;
  z-index: 1050;
  pointer-events: none;       /* let clicks pass except on buttons */
  isolation: isolate;         /* keep pseudo-element glows from mixing */
}

/* Button base */
.float-btn{
  --size: 56px;
  position: relative;
  inline-size: var(--size);
  block-size: var(--size);
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  color: #fff;
  text-decoration: none;
  pointer-events: auto;
  /* keep a subtle drop for depth; this respects the circle */
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
  will-change: transform;
  overflow: visible;          /* allow the halo to bloom */
}

/* Circular halo (replaces filter: drop-shadow) */
.float-btn::before{
  content: "";
  position: absolute;
  inset: -10px;               /* size of the glow */
  border-radius: inherit;
  z-index: -1;
  opacity: .55;
  transform: scale(1);
  transition: opacity .2s ease, transform .2s ease;
}

/* Icon size */
.float-btn i{ font-size: 1.45rem; line-height: 1; }

/* Variants */
.float-wa{
  background: radial-gradient(140% 140% at 30% 30%, #33d16b, #11a94a 60%);
}
.float-wa::before{
  background: radial-gradient(closest-side, rgba(51,209,107,.75), rgba(51,209,107,0) 70%);
  filter: blur(12px);
}

.float-call{
  background: radial-gradient(140% 140% at 30% 30%, var(--primary,#7817c2), #b100ff 60%);
}
.float-call::before{
  background: radial-gradient(closest-side, rgba(177,0,255,.65), rgba(177,0,255,0) 70%);
  filter: blur(12px);
}

/* Hover / active – lift & brighter halo */
.float-btn:hover{
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 14px 28px rgba(0,0,0,.22);
}
.float-btn:hover::before{
  opacity: .85;
  transform: scale(1.06);
}

/* Keyboard focus */
.float-btn:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(120,23,194,.25), 0 10px 22px rgba(0,0,0,.18);
}

/* Gentle breathing pulse on the halo only (no square artifacts) */
@keyframes halo-pulse{
  0%,100% { transform: scale(1);   opacity: .55; }
  50%     { transform: scale(1.08); opacity: .8;  }
}
.float-btn::before{ animation: halo-pulse 2.6s ease-in-out infinite; }

/* Small screens */
@media (max-width: 420px){
  .float-btn{ --size: 50px; }
  .contact-fabs{ gap: 10px; right: 14px; bottom: 14px; }
}


/* Neon “breathing” glow */
@keyframes fab-pulse{
  0%, 100% { filter: drop-shadow(0 0 0 rgba(0,0,0,0)) }
  50% {
    filter:
      drop-shadow(0 0 10px rgba(255,255,255,.18))
      drop-shadow(0 0 16px rgba(255,255,255,.12));
  }
}

/* Focus ring (keyboard accessibility) */
.float-btn:focus{
  outline: none;
  box-shadow:
    0 10px 22px rgba(0,0,0,.18),
    0 0 0 4px rgba(120,23,194,.25);
}

/* Smaller on very small screens */
@media (max-width: 420px){
  .float-btn{ --size: 50px }
  .contact-fabs{ right: 14px; bottom: 14px; gap: 10px; }
}




  @media (min-width: 992px) {
    .navbar .dropdown:hover .dropdown-menu {
      display: block;
      margin-top: 0;
    }
  }




  #lightboxVideo {
  image-rendering: auto;
  object-fit: cover;
  max-width: 900px;
  max-height: 80vh;
  width: 100%;
  height: auto;
}