/* Menu-only photo treatment. Keep the food clear of the reading area. */
body.menu-catalog .menu-catalog-hero.menu-photo-banner {
  min-height: 460px !important;
  height: auto !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  padding: 64px 0 !important;
  background: #151919;
  isolation: isolate;
}
body.menu-catalog .menu-photo-banner > img {
  left: 32% !important;
  top: 0 !important;
  width: 68% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: 50% 52% !important;
  filter: none !important;
  opacity: 1 !important;
  border-radius: 0 !important;
}
body.menu-catalog .menu-catalog-hero.menu-photo-banner::after {
  background: linear-gradient(90deg, #151919 0%, #151919 28%, rgba(21,25,25,.92) 39%, rgba(21,25,25,.46) 52%, rgba(21,25,25,0) 69%) !important;
}
body.menu-catalog .menu-photo-banner .container { position: relative; z-index: 2; }
body.menu-catalog .menu-photo-banner h1 { max-width: 47%; font-size: clamp(36px,4.1vw,55px) !important; text-wrap: balance; }
body.menu-catalog .menu-photo-banner .menu-hero-intro { max-width: 42% !important; text-wrap: pretty; }
body.menu-catalog .menu-photo-banner .menu-hero-links { max-width: 48%; gap: 12px 20px; }
@media (max-width: 900px) {
  body.menu-catalog .menu-catalog-hero.menu-photo-banner {
    --menu-photo-height: clamp(260px, 52vw, 460px);
    display: block;
    min-height: 0 !important;
    padding: calc(var(--menu-photo-height) - 24px) 0 32px !important;
  }
  body.menu-catalog .menu-photo-banner > img {
    left: 0 !important;
    width: 100% !important;
    height: var(--menu-photo-height) !important;
    object-position: 50% 52% !important;
  }
  body.menu-catalog .menu-catalog-hero.menu-photo-banner::after {
    background: linear-gradient(180deg, rgba(21,25,25,0) 0%, rgba(21,25,25,0) calc(var(--menu-photo-height) - 110px), #151919 var(--menu-photo-height), #151919 100%) !important;
  }
  body.menu-catalog .menu-photo-banner .container { width: calc(100% - 48px) !important; }
  body.menu-catalog .menu-photo-banner h1 { max-width: none; font-size: clamp(30px,4.7vw,42px) !important; }
  body.menu-catalog .menu-photo-banner .menu-hero-intro,
  body.menu-catalog .menu-photo-banner .menu-hero-links { max-width: none !important; }
}
@media (max-width: 480px) {
  body.menu-catalog .menu-photo-banner .container { width: calc(100% - 36px) !important; }
  body.menu-catalog .menu-photo-banner h1 { font-size: 30px !important; }
  body.menu-catalog .menu-photo-banner .menu-hero-links { gap: 10px 16px; }
}