@media(max-width:768px){

    .pull-left{
        float:none;           /* float remove */
        display:block;
        width:90px;           /* 👈 smaller size */
        margin:15px auto 0;   /* center image */
    }

    .bg-purohit-contact{
        text-align:justify;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

}
.bg-purohit-contact {
    padding-left: 40px;
    padding-right: 40px;
    text-align: justify;
    line-height: 1.5;
}

/* Mobile screens (max-width: 768px) */
@media (max-width: 768px) {
    .bg-purohit-contact {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

   .bg-purohit-contact img{
    float: left;
    margin-right: 20px;
    margin-bottom: 10px;
    width: 120px; /* adjust jar motha vatat asel tar */
}
.bg-purohit-contact p{
    overflow: hidden;
}
@media(max-width:768px){
    .bg-purohit-contact img{
                float: none;
        display: block;
        margin: 0 43px 15px auto;
        padding-right: 40px !important;
        width: 215px;
        height: 218px;
    }
}
/* Main correct logo left side */
.pull-left{
    float: left;
    width: 170px;
    margin-right: 25px;
    margin-bottom: 10px;
    margin-top: 5px;   /* control vertical position */
}


/* Paragraph proper wrap */
.bg-purohit-contact p{
    text-align: justify;

}


.bg-purohit-contact  a {
    color: #800000;      /* maroon color */
    cursor: pointer;     /* show pointer on hover */
      text-decoration: none; /* remove underline */
}

.wrong-logo{
    display: flex;
    justify-content: center;   /* center horizontally */
    align-items: center;
    gap: 15px;                 /* spacing between images */
    margin: 20px 0;
    flex-wrap: wrap;           /* wrap images to next line on small screens */
    height: auto;              /* default height */
}

.wrong-logo img{
    width: 60px;
    display: block;
    height: auto;              /* maintain aspect ratio */
}

/* Tablet view */
@media (max-width: 768px) {
    .wrong-logo img {
        width: 45px;
    }
    .wrong-logo {
        height: auto;          /* adjust container height automatically */
    }
}

/* Mobile view */
@media (max-width: 480px) {
    .wrong-logo img {
                width: 55px;
        margin-left: -2rem;
    }
    .wrong-logo {
        height: auto;          /* container height adjusts as images wrap */
    }
}

.faq-container {
    
    padding: 20px 2%;
}

.faq-title {
    text-align: left;
    margin-bottom: 50px;
    font-weight: bold;
}

.faq-wrapper {
    display: flex;
    gap: 40px;
}

.faq-left,
.faq-right {
    width: 50%;
}

.faq-card {
    margin-bottom: 10px;
}

.faq-question {
    background: #f04e00;
    color: #fff;
    padding: 14px 20px;
    border-radius: 12px;
    font-weight: 600;
    margin-bottom: 0px;
}

.faq-answer {
    background: #e8dfc8;
    padding: 18px;
    border-radius: 12px;
    border: 1px solid #8b0000;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .faq-wrapper {
        flex-direction: column;
    }

    .faq-left,
    .faq-right {
        width: 100%;
    }
}



 
@media (max-width: 768px) {
    .text-order-container {
        display: flex;
        flex-direction: column; /* stack vertically */
    }

    /* first 2 paragraphs stay first */
    .text-order-container p:nth-of-type(1),
    .text-order-container p:nth-of-type(2) {
        order: 1;
    }

    /* image comes after the first 2 paragraphs */
    .text-order-container img {
        order: 2;
        width: 100%;          /* adjust width for mobile */
        max-width: 365px;     /* optional max width */
        align-self: center;   /* center image horizontally */
       
        float: none !important;   /* override pull-left */
        margin-right: 0 !important;
    }

    /* remaining paragraphs after image */
    .text-order-container p:nth-of-type(n+3) {
        order: 3;
    }
}
        /* डेस्कटॉपसाठी */
.responsive-img {
 
   width: 165px !important;
    height: 100px !important;
}

/* मोबाइलसाठी */
@media only screen and (max-width: 768px) {
  .responsive-img {
    width: 284px;
  height: 235px;
      margin-left: 5rem;
  }
}



body{
    margin:0;
    font-family: Arial, sans-serif;
    background-color: #FFF8E1;
}
/* Prevent horizontal scrolling on mobile */
html, body {
    overflow-x: hidden;
}

/* ===== TOP NAV ===== */

.top-nav{
    background:#e65100;
 
    padding:12px 0;
    text-align:center;
}

.top-nav a,
.dropbtn{
    text-decoration:none;
    color:#fff;
    background:#ff6f00;
    padding:8px 18px;
    border-radius:25px;
    margin:0 8px;
    font-weight:bold;
    border:2px solid yellow;
    display:inline-block;
    transition:0.3s;
    font-size:14px;
}

.top-nav a:hover,
.dropbtn:hover{
    background:#ff8f00;
}

/* ===== DROPDOWN ===== */

.dropdown{
    display:inline-block;
    position:relative;
}

.dropdown-content{
    display:none;
    position:absolute;
    top:36px;
    left:0;
    min-width:240px;
    z-index:1000;
}

.dropdown-content a{
    display:block;
    background:#ff6f00;
    color:#fff;
    padding:6px 12px;
    margin:5px 0;
    border-radius:20px;
    border:2px solid yellow;
    text-decoration:none;
    font-size:13px;
}

.dropdown-content a:hover{
    background:#ff8f00;
}

.dropdown-content.show{
    display:block;
}

/* ===== MAIN HEADER ===== */

.main-header{
    background:#e65100;
    padding:25px 0 20px;
    text-align:center;
    position:relative;
    border-bottom:5px solid yellow;
}

.logo{
    position:absolute;
    left:20%;
    top:25px;
    width:90px;
}

.title-box{
    display:inline-block;
    padding:18px 60px;
    border-radius:50px;
    background:linear-gradient(#b71c1c,#7f0000);
    border:3px solid gold;
  
    color:gold;
    font-size:28px;
    font-weight:bold;
    letter-spacing:1px;
}

.subtitle{
    color:#fff;
    margin-top:12px;
    font-style:italic;
    font-size:18px;
}

.header-divider{
    background:#e0e0e0;
    border-top:2px solid #fffa07;
}
/* ===== MOBILE TOGGLE ===== */

.mobile-toggle{
    display:none;
    background:#ff6f00;
    color:#fff;
    border:2px solid yellow;
    padding:2px 12px;
    font-size:22px;
    border-radius:8px;
    cursor:pointer;
    
}

/* ===== MOBILE SIDEBAR ===== */

@media (max-width:768px){

    .mobile-toggle{
        display:block;
        margin:0 auto 10px;
        margin-left: 18rem;
    }

    .nav-links{
        position:fixed;
        top:0;
        left:-100%;
        width:100%;
        height:100%;
        background:#e65100;
        padding-top:70px;
        transition:0.4s;
        z-index:9999;
        text-align:left;
    }

    .nav-links a,
    .nav-links .dropbtn{
        display:block;
        margin:15px 20px;
    }

    .nav-links.show{
        left:0;
    }

    .dropdown-content{
        position:relative;
        top:0;
    }
}
/* CLOSE BUTTON */

.close-btn{
    display:none;
}

@media (max-width:768px){

    .close-btn{
        display:block;
        position:absolute;
        top:15px;
        left:92%;
        transform:translateX(-50%);
        font-size:24px;
        color:#fff;
        cursor:pointer;
        font-weight:bold;
    }

}
@media (max-width:768px){

    
    .dropdown-content a{
        display:block;
        width:calc(100% - 40px);   /* same width */
        margin:12px 20px;
        padding:10px 18px;
        border-radius:25px;
        border:2px solid yellow;
        background:#ff6f00;
        text-align:left;
    }

    .dropdown{
        display:block;
        width:100%;
    }

    .dropdown-content{
        position:relative;
        width:100%;
        margin-top:5px;
    }

}
@media (max-width:768px){

    /* Remove rounded button style */
    .nav-links a,
    .nav-links .dropbtn,
    .dropdown-content a {
        position: relative;           /* needed for pseudo-element */
        display: block;
        padding: 15px 20px;
        color: #fff;
        font-weight: 500;
        background: none;
        border: none;
        border-radius: 0;
        margin: 0;
        text-decoration: none;
    }

    /* Thinner bottom border */
    .nav-links a::after,
    .dropdown-content a::after {
        content: "";
        display: block;
        width: 100%;                  /* change this to control border width */
        margin: 0 auto;              /* center the border */
        border-bottom: 1px solid rgba(255,255,255,0.3);
    }

    .nav-links a:hover::after,
    .dropdown-content a:hover::after {
        border-color: rgba(255,255,255,0.6); /* optional hover effect */
    }

    .nav-links a:hover,
    .dropdown-content a:hover{
        background:rgba(255,255,255,0.1);
    }

    .dropdown-content{
        margin:0;
    }

}
@media (max-width:768px){

    .dropdown {
        width: 100%;
    }

    .nav-links .dropbtn {
        display: block;
        width: 100%;
        text-align: left;      /* important for mobile */
        background: none;
        border: none;
        border-radius: 0;
        padding: 15px 20px;
        margin: 0;
        position: relative;    /* needed for pseudo-element */
    }

    /* Shorter bottom border */
    .nav-links .dropbtn::after {
        content: "";
        display: block;
        width: 100%;                     /* adjust width as you like */
        margin: 0 0 0 20px; 
        margin-left: -0.2rem;            /* align with text padding */
        border-bottom: 1px solid rgba(255,255,255,0.3);
    }

    /* optional hover effect */
    .nav-links .dropbtn:hover::after {
        border-color: rgba(255,255,255,0.6);
    }

}



@media (max-width:768px){
    .main-header{
        display: flex;
        flex-direction: column;   /* stack rows vertically */
        align-items: center;
        justify-content: center;
        gap: 5px;                 /* space between rows */
        padding: 10px;
    }

    /* Row container for logo + title */
    .logo-title-row {
        display: flex;
        flex-direction: row;       /* logo and title side by side */
        align-items: center;
        gap: 8px;                  /* space between logo and title */
    }

    .logo{
                width: 50px;
        margin-left: -4rem;
        margin-top: -1rem;
        height: auto;
    }
    

    .title-box{
        font-size: 16px;
        padding: 6px 12px;
        border-radius: 20px;
        text-align: center;
        margin-left: 2rem;
    }

    .subtitle{
        display: block;           /* put subtitle on next line */
        width: 100%;
        font-size: 12px;
        text-align: center;
        margin-top: 4px;
    }
}