/* =========================================================
   THE CHINESE TOWN — LIVE HOMEPAGE CORRECTIONS
   This file only overrides the requested visual areas.
   Navbar/footer logo and Popular Picks remain controlled by style.css.
   ========================================================= */

/* HERO: transparent WebP cutout, no card/background */
.hero-food-visual{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:0;
}

.hero-food-cutout{
    display:block;
    width:min(100%,610px);
    max-height:610px;
    object-fit:contain;
    object-position:center;
    background:transparent !important;
    filter:drop-shadow(0 24px 35px rgba(0,0,0,.35));
}

/* remove old chips/ring if old CSS still exists */
.hero-ring,
.floating-chip{
    display:none !important;
}

/* COMBOS: thumbnail replaces the 01-05 number */
.combo-item{
    display:grid !important;
    grid-template-columns:74px minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:18px !important;
}

.combo-thumb{
    width:68px;
    height:62px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    flex:0 0 auto;
}

.combo-thumb img{
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
    object-position:center;
}

.combo-num{
    display:none !important;
}

/* ABOUT: left side food image */
.about-food-box{
    width:100%;
    aspect-ratio:4/3;
    overflow:hidden;
    border-radius:28px;
    border:1px solid rgba(255,255,255,.10);
    background:#16090a;
}

.about-food-box img{
    width:100%;
    height:100%;
    display:block;
    object-fit:cover;
    object-position:center;
}

/* FOOTER SOCIAL ICONS */
.social-links{
    display:flex;
    gap:12px;
    align-items:center;
}

.social-links .social-icon{
    width:42px;
    height:42px;
    display:grid !important;
    place-items:center;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.22);
    background:rgba(255,255,255,.06);
    color:#fff !important;
}

.social-links .social-icon:hover{
    background:#f0b631;
    border-color:#f0b631;
    color:#090909 !important;
}

.social-links .social-icon svg{
    width:19px;
    height:19px;
    display:block;
    fill:currentColor;
    stroke:currentColor;
    stroke-width:1.7;
}

.social-links .social-icon[aria-label="Instagram"] svg{
    fill:none;
}

.social-links .social-icon[aria-label="WhatsApp"] svg path:first-child{
    fill:none;
}

/* Responsive */
@media(max-width:900px){
    .hero-food-cutout{
        width:min(100%,520px);
        max-height:520px;
    }

    .combo-item{
        grid-template-columns:64px minmax(0,1fr) auto !important;
        gap:14px !important;
    }

    .combo-thumb{
        width:58px;
        height:54px;
    }
}

@media(max-width:650px){
    .hero-food-cutout{
        width:100%;
        max-height:420px;
    }

    .combo-item{
        grid-template-columns:58px minmax(0,1fr) auto !important;
        gap:11px !important;
    }

    .combo-thumb{
        width:52px;
        height:48px;
    }

    .about-food-box{
        border-radius:20px;
    }

    .social-links .social-icon{
        width:40px;
        height:40px;
    }
}

/* ===== FINAL HERO + LOGO RESPONSIVE FIX ===== */
.brand img{
    width:82px !important;
    height:62px !important;
    display:block !important;
    object-fit:contain !important;
}

.footer-brand img{
    width:150px !important;
    height:auto !important;
    display:block !important;
    object-fit:contain !important;
}

.hero-food-visual{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    overflow:visible !important;
}

.hero-food-cutout{
    width:440px !important;
    max-width:90% !important;
    max-height:520px !important;
    height:auto !important;
    object-fit:contain !important;
    object-position:center !important;
    background:transparent !important;
}

@media (max-width:1100px){
    .hero-food-cutout{
        width:400px !important;
        max-height:470px !important;
    }
}

@media (max-width:768px){
    .brand img{
        width:64px !important;
        height:48px !important;
    }

    .hero-food-visual{
        width:100% !important;
        min-height:560px !important;
        padding:20px 0 35px !important;
        overflow:visible !important;
    }

    .hero-food-cutout{
        width:520px !important;
        max-width:none !important;
        max-height:560px !important;
        height:auto !important;
        object-fit:contain !important;
        transform:none !important;
    }

    .footer-brand img{
        width:130px !important;
    }
}

@media (max-width:480px){
    .hero-food-visual{
        min-height:540px !important;
        overflow:hidden !important;
    }

    .hero-food-cutout{
        width:470px !important;
        max-width:none !important;
        max-height:520px !important;
        height:auto !important;
    }
}