/* Reset & Body */
body { font-family: "Poppins", sans-serif; margin:0; background:#fafafa; color:#333; }

/* Header */
header { text-align:center; background:#111; color:white; padding:15px 10px; }
header .logo { font-size:1.5rem; margin-bottom:10px; }
header nav a { color:white; text-decoration:none; margin:0 10px; font-weight:500; display:inline-block; }
header nav a.active { color:#f39c12; }

/* Hero */
.hero { text-align:center; padding:50px 10px; background:linear-gradient(to right,#f39c12,#f1c40f); color:white; }
.btn { background:#111; color:white; border:none; padding:12px 25px; margin:10px 0; font-size:16px; border-radius:6px; }
.btn:hover { background:#f39c12; }

/* Menu */
.menu-page { padding:20px 5%; }
.menu-grid { display:grid; grid-template-columns:1fr; gap:20px; margin-top:20px; }
.menu-item { background:white; border-radius:10px; overflow:hidden; box-shadow:0 3px 10px rgba(0,0,0,0.1); }
.menu-item img { width:100%; height:auto; object-fit:cover; }
.menu-details { padding:10px; }
.price { color:#f39c12; font-weight:bold; }

/* About & Contact */
.about-section, .contact-section { padding:20px 5%; background:white; margin:20px 0; border-radius:10px; box-shadow:0 3px 10px rgba(0,0,0,0.05); }
.about-section h2, .contact-section h2 { color:#f39c12; margin-bottom:10px; }
.contact-section ul { list-style:none; padding:0; margin-bottom:15px; }
.contact-section ul li { margin-bottom:5px; }
.contact-section form { display:flex; flex-direction:column; gap:10px; }
.contact-section input, .contact-section textarea { padding:10px; border-radius:6px; border:1px solid #ccc; font-size:14px; }

/* Modal */
.modal { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); justify-content:center; align-items:center; z-index:999; }
.modal-content { background:white; padding:20px; border-radius:10px; width:90%; max-width:350px; }
.modal.show { display:flex; }
.close { float:right; font-size:24px; cursor:pointer; }

/* Footer */
footer { text-align:center; padding:15px; background:#111; color:white; margin-top:20px; }

/* QR Reader */
#qr-reader { width:90%; max-width:300px; margin:10px auto; }