/*==========================================
 WHY CHOOSE
==========================================*/

@media(max-width:992px){

.choose-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.choose-grid{

grid-template-columns:1fr;

}

.choose-card{

padding:30px 20px;

}

.choose-icon{

width:70px;
height:70px;

font-size:30px;

}

}
/*==========================================
  HOW BOOKING WORKS
==========================================*/

@media(max-width:992px){

.process-grid{

grid-template-columns:repeat(2,1fr);

gap:25px;

}

}

@media(max-width:768px){

.process-grid{

grid-template-columns:1fr;

}

.process-card{

padding:35px 20px;

}

.process-icon{

font-size:40px;

}

.process-card h3{

font-size:20px;

}

}
/* FEATURED PUJAS */

@media(max-width:992px){

.featured-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.featured-grid{

grid-template-columns:1fr;

}

.featured-card img{

height:220px;

}

}
/*==========================================
 TESTIMONIALS
==========================================*/

@media(max-width:992px){

.testimonial-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.testimonial-grid{

grid-template-columns:1fr;

}

.testimonial-card{

padding:30px 20px;

}

}
/*==========================================
 GALLERY
==========================================*/

@media(max-width:992px){

.gallery-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.gallery-grid{

grid-template-columns:1fr;

}

.gallery-item img{

height:240px;

}

}
/*==========================================
 FAQ
==========================================*/

@media(max-width:768px){

.faq-item summary{

font-size:16px;

padding:18px;

}

.faq-item p{

padding:0 18px 18px;

}

}
/*==========================================
 CALL TO ACTION
==========================================*/

@media(max-width:768px){

.cta-box h2{

font-size:34px;

}

.cta-buttons{

flex-direction:column;

align-items:center;

}

.cta-buttons a{

width:100%;

max-width:320px;

text-align:center;

}

}
/*==========================================
 CONTACT
==========================================*/

@media(max-width:992px){

.contact-grid{

grid-template-columns:1fr;

}

}

@media(max-width:768px){

.contact-form{

padding:25px;

}

.contact-card{

padding:20px;

}

.contact-icon{

width:50px;
height:50px;
font-size:22px;

}

}
/*==========================================
 FOOTER
==========================================*/

@media(max-width:992px){

.footer-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.footer-grid{

grid-template-columns:1fr;

}

.footer-bottom{

flex-direction:column;

text-align:center;

}

.footer-links{

justify-content:center;

flex-wrap:wrap;

}

}
/*==========================================
 UPCOMING FESTIVAL
==========================================*/

@media(max-width:992px){

.festival-box{

grid-template-columns:1fr;

padding:40px;

}

}

@media(max-width:768px){

.festival-left h2{

font-size:36px;

}

.countdown{

grid-template-columns:repeat(2,1fr);

}

.time-box{

padding:25px 15px;

}

.time-box h3{

font-size:34px;

}

}
/*==========================================
 FESTIVAL RESPONSIVE
==========================================*/

@media(max-width:992px){

.festival-content{

grid-template-columns:1fr;

padding:40px;

}

}

@media(max-width:768px){

.festival-left h2{

font-size:36px;

}

.countdown{

grid-template-columns:repeat(2,1fr);

}

.time-card{

padding:25px 15px;

}

.time-card h2{

font-size:36px;

}

.festival-btns{

flex-direction:column;

}

.festival-btns a{

width:100%;

text-align:center;

}

}
/*==========================================
 PANCHANG RESPONSIVE
==========================================*/

@media(max-width:768px){

.panchang-card{

padding:25px;

}

.panchang-grid{

grid-template-columns:1fr;

}

.panchang-header h3{

font-size:28px;

}

.panchang-item{

flex-direction:column;

align-items:flex-start;

gap:8px;

}

}
@media(max-width:768px){

.floating-buttons{

right:15px;

bottom:20px;

}

.floating-whatsapp,
.floating-call{

width:58px;

height:58px;

font-size:24px;

}

}
/*==========================================
 MOBILE BAR RESPONSIVE
==========================================*/

@media(max-width:768px){

.mobile-sticky-bar{

display:grid;

}

body{

padding-bottom:80px;

}

}
@media(max-width:768px){

.back-to-top{

left:15px;

bottom:95px;

width:55px;

height:55px;

font-size:24px;

}

}
@media(max-width:991px){

.reviews-slider{

grid-template-columns:1fr;

}

}
/* ==========================
TABLET
========================== */

