/* "Parcourir Holé Molé" — the regular menu app (browse.js). Phone-first; two columns on desktop. */
#browse{position:fixed;inset:0;z-index:60;overflow-y:auto;overflow-x:hidden;background:#fffaf0;color:#14231c;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scroll-padding-top:150px}
#browse[hidden]{display:none}
.bw{--green:#0b5a2c;--deep:#073d20;--orange:#f39200;--yellow:#ffb21e;--red:#e2231a;--ink:#14231c;--line:#0b5a2c1a;
  max-width:1180px;margin:0 auto;padding:0 16px calc(120px + env(safe-area-inset-bottom));font-family:'DM Sans',system-ui,sans-serif}
.bw h1,.bw h2,.bw h3{font-family:'Lilita One','Arial Black',sans-serif;font-weight:400;letter-spacing:.2px;margin:0}
.bw button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.bw svg{display:block}

/* top bar */
.bw-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;margin:0 -16px;padding:calc(12px + env(safe-area-inset-top)) 16px 12px;background:#fffaf0e8;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transition:box-shadow .2s}
.bw-scrolled .bw-top{box-shadow:0 1px 0 var(--line),0 8px 20px #0b5a2c0d}
.bw-top img{width:36px;height:36px;border-radius:9px}
.bw-brand{flex:1;line-height:1.1}.bw-brand b{display:block;font-family:'Lilita One',sans-serif;font-weight:400;font-size:19px;color:var(--green)}.bw-brand small{font-size:11px;color:#14231c99;letter-spacing:1px}
.bw-icon{width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:50%;background:#0b5a2c10;color:var(--green)}
.bw-icon svg{width:21px;height:21px}
.bw-icon:active{transform:scale(.92)}
body.has-cart .bw-top{padding-right:82px}

/* hero */
.bw-hero{position:relative;display:flex;align-items:flex-end;margin-top:6px;padding:22px 20px 20px;border-radius:26px;overflow:hidden;color:#fff3d6;
  background:radial-gradient(120% 140% at 85% 10%,#1d8a4b 0,#0b5a2c 45%,#073d20 100%)}
.bw-hero::after{content:'';position:absolute;inset:0;background:url(assets/logo.png) center/120px repeat;opacity:.05;pointer-events:none}
.bw-hero>div{position:relative;z-index:1;max-width:70%}
.bw-hello{margin:0;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:#ffe6a6}
.bw-hero h1{font-size:clamp(26px,6.6vw,40px);line-height:1.05;margin:6px 0 8px;color:#fff}
.bw-tag{margin:0 0 16px;font-family:'Lilita One',sans-serif;letter-spacing:1.5px;color:var(--yellow);font-size:13px}
.bw-hero-actions{display:flex;flex-wrap:wrap;gap:8px}
.bw-pill{display:inline-flex;align-items:center;gap:7px;padding:11px 15px;border-radius:30px;border:1.5px solid #fff3d655;background:#ffffff14;color:#fff3d6;font-weight:700;font-size:13px;white-space:nowrap}
.bw-pill svg{width:17px;height:17px}
.bw-pill.hot{background:var(--yellow);border-color:var(--yellow);color:#2d1a00;min-width:150px}
.bw-pill:active{transform:scale(.96)}
.bw-mole{position:absolute;right:-6px;bottom:-12px;height:150px;width:auto;z-index:1;filter:drop-shadow(0 10px 16px #0007);animation:mole-bob 2.6s ease-in-out infinite;pointer-events:none}

/* search + filters */
.bw-search{position:relative;display:flex;align-items:center;gap:10px;margin:16px 0 10px;padding:0 14px;height:52px;border-radius:16px;background:#fff;box-shadow:0 1px 0 var(--line),0 6px 18px #0b5a2c12;color:#14231c88}
.bw-search>svg{width:20px;height:20px;flex:none}
.bw-search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font:inherit;font-size:16px;color:var(--ink)} /* ≥16px: iOS would zoom on focus */
.bw-search input::-webkit-search-cancel-button{display:none}
.bw-search:focus-within{box-shadow:0 0 0 2px var(--green),0 6px 18px #0b5a2c1f}
.bw-search [data-clear]{border:0;background:#0b5a2c12;color:var(--green);width:28px;height:28px;border-radius:50%;display:grid;place-items:center}
.bw-search [data-clear] svg{width:14px;height:14px}
.bw-filters{display:flex;gap:8px;overflow-x:auto;padding:2px 16px 4px;margin:0 -16px;scrollbar-width:none}
.bw-filters::-webkit-scrollbar,.bw-cats::-webkit-scrollbar,.bw-rail::-webkit-scrollbar{display:none}
.bw-filters button{flex:none;display:inline-flex;align-items:center;gap:5px;padding:8px 13px;border-radius:20px;border:1.5px solid var(--line);background:#fff;color:var(--green);font-weight:700;font-size:13px}
.bw-filters button svg{width:15px;height:15px}
.bw-filters [aria-pressed=true]{background:var(--green);border-color:var(--green);color:#ffe9b8}

/* featured rail */
.bw-featured{margin-top:22px}
.bw-featured h2,.bw-section h2,.bw-how h2{font-size:24px;color:var(--green)}
.bw-rail{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:12px 16px 8px;margin:0 -16px;scrollbar-width:none}
.bw-feat{flex:none;width:200px;scroll-snap-align:start;padding:12px;border-radius:22px;background:#fff;box-shadow:0 1px 0 var(--line),0 10px 24px #0b5a2c14;cursor:pointer;transition:transform .2s}
.bw-feat:active{transform:scale(.97)}
.bw-feat-art{height:120px;border-radius:16px;background:var(--tint);display:grid;place-items:center;overflow:hidden}
.bw-feat-art .art{width:96px;height:96px;transition:transform .35s cubic-bezier(.2,1.6,.5,1)}
.bw-feat:hover .art{transform:scale(1.1) rotate(-4deg)}
.bw-feat-art img,.bw-thumb img,.bw-sheet-art img{width:100%;height:100%;object-fit:cover}
.bw-feat h3{font-size:17px;margin:10px 2px 2px;color:var(--ink);line-height:1.1}
.bw-feat p{margin:0 2px;font-size:12px;color:#14231c88}
.bw-feat-foot{display:flex;justify-content:space-between;align-items:center;margin:10px 2px 0}
.bw-feat-foot b{color:var(--orange);font-size:16px}

/* add button (shared) */
.bw-add{width:38px;height:38px;border-radius:50%;border:0;background:var(--green);color:#fff;display:grid;place-items:center;box-shadow:0 4px 12px #0b5a2c4d;transition:transform .2s,background .2s}
.bw-add svg{width:20px;height:20px}
.bw-add:active{transform:scale(.85)}
.bw-add.done{background:var(--orange);animation:pop .45s cubic-bezier(.2,1.8,.5,1)}
@keyframes pop{0%{transform:scale(.6)}100%{transform:scale(1)}}

/* sticky categories */
.bw-cats{position:sticky;top:calc(66px + env(safe-area-inset-top));z-index:4;display:flex;gap:8px;overflow-x:auto;margin:22px -16px 0;padding:10px 16px;background:#fffaf0f0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);scrollbar-width:none}
.bw-filtering .bw-cats{display:none}
.bw-cats button{flex:none;display:inline-flex;align-items:center;gap:6px;padding:7px 13px 7px 8px;border-radius:24px;border:0;background:#0b5a2c0d;color:var(--green);font-weight:700;font-size:13px;transition:background .2s,color .2s}
.bw-cats .mini{width:26px;height:26px}
.bw-cats [aria-current=true]{background:var(--green);color:#ffe9b8}

/* sections + dishes */
.bw-section{margin-top:26px}
.bw-section>header{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.bw-sec-art{width:56px;height:56px;border-radius:16px;background:var(--tint);display:grid;place-items:center;flex:none}
.bw-sec-art .art{width:44px;height:44px}
.bw-section header p{margin:2px 0 0;font-size:12px;color:#14231c99}
.bw-dish{display:flex;gap:14px;padding:16px 0;border-bottom:1px solid var(--line);cursor:pointer;border-radius:12px;transition:background .15s}
.bw-dish:active{background:#0b5a2c08}
.bw-dish:focus-visible,.bw-feat:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.bw-dish-text{flex:1;min-width:0}
.bw-dish h3{font-size:18px;line-height:1.1;color:var(--ink)}
.bw-dish h3 mark,.bw-feat h3 mark{background:#ffb21e66;color:inherit;border-radius:3px;padding:0 1px}
.bw-dish p{margin:5px 0 0;font-size:13px;line-height:1.4;color:#14231caa;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bw-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.bw-tags:empty{display:none}
.tag{display:inline-flex;align-items:center;gap:3px;padding:3px 8px;border-radius:10px;background:#0b5a2c0f;color:var(--green);font-size:11px;font-weight:700}
.tag svg{width:12px;height:12px}
.tag.hot{background:#e2231a14;color:#b3160f}
.bw-price{display:block;margin-top:8px;color:var(--orange);font-size:16px}
.bw-thumb{position:relative;flex:none;width:100px;height:100px;border-radius:18px;background:var(--tint);display:grid;place-items:center;overflow:visible}
.bw-thumb .art{width:74px;height:74px;transition:transform .35s cubic-bezier(.2,1.6,.5,1)}
.bw-dish:hover .bw-thumb .art{transform:scale(1.08) rotate(-4deg)}
.bw-thumb .bw-add{position:absolute;right:-6px;bottom:-6px}
.bw-empty{text-align:center;padding:40px 0}
.bw-empty img{height:130px;width:auto}
.bw-empty p{font-weight:700;color:var(--green)}

/* footer */
.bw-foot{margin-top:36px;display:grid;gap:14px}
.bw-how{padding:20px;border-radius:24px;background:#fff;box-shadow:0 1px 0 var(--line),0 10px 24px #0b5a2c12}
.bw-how ol{margin:12px 0 16px;padding-left:20px;display:grid;gap:8px;font-size:14px;color:#14231ccc}
.bw-how b{color:var(--green)}
.bw-contact{display:flex;flex-wrap:wrap;gap:8px}
.bw-contact a,.bw-contact button{flex:1 1 140px;text-align:center;padding:13px 10px;border-radius:26px;border:1.5px solid var(--green);background:#fff;color:var(--green);font-weight:700;font-size:14px;text-decoration:none}
.bw-contact .wa{background:#25d366;border-color:#25d366;color:#053d1c}
.bw-exp{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:20px;border:0;border-radius:24px;text-align:left;color:#fff3d6;background:linear-gradient(120deg,#073d20,#0b5a2c 60%,#1d8a4b)}
.bw-exp span{font-size:13px;opacity:.85}
.bw-exp b{font-family:'Lilita One',sans-serif;font-weight:400;font-size:22px;color:var(--yellow)}
.bw-legal{font-size:11px;color:#14231c88;text-align:center;margin:6px 0 0}

/* sticky cart bar */
.bw-cartbar{position:fixed;z-index:65;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(520px,calc(100% - 32px));display:flex;align-items:center;gap:12px;padding:10px 12px 10px 10px;border:0;border-radius:30px;background:var(--green);color:#fff;box-shadow:0 14px 34px #073d2066;font-weight:700;animation:bar-in .4s cubic-bezier(.2,1.4,.5,1)}
.bw-cartbar[hidden]{display:none}
.bw-cartbar .n{min-width:34px;height:34px;padding:0 8px;border-radius:17px;background:var(--yellow);color:#2d1a00;display:grid;place-items:center}
.bw-cartbar .l{flex:1;text-align:left}
.bw-cartbar .t{color:#ffe9b8}
.bw-cartbar.pulse{animation:bar-pulse .5s cubic-bezier(.3,1.8,.5,1)}
@keyframes bar-in{from{opacity:0;transform:translate(-50%,30px)}}
@keyframes bar-pulse{0%{transform:translateX(-50%) scale(1)}40%{transform:translateX(-50%) scale(1.05)}100%{transform:translateX(-50%) scale(1)}}
.bw-sheet-open .bw-cartbar{opacity:0;pointer-events:none}

/* dish sheet */
.bw-sheet-scrim{position:fixed;inset:0;z-index:66;background:#0009;animation:fade .25s}
.bw-sheet{position:fixed;z-index:67;left:0;right:0;bottom:0;max-height:92%;overflow-y:auto;border-radius:28px 28px 0 0;background:#fffaf0;box-shadow:0 -10px 40px #0006;transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.8,.3,1);padding-bottom:env(safe-area-inset-bottom);overscroll-behavior:contain;touch-action:pan-y}
.bw-sheet.in{transform:none}
@keyframes fade{from{opacity:0}}
.bw-grab{width:44px;height:5px;border-radius:3px;background:#14231c33;margin:10px auto 0}
.bw-x{position:absolute;top:14px;right:14px;background:#fffaf0cc;z-index:1}
.bw-sheet-art{margin:12px 16px 0;height:min(36vh,240px);border-radius:22px;background:var(--tint);display:grid;place-items:center;overflow:hidden}
.bw-sheet-art .big{width:min(52%,200px);height:auto;animation:art-in .5s cubic-bezier(.2,1.5,.5,1)}
@keyframes art-in{from{transform:scale(.7) rotate(-8deg);opacity:0}}
.bw-sheet-body{padding:18px 20px 20px}
.bw-kicker{margin:0;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--orange);font-weight:700}
.bw-sheet h2{font-size:30px;color:var(--ink);margin:4px 0 6px;line-height:1.05}
.bw-price.big{font-size:22px;margin-top:2px}
.bw-sheet h4{margin:18px 0 8px;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#14231c88}
.bw-ingr{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.bw-ingr li{padding:7px 12px;border-radius:16px;background:#fff;border:1px solid var(--line);font-size:13px}
.bw-served{margin:14px 0 0;font-size:13px;color:var(--green);font-weight:700}
.bw-sheet-buy{display:flex;gap:10px;margin-top:20px}
.bw-qty{display:flex;align-items:center;gap:4px;padding:4px;border-radius:30px;background:#0b5a2c10}
.bw-qty button{width:42px;height:42px;border-radius:50%;border:0;background:#fff;color:var(--green);font-size:22px;box-shadow:0 2px 6px #0b5a2c1a}
.bw-qty span{min-width:26px;text-align:center;font-weight:700;font-size:17px}
.bw-cta{flex:1;height:50px;border:0;border-radius:30px;background:var(--green);color:#fff;font-weight:700;font-size:15px}
.bw-cta.alt{display:block;width:100%;margin-top:10px;background:var(--orange)}
.bw-cta:active{transform:scale(.97)}

/* desktop */
@media(min-width:960px){
  .bw{display:grid;grid-template-columns:220px 1fr;column-gap:32px;align-items:start}
  .bw-top,.bw-hero,.bw-search,.bw-filters,.bw-featured,.bw-foot{grid-column:1 / -1}
  .bw-top{margin:0 -16px}
  .bw-hero{padding:40px 40px 36px;min-height:260px}.bw-mole{height:220px;right:30px}
  .bw-cats{grid-column:1;flex-direction:column;top:90px;margin:26px 0 0;padding:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .bw-cats button{width:100%;padding:9px 14px 9px 10px;font-size:14px}
  .bw-menu{grid-column:2}
  .bw-list{display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
  .bw-rail{margin:0;padding:12px 0 8px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .bw-filtering .bw-menu{grid-column:1 / -1}
  .bw-sheet{left:50%;right:auto;bottom:50%;width:min(560px,92vw);max-height:88vh;border-radius:28px;transform:translate(-50%,calc(50% + 40px)) scale(.96);opacity:0;transition:transform .3s cubic-bezier(.2,.8,.3,1),opacity .25s}
  .bw-sheet.in{transform:translate(-50%,50%);opacity:1}
  .bw-grab{display:none}
}
@media(prefers-reduced-motion:reduce){.bw *{animation:none!important;transition:none!important}}
