*{margin:0;padding:0;box-sizing:border-box}
:root{--orange:#f47721;--orange-dark:#e96512;--cyan:#22c7df;--dark:#222;--text:#252525;--muted:#777;--border:#e8e8e8}
html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}
button,input{font-family:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}
.section-container{width:min(1280px,94%);margin:auto}

.top-bar{height:50px;background:var(--cyan);color:#fff}
.top-bar-container{width:min(1280px,94%);height:100%;margin:auto;display:flex;justify-content:space-between;align-items:center}
.top-contact{display:flex;gap:35px;align-items:center}.top-contact a{font-size:14px;display:flex;align-items:center;gap:7px}

.main-header{background:#fff;border-bottom:1px solid #e9e9e9}
.header-container{width:min(1280px,94%);min-height:110px;margin:auto;display:flex;align-items:center;justify-content:space-between}
.logo-link{display:flex;align-items:center}.moko-logo{width:190px;height:auto;display:block}
.navigation{display:flex;align-items:center;gap:24px}
.nav-link{border:none;background:transparent;font-size:15px;font-weight:600;color:var(--orange);transition:.2s}
.nav-link:hover{color:#111}.header-icon{border:none;background:transparent;color:var(--orange);font-size:25px;position:relative}
.cart-count{position:absolute;top:-9px;right:-10px;width:19px;height:19px;border-radius:50%;background:var(--orange);color:#fff;display:flex;justify-content:center;align-items:center;font-size:10px}
.tables-dropdown{position:relative}.tables-button{display:flex;gap:7px;align-items:center}
.dropdown-menu{position:absolute;top:32px;left:-15px;width:180px;background:#fff;border:1px solid var(--border);box-shadow:0 10px 30px rgba(0,0,0,.1);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;z-index:100}
.tables-dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown-item{display:block;width:100%;padding:11px;border:none;background:#fff;text-align:left;font-size:13px}.dropdown-item:hover{background:#fff3e9;color:var(--orange)}
.mobile-menu-button{display:none;background:transparent;border:none;font-size:27px;color:var(--orange)}

.search-panel{display:none;background:#fff;border-bottom:1px solid var(--border);padding:15px}.search-panel.active{display:block}
.search-inner{width:min(800px,95%);margin:auto;display:flex}.search-inner input{flex:1;border:1px solid #ddd;padding:13px 15px;outline:none}.search-inner button{width:50px;border:none;background:var(--orange);color:#fff;font-size:20px}

.hero-section{width:min(1280px,94%);margin:15px auto 0;height:350px;background:linear-gradient(90deg,#f8b82e,#f78b17 50%,#f66f0d);border-radius:4px;overflow:hidden;color:#fff}
.hero-container{height:100%;display:grid;grid-template-columns:1fr 190px}.hero-left{position:relative;display:flex;flex-direction:column;justify-content:center;padding-left:48%}
.hero-badge{position:absolute;top:45px;left:46%;background:#ffc000;color:#fff;padding:8px 15px;font-size:20px;font-weight:900;transform:rotate(-8deg)}
.hero-delivery{display:flex;flex-direction:column;font-size:clamp(45px,5vw,72px);line-height:.9;font-weight:900;text-transform:uppercase}
.hero-left p{margin-top:20px;font-size:20px;font-weight:700}.hero-dots{margin-top:20px;display:flex;gap:12px}.hero-dots span{width:10px;height:10px;border:1px solid #fff;border-radius:50%}.hero-dots .active{background:#fff}
.hero-right{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:25px;background:rgba(240,90,0,.2)}.delivery-feature{text-align:center;font-size:14px}.feature-icon{font-size:31px;margin-bottom:4px}

.service-section{padding:16px 0}.service-container{width:min(1280px,94%);margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:15px}
.service-card{border:1px solid var(--border);border-radius:5px;min-height:90px;padding:18px 35px;display:flex;align-items:center;gap:30px}.service-icon{color:var(--orange);font-size:38px}.service-card p{font-size:16px;line-height:1.6;color:#555}

.paybill-section{padding:0 0 20px}.paybill-container{width:min(1280px,94%);margin:auto;height:42px;background:linear-gradient(90deg,#ff6710,#ffb000);color:#fff;display:grid;grid-template-columns:1fr 1.4fr 1fr;align-items:center;text-align:center;font-size:16px;font-weight:800}
.paybill-part{display:flex;justify-content:center;align-items:center;gap:25px}.paybill-icon{font-size:23px}.paybill-middle,.paybill-coming{color:#d94616}

.section-title{margin-bottom:22px}.section-title h2{font-size:22px;font-weight:800}.section-title span{display:block;width:40px;height:3px;background:var(--orange);margin-top:8px}
.section-title-row{display:flex;justify-content:space-between;align-items:flex-end}.view-all{font-size:13px;font-weight:600;margin-bottom:23px}

.categories-section{padding:0 0 50px}.category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.category-card{border:1px solid var(--border);border-radius:5px;overflow:hidden;background:#fff;transition:.25s}.category-card:hover{transform:translateY(-4px);box-shadow:0 10px 25px rgba(0,0,0,.08)}
.category-card img{width:100%;height:150px;object-fit:cover;display:block}.category-info{text-align:center;padding:12px 8px 15px}.category-info h3{font-size:13px;margin-bottom:4px}.category-info p{color:var(--orange);font-size:11px;margin-bottom:12px}
.shop-button{border:none;background:var(--orange);color:#fff;padding:8px 18px;font-size:11px;font-weight:800;border-radius:2px}.shop-button:hover{background:var(--orange-dark)}

.products-section{padding:10px 0 65px}.product-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.product-card{border:1px solid var(--border);border-radius:5px;overflow:hidden;background:#fff;transition:.2s}.product-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px rgba(0,0,0,.08)}
.product-image{height:175px;width:100%;object-fit:cover;background:#f7f7f7}.product-info{padding:12px}.product-info h3{font-size:13px;margin-bottom:10px}.product-price{color:var(--orange);font-size:15px;font-weight:900;margin-bottom:10px}
.order-row{display:grid;grid-template-columns:1fr 40px}.order-button{border:none;background:var(--orange);color:#fff;padding:9px;font-size:11px;font-weight:800}.cart-add{border:none;background:#ed6c15;color:#fff;border-left:1px solid rgba(255,255,255,.4);font-size:18px}

.category-products-section{display:none;padding:45px 0 70px;background:#fafafa}.category-products-section.active{display:block}
.category-heading{margin-bottom:30px}.back-button{border:none;background:#fff;border:1px solid var(--border);padding:10px 17px;margin-bottom:25px;font-size:12px;font-weight:700}
.small-heading{color:var(--orange);font-size:11px;font-weight:800;letter-spacing:1px}.category-heading h2{font-size:32px;margin:5px 0}.category-heading>p:last-child{color:var(--muted);font-size:14px}
.category-product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}

.reviews-section{padding:20px 0 55px}.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.review-card{border:1px solid var(--border);border-radius:6px;padding:25px;min-height:150px}
.review-top{display:flex;justify-content:space-between}.google{color:#4285f4;font-weight:900;font-size:20px}.stars{color:#00a65a;letter-spacing:2px;margin:12px 0}.review-card p{font-size:13px;color:#555;line-height:1.6}.google-rating{text-align:center;margin-top:28px;font-size:13px}

.benefits-section{padding:0 0 55px}.benefits-container{width:min(1100px,94%);margin:auto;border:1px solid var(--border);display:grid;grid-template-columns:repeat(4,1fr)}
.benefit{display:flex;align-items:center;justify-content:center;gap:12px;padding:20px;border-right:1px solid var(--border)}.benefit:last-child{border-right:none}.benefit>span{color:var(--orange);font-size:24px}.benefit strong,.benefit small{display:block}.benefit strong{color:var(--orange);font-size:12px}.benefit small{color:#777;font-size:10px;margin-top:3px}

.find-us{padding:0 0 60px}.find-us-box{background:#fff7f0;border:1px solid #f6e0d0;padding:35px;display:flex;justify-content:space-between;align-items:center}.find-us-box h2{margin:5px 0;font-size:28px}.find-us-box p:last-child{color:#777}.contact-button{background:var(--orange);color:#fff;padding:13px 25px;font-weight:800;font-size:13px}

.floating-contact{
position:fixed;
right:22px;
bottom:22px;
display:flex;
flex-direction:column;
align-items:flex-end;
gap:12px;
z-index:9999;
pointer-events:none
}
.floating-contact a{
pointer-events:auto
}
.floating-whatsapp,.floating-call{display:flex;align-items:center;gap:10px}.floating-whatsapp{flex-direction:row}.floating-call{flex-direction:row-reverse}
.floating-icon{width:58px;height:58px;border-radius:50%;display:flex;justify-content:center;align-items:center;color:#fff;font-size:27px;box-shadow:0 5px 20px rgba(0,0,0,.2)}.floating-whatsapp .floating-icon{background:#12b957}.floating-call .floating-icon{background:var(--orange)}
.floating-label{background:#fff;padding:10px 13px;box-shadow:0 3px 15px rgba(0,0,0,.12);font-size:12px;color:#444}

.cart-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:1000}.cart-overlay.active{display:block}
.cart-sidebar{position:fixed;top:0;right:-420px;width:400px;max-width:92%;height:100vh;background:#fff;z-index:1001;display:flex;flex-direction:column;transition:.3s;box-shadow:-10px 0 30px rgba(0,0,0,.15)}.cart-sidebar.active{right:0}
.cart-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--border)}.cart-header button{border:none;background:transparent;font-size:30px}
.cart-items{flex:1;overflow-y:auto;padding:20px}.empty-cart{text-align:center;color:#888;margin-top:50px}.cart-item{display:flex;gap:12px;border-bottom:1px solid var(--border);padding:15px 0}.cart-item img{width:75px;height:65px;object-fit:cover}.cart-item-details{flex:1}.cart-item-details h4{font-size:13px;margin-bottom:6px}.cart-item-details p{color:var(--orange);font-weight:800;font-size:12px}.remove-cart-item{border:none;background:none;color:#c00;font-size:11px}
.cart-footer{border-top:1px solid var(--border);padding:20px}.cart-total-row{display:flex;justify-content:space-between;margin-bottom:15px}.cart-total-row strong{color:var(--orange)}.checkout-button{width:100%;padding:14px;background:#12a854;color:#fff;border:none;font-weight:800}

footer{background:#222;color:#fff;padding:45px 0 0}.footer-container{width:min(1100px,94%);margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px;padding-bottom:40px}
.footer-logo{width:140px;background:#fff;padding:8px;margin-bottom:15px}.footer-container p{color:#aaa;font-size:13px;max-width:350px}.footer-container h3{font-size:15px;margin-bottom:15px}.footer-container a{display:block;color:#aaa;font-size:13px;margin-bottom:10px}.footer-container a:hover{color:var(--orange)}
.copyright{border-top:1px solid #444;text-align:center;padding:18px;color:#888;font-size:11px}

@media(max-width:1100px){.navigation{gap:14px}.nav-link{font-size:13px}.category-grid,.product-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){
.top-bar{height:auto;padding:9px 0}.top-bar-container{justify-content:center}.top-contact{gap:15px}.top-contact a{font-size:11px}
.header-container{min-height:90px}.moko-logo{width:145px}.mobile-menu-button{display:block}
.navigation{display:none;position:absolute;top:140px;left:0;right:0;background:#fff;padding:20px;flex-direction:column;align-items:flex-start;gap:15px;box-shadow:0 10px 20px rgba(0,0,0,.1);z-index:200}.navigation.active{display:flex}
.tables-dropdown{width:100%}.dropdown-menu{position:static;display:none;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;width:100%}.tables-dropdown:hover .dropdown-menu{display:none}.tables-dropdown.open .dropdown-menu{display:block}
.hero-section{height:auto}.hero-container{grid-template-columns:1fr}.hero-left{min-height:300px;padding:45px 30px}.hero-badge{left:30px;top:25px}.hero-delivery{font-size:47px}.hero-right{display:grid;grid-template-columns:repeat(3,1fr);padding:20px}
.service-container{grid-template-columns:1fr}.paybill-container{font-size:12px}.category-grid,.product-grid{grid-template-columns:repeat(2,1fr)}.category-product-grid{grid-template-columns:repeat(2,1fr)}
.reviews-grid{grid-template-columns:1fr}.benefits-container{grid-template-columns:repeat(2,1fr)}.benefit:nth-child(2){border-right:none}.benefit:nth-child(-n+2){border-bottom:1px solid var(--border)}
.footer-container{grid-template-columns:1fr 1fr}
}
@media(max-width:550px){
.top-contact{flex-direction:column;gap:3px}.hero-delivery{font-size:39px}.hero-left p{font-size:13px}.hero-right{grid-template-columns:repeat(3,1fr);gap:8px}.delivery-feature{font-size:10px}.feature-icon{font-size:24px}
.service-card{padding:15px;gap:15px}.service-card p{font-size:12px}.paybill-container{height:50px;grid-template-columns:1fr 1.4fr 1fr;font-size:9px}
.category-grid,.product-grid{grid-template-columns:repeat(2,1fr);gap:9px}.category-card img{height:115px}.product-image{height:145px}.product-info h3{font-size:11px}.product-price{font-size:12px}.order-button{font-size:9px}
.category-product-grid{grid-template-columns:1fr 1fr}.benefits-container{grid-template-columns:1fr}.benefit{border-right:none!important;border-bottom:1px solid var(--border)}.benefit:last-child{border-bottom:none}
.find-us-box{flex-direction:column;align-items:flex-start;gap:20px}.floating-contact{right:14px;bottom:14px;gap:9px}.floating-label{display:none}.floating-icon{width:52px;height:52px}.footer-container{grid-template-columns:1fr;gap:25px}
}


/* Fixed contact buttons - bottom right */
.floating-whatsapp,
.floating-call{
display:flex;
align-items:center;
flex-direction:row;
gap:10px;
}
.floating-whatsapp .floating-icon,
.floating-call .floating-icon{
width:56px;
height:56px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
color:#fff;
font-size:25px;
font-weight:700;
box-shadow:0 5px 18px rgba(0,0,0,.22);
}
.floating-whatsapp .floating-icon{background:#18b957}
.floating-call .floating-icon{background:#f47721}
.floating-label{
background:#fff;
padding:9px 12px;
border-radius:5px;
box-shadow:0 3px 15px rgba(0,0,0,.14);
font-size:12px;
font-weight:700;
white-space:nowrap;
}

.cart-footer{
background:#fff;
position:sticky;
bottom:0;
box-shadow:0 -5px 18px rgba(0,0,0,.08);
}
.checkout-button{
display:block;
min-height:50px;
font-size:13px;
border-radius:4px;
cursor:pointer;
}

.product-category-block{margin-bottom:58px;scroll-margin-top:120px}.product-description{color:#777;font-size:12px;line-height:1.5;min-height:34px;margin-bottom:8px}.category-card img,.product-image{object-fit:cover}

/* Product catalog is hidden on the home screen until a category is selected. */


/* Dedicated single-category view */
.category-hidden{display:none !important;}
.category-page-header{max-width:1200px;margin:0 auto;padding:28px 20px 10px;display:flex;align-items:center;gap:25px;}
.category-page-header h2{margin:5px 0 0;font-size:28px;}
.category-page-header .back-button{border:1px solid #ddd;background:#fff;padding:11px 17px;border-radius:4px;cursor:pointer;font-weight:700;}
.category-mode #products{min-height:75vh;}
.category-mode .product-category-block{scroll-margin-top:20px;}
@media(max-width:650px){.category-page-header{padding:18px 14px;gap:14px;align-items:flex-start;}.category-page-header h2{font-size:22px;}.category-page-header .back-button{font-size:12px;white-space:nowrap;}}
