
* { box-sizing: border-box; }
body { margin: 0;     font-family: Arial, sans-serif; background:#fff8d4; }
/* Header */
header { background: #e85600; position: relative; }

/* Menu container */
.menu {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    padding: 10px 20px;
    position: relative;
}

/* Language dropdown (desktop) */
.lang-select {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}
.lang-select select {
    padding: 6px 10px;
    border-radius: 4px;
    border: 1px solid #ccc;
    font-size: 14px;
}
@media (max-width: 629px) { .lang-select { display: none; } }

/* Menu links */
ul.nav-center {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}
ul.nav-center li { position: relative; margin: 0 10px; }
ul.nav-center li a {
    display: block;
    padding: 8px 14px;
    text-decoration: none;
    color: black;
    border-radius: 4px;
    font-weight: bold;
    background-color: #fff3cd;
    transition: all 0.3s ease;
}
/* ul.nav-center li a:hover { background-color: #dd4814; color: #fff; } */
ul.nav-center li a.active { background-color: #ee5e03; color: #fff; }

/* Dropdown */
.dropdown-content {
    display: none;
    position: absolute;
    top: 104%;
    left: 0;
  
       min-width: 231px;
    z-index: 1000;
}
.dropdown-content a { padding: 8px 12px; }
.dropdown-content a {
    background-color: #ee5e03 !important; /* Bhagava color */
    text-decoration: none; /* Optional: remove underline */
    font-weight: bold; /* Optional: make it stand out */
    color: #fff !important;
}
/* .dropdown:hover .dropdown-content { display: block; } */
.dropdown > a::after { content: " ▼"; font-size: 0.8em; }


/* Mobile menu toggle */
.menu-toggle { display: none; }
.menu-toggle button {
    background: #dd4814;
    border: none;
    color: #fff;
    font-size: 22px;
    width: 42px;
    height: 36px;
    cursor: pointer;
    border-radius: 4px;
}
@media (max-width: 629px){
    .dropdown-content {
        position: relative;      /* inside menu, not absolute */
        background: #ee5e03;     /* optional mobile color */
        border: none;            /* remove desktop border */
        display: none;           /* hidden by default */
        padding-left: 20px;      /* indent items */
        top: 2px;
    }
    .dropdown-content a {
        color: #fff;             /* white text on mobile */
        padding: 10px 0;
        display: block;
        font-size: 16px;
    }
    .dropdown-content a {
    background-color: #ee5e03 !important; /* Bhagava color */
    color: #fff !important;
}
}

/* Mobile menu */
@media (max-width: 629px){
    .menu-toggle { display: block; position: absolute; top: 12px; right: 12px; z-index: 2000; }
    ul.nav-center {
        flex-direction: column;
        display: none;
        position: fixed;
        top:0; left:0;
        width: 100%;
        height: 100%;
        background: #ee5e03;
        padding-top: 60px;
        z-index: 2000;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
    }
    ul.nav-center.open { transform: translateX(0); display: flex; }
    ul.nav-center li a { background: none; color: #fff; border-bottom: 1px solid #fff; font-size: 18px; padding: 12px 20px; }
    ul.nav-center li a:hover { background-color: #dd4814; }
    
    .menu {
    
    padding: 26px 20px;
    
}
}
/* Close button default: hide on desktop */
.close-menu {
    display: none;
}

/* Mobile: show close button */
@media (max-width: 629px) {
    .close-menu {
        display: block;
        position: absolute;
        top: 10px;
        right: 10px;
        font-size: 24px;
        background: none;
        border: none;
        color: white;
        cursor: pointer;
        z-index: 2002;
    }
}


.mobile-lang-footer {
    display: none; /* hide on desktop */
}

@media (max-width: 629px) {
    /* Mobile language footer fixed at bottom */
    .mobile-lang-footer {
        display: flex !important;          /* horizontal */
        justify-content: center;           /* center links */
        align-items: center;               /* vertical center */
        position: fixed;                   /* fixed at bottom */
        bottom: 0;                         /* stick to bottom */
        left: 0;
        width: 100%;
        padding: 10px 0;
                         /* visible background */
        border-top: 1px solid #ddd;
        z-index: 2001;                     /* above menu overlay */
        font-size: 14px;
        gap: 5px;                            /* no extra space needed */
    }

    /* Links inline with "|" separator */
    .mobile-lang-footer a {
        display: inline-block;
        color: white;
        text-decoration: none;
        font-weight: normal;
        margin: 0;
        padding: 0 5px;
        position: relative;
    }

    /* Add "|" separator except last link */
    .mobile-lang-footer a:not(:last-child)::after {
        content: "|";
        margin-left: 5px;
        color: white;
    }

}

/* FORCE PUJA DROPDOWN ALWAYS OPEN ON MOBILE */
@media (max-width: 629px) {

    /* dropdown container */
    .dropdown {
        display: block;
    }

    /* dropdown content ALWAYS visible */
    .dropdown .dropdown-content {
        display: block !important;
        position: relative;
        background: #ee5e03;
        border: none;
        padding-left: 20px;
    }

    /* dropdown title clickable but no effect */
    .dropdown > a {
        pointer-events: none; /* tap केलं तरी काही होणार नाही */
    }
}
/* Puja dropdown spacing */
.dropdown-content a {
    margin-bottom: 3px;        /* प्रत्येक puja मध्ये gap */
    padding: 10px 14px;        /* link आत spacing */
    line-height: 1.4;
    border-radius: 4px;
}

/* Last item ला extra margin नको */
.dropdown-content a:last-child {
    margin-bottom: 0;
}


/* Logo + Heading Section */
.logo-section {
    display: flex;
    justify-content: center;       /* centers the block on page */
    align-items: center;           /* vertically centers logo and heading */
    padding: 30px 20px;
    background: #fff8d4;
}

.logo-wrapper {
    display: flex;
    align-items: center;           /* vertically align logo & text */
    max-width: 924px;
    width: 100%;
    flex-wrap: nowrap;             /* prevent wrapping */
}

.logo {
    flex: 0 0 auto;
    margin-right: 20px;
}

.logo img {
    width: 243px;
    height: 238px;
}

.heading {
    flex: 1;
    text-align: left;
}

.heading h1 {
    margin: 0;
    font-size: 37px;
    color: #333;
}

.heading p {
    margin: 5px 0 0 0;
    font-size: 16px;
    color: #555;
}

/* Responsive for mobile */
@media (max-width: 629px) {
    .logo-wrapper {
        flex-wrap: nowrap;           /* keep logo + text side by side */
        align-items: center;         /* vertically center */
    }

    .logo img {
        width: 80px;
        height: auto;
    }

    .heading h1 {
        font-size: 20px;
    }

    .heading p {
        font-size: 12px;
    }
    .logo-section {
   
          /* vertically centers logo and heading */
    padding: 0px 0px;
    
}

}

.content-area {
   padding-left: 40px;
   padding-right: 40px;
    text-align: justify;
    font-size: 16px;
    line-height: 1.5;
}

.section-title {
    font-size: 25px; /* Desktop default */
    font-weight: bold;
    color: black; /* optional color */
}

/* Mobile adjustments */
@media (max-width: 629px) {
    .section-title {
        font-size: 18px; /* Mobile font size */
        font-weight: bold;
    }

    .content-area {
   padding-left: 20px;
   padding-right: 20px;
   
}
}
.section-subtitle {
    font-size: 20px; /* Desktop font size */
    color: black;     /* Optional color */
  
     font-weight: bold;
}

/* Mobile adjustments */
@media (max-width: 629px) {
    .section-subtitle {
        font-size: 17px; /* Mobile font size */
         font-weight: bold;
    }
}
.section-divider {
    width: 100%;
   
    border: none;
    border-top: 4px solid #a60606;
}
