@media(max-width:768px){

.header{
    padding:8px 0;
}

/* GRID LAYOUT */
.header-inner{
    display:grid;
    grid-template-columns: auto 1fr auto;
    align-items:center;
    gap:6px;
}

/* LOGO */
.logo-box{
    min-width:auto;
    justify-self:start;
}

.logo-box img{
    width:34px;
    height:34px;
}

/* BRAND NAME HIDE */
.brand-name{
    display:none;
}

/* 🔥 SEARCH FINAL FIX */
.search-bar{
    flex: unset !important;
    width:90%;                 /* 🔥 width control */
    max-width:260px;          /* 🔥 center compact look */
    display:flex;
    align-items:center;
    justify-self:center;
    background:#fffaf2;
    border-radius:25px;       /* thoda tight */
    border:1px solid #eee;
    overflow:hidden;
    height:34px;              /* 🔥 better height */
}

/* INPUT */
.search-bar input{
    flex:1;
    min-width:0;
    padding:0 8px;
    font-size:12px;   /* thoda compact */
    border:none;
    outline:none;
    height:100%;
}

/* BUTTON */
.search-bar button{
    width:34px;
    height:100%;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--gold);
    border:none;
}

/* AUTH */
.auth{
    justify-self:end;
    display:flex;
    gap:4px;
}

.btn-outline,
.btn-fill{
    padding:3px 6px;
    font-size:10px;
}

/* CATEGORY */
.cat-wrapper{
    justify-content:flex-start;
    overflow-x:auto;
    gap:15px;
}

}

/* ================= HERO ================= */