:root { --menu-ink:#10241d; --menu-navy:#064b37; --menu-blue:#0b7a55; --menu-red:#08734f; --menu-yellow:#f7c21a; --menu-cream:#fffdf7; --menu-line:rgba(16,36,29,.14); }
* { box-sizing:border-box; }
body { background:linear-gradient(180deg,rgba(11,122,85,.18),transparent 420px),linear-gradient(120deg,rgba(255,165,101,.14),transparent 44%),#fff4df; color:var(--menu-ink); font-family:Inter,Arial,sans-serif; margin:0; min-height:100vh; }
a { color:inherit; }
.menu-shell { margin:0 auto; max-width:1240px; padding:22px 20px 54px; }
.menu-topbar { align-items:center; background:rgba(255,253,247,.92); border:1px solid rgba(255,255,255,.9); border-radius:999px; box-shadow:0 14px 36px rgba(6,75,55,.13); display:flex; gap:16px; justify-content:space-between; padding:10px 16px; }
.menu-brand { align-items:center; color:var(--menu-navy); display:flex; font-family:Georgia,serif; font-weight:900; gap:10px; text-decoration:none; }.menu-brand img { background:#fff; border-radius:50%; height:42px; padding:3px; width:42px; }.menu-home { background:var(--menu-navy); border-radius:999px; color:#fff; font-size:.86rem; font-weight:700; padding:10px 14px; text-decoration:none; }
.menu-hero { background:linear-gradient(100deg,rgba(6,75,55,.94),rgba(6,75,55,.63)), url("assets/uploads/web/hot-meals-menu-web.jpg") center 24%/cover; border:1px solid rgba(255,255,255,.75); border-radius:24px; box-shadow:0 22px 52px rgba(6,75,55,.22); color:#fffdf7; margin:28px 0 22px; min-height:260px; overflow:hidden; padding:30px; position:relative; }.menu-hero::before { border:1px solid rgba(247,194,26,.45); border-radius:18px; content:""; inset:10px; position:absolute; }.menu-hero > * { position:relative; }.menu-kicker { color:#ffa565; font-size:.75rem; font-weight:900; letter-spacing:.14em; margin:0 0 8px; text-transform:uppercase; }.menu-hero h1 { font-family:Georgia,serif; font-size:clamp(2.4rem,7vw,5.4rem); letter-spacing:-.04em; line-height:.9; margin:0; }.menu-hero p:last-child { font-size:1rem; line-height:1.5; max-width:530px; }.bar-page .menu-hero { background:linear-gradient(100deg,rgba(6,75,55,.94),rgba(6,75,55,.72)),radial-gradient(circle at 80% 20%,rgba(247,194,26,.32),transparent 32%),#083b30; }.bar-page .menu-hero::after { display:none; }
.ordering-layout { align-items:start; display:grid; gap:22px; grid-template-columns:minmax(0,1fr) 360px; }.menu-intro { color:#435c52; margin:0 0 20px; }.menu-category { background:rgba(255,253,247,.92); border:1px solid var(--menu-line); border-radius:18px; box-shadow:0 12px 30px rgba(6,75,55,.07); margin-bottom:18px; overflow:hidden; }.menu-category h2 { background:linear-gradient(90deg,var(--menu-navy),var(--menu-blue)); color:#fffdf7; font-family:Georgia,serif; font-size:1.35rem; letter-spacing:.02em; margin:0; padding:13px 17px; }.menu-items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }.menu-item { align-items:center; border-bottom:1px dashed var(--menu-line); display:flex; gap:12px; justify-content:space-between; min-height:64px; padding:12px 15px; }.menu-item:nth-child(odd) { border-right:1px dashed var(--menu-line); }.menu-item strong { display:block; font-size:.94rem; }.menu-item small { color:#697970; display:block; font-size:.76rem; margin-top:3px; }.menu-price { color:var(--menu-navy); font-weight:900; white-space:nowrap; }.add-item { background:var(--menu-navy); border:0; border-radius:999px; color:#fff; cursor:pointer; font-weight:900; margin-left:8px; min-height:34px; padding:5px 12px; }.add-item:hover,.add-item.was-added { background:#ffa565; color:var(--menu-ink); transform:translateY(-1px); }
.cart { background:var(--menu-cream); border:4px solid var(--menu-yellow); border-radius:20px; box-shadow:0 16px 32px rgba(0,0,0,.28); color:var(--menu-ink); padding:19px; position:sticky; top:16px; }.cart h2 { color:var(--menu-red); font-family:Impact,"Arial Black",sans-serif; font-size:1.65rem; font-style:italic; letter-spacing:.05em; margin:0 0 5px; text-transform:uppercase; }.cart-note { color:#526075; font-size:.8rem; line-height:1.4; margin:0 0 14px; }.cart-items { display:grid; gap:8px; max-height:320px; overflow:auto; }.cart-empty { color:#657182; font-size:.9rem; padding:14px 0; }.cart-row { align-items:center; border-bottom:1px solid #e2ddca; display:grid; gap:8px; grid-template-columns:1fr auto auto; padding:8px 0; }.cart-row strong { font-size:.85rem; }.cart-row span { color:#526075; font-size:.76rem; }.quantity { align-items:center; display:flex; gap:6px; }.quantity button { background:#163e63; border:0; border-radius:50%; color:#fff; cursor:pointer; font-weight:900; height:25px; width:25px; }.cart-total { border-top:2px solid #d8cfaf; display:flex; font-size:1.08rem; font-weight:900; justify-content:space-between; margin-top:14px; padding-top:14px; }.whatsapp-order { background:#168d4b; border:0; border-radius:12px; color:#fff; cursor:pointer; font-size:1rem; font-weight:900; margin-top:14px; padding:14px; width:100%; }.whatsapp-order:disabled { cursor:not-allowed; opacity:.48; }.clear-cart { background:transparent; border:0; color:#6c4a18; cursor:pointer; display:block; font-size:.8rem; margin:12px auto 0; text-decoration:underline; }.service-note { color:#45576b; font-size:.75rem; line-height:1.45; margin:14px 0 0; }.bar-page .service-note { color:#553c12; }
.qr-hub { display:grid; gap:22px; grid-template-columns:repeat(2,minmax(0,1fr)); margin:48px auto; max-width:820px; }.qr-card { background:var(--menu-cream); border:4px solid var(--menu-yellow); border-radius:22px; color:var(--menu-ink); padding:24px; text-align:center; }.qr-card img { background:#fff; border-radius:12px; max-width:220px; padding:10px; width:100%; }.qr-card h2 { color:var(--menu-red); font-family:Impact,"Arial Black",sans-serif; font-style:italic; margin:12px 0 4px; text-transform:uppercase; }.qr-card a { background:var(--menu-red); border-radius:999px; color:#fff; display:inline-block; font-weight:900; margin-top:12px; padding:11px 16px; text-decoration:none; }
.guest-details { display:grid; gap:6px; margin-top:17px; }.guest-details label { color:var(--menu-navy); font-size:.8rem; font-weight:800; }.guest-details em { color:#c84e27; font-style:normal; }.guest-details span { color:#718078; font-weight:500; }.guest-details input { background:#fffefa; border:1px solid #cbd8ce; border-radius:10px; color:var(--menu-ink); font:inherit; padding:11px 12px; }.guest-details input:focus { border-color:var(--menu-blue); box-shadow:0 0 0 3px rgba(11,122,85,.14); outline:0; }.form-message { color:#607067; font-size:.8rem; line-height:1.35; margin:9px 0 0; min-height:1.15em; }.form-message.success { color:var(--menu-blue); font-weight:700; }.form-message.error { color:#b73523; font-weight:800; }.order-history { border-top:1px solid #e6dfcf; margin-top:14px; padding-top:12px; }.order-history summary { color:var(--menu-navy); cursor:pointer; font-size:.82rem; font-weight:800; }.order-history summary span { background:#e4f2e9; border-radius:999px; font-size:.7rem; margin-left:5px; padding:2px 7px; }.history-row { border-bottom:1px solid #ece5d6; display:grid; gap:2px; padding:9px 0; }.history-row strong { font-size:.8rem; }.history-row span,.history-row small { color:#63736a; font-size:.72rem; }
@media (max-width:850px) { .ordering-layout { grid-template-columns:1fr; }.cart { position:static; }.menu-items { grid-template-columns:1fr; }.menu-item:nth-child(odd) { border-right:0; }.menu-hero { min-height:230px; }.qr-hub { grid-template-columns:1fr; } }
@media (max-width:480px) { .menu-shell { padding:16px 12px 40px; }.menu-hero { border-radius:18px; margin:18px 0; padding:22px; }.menu-hero h1 { font-size:2.5rem; }.menu-item { padding:11px; }.menu-item strong { font-size:.88rem; } }