@media(max-width:991px){

.hero-grid,
.about-grid{
grid-template-columns:1fr;
text-align:center;
}

.hero-image{
margin-top:40px;
}

.about-image{
margin-bottom:40px;
}

.counter-grid{
grid-template-columns:repeat(2,1fr);
}

.why-grid{
grid-template-columns:repeat(2,1fr);
}

.area-grid{
grid-template-columns:repeat(3,1fr);
}

.footer-grid{
grid-template-columns:1fr;
text-align:center;
}
}
@media(max-width:991px){

.nav-links{

display:flex;

flex-direction:column;

position:fixed;

top:80px;

right:-100%;

width:280px;

height:calc(100vh - 80px);

background:#fff;

padding:30px;

gap:18px;

transition:.35s;

z-index:9999;

box-shadow:-5px 0 20px rgba(0,0,0,.15);

}

.nav-links.active{

right:0;

}

}


/* ==========================
MOBILE
========================== */

@media(max-width:768px){

.about-hero{
padding:120px 0 70px;
}

.hero-content h1{
font-size:40px;
}

.hero-content p{
font-size:16px;
}

.about-content h2{
font-size:34px;
}

.section-title h2{
font-size:34px;
}

.counter-grid{
grid-template-columns:1fr;
}

.why-grid{
grid-template-columns:1fr;
}

.area-grid{
grid-template-columns:repeat(2,1fr);
}

.hero-btns{
flex-direction:column;
}

.btn-primary,
.btn-secondary{
width:100%;
text-align:center;
}

.about-features{
grid-template-columns:1fr;
}

.about-cta h2{
font-size:34px;
}

}


/* ==========================
SMALL MOBILE
========================== */

@media(max-width:480px){

.hero-content h1{
font-size:32px;
}

.about-content h2{
font-size:28px;
}

.section-title h2{
font-size:28px;
}

.timeline-item{
padding:22px;
}

.counter-box{
padding:25px;
}

.area-grid{
grid-template-columns:1fr;
}

.about-cta{
padding:70px 20px;
}

}
/*==========================================
PREMIUM HERO MOBILE
==========================================*/

@media (max-width:991px){

.hero{

padding:50px 0 40px;
min-height:auto;

}

.hero .container{

flex-direction:column-reverse;
text-align:center;
gap:40px;

}

.hero-content{

max-width:100%;

}

.hero-image{

justify-content:center;

}

.hero-image img{

max-width:420px;
width:90%;

}

.hero h1{

font-size:48px;
line-height:1.2;

}

.hero-description{

font-size:17px;
max-width:650px;
margin:20px auto 30px;

}

.hero-buttons{

justify-content:center;

}

}

@media (max-width:768px){

.hero{

padding:35px 0;

}

.hero-image img{

width:85%;
max-width:320px;

}

.hero-subtitle{

font-size:15px;

}

.hero h1{

font-size:34px;

}

.hero-description{

font-size:15px;
line-height:1.7;

}

.hero-buttons{

flex-direction:column;
gap:15px;

}

.hero-buttons a{

width:100%;
max-width:280px;
margin:auto;

}

}

@media (max-width:480px){

.hero{

padding:25px 0;

}

.hero-image img{

max-width:260px;

}

.hero h1{

font-size:28px;

}

.hero-description{

font-size:14px;

}

.hero-subtitle{

font-size:14px;

}

}
/*==========================================
SERVICES MOBILE
==========================================*/

@media(max-width:991px){

.services-grid{

grid-template-columns:repeat(2,1fr);

gap:25px;

}

.service-card img{

height:220px;

}

}

@media(max-width:768px){

.popular-services{

padding:70px 0;

}

.services-grid{

grid-template-columns:1fr;

gap:22px;

}

.service-card{

border-radius:18px;

}

.service-card img{

height:210px;

}

.service-content{

padding:22px;

}

.service-content h3{

font-size:22px;

}

.service-content p{

font-size:15px;

min-height:auto;

margin-bottom:20px;

}

.service-buttons{

flex-direction:column;

gap:12px;

}

.learn-btn,
.call-btn{

width:100%;
text-align:center;
padding:14px;

}

}


/*==========================================
TRUST SECTION MOBILE
==========================================*/

