*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Arial;
}

.container{
width:90%;
margin:auto;
}

/* TOPBAR */

.topbar{
background:rgba(0,0,0,0.6);
color:white;
font-size:14px;
padding:10px 0;
}

.topbar-flex{
display:flex;
justify-content:space-between;
align-items:center;
}

.nav ul li a i{
font-size:12px;
margin-left:5px;
}
.dropdown:hover i{
transform:rotate(180deg);
transition:0.3s;
}
/* MAIN HEADER */

.main-header{
position:absolute;
top:60px;
width:100%;
z-index:999;
}

.nav-flex{
background:white;
padding:4px 12px;
display:flex;
align-items:center;
justify-content:space-between;
box-shadow:0 3px 10px rgba(0,0,0,0.1);
}

/* LOGO */

.logo{
display:flex;
align-items:center;
gap:10px;
}
.logo img{
height:70px;
width:auto;
display:block;
}
.om{
color:#ff5722;
font-size:30px;
}

/* MENU */

.nav ul{
display:flex;
list-style:none;
}

.nav ul li{
position:relative;
}

/* .nav ul li a{
padding:20px 15px;
display:block;
text-decoration:none;
color:#1b2a4e;
font-weight:500;
} */

.nav ul li a{
position:relative;
padding:20px 15px;
display:block;
text-decoration:none;
color:#1b2a4e;
font-weight:500;
transition:0.3s;
}

/* underline animation */

.nav ul li a::after{
content:"";
position:absolute;
left:0;
bottom:10px;
width:0%;
height:2px;
background:#5c1919;
transition:0.3s ease;
}

/* hover effect */

.nav ul li a:hover::after{
width:90%;
}

/* active menu */

.nav ul li a.active{
color:#5c1919;
}

/* active underline */

.nav ul li a.active::after{
width:100%;
}
/* DROPDOWN */
.submenu{
position:absolute;
top:100%;
left:0;
background:white;
min-width:260px;   /* change from 160px */
list-style:none;
display:flex;
flex-direction:column;
opacity:0;
visibility:hidden;
transform:translateY(10px);
transition:0.3s;
box-shadow:0 5px 10px rgba(0,0,0,0.1);
}
.submenu li{
width:100%;
}
.submenu li a{
padding:10px 15px;
display:block;
white-space:nowrap;
}

/* show on hover */

.dropdown:hover .submenu{
opacity:1;
visibility:visible;
transform:translateY(0);
z-index: 9999;
}


.submenu li a:hover{
background:#f5f5f5;
}
/* ICONS */

.icons{
display:flex;
gap:20px;
font-size:18px;
}

/* STICKY */

.sticky{
position:fixed;
top:0;
width:100%;
}

/* MOBILE */

.menu-btn{
display:none;
font-size:24px;
cursor:pointer;
}

.nav ul li{
position:relative;
}

@media(max-width:768px){

.nav{
position:absolute;
top:70px;
left:-100%;
width:100%;
background:white;
}

.nav.active{
left:0;
}

.nav ul{
flex-direction:column;
}

.menu-btn{
display:block;
}

.icons{
display:none;
}
/* disable hover dropdown on mobile */
.dropdown:hover .submenu{
opacity:0;
visibility:hidden;
transform:translateY(10px);
}

/* show submenu when open class added */
.dropdown.open .submenu{
opacity:1;
visibility:visible;
transform:translateY(0);
position:relative;
box-shadow:none;
}

}

@media(max-width:1024px){

.nav{
position:absolute;
top:70px;
left:-100%;
width:100%;
background:white;
}

.nav.active{
left:0;
}

.nav ul{
flex-direction:column;
}

.menu-btn{
display:block;
}

.icons{
display:none;
}

/* disable hover dropdown */
.dropdown:hover .submenu{
opacity:0;
visibility:hidden;
transform:translateY(10px);
}

/* show when clicked */
.dropdown.open .submenu{
opacity:1;
visibility:visible;
transform:translateY(0);
position:relative;
box-shadow:none;
}

}

/* hero section */
.hero{
width:100%;
height:80vh;
}

.heroSwiper{
width:100%;
height:100%;
}

.hero-slide12{
height:100vh;
background-size:cover;
background-position:center;
display:flex;
align-items:center;
justify-content:center;
position:relative;
}
.hero-slide{
height:100vh;
background-size:cover;
background-position:center;
display:flex;
align-items:center;      /* vertical center */
justify-content:center;  /* horizontal center */
text-align:center;
position:relative;
padding-top:120px;       /* header space */
}
.hero-content123{
position:relative;
text-align:center;
color:white;
z-index:2;
margin-top:80px;
}
.hero-content{
position:relative;
z-index:2;
color:white;
max-width:700px;
margin:auto;
margin-top:150px;
}
.hero-slide122::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.4);
}
.hero-slide::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.45);
}
/* 
.hero-content{
position:relative;
text-align:center;
color:white;
z-index:2;
} */

