Observe Traditional Rituals

Explore More

Nearby Attractions

<div class="swiper nearbySwiper"> <div class="swiper-wrapper"> </div> </div> </div> </section> <style> a.attraction-card.shadow-sm.h-100.bg-white.text-decoration-none { width: 100%; } .attraction-card.search-highlight { outline: 2px solid #FF8C00; outline-offset: 2px; } .attraction-card { position: relative; width: 100%; aspect-ratio: 3 / 4; border-radius: 1.25rem !important; overflow: hidden !important; border: none !important; cursor: pointer; transition: transform 0.4s ease, box-shadow 0.4s ease; will-change: transform; opacity: 0; animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; } .attraction-card:hover { transform: translateY(-6px); box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.3); } .attraction-card .card-bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s ease; z-index: 0; } .attraction-card:hover .card-bg-img { transform: scale(1); } .attraction-card .card-overlay-gradient { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, transparent 50%); opacity: 0.6; z-index: 1; transition: opacity 0.4s ease; } .attraction-card:hover .card-overlay-gradient { opacity: 0.95; } .attraction-card .card-content-overlay { position: absolute; bottom: 1.5rem; left: 1.5rem; right: 1.5rem; z-index: 2; } .attraction-card .card-content-overlay h3 { font-size: 1.0rem; font-weight: 700; margin-bottom: 0.3rem; color: #fff !important; text-shadow: 0 2px 6px rgba(0,0,0,0.5); line-height: 1.2; } .attraction-card .card-content-overlay p { font-size: 0.85rem; margin-bottom: 0; color: rgba(255,255,255,0.85) !important; text-shadow: 0 1px 3px rgba(0,0,0,0.4); } .attraction-card .card-bg-img {height:auto !important;} @media (max-width: 768px) { .hero-mini { min-height: 220px; } .hero-mini .hero-title { font-size: 1.4rem !important; line-height: 1.25 !important; } .hero-mini .header-tagline { font-size: 0.7rem !important; } } @media (max-width: 480px) { .hero-mini { min-height: 200px; } .hero-mini .hero-title { font-size: 1.15rem !important; } } </style>