/* Niu Mama mobile fixes (Nov 12 2026). Loaded last on every page. */

/* Header "Order online" never wraps onto two lines */
.nh-top .nh-red{white-space:nowrap}

/* Burger turns into an X while the mobile menu is open */
.nh-bars span{transition:transform .25s cubic-bezier(.22,1,.36,1),opacity .2s}
.nh-burger[aria-expanded="true"] .nh-bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nh-burger[aria-expanded="true"] .nh-bars span:nth-child(2){opacity:0}
.nh-burger[aria-expanded="true"] .nh-bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* Page behind the Order picker no longer scrolls */
html:has(.nm-op.is-open){overflow:hidden}

/* Kitchen menus: the sticky category bar slides with the header instead of jumping */
.nx-page .nm-m__bar{transition:top .35s cubic-bezier(.22,1,.36,1)}

/* Desktop header nav matches the homepage on inner pages */
.nx-page header.nh-top .nh-nav a{font-size:16px!important;letter-spacing:normal!important;text-transform:none!important}

@media (max-width:767px){
  /* Homepage hero: show the whole video (no cropping), text and buttons underneath */
  .nh-hero>div:has(>.nh-video){height:auto!important;overflow:visible!important;display:flex;flex-direction:column}
  .nh-hero .nh-video{position:relative!important;inset:auto!important;width:100%!important;height:auto!important;aspect-ratio:960/508;object-fit:cover;display:block}
  .nh-hero>div:has(>.nh-video)>.nh-video+div{display:none}
  .nh-hero>div:has(>.nh-video)>.nh-video+div+div{position:static!important;padding:28px 20px 36px;max-width:none!important}
  .nh-hero .nh-hero-h{font-size:clamp(42px,12vw,56px)!important}
  .nh-hero .nh-hero-p{margin-top:16px!important;font-size:17px!important}
  .nh-hero .nh-toggle[data-toggle="video"]{top:calc(100vw * 508 / 960 - 54px);bottom:auto!important;left:10px!important;width:44px!important;height:44px!important}
  .nh-top{padding-top:12px!important;padding-bottom:12px!important}
  .nh-top>a:first-child img{height:52px!important}

  /* Tap targets: at least 44px tall */
  .nh-rating{min-height:44px}
  .nh-toggle{min-width:44px;min-height:44px}
  .nh-story .nh-dot{min-height:44px;min-width:32px}
  .nh-flink{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
  .nm-m__cats a,.nx-page .nm-m__cats a,.nx-k .nm-m__bar .nm-m__cats a{min-height:44px!important}
  .nx-pill,.nx-page .nm-cat__kh a.nx-pill{display:inline-flex!important;align-items:center;min-height:44px!important}
  .nm-ev__link{display:inline-flex;align-items:center;min-height:44px}
  .nh-top>a.nh-red{min-height:44px!important}
  main h3 ~ p + a[href^="#"]{display:inline-flex;align-items:center;min-height:44px}
  a[href^="tel:"].text-brand{display:inline-flex;align-items:center;min-height:44px}
  .nx-ctr__btn{padding:0 16px!important;white-space:nowrap}
  .nm-map__btn{white-space:nowrap}
  abbr.nm-diet{font-size:12px}
  input[type="checkbox"],input[type="radio"]{width:22px;height:22px}

  /* Scroll reveals: quicker and smaller on phones so nothing looks late or jumpy */
  .nh-js .nh-rv{translate:0 10px;transition-duration:.5s}
  .nh-js .nh-rise>span{transition-duration:.6s}

  /* Sticky action bar at the bottom of the screen */
  .nm-ab{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:6px;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(26,19,14,.97);box-shadow:0 -8px 24px -12px rgba(0,0,0,.5);transition:transform .3s cubic-bezier(.22,1,.36,1)}
  .nm-ab a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:48px;border-radius:12px;color:#fff7ea;font:600 12px/1.1 'Instrument Sans',system-ui,sans-serif;text-decoration:none}
  .nm-ab a svg{width:20px;height:20px}
  .nm-ab a.nm-ab__order{background:#e0203f;color:#fff;font-size:15px;flex-direction:row;gap:8px}
  .nm-ab a:active{transform:scale(.96)}
  body.has-ab{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  html.nm-mm-open .nm-ab,html:has(.nm-op.is-open) .nm-ab,html:has(dialog[open]) .nm-ab{transform:translateY(110%)}
}
@media (min-width:768px){.nm-ab{display:none}}
@media (prefers-reduced-motion:reduce){.nm-ab,.nx-page .nm-m__bar,.nh-bars span{transition:none}}

/* Kitchen circles row: room for the coloured ring and shadow so nothing is clipped */
@media (max-width:960px){
  .nh-plates{padding-top:20px!important;margin-top:-20px;padding-bottom:28px!important;margin-bottom:-20px;scroll-padding-inline:20px}
}
/* Phones and tablets have no real hover: tapping a card must not tilt or lift the circle */
@media (hover:none){
  .nh-plates>div:hover>img{transform:none!important}
}

/* Phones: the header Order button goes away (the bottom bar has Order); the menu button moves right */
@media (max-width:767px){
  body.has-ab .nh-top>a.nh-red{display:none!important}
  body.has-ab .nh-top .nh-burger{margin-left:auto!important}
}