.hero-content h1{
font-size:60px;
margin-bottom:10px;
}

.hero-content p{
font-size:18px;
}

/* responsive */

@media(max-width:768px){

.hero-content h1{
font-size:36px;
}

.hero{
height:70vh;
}

.hero-slide{
height:70vh;
}

}
.swiper-button-next,
.swiper-button-prev{
color:#5c1919 !important;
}
.swiper-slide{
transition:1s;
}
.hero-buttons1223{
margin-top:20px;
display:flex;
gap:15px;
justify-content:center;
flex-wrap:wrap;
}
.hero-buttons{
margin-top:20px;
display:flex;
gap:15px;
justify-content:center;
flex-wrap:wrap;
}
.store-btn{
display:flex;
align-items:center;
gap:10px;
padding:12px 18px;
background:white;
color:#000;
text-decoration:none;
border-radius:6px;
font-size:14px;
transition:0.3s;
}
.hero-content h1{
font-size:60px;
line-height:1.2;
}
.store-btn i{
font-size:20px;
}

.store-btn:hover{
background:#5c1919;
color:white;
}

/* mobile */

@media(max-width:768px){

.hero-buttons{
flex-direction:column;
align-items:center;
}
.hero-content h1{
font-size:36px;
}

}
/* end hero section */






/* DIGITAL SERVICES */

.digital-services{
padding:80px 0;
background:#ffffff;
}

/* SECTION TITLE */

.section-title{
text-align:center;
margin-bottom:60px;
}

.section-title h2{
font-size:36px;
color:#1b2a4e;
margin-bottom:10px;
}

.section-title p{
color:#666;
font-size:16px;
}

/* GRID LAYOUT */

.services-grid{
display:grid;
grid-template-columns:repeat(auto-fit, minmax(260px, 260px));
gap:40px;
justify-content:center;
max-width:1100px;
margin:auto;
}

/* CARD */

.service-card{
background:#f9f9f9;
padding:35px 25px;
text-align:center;
border-radius:14px;
transition:0.3s;
box-shadow:0 10px 25px rgba(0,0,0,0.08);
width:260px;
}

/* ICON */

.service-card i{
font-size:28px;
color:white;
background:#5c1919;
width:65px;
height:65px;
line-height:65px;
border-radius:50%;
margin-bottom:18px;
display:inline-block;
}

/* TITLE */

.service-card h3{
font-size:20px;
margin-bottom:10px;
color:#1b2a4e;
}

/* TEXT */

.service-card p{
font-size:14px;
color:#555;
line-height:1.6;
}

/* HOVER EFFECT */

.service-card:hover{
transform:translateY(-10px);
box-shadow:0 20px 40px rgba(0,0,0,0.15);
}

.service-card:hover i{
transform:scale(1.1);
transition:0.3s;
}

/* RESPONSIVE */

@media(max-width:768px){

.section-title h2{
font-size:28px;
}

.services-grid{
gap:30px;
}

.service-card{
width:240px;
}

}

@media(max-width:480px){

.services-grid{
grid-template-columns:1fr;
justify-items:center;
}

.service-card{
width:100%;
max-width:320px;
}

}



    /* DEVOTEE SECTION */

.devotee-section{
padding:90px 20px;
background:#f9f9f9;
}

.devotee-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
}

/* LEFT SIDE */

.devotee-info h2{
font-size:36px;
margin-bottom:15px;
color:#d07e2d;
}

.devotee-info p{
color:white;
line-height:1.7;
margin-bottom:20px;
}

.devotee-benefits{
list-style:none;
margin-bottom:25px;
padding:0;
}

.devotee-benefits li{
margin-bottom:10px;
padding-left:22px;
position:relative;
color: #f9f9f9;
}

.devotee-benefits li::before{
content:"✔";
position:absolute;
left:0;
color:#d07e2d;
font-weight:bold;
}

.devotee-buttons{
display:flex;
gap:15px;
flex-wrap:wrap;
}

/* FORM CARD */

.devotee-form{
background:rgba(255,255,255,0.15);
backdrop-filter:blur(15px);
-webkit-backdrop-filter:blur(15px);
padding:40px;
border-radius:16px;
border:1px solid rgba(255,255,255,0.3);
box-shadow:0 20px 50px rgba(0,0,0,0.2);
color:#fff;
}


