/* Universal Box Sizing */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Images aur Media ko screen ke bahar jane se rokna */
img, video, canvas {
    max-width: 100%;
    height: auto;
}


.container {
    width: 90%;
    margin: 0 auto;
    max-width: 1200px; 
}


html {
    font-size: 16px;
}

/* Media Queries for Mobile (Tablets aur Phones) */
@media screen and (max-width: 768px) {
    html {
        font-size: 14px; /* Text scaling */
    }

    /* Grid/Flex layouts ko column mein convert karna */
    .row, .flex-group {
        display: flex;
        flex-direction: column !important;
    }

    /* Navigation menu ko mobile par handle karne ke liye */
    .nav-menu {
        display: none; /* JS isse toggle karega */
        width: 100%;
    }
    
    .nav-menu.active {
        display: block;
    }
}