
.header-area{
    background:#ffffff;
    padding:5px 0;
}

/* Logo */

.navbar-brand{
    font-size:26px;
    font-weight:700;
    color:green !important;
}

/* Menu */

.navbar-nav .nav-link{
    color:green !important;
    font-size:19px;
    font-weight:600;
    margin-left:30px;
}

.navbar-nav .nav-link:hover{
    color:#0b7d32 !important;
}

/* Hamburger */

.navbar-toggler{
    border:none;
}

.navbar-toggler:focus{
    box-shadow:none;
}

.hamburger{
    width:30px;
    height:22px;
    position:relative;
}

.hamburger span{
    position:absolute;
    width:100%;
    height:3px;
    background:green;
    left:0;
    transition:0.3s;
}

.hamburger span:nth-child(1){
    top:0;
}

.hamburger span:nth-child(2){
    top:9px;
}

.hamburger span:nth-child(3){
    bottom:0;
}

/* Cross animation */

.navbar-toggler.active span:nth-child(1){
    transform:rotate(45deg);
    top:9px;
}

.navbar-toggler.active span:nth-child(2){
    opacity:0;
}

.navbar-toggler.active span:nth-child(3){
    transform:rotate(-45deg);
    top:9px;
}

/* Mobile spacing */

@media(max-width:991px){

.navbar-nav{
    text-align:center;
    padding-top:15px;
}

.navbar-nav .nav-link{
    margin-left:0;
    padding:12px 0;
}

}

.marquee-container{
    width:100%;
    background-color: var(--pbmit-secondary-color);
    background-image: url(../images/homepage-3/bg/yoga-pattern-new-01.png);
    color:white;
    overflow:hidden;
    padding:10px 0;
}

.marquee-text{
    display:inline-block;
    white-space:nowrap;
    animation:marquee 15s linear infinite;
    font-size:18px;
    font-weight:600;
}

@keyframes marquee{
    0%{
        transform:translateX(100%);
    }
    100%{
        transform:translateX(-100%);
    }
}


