/* ==========================================================================
   REAL BANDHAN — Premium Light Redesign (overrides, loaded after style.css)
   Visual-only layer: no HTML IDs, form actions, or PHP logic depend on this.
   Safe to remove this single <link> to revert to the previous look.
   ========================================================================== */

/* ---- 1. Softer, lighter colour tokens (cascades through every page) ---- */
:root{
  --maroon:        #8C3B52;   /* softened from a bright red-maroon to a muted rosewood */
  --maroon-deep:   #5A2A3A;   /* deep warm heading colour, less red / more elegant brown-plum */
  --red-accent:    #B7405F;
  --saffron:       #C9A24B;
  --saffron-light: #E7C77E;
  --gold:          #CBA463;
  --gold-deep:     #A9822E;
  --champagne:     #E8D2A0;
  --champagne-soft:#F3E6C8;
  --ivory:         #FFFCF6;
  --ivory-dim:     #FBF3E6;
  --blush:         #FBEDEA;
  --blush-deep:    #F3DAD6;
  --dark-bg:       #3B2A30;   /* only used for tiny high-contrast accents now, not full sections */
  --border:        #F0E3D2;
  --shadow:        0 10px 30px rgba(150,110,60,.10);
  --shadow-soft:   0 20px 55px -22px rgba(120,80,50,0.20);
  --shadow-card:   0 12px 30px -14px rgba(120,80,50,0.16);
  --grad-heritage: linear-gradient(135deg, var(--champagne) 0%, var(--gold-deep) 100%);
  --grad-saffron:  linear-gradient(135deg, var(--saffron-light) 0%, var(--saffron) 55%, var(--gold-deep) 100%);
}

