:root {
  --brand-maroon: #7b1f32;
  --brand-gold: #d8a23a;
  --brand-cream: #fff8ec;
  --brand-deep: #2a1710;
}

body {
  color: var(--brand-deep);
  font-family: "Segoe UI", Arial, sans-serif;
}

.navbar {
  background: rgba(42, 23, 16, 0.96);
}

.navbar-brand,
.nav-link {
  letter-spacing: 0.01em;
}

.nav-link.active,
.nav-link:hover {
  color: var(--brand-gold) !important;
}

.hero {
  background-image: linear-gradient(90deg, rgba(42, 23, 16, 0.88), rgba(123, 31, 50, 0.68)), url("img/hindu-ritual-01.jpg");
  background-position: center;
  background-size: cover;
  color: #fff;
  min-height: 72vh;
}

.hero-services {
  background-image: linear-gradient(90deg, rgba(42, 23, 16, 0.88), rgba(123, 31, 50, 0.62)), url("img/ganesh-yagna-priest.jpg");
}

.hero-wedding {
  background-image: linear-gradient(90deg, rgba(42, 23, 16, 0.88), rgba(123, 31, 50, 0.62)), url("img/wedding-resort.jpg");
}

.hero-contact {
  background-image: linear-gradient(90deg, rgba(42, 23, 16, 0.88), rgba(123, 31, 50, 0.62)), url("img/priest-04.jpg");
}

.section-soft {
  background: var(--brand-cream);
}

.section-title {
  color: var(--brand-maroon);
}

.accent-line {
  background: var(--brand-gold);
  border-radius: 999px;
  display: inline-block;
  height: 4px;
  width: 72px;
}

.btn-brand {
  --bs-btn-bg: var(--brand-maroon);
  --bs-btn-border-color: var(--brand-maroon);
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: #5d1726;
  --bs-btn-hover-border-color: #5d1726;
  --bs-btn-hover-color: #fff;
}

.btn-outline-brand {
  --bs-btn-border-color: var(--brand-gold);
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: var(--brand-gold);
  --bs-btn-hover-border-color: var(--brand-gold);
  --bs-btn-hover-color: var(--brand-deep);
}

.feature-card,
.service-card,
.timeline-card {
  border: 0;
  box-shadow: 0 0.75rem 2rem rgba(42, 23, 16, 0.1);
}

.icon-circle {
  align-items: center;
  background: rgba(216, 162, 58, 0.16);
  border-radius: 50%;
  color: var(--brand-maroon);
  display: inline-flex;
  font-size: 1.35rem;
  height: 3rem;
  justify-content: center;
  width: 3rem;
}

.priest-panel {
  background-image: linear-gradient(145deg, rgba(123, 31, 50, 0.35), rgba(216, 162, 58, 0.18)), url("img/priest-01.jpg");
  background-position: center;
  background-size: cover;
  border-radius: 1.5rem;
  min-height: 400px;
}

.wedding-panel {
  background-image: linear-gradient(145deg, rgba(123, 31, 50, 0.25), rgba(216, 162, 58, 0.18)), url("img/wedding-indoor.jpg");
}

.contact-panel {
  background-image: linear-gradient(145deg, rgba(42, 23, 16, 0.22), rgba(123, 31, 50, 0.22)), url("img/contact-card.jpg");
}

.badge-soft {
  background: rgba(216, 162, 58, 0.18);
  color: var(--brand-maroon);
}

.list-check {
  list-style: none;
  padding-left: 0;
}

.list-check li {
  margin-bottom: 0.7rem;
  padding-left: 1.85rem;
  position: relative;
}

.list-check li::before {
  color: var(--brand-gold);
  content: "✓";
  font-weight: 700;
  left: 0;
  position: absolute;
}

.timeline-number {
  align-items: center;
  background: var(--brand-maroon);
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  font-weight: 700;
  height: 2.4rem;
  justify-content: center;
  width: 2.4rem;
}

.card-img-top {
  height: 220px;
  object-fit: cover;
}

.gallery-img {
  aspect-ratio: 4 / 3;
  border-radius: 1rem;
  box-shadow: 0 0.75rem 1.5rem rgba(42, 23, 16, 0.12);
  object-fit: cover;
  width: 100%;
}

.feature-photo {
  border-radius: 1.5rem;
  box-shadow: 0 1rem 2rem rgba(42, 23, 16, 0.14);
  height: 100%;
  max-height: 520px;
  object-fit: cover;
  width: 100%;
}

.photo-caption {
  background: rgba(42, 23, 16, 0.78);
  border-radius: 999px;
  bottom: 1rem;
  color: #fff;
  font-size: 0.9rem;
  left: 1rem;
  padding: 0.45rem 0.9rem;
  position: absolute;
}

footer {
  background: var(--brand-deep);
  color: rgba(255, 255, 255, 0.82);
}

footer a {
  color: #fff;
}

@media (max-width: 767.98px) {
  .hero {
    min-height: auto;
    padding: 5rem 0;
  }

  .display-4 {
    font-size: 2.35rem;
  }
}