.our-values{
    background:#f8f9fa;
    }
    
    .section-title{
    font-size:36px;
    font-weight:700;
    color:#0B1F3A;
    }
    
    .section-subtitle{
    color:#777;
    }
    
    .value-box{
    background:white;
    padding:35px 25px;
    border-radius:10px;
    transition:0.3s;
    height:100%;
    box-shadow:0 5px 15px rgba(0,0,0,0.05);
    }
    
    .value-box:hover{
    transform:translateY(-8px);
    }
    
    .icon-box{
    width:70px;
    height:70px;
    margin:auto;
    background:#C8A44D;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:20px;
    }
    
    .icon-box i{
    font-size:28px;
    color:white;
    }
    
    .value-box h4{
    font-size:20px;
    font-weight:600;
    margin-bottom:10px;
    color:#0B1F3A;
    }
    
    .value-box p{
    font-size:15px;
    color:#666;
    }


    .what-we-do{
        background:#f8f9fa;
        }
        
        .service-card{
        position:relative;
        overflow:hidden;
        border-radius:10px;
        padding:40px 30px;
        height:260px;
        transition:.4s;
        }
        
        /* different light colors */
        
        .service-card{
        background:#FFF3E6;
        }
        
        .card2{
        background:#E8F6F3;
        }
        
        .card3{
        background:#F3ECFF;
        }
        
        /* content */
        
        .service-content h4{
        font-size:22px;
        font-weight:600;
        color:#0B1F3A;
        margin-bottom:10px;
        }
        
        .service-content p{
        font-size:15px;
        color:#555;
        }
        
        /* image */
        
        .service-image{
        position:absolute;
        top:0;
        right:-100%;
        width:50%;
        height:100%;
        transition:.5s;
        }
        
        .service-image img{
        width:100%;
        height:100%;
        object-fit:cover;
        }
        
        /* hover effect */
        
        .service-card:hover .service-image{
        right:0;
        }
        
        .service-card:hover{
        box-shadow:0 10px 30px rgba(0,0,0,0.1);
        }



        .partnership-section{
            background:#f8f9fa;
            }
            
            .partner-img img{
            width:100%;
            border-radius:12px;
            }
            
            .partner-title{
            font-size:36px;
            font-weight:700;
            color:#0B1F3A;
            margin-bottom:20px;
            }
            
            .partner-text{
            font-size:16px;
            color:#555;
            line-height:1.7;
            margin-bottom:15px;
            }
            
            .partner-btn{
            display:inline-block;
            background:#C8A44D;
            color:#000;
            padding:12px 28px;
            border-radius:6px;
            text-decoration:none;
            font-weight:600;
            transition:0.3s;
            }
            
            .partner-btn:hover{
            background:#0B1F3A;
            color:white;
            }



            .founder-section{
                background:#c0f1f8;
                }
                
                .founder-img img{
                width:100%;
                border-radius:12px;
                box-shadow:0 10px 25px rgba(0,0,0,0.1);
                }
                
                .founder-title{
                font-size:34px;
                font-weight:700;
                color:#0B1F3A;
                margin-bottom:20px;
                }
                
                .founder-text{
                font-size:16px;
                color:#555;
                line-height:1.7;
                margin-bottom:15px;
                }
                
                .founder-name{
                font-size:18px;
                font-weight:600;
                color:#C8A44D;
                margin-top:20px;
                }



                .yoga-card{
                    background:white;
                    border-radius:10px;
                    overflow:hidden;
                    box-shadow:0 5px 15px rgba(0,0,0,0.08);
                    transition:.3s;
                    }
                    
                    .yoga-card:hover{
                    transform:translateY(-6px);
                    }
                    
                    .yoga-img{
                    position:relative;
                    }
                    
                    .yoga-img img{
                    width:100%;
                    height:220px;
                    object-fit:cover;
                    }
                    
                    /* TAG CONTAINER */
                    
                    .tags{
                    position:absolute;
                    top:15px;
                    left:15px;
                    display:flex;
                    gap:6px;
                    flex-wrap:wrap;
                    }
                    
                    /* TAG STYLE */
                    
                    .tag{
                    background:#C8A44D;
                    color:black;
                    padding:5px 12px;
                    font-size:12px;
                    border-radius:20px;
                    font-weight:600;
                    }
                    
                    .yoga-content{
                    padding:25px;
                    }
                    
                    .more-btn{
                    padding:10px 25px;
                    border:2px solid #0B1F3A;
                    border-radius:15px;
                    text-decoration:none;
                    color:#0B1F3A;
                    font-weight:600;
                    display:inline-block;
                    margin-top:10px;
                    }
                    
                    .more-btn:hover{
                    background:#0B1F3A;
                    color:white;
                    }



                    .event-section{
                        background:#c0f1f8;
                        }
                        
                        .event-img img{
                        width:100%;
                        border-radius:12px;
                        }
                        
                        .event-date{
                        color:#C8A44D;
                        font-weight:600;
                        font-size:25px;
                        margin-bottom:10px;
                        }
                        
                        .event-title{
                        font-size:32px;
                        font-weight:700;
                        color:#0B1F3A;
                        margin-bottom:20px;
                        }
                        
                        .event-btn{
                        display:inline-block;
                        padding:10px 25px;
                        border:2px solid #0B1F3A;
                        border-radius:15px;
                        text-decoration:none;
                        color:#0B1F3A;
                        font-weight:600;
                        transition:0.3s;
                        }
                        
                        .event-btn:hover{
                        background:#0B1F3A;
                        color:white;
                        }



                        .event-section{
                            background:#f8f9fa;
                            }
                            
                            .event-box{
                            background:white;
                            padding:30px;
                            border-radius:12px;
                            box-shadow:0 5px 20px rgba(0,0,0,0.08);
                            }
                            
                            .event-info{
                            border-right:1px solid #eee;
                            padding-right:20px;
                            }
                            
                            .event-item{
                            display:flex;
                            align-items:center;
                            margin-bottom:15px;
                            font-size:15px;
                            color:#444;
                            }
                            
                            .event-item i{
                            color:#C8A44D;
                            font-size:18px;
                            margin-right:10px;
                            }
                            
                            .join-btn{
                            display:inline-block;
                            margin-top:10px;
                            padding:10px 25px;
                            border:2px solid #0B1F3A;
                            border-radius:15px;
                            text-decoration:none;
                            color:#0B1F3A;
                            font-weight:600;
                            transition:0.3s;
                            }
                            
                            .join-btn:hover{
                            background:#0B1F3A;
                            color:white;
                            }
                            
                            .event-title{
                            font-size:28px;
                            font-weight:700;
                            color:#0B1F3A;
                            margin-bottom:15px;
                            }
                            
                            .event-content p{
                            color:#555;
                            line-height:1.7;
                            font-size:15px;
                            }


                            .hero-banner{
                                background:url("images/homepage-1/event-img-2.jpg") center/cover no-repeat;
                                height:500px;
                                display:flex;
                                align-items:center;
                                justify-content:center;
                                text-align:center;
                                position:relative;
                                color:white;
                                }
                                
                                /* dark overlay */
                                
                                .hero-banner::before{
                                content:"";
                                position:absolute;
                                top:0;
                                left:0;
                                width:100%;
                                height:100%;
                                background:rgba(0,0,0,0.4);
                                }
                                
                                .hero-banner .container{
                                position:relative;
                                z-index:2;
                                }
                                
                                /* Comic Sans title */
                                
                                .hero-title{
                                font-family:"Comic Sans MS", cursive;
                                font-size:55px;
                                font-weight:bold;
                                margin-bottom:20px;
                                color: white;
                                }
                                
                                .hero-text{
                                font-size:18px;
                                margin-bottom:25px;
                                }
                                
                                .hero-btn{
                                padding:12px 28px;
                                border:2px solid white;
                                border-radius:15px;
                                color:white;
                                text-decoration:none;
                                font-weight:600;
                                transition:.3s;
                                }
                                
                                .hero-btn:hover{
                                background:white;
                                color:#0B1F3A;
                                }



                                .marquee-section{
                                    background:#F6F8FB;
                                    padding:15px 0;
                                    overflow:hidden;
                                    }
                                    
                                    .marquee{
                                    white-space:nowrap;
                                    overflow:hidden;
                                    }
                                    
                                    .marquee-content{
                                    display:inline-block;
                                    animation:marquee 18s linear infinite;
                                    }
                                    
                                    .marquee-content span{
                                    display:inline-block;
                                    margin-right:60px;
                                    font-size:25px;
                                    font-weight:600;
                                    color:#0B1F3A;
                                    }
                                    
                                    .marquee-content i{
                                    color:#C8A44D;
                                    margin-right:8px;
                                    }
                                    
                                    @keyframes marquee{
                                    0%{
                                    transform:translateX(100%);
                                    }
                                    100%{
                                    transform:translateX(-100%);
                                    }
                                    }

                                    .cta-offer{
                                        background:#EAF6FF;
                                        padding:40px 20px;
                                        }
                                        
                                        .offer-title{
                                        font-size:40px;
                                        font-weight:700;
                                        color:#0B1F3A;
                                        margin-bottom:25px;
                                        }
                                        
                                        .offer-btn{
                                        display:inline-block;
                                        padding:12px 35px;
                                        border:2px solid #0B1F3A;
                                        border-radius:15px;
                                        text-decoration:none;
                                        color:#0B1F3A;
                                        font-weight:600;
                                        transition:0.3s;
                                        }
                                        
                                        .offer-btn:hover{
                                        background:#0B1F3A;
                                        color:white;
                                        }

                                        .classes-section{
                                            background:#F6F8FB;
                                            }
                                            
                                            .section-title{
                                            font-size:36px;
                                            font-weight:700;
                                            color:#0B1F3A;
                                            }
                                            
                                            .class-card{
                                            background:white;
                                            border-radius:12px;
                                            overflow:hidden;
                                            box-shadow:0 5px 15px rgba(0,0,0,0.08);
                                            transition:.3s;
                                            }
                                            
                                            .class-card:hover{
                                            transform:translateY(-6px);
                                            }
                                            
                                            .class-card img{
                                            width:100%;
                                            height:220px;
                                            object-fit:cover;
                                            }
                                            
                                            .class-content{
                                            padding:20px;
                                            }
                                            
                                            .class-content h5{
                                            font-size:20px;
                                            color:#0B1F3A;
                                            margin-bottom:8px;
                                            }
                                            
                                            .class-content p{
                                            font-size:14px;
                                            color:#666;
                                            }


                                            .pricing-section{
                                                background:#F6F8FB;
                                                }
                                                
                                                .section-title{
                                                font-size:36px;
                                                font-weight:700;
                                                color:#0B1F3A;
                                                }
                                                
                                                .pricing-card{
                                                background:white;
                                                padding:35px 25px;
                                                border-radius:12px;
                                                text-align:center;
                                                box-shadow:0 5px 20px rgba(0,0,0,0.08);
                                                position:relative;
                                                transition:.3s;
                                                }
                                                
                                                .pricing-card:hover{
                                                transform:translateY(-8px);
                                                }
                                                
                                                .plan-title{
                                                font-size:22px;
                                                color:#0B1F3A;
                                                margin-bottom:10px;
                                                }
                                                
                                                .plan-price{
                                                font-size:40px;
                                                font-weight:700;
                                                color:#C8A44D;
                                                }
                                                
                                                .plan-duration{
                                                color:#777;
                                                margin-bottom:20px;
                                                }
                                                
                                                .plan-features{
                                                list-style:none;
                                                padding:0;
                                                margin-bottom:25px;
                                                }
                                                
                                                .plan-features li{
                                                margin-bottom:10px;
                                                color:#555;
                                                }
                                                
                                                .price-btn{
                                                display:inline-block;
                                                padding:10px 28px;
                                                border:2px solid #0B1F3A;
                                                border-radius:15px;
                                                text-decoration:none;
                                                color:#0B1F3A;
                                                font-weight:600;
                                                transition:.3s;
                                                }
                                                
                                                .price-btn:hover{
                                                background:#0B1F3A;
                                                color:white;
                                                }
                                                
                                                /* Best Plan */
                                                
                                                .best-plan{
                                                border:2px solid #C8A44D;
                                                }
                                                
                                                .best-badge{
                                                position:absolute;
                                                top:-12px;
                                                left:50%;
                                                transform:translateX(-50%);
                                                background:#C8A44D;
                                                color:black;
                                                padding:5px 15px;
                                                font-size:12px;
                                                border-radius:20px;
                                                font-weight:600;
                                                }



                                                .popup-box{
                                                    border-radius:15px;
                                                    overflow:hidden;
                                                    }
                                                    
                                                    .popup-image img{
                                                    object-fit:cover;
                                                    height:100%;
                                                    }
                                                    
                                                    .popup-title{
                                                    font-weight:700;
                                                    color:#0B1F3A;
                                                    margin-bottom:20px;
                                                    }
                                                    
                                                    .popup-input{
                                                    border-radius:10px;
                                                    border:1px solid #ddd;
                                                    padding:10px;
                                                    }
                                                    
                                                    .popup-btn{
                                                    background:#C8A44D;
                                                    border:none;
                                                    padding:12px;
                                                    border-radius:12px;
                                                    font-weight:600;
                                                    color:black;
                                                    transition:0.3s;
                                                    }
                                                    
                                                    .popup-btn:hover{
                                                    background:#0B1F3A;
                                                    color:white;
                                                    }