body{
  background: linear-gradient(180deg, #fffefb 0%, var(--ivory) 100%);
}

/* ==========================================================================
   2. Navbar — clean ivory, sticky, always readable (no dark transparent state)
   ========================================================================== */
.navbar-heritage{
  background: rgba(255, 252, 246, 0.88) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 6px 24px -18px rgba(120,80,50,0.35);
}
.navbar-heritage.scrolled{
  background: rgba(255, 252, 246, 0.97) !important;
  box-shadow: 0 10px 30px -18px rgba(120,80,50,0.30);
}
.navbar-heritage .brand-mark,
.navbar-heritage .marathi,
.navbar-heritage.scrolled .brand-mark{ color: var(--maroon-deep) !important; }
.navbar-heritage .marathi,
.navbar-heritage.scrolled .marathi{ color: var(--gold-deep) !important; }
.navbar-heritage .brand-tagline,
.navbar-heritage.scrolled .brand-tagline{ color: var(--ink-soft); }
.navbar-heritage .nav-link,
.navbar-heritage.scrolled .nav-link{ color: var(--ink) !important; }
.navbar-heritage .nav-link.active,
.navbar-heritage.scrolled .nav-link.active{ color: var(--maroon) !important; }
.navbar-heritage .btn-outline-heritage{ border-color: var(--maroon); color: var(--maroon); }
.navbar-heritage .btn-outline-heritage:hover{ background: var(--maroon); color: #fff; }
.navbar-heritage .navbar-toggler i,
.navbar-heritage:not(.scrolled) .navbar-toggler i{ color: var(--maroon-deep) !important; }

/* ==========================================================================
   3. Buttons — gold/champagne primary, off-white outline secondary
   ========================================================================== */
.btn-heritage{
  background: linear-gradient(135deg, var(--gold) 0%, var(--gold-deep) 100%);
  color: #fff;
  box-shadow: 0 14px 26px -12px rgba(169,130,46,0.45);
}
.btn-heritage:hover{
  color: #fff;
  box-shadow: 0 18px 32px -14px rgba(169,130,46,0.55);
}
.btn-outline-heritage{
  border-color: var(--maroon);
  color: var(--maroon-deep);
  background: #fff;
}
.btn-outline-heritage:hover{
  background: var(--maroon-deep);
  color: #fff;
  border-color: var(--maroon-deep);
}
.btn-saffron{
  background: linear-gradient(135deg, var(--saffron-light) 0%, var(--gold-deep) 100%);
  color: #4A3210;
  box-shadow: 0 12px 24px -10px rgba(169,130,46,0.5);
}
.btn-saffron:hover{ color: #4A3210; }

/* ==========================================================================
   4. Hero — light, airy, no dark overlay, no zoom
   ========================================================================== */
.hero{
  padding: 148px 0 60px;
  background:
    radial-gradient(circle at 8% 12%, rgba(232,199,126,0.28), transparent 45%),
    radial-gradient(circle at 96% 18%, rgba(251,218,214,0.5), transparent 42%),
    linear-gradient(180deg, #FFFDF8 0%, var(--ivory-dim) 100%);
}
/* neutralise the old dark photo-slideshow layer completely */
.hero-bg-slider{ display: none !important; }
.hero::before{ display: none !important; }
.hero-pattern{
  background-image: radial-gradient(circle, rgba(169,130,46,0.16) 1.3px, transparent 1.3px);
  background-size: 26px 26px;
  opacity: 0.55;
}
.hero .container{ height: auto; min-height: 0; padding-bottom: 3rem; }

.hero-badge{
  background: #fff;
  border: 1px solid var(--champagne);
  color: var(--maroon-deep);
  box-shadow: 0 10px 26px -14px rgba(169,130,46,0.35);
}
.hero-tag{
  color: var(--gold-deep);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.85rem;
  display: inline-block;
  margin-bottom: 0.6rem;
}
.hero h1{ color: var(--maroon-deep); text-shadow: none; }
.hero h1 span{ color: var(--gold-deep); }
.hero p{ color: var(--ink-soft); }
.hero-stat-item{ color: var(--ink); }
.hero-stat-item .lbl{ color: var(--ink-soft); }
.hero-stat-divider{ background: var(--border); }

/* ---- Hero photo carousel: fixed size, slide/fade transition, NO zoom ---- */
.hero-photo-carousel{
  position: relative;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: var(--shadow-soft);
  aspect-ratio: 4 / 5;
  max-height: 520px;
  background: var(--champagne-soft);
}
.hero-photo-carousel .swiper-slide{
  overflow: hidden;
}
.hero-photo-carousel .swiper-slide img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  /* explicitly no transform / scale animation on the image itself */
}
.hero-photo-frame-ring{
  position: absolute;
  inset: 14px;
  border: 1px solid rgba(255,255,255,0.55);
  border-radius: 20px;
  pointer-events: none;
  z-index: 3;
}
.hero-photo-caption{
  position: absolute;
  left: 0; right: 0; bottom: 0;
  z-index: 2;
  padding: 1.6rem 1.4rem 1.2rem;
  background: linear-gradient(180deg, rgba(58,30,20,0) 0%, rgba(58,30,20,0.55) 100%);
  color: #fff;
  font-family: var(--font-display);
  font-size: 1.05rem;
}
.hero-photo-carousel .swiper-pagination-bullet{
  background: #fff;
  opacity: 0.6;
}
.hero-photo-carousel .swiper-pagination-bullet-active{
  opacity: 1;
  background: var(--saffron-light);
}
@media (max-width: 991.98px){
  .hero-photo-carousel{ max-height: 380px; margin-top: 1rem; }
}

/* ==========================================================================
   4b. Photo marquee — continuous scrolling strip of real couple photos.
   Images are shown crisp/clear at a fixed size; only the track translates.
   No scaling, no Ken Burns, no zoom on the images themselves.
   ========================================================================== */
.photo-marquee-section{
  background: linear-gradient(180deg, var(--ivory-dim) 0%, #fff 100%);
  padding: 34px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  overflow: hidden;
}
.photo-marquee{
  position: relative;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.photo-marquee-track{
  display: flex;
  align-items: center;
  gap: 22px;
  width: max-content;
  animation: photoMarqueeScroll 42s linear infinite;
}
.photo-marquee-section:hover .photo-marquee-track{
  animation-play-state: paused;
}
.photo-marquee-item{
  flex: 0 0 auto;
  width: 220px;
  height: 150px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  border: 1px solid var(--champagne);
  background: #fff;
}
.photo-marquee-item img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  display: block;
  /* explicitly no transform / scale / filter — images stay clear and true to size */
}
@keyframes photoMarqueeScroll{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}
@media (max-width: 767.98px){
  .photo-marquee-item{ width: 160px; height: 112px; }
  .photo-marquee-track{ gap: 14px; animation-duration: 30s; }
}
@media (prefers-reduced-motion: reduce){
  .photo-marquee-track{ animation: none; overflow-x: auto; }
}

/* ==========================================================================
   5. Stats band — champagne, not maroon
   ========================================================================== */
.stats-band{
  background: linear-gradient(135deg, var(--champagne-soft) 0%, var(--champagne) 100%);
}
.stats-band::before{
  background-image: radial-gradient(circle, rgba(169,130,46,0.18) 1.5px, transparent 1.5px);
}
.stat-number, .stats-band .stat-number span{ color: var(--maroon-deep) !important; }
.stat-label{ color: var(--ink-soft); font-weight: 600; }

/* ==========================================================================
   6. Cards — soften shadow tint, keep white/rounded/subtle-border language
   ========================================================================== */
.profile-card{ box-shadow: var(--shadow-card); }
.profile-card:hover{ box-shadow: 0 26px 50px -20px rgba(120,80,50,0.24); }
.why-card:hover{ border-color: var(--saffron); }
.mini-pricing-card.popular{
  background: linear-gradient(135deg, var(--champagne) 0%, var(--gold-deep) 100%);
  color: var(--maroon-deep);
}
.mini-pricing-card.popular .mp-name,
.mini-pricing-card.popular .mp-price{ color: var(--maroon-deep) !important; }
.mini-pricing-card.popular .mp-price span{ color: rgba(90,42,58,0.75) !important; }
.mini-pricing-card.popular ul li{ color: rgba(90,42,58,0.85) !important; }
.mini-pricing-card.popular ul li i{ color: var(--maroon-deep) !important; }

/* ==========================================================================
   7. Footer — light ivory instead of dark navy, gold accents
   ========================================================================== */
.footer-heritage{
  background: linear-gradient(180deg, var(--ivory-dim) 0%, var(--champagne-soft) 100%);
  color: var(--ink-soft);
  border-top: 1px solid var(--border);
}
.footer-heritage h6{ color: var(--maroon-deep); }
.footer-heritage a{ color: var(--ink-soft); }
.footer-heritage a:hover{ color: var(--gold-deep); }
.footer-brand{ color: var(--maroon-deep); }
.footer-brand .marathi{ color: var(--gold-deep); }
.footer-social{
  border-color: var(--border);
  color: var(--maroon-deep);
}
.footer-social:hover{ background: var(--gold-deep); border-color: var(--gold-deep); color: #fff !important; }
.footer-bottom{ border-top-color: var(--border); }
.newsletter-form .form-control-heritage{
  background: #fff;
  border-color: var(--border);
  color: var(--ink);
}
.newsletter-form .form-control-heritage::placeholder{ color: var(--ink-soft); }
.back-to-top{
  background: var(--gold-deep) !important;
}

/* ==========================================================================
   8. Small polish
   ========================================================================== */
.section-title{ color: var(--maroon-deep); }
.eyebrow, .eyebrow::before{ color: var(--gold-deep); background: var(--gold-deep); }
::selection{ background: var(--champagne); color: var(--maroon-deep); }