/* Launch refinements keep the existing Molabat layout and brand. */
html { scroll-padding-top: 76px; scroll-behavior: auto; }
.hero { background: var(--paper); }
.hero::before { display: none; }
.hero-photo img { height: auto; }
.hero .ho-card { display: none; }
.hero h1 { font-size: 3.3rem; letter-spacing: 0; }
.recognition-note { font-size: .7rem; color: var(--ink2); margin-top: 10px; }
.mi-desc, .cart-note, .ck-fine { color: var(--ink2); }
.mi-desc { font-size: .8rem; line-height: 1.5; }
.pb-opts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
.pb-choice { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--card); padding: 8px; }
.pb-choice.selected { border-color: var(--red); }
.pb-choice .pb-opt { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px; width: 100%; text-align: left; border: 0; box-shadow: none; background: transparent; white-space: normal; padding: 7px 4px; }
.pb-choice small { grid-column: 1/-1; display: block; font-size: .72rem; color: var(--ink2); margin-top: 5px; line-height: 1.5; font-weight: 400; }
.pb-choice .pb-opt-price { white-space: nowrap; font-size: .7rem; }
.pb-choice .pb-opt.sel, .pb-choice .pb-opt.sel .pb-opt-price { color: var(--red); }
.pb-choice .qty-ctrl { width: max-content; margin-top: 7px; }
.qty-ctrl button { min-width: 40px; min-height: 40px; }
.plate-extra { grid-column: 1/-1; display: flex; gap: 10px; align-items: center; font-size: .85rem; padding: 12px 0; }
.plate-extra input { width: 20px; height: 20px; accent-color: var(--red); }
.field-label { font-size: .82rem; font-weight: 700; margin-top: 5px; }
.ck-inp { font-size: 16px; }
#ck-step1 > div, #ck-step2 > div { animation: none !important; }
.form-error { color: #a10d10; font-size: .84rem; line-height: 1.5; margin: 8px 0; }
.payment-pending { padding: 24px 0; }
.payment-pending h2 { font-size: 1.6rem; margin-bottom: 16px; }
.payment-pending p { margin-bottom: 16px; line-height: 1.6; }
.payment-pending .btn { margin: 12px 0; }
.tracking-status { padding: 16px; margin: 16px 0; background: #fff; border-left: 4px solid var(--red); border-radius: 4px; }
.tracking-status p { font-size: .85rem; line-height: 1.6; margin-top: 6px; overflow-wrap: anywhere; }
.ck-row { gap: 14px; align-items: start; }
.ck-row > span:last-child { white-space: nowrap; }
.pb-modal { max-height: 88dvh; }
.cart-drawer { height: calc(100dvh - 20px); }
body:has(.pb-modal.open), body:has(.cart-drawer.open) { overflow: hidden; }
.mob-bar { padding-bottom: env(safe-area-inset-bottom); }
:focus-visible { outline: 3px solid #326442; outline-offset: 3px; }
@media (max-width:768px) {
  .hero { padding: 78px 18px 0; }
  .hero-inner { display: flex; flex-direction: column; align-items: stretch; gap: 12px; padding-bottom: 22px; }
  .hero-inner > div:first-child, .hero-side { display: contents; }
  .live-pill { order: 0; font-size: .7rem; margin: 0; align-self: flex-start; }
  .hero h1 { order: 1; font-size: 1.85rem; line-height: 1.15; margin: 0; }
  .hero-photo { order: 2; border-radius: 8px; }
  .hero-photo img { aspect-ratio: 2.4; height: auto; }
  .hero-p { order: 3; margin: 0; font-size: .88rem; line-height: 1.5; }
  .hero-btns { order: 4; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .hero-btns .btn { font-size: .78rem; padding: 12px 8px; min-height: 46px; gap: 5px; border-radius: 8px; }
  .hero-btns > a:last-child { display: none; }
  .hero-stats { order: 5; gap: 8px; margin: 3px 0 0; }
  .stat-chip { flex: 1; min-width: 0; padding: 8px; border-radius: 8px; }
  .stat-chip b { font-size: .95rem; }
  .stat-chip span { font-size: .6rem; letter-spacing: 0; }
  .recognition-note { order: 6; margin: 0; font-size: .62rem; }
  #reorderSlot { order: 7; }
  .hero .ho-card { display: none; }
  .menu-item { display: grid; grid-template-columns: 72px minmax(0,1fr); gap: 8px 12px; padding: 14px; }
  .menu-item .mi-img, .menu-item .mi-ph { width: 72px; height: 72px; grid-column: 1; grid-row: 1 / span 2; }
  .menu-item .mi-info { grid-column: 2; }
  .menu-item > div:last-child { grid-column: 2; justify-content: space-between; }
  .mi-custom { min-height: 36px; text-align: left; }
  .mi-name { font-size: .9rem; }
  .add-btn { width: 42px; height: 42px; }
  .sticky-cart { bottom: calc(72px + env(safe-area-inset-bottom)); }
  .pb-foot { padding-bottom: max(16px,env(safe-area-inset-bottom)); }
}
@media (max-width:360px) {
  .hero h1 { font-size: 1.65rem; }
  .pb-opts { grid-template-columns: 1fr; }
}