@media(max-width:991px){

.trust-section .container{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:576px){

.trust-section{

padding:60px 0;

}

.trust-section .container{

grid-template-columns:1fr;

gap:18px;

}

.trust-card{

padding:25px 20px;

}

.trust-card h2{

font-size:34px;

}

}


/*==========================================
WHY CHOOSE MOBILE
==========================================*/

@media(max-width:991px){

.choose-grid{

grid-template-columns:repeat(2,1fr);

gap:22px;

}

}

@media(max-width:768px){

.choose-grid{

grid-template-columns:1fr;

}

.choose-card{

padding:28px 22px;

}

.choose-icon{

width:70px;

height:70px;

font-size:28px;

margin-bottom:18px;

}

.choose-card h3{

font-size:21px;

}

.choose-card p{

font-size:15px;

line-height:1.7;

}

}


/*==========================================
SECTION TITLE MOBILE
==========================================*/

@media(max-width:768px){

.section-heading{

margin-bottom:45px;

}

.section-title{

font-size:32px;

line-height:1.3;

}

.section-description{

font-size:15px;

line-height:1.8;

padding:0 8px;

}

.section-tag{

font-size:12px;

padding:7px 16px;

}

}
/*==========================================
BOOKING PROCESS
==========================================*/

@media(max-width:991px){

.process-grid{

grid-template-columns:repeat(2,1fr);

gap:22px;

}

}

@media(max-width:768px){

.booking-process{

padding:70px 0;

}

.process-grid{

grid-template-columns:1fr;

}

.process-card{

padding:30px 20px;

}

.process-number{

width:50px;
height:50px;
font-size:17px;

}

.process-icon{

font-size:38px;

}

.process-card h3{

font-size:22px;

}

.process-card p{

font-size:15px;

}

}


/*==========================================
FEATURED PUJAS
==========================================*/

@media(max-width:991px){

.featured-grid{

grid-template-columns:repeat(2,1fr);

gap:22px;

}

}

@media(max-width:768px){

.featured-grid{

grid-template-columns:1fr;

}

.featured-card{

border-radius:18px;

}

.featured-card img{

height:220px;

}

.featured-content{

padding:22px;

}

.featured-content h3{

font-size:22px;

}

.featured-content p{

font-size:15px;

}

.featured-content .book-btn{

width:100%;
display:block;
text-align:center;

}

}


/*==========================================
FESTIVAL SECTION
==========================================*/

@media(max-width:991px){

.festival-content{

grid-template-columns:1fr;

padding:40px;

gap:35px;

}

}

@media(max-width:768px){

.festival-section{

padding:70px 0;

}

.festival-content{

padding:25px;

}

.festival-left{

text-align:center;

}

.festival-left h2{

font-size:34px;

}

.festival-left p{

font-size:15px;

}

.festival-btns{

flex-direction:column;

}

.festival-btns a{

width:100%;
text-align:center;

}

.countdown{

grid-template-columns:repeat(2,1fr);

gap:15px;

}

.time-card{

padding:20px 10px;

}

.time-card h2{

font-size:32px;

}

.time-card span{

font-size:14px;

}

}


/*==========================================
PANCHANG
==========================================*/

@media(max-width:768px){

.panchang-section{

padding:70px 0;

}

.panchang-card{

padding:25px 18px;

border-radius:18px;

}

.panchang-header h3{

font-size:26px;

}

.panchang-header span{

font-size:15px;

}

.panchang-grid{

grid-template-columns:1fr;

gap:15px;

}

.panchang-item{

padding:18px;

flex-direction:column;

align-items:flex-start;

gap:8px;

}

.panchang-item strong{

font-size:15px;

}

.panchang-item span{

font-size:15px;

}

.panchang-btn .book-btn{

width:100%;
display:block;
text-align:center;

}

}
/*==========================================
GOOGLE REVIEWS
==========================================*/

@media(max-width:991px){

.reviews-slider{
grid-template-columns:1fr;
gap:22px;
}

.review-card{
padding:28px 22px;
}

.google-top{
flex-direction:column;
align-items:flex-start;
gap:10px;
}

.review-card p{
font-size:15px;
line-height:1.8;
}

}


/*==========================================
GALLERY
==========================================*/

@media(max-width:991px){

.gallery-grid{
grid-template-columns:repeat(2,1fr);
gap:18px;
}

}

@media(max-width:768px){

.gallery-section{
padding:70px 0;
}

.gallery-grid{
grid-template-columns:1fr;
}

.gallery-item img{
height:230px;
}

.gallery-btn .book-btn{
width:100%;
display:block;
text-align:center;
}

}


/*==========================================
FAQ
==========================================*/

@media(max-width:768px){

.faq-section{
padding:70px 0;
}

.faq-item summary{
font-size:16px;
padding:18px;
}

.faq-item p{
padding:0 18px 18px;
font-size:15px;
line-height:1.7;
}

}


/*==========================================
CONTACT
==========================================*/

@media(max-width:991px){

.contact-grid{
grid-template-columns:1fr;
gap:30px;
}

}

@media(max-width:768px){

.contact-section{
padding:70px 0;
}

.contact-form{
padding:22px;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
font-size:15px;
padding:14px;
}

.contact-card{
padding:20px;
}

.contact-icon{
width:50px;
height:50px;
font-size:22px;
}

}


/*==========================================
FOOTER
==========================================*/

@media(max-width:991px){

.footer-grid{
grid-template-columns:1fr;
text-align:center;
gap:35px;
}

.footer-social{
justify-content:center;
}

.footer-bottom{
flex-direction:column;
text-align:center;
}

.footer-links{
justify-content:center;
flex-wrap:wrap;
}

}


/*==========================================
FLOATING BUTTONS
==========================================*/

@media(max-width:768px){

.floating-buttons{
right:15px;
bottom:95px;
}

.floating-whatsapp,
.floating-call{
width:56px;
height:56px;
font-size:24px;
}

.back-to-top{
left:15px;
bottom:95px;
width:52px;
height:52px;
font-size:22px;
}

}


/*==========================================
MOBILE STICKY BAR
==========================================*/

@media(max-width:768px){

.mobile-sticky-bar{
display:grid;
}

body{
padding-bottom:80px;
}

.mobile-sticky-bar a{
font-size:14px;
}

.mobile-sticky-bar a span{
font-size:22px;
}

}
/*==========================================
SERVICE DETAILS PAGE MOBILE
==========================================*/

@media (max-width:991px){

.service-hero .container,
.service-details .container,
.service-content,
.service-grid{

display:flex;
flex-direction:column;
gap:30px;

}

.service-image img{

width:100%;
height:auto;
border-radius:20px;

}

.service-content{

text-align:center;

}

.service-content h1{

font-size:40px;
line-height:1.3;

}

.service-content h2{

font-size:30px;

}

.service-content p{

font-size:16px;
line-height:1.8;

}

.book-btn,
.whatsapp-btn{

display:block;
width:100%;
max-width:300px;
margin:10px auto;

}

}

@media (max-width:768px){

.service-hero{

padding:120px 0 60px;

}

.service-content h1{

font-size:30px;

}

.service-content h2{

font-size:24px;

}

.service-content p{

font-size:15px;

}

.service-image img{

border-radius:16px;

}

}
/* ==========================================
   ABOUT + SERVICE MOBILE FIX
========================================== */

@media (max-width:768px){

.container{
width:100%;
max-width:100%;
padding:0 18px;
}

.header{
padding:12px 0;
}

.navbar{
display:flex;
justify-content:space-between;
align-items:center;
}

.nav-links{
width:100%;
}

.about-hero,
.service-hero{
padding:110px 0 60px;
}

.about-hero-grid,
.service-hero-grid{
display:block !important;
}

.about-hero-image,
.service-hero-image{
display:none !important;
}

.about-hero-content,
.service-hero-content{
width:100%;
max-width:100%;
margin:auto;
text-align:center;
}

.about-hero-content h1,
.service-hero-content h1{
font-size:34px !important;
line-height:1.3;
margin-bottom:20px;
}

.about-hero-content p,
.service-hero-content p{
font-size:16px;
line-height:1.8;
margin:20px auto;
}

.hero-buttons{
display:flex;
flex-direction:column;
align-items:center;
gap:15px;
}

.hero-buttons a,
.btn-primary,
.btn-secondary{
width:100%;
max-width:280px;
text-align:center;
}

.about-grid,
.service-grid,
.benefits-grid,
.related-grid,
.process-grid,
.contact-grid,
.footer-grid,
.choose-grid{
grid-template-columns:1fr !important;
}

.about-image,
.service-image{
margin-bottom:25px;
}

.about-image img,
.service-image img{
width:100%;
height:auto;
border-radius:18px;
}

.section-title{
font-size:30px;
line-height:1.3;
}

.section-description{
font-size:15px;
line-height:1.8;
}

.related-card img,
.service-card img{
height:220px;
object-fit:cover;
}

.footer{
text-align:center;
}

}