.devotee-form h3{
margin-bottom:20px;
color:#fff;
}


/* FORM */

.form-group{
margin-bottom:15px;
}

.form-group input,
.form-group select,
.form-group textarea{
width:100%;
padding:12px;
border-radius:6px;
border:1px solid rgba(255,255,255,0.4);
background:rgba(255,255,255,0.1);
color:white;
font-size:14px;
outline:none;
}

.form-group textarea{
height:100px;
resize:none;
}

/* BUTTON */

.submit-btn{
width:100%;
padding:13px;
background:#ff6a00;
color:white;
border:none;
border-radius:6px;
font-size:15px;
cursor:pointer;
transition:0.3s;
}

.submit-btn:hover{
background:#e85c00;
}

/* CTA BUTTONS */

.cta-btn{
padding:12px 20px;
border-radius:6px;
text-decoration:none;
font-size:14px;
transition:0.3s;
}

.cta-btn.secondary{
background:#ff6a00;
color:white;
}

.cta-btn.outline{
border:2px solid #5c1919;
color:#5c1919;
}

.cta-btn:hover{
opacity:0.9;
}

/* RESPONSIVE */

@media(max-width:900px){

.devotee-grid{
grid-template-columns:1fr;
}

.devotee-info{
text-align:center;
}

.devotee-buttons{
justify-content:center;
}

}
.devotee-section{
padding:100px 20px;
background:linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),
url('./image/form.png');
background-size:cover;
background-position:center;
}


/* footer */
/* FOOTER */

.footer{
background:#111;
color:#ccc;
padding-top:70px;
}
.footer .container{
    margin-bottom: 17px;
}
.footer-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:40px;
}

/* LOGO */

.footer-logo{
width:120px;
margin-bottom:15px;
}

/* TEXT */

.footer p{
font-size:14px;
line-height:1.7;
}

/* HEADINGS */

.footer h3{
color:white;
margin-bottom:15px;
}

/* LINKS */

.footer-links ul{
list-style:none;
padding:0;
}

.footer-links li{
margin-bottom:8px;
}

.footer-links a{
color:#ccc;
text-decoration:none;
font-size:14px;
transition:0.3s;
}

.footer-links a:hover{
color:#ff6a00;
}

/* SOCIAL */

.footer-social{
margin-top:15px;
}

.footer-social a{
display:inline-block;
margin-right:10px;
font-size:18px;
color:white;
background:#5c1919;
width:35px;
height:35px;
line-height:35px;
text-align:center;
border-radius:50%;
transition:0.3s;
}

.footer-social a:hover{
background:#ff6a00;
}

.footer-legal{
text-align:center;
padding:15px 20px;
border-top:1px solid #333;
}

.footer-legal a{
color:#ccc;
margin:0 10px;
font-size:13px;
text-decoration:none;
}

.footer-legal a:hover{
color:#ff6a00;
}

/* APP BUTTON */

.footer-app-btns{
margin-top:10px;
}

.app-btn{
display:inline-block;
margin-right:10px;
margin-top:10px;
padding:8px 14px;
background:#5c1919;
color:white;
border-radius:6px;
text-decoration:none;
font-size:13px;
}

.app-btn:hover{
background:#ff6a00;
}

/* BOTTOM */

.footer-bottom{
text-align:center;
padding:20px;
margin-top:0px;
border-top:1px solid #333;
font-size:13px;
}

/* RESPONSIVE */

@media(max-width:992px){

.footer-grid{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:600px){

.footer-grid{
grid-template-columns:1fr;
text-align:center;
}

.footer-social{
justify-content:center;
}

}
/* end footer */
.whatsapp-float {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 65px;
    height: 65px;
    background-color: #25D366;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    z-index: 1000;
    cursor: pointer;

    /* Animation */
    animation: pulse 2s infinite, shake 2s infinite;
}

.whatsapp-float img {
    width: 35px;
}

/* 🔵 Pulse Animation */
@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
    }
    70% {
        transform: scale(1.1);
        box-shadow: 0 0 0 15px rgba(37, 211, 102, 0);
    }
    100% {
        transform: scale(1);
    }
}

/* 🔄 Shake Animation */
@keyframes shake {
    0% { transform: translateX(0); }
    20% { transform: translateX(-3px); }
    40% { transform: translateX(3px); }
    60% { transform: translateX(-3px); }
    80% { transform: translateX(3px); }
    100% { transform: translateX(0); }
}

/* Hover pe smooth zoom */
.whatsapp-float:hover {
    animation: none;
    transform: scale(1.15);
}