.top-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 15px;
    background:#2874f0;
    color:white;
}

.logo a{
    color:white;
    font-size:22px;
    text-decoration:none;
    font-weight:bold;
}

.search-bar input{
    width:250px;
    padding:6px;
}

.category-row{
    display:flex;
    overflow-x:auto;
    background:white;
    padding:10px;
}

.category-row a{
    margin-right:20px;
    text-decoration:none;
    color:#333;
    font-weight:bold;
}

.hero-banner{
    background:#ff5722;
    color:white;
    text-align:center;
    padding:40px 20px;
}

.product-section{
    padding:20px;
}

.main-footer{
    background:#172337;
    color:white;
    text-align:center;
    padding:15px;
}

.mobile-menu{
    display:none;
}

@media(max-width:768px){
    .search-bar input{
        width:150px;
    }
    .mobile-menu{
        position:fixed;
        bottom:0;
        width:100%;
        display:flex;
        justify-content:space-around;
        background:white;
        padding:10px 0;
        border-top:1px solid #ddd;
    }
    .mobile-menu a{
        text-decoration:none;
        color:#2874f0;
        font-weight:bold;
    }
}