/* ========================================
   Moulya's Kitchen — Mobile Homepage
   Applies ONLY below 992px (Bootstrap lg)
   ======================================== */

   @media (max-width: 991.98px) {
    .home-page,
    body.mk-has-mobile-dock {
      padding-bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px));
    }
  
    /* ---------- Sticky header ---------- */
    .mk-home-header {
      position: sticky;
      top: 0;
      z-index: 1030;
      min-height: 4.5rem;
      padding: 0;
      background: rgba(253, 248, 240, 0.88);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      transition: background 0.25s ease, box-shadow 0.25s ease;
    }
  
    .mk-home-header.is-scrolled {
      background: rgba(253, 248, 240, 0.96);
      box-shadow: 0 4px 20px rgba(10, 46, 0, 0.1);
    }
  
    .home-page .mk-site-announcement-host:not([hidden]) {
      position: sticky;
      top: var(--mk-header-offset, 4.5rem);
      z-index: 1025;
    }
  
    body.mk-product-detail-open .mk-home-header {
      position: fixed !important;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1045;
    }
  
    body.mk-product-detail-open .mk-site-announcement-host:not([hidden]) {
      position: fixed !important;
      top: var(--mk-product-detail-header-h, var(--mk-header-offset, 4.5rem));
      left: 0;
      right: 0;
      z-index: 1044;
    }
  
    .mk-home-header > .container,
    .mk-home-header > .container-fluid {
      width: 100%;
      max-width: 100%;
      padding-top: 0.45rem;
      padding-bottom: 0.45rem;
      padding-left: max(0.5rem, env(safe-area-inset-left, 0px));
      padding-right: max(0.5rem, env(safe-area-inset-right, 0px));
    }
  
    .mk-home-header__bar {
      display: flex;
      align-items: center;
      gap: 0.15rem;
      width: 100%;
      min-width: 0;
    }
  
    .mk-home-header__toggler {
      flex: 0 0 auto;
      width: 2.5rem;
      height: 2.5rem;
      min-width: 40px;
      min-height: 40px;
      padding: 0;
      margin: 0;
    }
  
    .mk-home-header__logo {
      flex: 0 0 auto;
      margin: 0 !important;
    }
  
    .mk-home-header__logo .mk-navbar-logo {
      width: 2.85rem;
      height: 2.85rem;
    }
  
    .mk-home-header__icons {
      flex: 0 0 auto;
      margin-left: auto;
      display: inline-flex;
      align-items: center;
      gap: 0;
      min-width: 0;
    }
  
    .mk-home-header__icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2.5rem;
      height: 2.5rem;
      min-width: 40px;
      min-height: 40px;
      padding: 0;
      color: var(--foreground);
      text-decoration: none;
      border-radius: 50%;
      transition: background-color 0.2s ease;
      font-size: 1.15rem;
      line-height: 1;
    }
  
    .mk-home-header__icon:active {
      background-color: rgba(10, 46, 0, 0.06);
    }
  
    .mk-home-header__icon .cart-badge,
    .mk-home-header__icon .mk-notif-count-badge {
      top: 0.2rem;
      right: 0.15rem;
      min-width: 1rem;
      height: 1rem;
      font-size: 0.6rem;
      line-height: 1rem;
      padding: 0 0.2rem;
    }
  
    .mk-mobile-notif-dot {
      position: absolute;
      top: 0.45rem;
      right: 0.45rem;
      width: 0.45rem;
      height: 0.45rem;
      border-radius: 50%;
      background: #ef4444;
      border: 1.5px solid #fdf8f0;
    }
  
    .mk-home-header .navbar-collapse .d-flex.align-items-center.gap-2 {
      display: none !important;
    }
  
    /* Hide Bootstrap collapse dropdown — nav opens in left sidebar instead */
    .navbar-mk #navbarNav.mk-navbar-collapse--sidebar-source {
      display: none !important;
    }
  
    /* ---------- Mobile nav sidebar (left drawer) ---------- */
    .mk-mobile-nav-sidebar {
      --mk-sidebar-width: clamp(60vw, 65vw, 70vw);
      width: var(--mk-sidebar-width);
      max-width: 70vw;
      border-right: none;
      border-radius: 0 1.35rem 1.35rem 0;
      background: #fdf8f0;
      box-shadow: 8px 0 40px rgba(10, 46, 0, 0.16);
    }
  
    .mk-mobile-nav-sidebar__header {
      position: relative;
      padding: 1.1rem 1rem 1rem;
      border-bottom: 1px solid rgba(10, 46, 0, 0.08);
      align-items: flex-start;
      overflow: hidden;
    }
  
    .mk-mobile-nav-sidebar__header-leaf {
      position: absolute;
      top: 0.35rem;
      right: 3.25rem;
      font-size: 3.25rem;
      color: rgba(61, 82, 41, 0.08);
      pointer-events: none;
      transform: rotate(18deg);
    }
  
    .mk-mobile-nav-sidebar__brand {
      display: flex;
      align-items: center;
      gap: 0.7rem;
      min-width: 0;
      flex: 1;
      position: relative;
      z-index: 1;
    }
  
    .mk-mobile-nav-sidebar__brand-text strong {
      display: block;
      font-size: 1rem;
      color: var(--mk-green, #0a2e00);
      line-height: 1.2;
    }
  
    .mk-mobile-nav-sidebar__brand-text span {
      display: block;
      font-size: 0.6875rem;
      color: #64748b;
      line-height: 1.25;
      margin-top: 0.1rem;
    }
  
    .mk-mobile-nav-sidebar__logo {
      width: 3rem;
      height: 3rem;
      border-radius: 50%;
      object-fit: cover;
      flex-shrink: 0;
      box-shadow: 0 2px 8px rgba(10, 46, 0, 0.08);
    }
  
    .mk-mobile-nav-sidebar__close {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2rem;
      height: 2rem;
      margin: 0;
      padding: 0;
      border: 1px solid rgba(10, 46, 0, 0.12);
      border-radius: 0.5rem;
      background: #fff;
      color: #334155;
      flex-shrink: 0;
      position: relative;
      z-index: 2;
    }
  
    .mk-mobile-nav-sidebar__body {
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
      overflow-y: auto;
    }
  
    .mk-mobile-nav-sidebar__nav {
      padding: 0.35rem 0 0;
    }
  
    .mk-mobile-nav-sidebar__list {
      list-style: none;
      margin: 0;
      padding: 0;
    }
  
    .mk-mobile-nav-sidebar__item {
      margin: 0;
      border-bottom: 1px solid rgba(10, 46, 0, 0.07);
    }
  
    .mk-mobile-nav-sidebar__link {
      display: grid;
      grid-template-columns: 1.75rem 1fr auto;
      align-items: center;
      gap: 0.75rem;
      padding: 0.95rem 1rem;
      color: var(--mk-green, #3d5229);
      text-decoration: none;
      font-weight: 600;
      font-size: 0.9375rem;
      line-height: 1.2;
      background: transparent;
      transition: background-color 0.2s ease;
    }
  
    .mk-mobile-nav-sidebar__link-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--mk-green, #3d5229);
    }
  
    .mk-mobile-nav-sidebar__link-icon i {
      font-size: 1.125rem;
      line-height: 1;
    }
  
    .mk-mobile-nav-sidebar__link-label {
      min-width: 0;
    }
  
    .mk-mobile-nav-sidebar__chevron {
      font-size: 0.875rem;
      color: #94a3b8;
      flex-shrink: 0;
    }
  
    .mk-mobile-nav-sidebar__link.is-active,
    .mk-mobile-nav-sidebar__link[aria-current="page"] {
      background: rgba(61, 82, 41, 0.06);
    }
  
    .mk-mobile-nav-sidebar__link:active {
      background: rgba(61, 82, 41, 0.08);
    }
  
    .mk-mobile-nav-sidebar__promo {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: start;
      gap: 0.65rem;
      margin: 0.85rem 1rem 0.75rem;
      padding: 0.85rem 0.9rem;
      border: 1px solid rgba(61, 82, 41, 0.18);
      border-radius: 0.85rem;
      background: rgba(61, 82, 41, 0.05);
    }
  
    .mk-mobile-nav-sidebar__promo-icon {
      color: var(--mk-green, #3d5229);
      font-size: 1rem;
      line-height: 1;
      padding-top: 0.1rem;
    }
  
    .mk-mobile-nav-sidebar__promo-text strong {
      display: block;
      font-size: 0.8125rem;
      color: var(--mk-green, #3d5229);
      line-height: 1.25;
      margin-bottom: 0.2rem;
    }
  
    .mk-mobile-nav-sidebar__promo-text p {
      margin: 0;
      font-size: 0.6875rem;
      line-height: 1.35;
      color: #64748b;
    }
  
    .mk-mobile-nav-sidebar__promo-like {
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      gap: 0.15rem;
      margin: 0;
      padding: 0;
      border: none !important;
      outline: none !important;
      box-shadow: none !important;
      background: transparent !important;
      background-image: none !important;
      color: #cbd5e1;
      cursor: pointer;
      line-height: 1;
      min-width: 2rem;
      user-select: none;
      -webkit-user-select: none;
      -webkit-tap-highlight-color: transparent;
    }
  
    .mk-mobile-nav-sidebar__promo-like:focus,
    .mk-mobile-nav-sidebar__promo-like:focus-visible,
    .mk-mobile-nav-sidebar__promo-like:active {
      border: none !important;
      outline: none !important;
      box-shadow: none !important;
      background: transparent !important;
    }
  
    .mk-mobile-nav-sidebar__promo-like i {
      font-size: 1rem;
      transition: color 0.15s ease, transform 0.2s ease;
    }
  
    .mk-mobile-nav-sidebar__promo-like-count {
      font-size: 0.625rem;
      font-weight: 700;
      color: #94a3b8;
      min-width: 1rem;
      text-align: center;
      line-height: 1;
    }
  
    .mk-mobile-nav-sidebar__promo-like.is-liked {
      color: #e11d48;
    }
  
    .mk-mobile-nav-sidebar__promo-like.is-liked .mk-mobile-nav-sidebar__promo-like-count {
      color: #e11d48;
    }
  
    .mk-mobile-nav-sidebar__promo-like.is-animating i {
      transform: scale(1.15);
    }
  
    .mk-mobile-nav-sidebar__promo-like:active i {
      transform: scale(0.92);
    }
  
    .mk-mobile-nav-sidebar__promo-heart {
      color: #cbd5e1;
      font-size: 1rem;
      padding-top: 0.1rem;
    }
  
    .mk-mobile-nav-sidebar__profile {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      margin: 0 1rem 0.65rem;
      padding: 0.85rem 0.9rem;
      border: 1px solid rgba(10, 46, 0, 0.1);
      border-radius: 0.85rem;
      background: #fff;
      text-decoration: none;
      color: inherit;
    }
  
    .mk-mobile-nav-sidebar__avatar {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2.5rem;
      height: 2.5rem;
      border-radius: 50%;
      background: rgba(61, 82, 41, 0.1);
      color: var(--mk-green, #3d5229);
      font-size: 0.8125rem;
      font-weight: 700;
      flex-shrink: 0;
    }
  
    .mk-mobile-nav-sidebar__profile-text strong {
      display: block;
      font-size: 0.9375rem;
      color: #0f172a;
      line-height: 1.2;
    }
  
    .mk-mobile-nav-sidebar__profile-link {
      display: inline-flex;
      align-items: center;
      gap: 0.15rem;
      margin-top: 0.15rem;
      font-size: 0.75rem;
      font-weight: 600;
      color: var(--mk-green, #3d5229);
    }
  
    .mk-mobile-nav-sidebar__profile-link i {
      font-size: 0.6875rem;
    }
  
    .mk-mobile-nav-sidebar__auth {
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
      margin: 0 1rem 0.65rem;
    }
  
    .mk-mobile-nav-sidebar__auth-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 2.75rem;
      border-radius: 999px;
      font-weight: 600;
      font-size: 0.875rem;
      text-decoration: none;
    }
  
    .mk-mobile-nav-sidebar__auth-btn--enter {
      background: var(--mk-green, #3d5229);
      color: #fff;
    }
  
    .mk-mobile-nav-sidebar__auth-btn--join {
      background: #fff;
      color: var(--mk-green, #3d5229);
      border: 1px solid rgba(61, 82, 41, 0.25);
    }
  
    .mk-mobile-nav-sidebar__logout-btn {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 0.65rem;
      width: calc(100% - 2rem);
      margin: 0 1rem 0.85rem;
      padding: 0.85rem 0.95rem;
      border: none;
      border-radius: 0.85rem;
      background: #fff4e8;
      color: #ea580c;
      font-weight: 700;
      font-size: 0.9375rem;
      text-align: left;
    }
  
    .mk-mobile-nav-sidebar__logout-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 1.75rem;
      height: 1.75rem;
      border-radius: 0.45rem;
      background: rgba(234, 88, 12, 0.12);
      color: #ea580c;
    }
  
    .mk-mobile-nav-sidebar__logout-btn .mk-mobile-nav-sidebar__chevron {
      color: #fb923c;
    }
  
    .mk-mobile-nav-sidebar__sound {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 0.75rem;
      width: calc(100% - 2rem);
      margin: 0 1rem 0.85rem;
      padding: 0.85rem 0.95rem;
      border: 1px solid rgba(61, 82, 41, 0.12);
      border-radius: 0.85rem;
      background: #fff;
      color: inherit;
      text-align: left;
    }
  
    .mk-mobile-nav-sidebar__sound-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 1.75rem;
      height: 1.75rem;
      border-radius: 0.45rem;
      background: rgba(61, 82, 41, 0.1);
      color: var(--mk-green, #3d5229);
    }
  
    .mk-mobile-nav-sidebar__sound-text strong {
      display: block;
      font-size: 0.875rem;
      color: #1f2937;
      line-height: 1.2;
    }
  
    .mk-mobile-nav-sidebar__sound-text small {
      display: block;
      font-size: 0.6875rem;
      color: #64748b;
      margin-top: 0.1rem;
    }
  
    .mk-mobile-nav-sidebar__help {
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      gap: 0.75rem;
      margin-top: auto;
      padding: 0.95rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
      border-top: 1px solid rgba(10, 46, 0, 0.08);
      background: #fdf8f0;
      text-decoration: none;
      color: inherit;
    }
  
    .mk-mobile-nav-sidebar__help-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 2rem;
      height: 2rem;
      border-radius: 0.5rem;
      background: rgba(61, 82, 41, 0.08);
      color: var(--mk-green, #3d5229);
    }
  
    .mk-mobile-nav-sidebar__help-text strong {
      display: block;
      font-size: 0.875rem;
      color: #0f172a;
      line-height: 1.2;
    }
  
    .mk-mobile-nav-sidebar__help-text small {
      display: block;
      margin-top: 0.1rem;
      font-size: 0.6875rem;
      color: #64748b;
    }
  
    .offcanvas-backdrop.show {
      opacity: 0.42;
    }
  
    /* ---------- Hero — default carousel slide + legacy hero-section ---------- */
    .hero-section,
    .mk-hero-slide--default {
      padding: clamp(1.25rem, 4vw, 2.5rem) 0 clamp(1rem, 3vw, 1.75rem);
      background-size: cover !important;
      background-position: 72% center !important;
      background-repeat: no-repeat !important;
      min-height: auto !important;
    }
  
    .mk-hero-slide--default .hero-content.mk-home-shell {
      padding-top: 0.25rem;
      padding-bottom: 0.15rem;
      padding-left: max(0.5rem, env(safe-area-inset-left, 0px));
      padding-right: max(0.75rem, env(safe-area-inset-right, 0px));
    }

    .mk-hero-slide--default .hero-content .col-lg-7 {
      max-width: 100%;
      padding-left: 0;
      padding-right: 0;
    }
  
    .hero-overlay,
    .mk-hero-slide--default .hero-overlay {
      display: block;
      background: linear-gradient(
        105deg,
        rgba(255, 255, 255, 0.96) 0%,
        rgba(255, 255, 255, 0.9) 42%,
        rgba(255, 255, 255, 0.55) 62%,
        rgba(255, 255, 255, 0.12) 100%
      );
    }
  
    .hero-section .hero-content .row,
    .mk-hero-slide--default .hero-content .row {
      --bs-gutter-x: 0;
      margin-left: 0;
      margin-right: 0;
      flex-direction: column;
      gap: 0;
    }
  
    .hero-section h1,
    .mk-hero-slide--default .mk-hero__title {
      font-family: 'Great Vibes', cursive !important;
      font-weight: 400 !important;
      font-size: clamp(1.7rem, 7.2vw, 2.35rem) !important;
      color: #0a2e00 !important;
      line-height: 1.08;
      margin-bottom: 0.4rem !important;
      max-width: none;
      text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55);
    }

    .mk-hero-slide--default .mk-hero__title-line {
      display: block;
      white-space: nowrap;
    }

    .hero-section h1 .text-primary-mk,
    .mk-hero-slide--default .mk-hero__title .text-primary-mk,
    .mk-hero-slide--default .mk-hero__title-line--accent {
      color: var(--mk-orange, #d97706) !important;
    }

    .mk-hero-slide--default .mk-hero__copy {
      max-width: min(96vw, 22rem);
    }

    .hero-section .fs-5,
    .mk-hero__subtitle {
      font-size: 0.72rem !important;
      color: #374151 !important;
      line-height: 1.5;
      margin-bottom: 0.65rem !important;
      max-width: 16.5rem;
    }

    .mk-hero__points {
      font-family: Inter, system-ui, -apple-system, sans-serif !important;
      font-size: 0.68rem !important;
      font-weight: 500;
      line-height: 1.3;
      margin-bottom: 0 !important;
      max-width: 15rem;
      color: #4b5563 !important;
    }

    .mk-hero__points li {
      margin-bottom: 0.08rem;
      gap: 0.3rem;
    }

    .mk-hero__points li::before {
      width: 0.22rem;
      height: 0.22rem;
    }

    .mk-hero__trust {
      display: flex;
      flex-direction: column;
      align-items: flex-start !important;
      gap: 0.35rem !important;
      font-size: 0.66rem;
      max-width: 11.5rem;
      margin-bottom: 0 !important;
    }
  
    .mk-hero__trust > div {
      width: 100%;
      white-space: nowrap;
    }
  
    .mk-hero__trust i {
      font-size: 0.8rem;
      flex-shrink: 0;
    }
  
    /* ---------- Banner ---------- */
    .home-page section.py-4 {
      padding-top: 1rem !important;
      padding-bottom: 1rem !important;
    }
  
    /* ---------- Weekly specials ---------- */
    .mk-weekly-specials {
      padding-top: 2rem !important;
      padding-bottom: 2rem !important;
      overflow: visible;
    }
  
    .mk-weekly-specials .mk-home-card {
      isolation: isolate;
    }
  
    .mk-weekly-specials .section-header {
      margin-bottom: 1.25rem;
    }
  
    .mk-home-menu-tabs {
      max-width: none;
      margin-bottom: 1rem;
    }
  
    .mk-home-menu-tab {
      min-width: 6.5rem;
      font-size: 0.75rem;
      padding: 0.5rem 0.65rem;
    }
  
    .mk-home-menu-tab span {
      display: inline;
    }
  
    #homeWeeklyWeekTabs {
      display: none !important;
    }
  
    .mk-home-menu-hub #homeWeeklyWeekTabs,
    .mk-home-menu-hub .mk-week-select,
    .mk-home-menu-hub #homeWeeklyWeekSelect {
      display: none !important;
      visibility: hidden !important;
    }
  
    .mk-weekly-picker .mk-week-select {
      display: block !important;
      visibility: visible !important;
      max-width: 100%;
    }
  
    .mk-weekly-picker .mk-week-select.is-hidden {
      display: none !important;
    }
  
    #homeWeeklyDayTabs {
      display: none !important;
    }
  
    /* Product grid — two compact columns on mobile (not home carousel) */
    #weeklyPreviewGrid.row:not(.mk-home-cards-carousel__track),
    #homeGeneralMenuGrid.row,
    #homeOffersGrid.row,
    #menuGrid.row,
    #productsGrid.row {
      --bs-gutter-x: 0.5rem;
      --bs-gutter-y: 0.65rem;
    }
  
    #weeklyPreviewGrid:not(.mk-home-cards-carousel__track) > .col-6,
    #homeGeneralMenuGrid > .col-6,
    #homeOffersGrid > .col-6,
    #menuGrid > .col-6,
    #productsGrid > .col-6 {
      flex: 0 0 50% !important;
      max-width: 50% !important;
    }
  
    .mk-home-cards-carousel__track > [class*="col-"]:not(.col-12) {
      flex: 0 0 clamp(12rem, 42%, 13.25rem) !important;
      max-width: clamp(12rem, 42%, 13.25rem) !important;
      width: clamp(12rem, 42%, 13.25rem) !important;
    }
  
    .mk-home-cards-carousel__track > .col-12 {
      flex: 0 0 100% !important;
      max-width: 100% !important;
      width: 100% !important;
    }
  
    .mk-home-cards-carousel__nav {
      width: 2rem;
      height: 2rem;
      font-size: 0.85rem;
    }
  
    .mk-home-cards-carousel__nav--prev {
      left: 0.35rem;
      --mk-carousel-nav-x: -25%;
      transform: translate(var(--mk-carousel-nav-x), -50%);
    }
  
    .mk-home-cards-carousel__nav--next {
      right: 0.35rem;
      --mk-carousel-nav-x: 25%;
      transform: translate(var(--mk-carousel-nav-x), -50%);
    }
  
    .mk-day-picker-nav {
      width: 2rem;
      height: 2rem;
      font-size: 0.85rem;
    }
  
    .mk-home-menu-hub .mk-day-picker-row .mk-day-scroll__btn {
      min-width: 0;
      padding: 0.4rem 0.25rem 0.45rem;
    }
  
    .mk-home-menu-hub .mk-day-scroll__badge {
      display: none !important;
    }
  
    .mk-home-membership-chip {
      margin-bottom: 0.45rem;
    }
  
    .mk-home-membership-chip__main {
      padding: 0.55rem 0.65rem;
      gap: 0.5rem;
    }
  
    .mk-home-membership-chip__icon {
      width: 1.85rem;
      height: 1.85rem;
      font-size: 0.85rem;
      border-radius: 0.55rem;
    }
  
    .mk-home-membership-chip__label {
      font-size: 0.64rem;
    }
  
    .mk-home-membership-chip__plan {
      font-size: 0.72rem;
    }
  
    .mk-home-membership-chip__summary {
      font-size: 0.7rem;
    }
  
    .mk-home-membership-chip__chevron {
      font-size: 0.85rem;
    }
  
    .mk-home-menu-hub .mk-home-cards-carousel .mk-home-card__media {
      width: 100%;
      flex-shrink: 0;
      aspect-ratio: 4 / 3;
      height: auto !important;
      max-height: none !important;
      min-height: 0;
      border-radius: 0.75rem 0.75rem 0 0;
    }
  
    .mk-home-menu-hub .mk-home-cards-carousel .mk-home-card .card-img-top,
    .mk-home-menu-hub .mk-home-cards-carousel .mk-home-card__image {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      max-height: none !important;
      aspect-ratio: unset;
      object-fit: cover;
      object-position: center;
      display: block;
      border-radius: 0;
    }
  
    /* Product card mobile — compact layout */
    .mk-home-cards-carousel__track .mk-home-card {
      display: flex;
      flex-direction: column;
      border-radius: 0.75rem;
      box-shadow: var(--mk-shadow-card);
      border: 1px solid rgba(229, 221, 211, 0.5);
      transition: transform 0.25s ease, box-shadow 0.25s ease;
      overflow: hidden;
    }
  
    .mk-home-card:active {
      transform: scale(0.995);
    }
  
    .mk-home-cards-carousel__track .mk-home-card__media {
      position: relative;
      width: 100%;
      aspect-ratio: 4 / 3;
      height: auto !important;
      max-height: none !important;
      overflow: hidden;
      background-color: var(--muted);
      border-radius: 0.75rem 0.75rem 0 0;
    }
  
    .mk-home-cards-carousel__track .mk-home-card .card-img-top,
    .mk-home-cards-carousel__track .mk-home-card__image {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      max-height: none !important;
      aspect-ratio: unset;
      object-fit: cover;
      object-position: center;
      display: block;
      border-radius: 0;
    }
  
    .mk-home-card__media {
      width: 100%;
      height: clamp(5.75rem, 24vw, 6.75rem);
      overflow: hidden;
      background-color: var(--muted);
    }
  
    .mk-home-cards-carousel__track .mk-home-card .sold-out-ribbon {
      top: 8px;
      left: -38px;
      width: 130px;
      font-size: 0.52rem;
    }
  
    .mk-home-cards-carousel__track .mk-home-card__badge {
      top: 0.35rem;
      left: 0.35rem;
      font-size: 0.58rem;
      padding: 0.12rem 0.3rem;
    }
  
    .mk-home-card .card-img-top,
    .mk-home-card__image {
      width: 100%;
      height: 100%;
      max-height: 6.75rem;
      aspect-ratio: unset;
      object-fit: cover;
      object-position: center;
      display: block;
      border-radius: 0.75rem 0.75rem 0 0;
    }
  
    .mk-home-card.card-sold-out .card-img-top,
    .mk-home-card.card-sold-out .mk-home-card__image {
      filter: grayscale(25%) brightness(0.92);
      opacity: 1;
    }
  
    .mk-home-card__body,
    .mk-home-card .card-body {
      flex: 1;
      display: flex;
      flex-direction: column;
      min-width: 0;
      padding: 0.45rem 0.5rem 0.5rem !important;
    }
  
    .mk-home-card__title,
    .mk-home-card .card-title {
      font-size: 0.8125rem !important;
      color: var(--mk-green, #0a2e00);
      margin-bottom: 0.1rem !important;
      line-height: 1.2;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
  
    .mk-home-card__desc {
      font-size: 0.78rem;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      display: -webkit-box;
      overflow: hidden;
    }
  
    .mk-home-card__delivery {
      font-size: 0.75rem;
    }
  
    .mk-home-card .mk-membership-tag {
      font-size: 0.55rem;
      padding: 0.18rem 0.35rem;
      margin-bottom: 0.15rem !important;
      max-width: 100%;
    }
  
    .mk-home-card__countdown {
      font-size: 0.625rem;
      margin-bottom: 0.25rem !important;
      line-height: 1.25;
      word-break: break-word;
    }
  
    .mk-home-card__slot-msg {
      margin: 0 0 0.25rem;
      padding: 0.2rem 0.35rem;
      font-size: 0.625rem;
      font-weight: 600;
      line-height: 1.25;
      color: var(--muted-foreground);
      text-align: center;
      background: rgba(10, 46, 0, 0.06);
      border-radius: 0.5rem;
    }
  
    .mk-home-card__slot-picker {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.25rem;
      margin: 0 0 0.25rem;
    }
  
    .mk-home-card__slot-option {
      display: block;
      min-width: 0;
      margin: 0;
      cursor: pointer;
    }
  
    .mk-home-card__slot-chip {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      min-height: 1.5rem;
      padding: 0.18rem 0.25rem;
      font-size: 0.5625rem;
      font-weight: 600;
      line-height: 1.15;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: #fff;
      color: var(--foreground);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  
    .mk-home-card__slot-input:checked + .mk-home-card__slot-chip {
      background: var(--mk-green, #3d5229);
      border-color: var(--mk-green, #3d5229);
      color: #fff;
    }
  
    .mk-home-card__slot-input:disabled + .mk-home-card__slot-chip {
      opacity: 0.55;
      cursor: not-allowed;
    }
  
    .mk-home-card__slot-option:has(.mk-home-card__slot-input:disabled) {
      cursor: not-allowed;
    }
  
    .mk-home-card__slot,
    .mk-home-card select.form-select {
      width: 100%;
      max-width: 100%;
      border-radius: 0.5rem;
      font-size: 0.6875rem;
      min-height: 1.75rem;
      padding: 0.15rem 1.35rem 0.15rem 0.35rem;
      margin-bottom: 0.25rem !important;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
      background-position: right 0.35rem center;
      background-size: 0.65rem;
    }
  
    .mk-home-card__footer {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      grid-template-areas:
        "price price"
        "wishlist actions";
      gap: 0.35rem 0.35rem;
      align-items: center;
      margin-top: auto;
      padding-top: 0.2rem;
      min-height: unset;
      width: 100%;
      min-width: 0;
    }
  
    .mk-home-card__price {
      grid-area: price;
      flex: none;
      width: 100%;
      min-width: 0;
      overflow: visible;
    }
  
    .mk-home-card__price .price-current {
      display: block;
      font-size: 0.9rem;
      color: var(--mk-orange, #d97706);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  
    .mk-home-card__price .price-offer-row,
    .mk-home-card__price .price-stack {
      row-gap: 0.1rem;
    }
  
    .mk-home-card__price .price-original,
    .mk-home-card__price .price-single {
      font-size: 0.78rem;
      line-height: 1.1;
    }
  
    .mk-home-card__wishlist,
    .mk-home-card .favorite-btn {
      position: static;
      grid-area: wishlist;
      flex-shrink: 0;
      width: auto;
      height: auto;
      min-width: 0;
      min-height: 0;
      border: none !important;
      border-radius: 0 !important;
      background: transparent !important;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0.15rem;
      color: #9f1239;
      box-shadow: none !important;
    }
  
    .mk-home-card__wishlist.active,
    .mk-home-card .favorite-btn.active {
      color: #e11d48;
      background: transparent !important;
      border: none !important;
    }
  
    .mk-home-card__cart,
    .mk-home-card .weekly-add-cart-btn,
    .mk-home-card .add-cart-btn {
      position: static;
      flex-shrink: 0;
      width: 1.85rem;
      height: 1.85rem;
      min-width: 30px;
      min-height: 30px;
      border-radius: 50% !important;
      background: var(--mk-orange, #d97706) !important;
      border: none !important;
      color: #fff !important;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0 !important;
      font-size: 1rem;
      box-shadow: 0 4px 14px rgba(217, 119, 6, 0.4);
    }
  
    .mk-home-card__cart:disabled,
    .mk-home-card .weekly-add-cart-btn:disabled,
    .mk-home-card .add-cart-btn:disabled {
      background: #e5e7eb !important;
      color: #9ca3af !important;
      box-shadow: none;
    }
  
    .mk-home-card__cart i,
    .mk-home-card .weekly-add-cart-btn i,
    .mk-home-card .add-cart-btn i {
      font-size: 1rem;
    }
  
    .mk-weekly-qty {
      min-width: 0;
      max-width: 4.85rem;
      height: 1.75rem;
      padding: 0 0.08rem;
    }
  
    .mk-weekly-qty__btn {
      width: 1.45rem;
      font-size: 0.9rem;
    }
  
    .mk-weekly-qty__value {
      min-width: 0.75rem;
      font-size: 0.8rem;
    }
  
    .mk-weekly-card__cart-wrap {
      grid-area: actions;
      margin-left: 0;
      justify-self: end;
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      gap: 0.25rem;
      min-width: 0;
      max-width: 100%;
    }
  
    .mk-home-card .sold-out-ribbon {
      top: 10px;
      left: -42px;
      width: 140px;
      font-size: 0.55rem;
    }
  
    /* Add On's section — tighter spacing on mobile */
    .mk-addon-section {
      margin-top: 1.1rem;
      padding: 0.85rem 0.85rem 1rem;
      border-radius: 1rem;
    }
  
    /* View full menu — scrolls with page content */
    .mk-view-menu-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
      width: 100%;
      max-width: 22rem;
      min-height: 48px;
      border-radius: var(--mk-pill-radius, 9999px) !important;
      border: 1.5px solid var(--mk-green, #3d5229) !important;
      color: var(--mk-green, #3d5229) !important;
      font-weight: 600;
      font-size: 0.875rem;
      background: #fff;
      text-decoration: none;
      box-shadow: 0 2px 12px rgba(10, 46, 0, 0.06);
      transition: background-color 0.2s ease, transform 0.2s ease;
    }
  
    .mk-view-menu-btn:hover,
    .mk-view-menu-btn:focus {
      background: rgba(61, 82, 41, 0.05);
      color: var(--mk-green, #3d5229) !important;
    }
  
    /* Fixed mobile bottom nav only */
    .mk-mobile-dock {
      display: block;
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1050;
      padding-bottom: env(safe-area-inset-bottom, 0px);
    }
  
    /* ---------- Bottom navigation ---------- */
    .mk-bottom-nav {
      display: flex;
      position: relative;
      width: 100%;
      max-width: 100%;
      align-items: flex-end;
      justify-content: space-between;
      min-height: 4.5rem;
      padding: 0.5rem 0.75rem 0.65rem;
      background: #fff;
      border-radius: 1.35rem 1.35rem 0 0;
      border-top: none;
      box-shadow: 0 -8px 32px rgba(10, 46, 0, 0.1);
    }
  
    .mk-bottom-nav__item {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-end;
      gap: 0.2rem;
      min-width: 3rem;
      min-height: 44px;
      padding: 0.2rem 0.15rem;
      color: #94a3b8;
      text-decoration: none;
      font-size: 0.625rem;
      font-weight: 600;
      line-height: 1.15;
      border: none;
      background: transparent;
      transition: color 0.2s ease, opacity 0.2s ease;
    }
  
    .mk-bottom-nav__item i,
    .mk-bottom-nav__item .mk-bottom-nav__icon {
      display: inline-block;
      flex-shrink: 0;
      width: 1.35rem;
      height: 1.35rem;
      font-size: 1.35rem;
      line-height: 1;
    }
  
    .mk-bottom-nav__icon--stroke {
      fill: none;
      stroke: currentColor;
      stroke-width: 1.75;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
  
    .mk-bottom-nav__item.is-active .mk-bottom-nav__icon--stroke,
    .mk-bottom-nav__item[aria-current="page"] .mk-bottom-nav__icon--stroke {
      stroke-width: 2;
    }
  
    .mk-bottom-nav__item i {
      min-width: 1.35rem;
      min-height: 1.35rem;
    }
  
    .mk-bottom-nav__item i.bi::before {
      font-family: bootstrap-icons !important;
    }
  
    .mk-bottom-nav__item span {
      white-space: nowrap;
    }
  
    .mk-bottom-nav__item.is-active,
    .mk-bottom-nav__item[aria-current="page"] {
      color: var(--mk-green, #3d5229);
      font-weight: 700;
    }
  
    .mk-bottom-nav__item:not(.is-active):not([aria-current="page"]) i,
    .mk-bottom-nav__item:not(.is-active):not([aria-current="page"]) .mk-bottom-nav__icon {
      opacity: 0.72;
    }
  
    .mk-bottom-nav__item.is-active i.bi::before,
    .mk-bottom-nav__item[aria-current="page"] i.bi::before {
      font-weight: 700;
    }
  
    .mk-bottom-nav__item--order {
      flex: 0 0 auto;
      margin-top: -2.25rem;
      padding-bottom: 0;
    }
  
    .mk-bottom-nav__order-btn {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.15rem;
      width: 4.75rem;
      height: 4.75rem;
      min-width: 4.75rem;
      min-height: 4.75rem;
      border-radius: 50%;
      background: var(--mk-green, #3d5229);
      color: #fff;
      border: 4px solid #fff;
      box-shadow: 0 10px 28px rgba(61, 82, 41, 0.45);
      text-decoration: none;
      font-size: 0.625rem;
      font-weight: 700;
      line-height: 1.1;
      text-align: center;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }
  
    .mk-bottom-nav__order-btn:active {
      transform: scale(0.94);
    }
  
    .mk-bottom-nav__order-btn i {
      font-size: 1.35rem;
      font-weight: 400;
    }
  
    .mk-bottom-nav__order-btn span {
      font-size: 0.5625rem;
      letter-spacing: 0.01em;
    }
  
    /* General menu section spacing */
    .home-page section.py-5:not(.mk-weekly-specials) {
      padding-top: 2rem !important;
      padding-bottom: 2rem !important;
    }
  
    /* Footer extra padding for bottom dock */
    .home-page .footer-mk,
    body.mk-has-mobile-dock .footer-mk {
      padding-bottom: 1rem;
    }
  
    /* ---------- Explore More promo banners ---------- */
    .mk-explore-more__title {
      font-family: 'Playfair Display', serif;
      font-size: clamp(1.35rem, 4.5vw, 1.65rem);
      font-weight: 700;
      color: #0a2e00;
      margin: 0;
    }
  
    .mk-explore-more__title::before,
    .mk-explore-more__title::after {
      display: none;
    }
  
    .mk-explore-more .row {
      --bs-gutter-y: 0.75rem;
    }
  
    .mk-explore-more .promo-card {
      display: grid;
      grid-template-columns: 2.5rem minmax(0, 1fr) 4.25rem 2.25rem;
      grid-template-areas: 'icon content image go';
      align-items: center;
      gap: 0.5rem 0.65rem;
      min-height: 5.5rem;
      padding: 0.65rem 0.75rem;
      border-radius: 1rem;
      text-decoration: none;
      color: inherit;
      flex-direction: row;
      transform: none;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    }
  
    .mk-explore-more .promo-card:active {
      transform: scale(0.99);
    }
  
    .mk-explore-more .promo-card:hover {
      transform: none;
      box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
    }
  
    .mk-explore-more .promo-card__mobile-icon {
      grid-area: icon;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.35rem;
      line-height: 1;
    }
  
    .mk-explore-more .promo-card-catering .promo-card__mobile-icon {
      color: #ea580c;
    }
  
    .mk-explore-more .promo-card-combo .promo-card__mobile-icon {
      color: #facc15;
    }
  
    .mk-explore-more .promo-card-new .promo-card__mobile-icon {
      color: #fde047;
    }
  
    .mk-explore-more .promo-card__content {
      grid-area: content;
      min-width: 0;
    }
  
    .mk-explore-more .promo-card__head-row {
      display: block;
      margin-bottom: 0.15rem;
    }
  
    .mk-explore-more .promo-card__head-icon {
      display: none;
    }
  
    .mk-explore-more .promo-card__title {
      font-size: 0.9rem !important;
      line-height: 1.2;
      margin-bottom: 0.15rem !important;
    }
  
    .mk-explore-more .promo-card__sub {
      font-size: 0.6875rem;
      line-height: 1.3;
      margin-bottom: 0.15rem !important;
      opacity: 0.92;
    }
  
    .mk-explore-more .promo-card-catering .promo-card__sub,
    .mk-explore-more .promo-card-catering .promo-card__title {
      color: #1f2937;
    }
  
    .mk-explore-more .promo-card__highlight {
      font-size: 0.6875rem;
      margin-bottom: 0 !important;
    }
  
    .mk-explore-more .promo-image-wrap {
      grid-area: image;
      width: 4.25rem;
      height: 4.25rem;
      min-width: 4.25rem;
      max-width: 4.25rem;
      border-radius: 0.65rem;
      overflow: hidden;
      background: rgba(255, 255, 255, 0.25);
    }
  
    .mk-explore-more .promo-image {
      border-radius: 0.65rem;
    }
  
    .mk-explore-more .promo-card__go {
      grid-area: go;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 2rem;
      height: 2rem;
      border-radius: 50%;
      background: #fff;
      color: #1f2937;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
      flex-shrink: 0;
    }
  
    .mk-explore-more .promo-card__go i {
      font-size: 1rem;
      font-weight: 700;
    }
  
    .mk-explore-more .promo-card__mobile-cta {
      display: inline-block;
      font-size: 0.625rem;
      font-weight: 700;
      padding: 0.2rem 0.55rem;
      border-radius: 9999px;
      line-height: 1.3;
      margin-top: 0.15rem;
    }
  
    .mk-explore-more .promo-card__mobile-cta--combo {
      background: #facc15;
      color: #111827;
    }
  
    .mk-explore-more .promo-card__mobile-cta--new {
      background: #1e3a8a;
      color: #fff;
    }
  
    /* ---------- Mobile footer (accordion layout) ---------- */
    .footer-mk {
      padding: 1.75rem 0 0;
    }
  
    .footer-mk > .container,
    .footer-mk .footer-bottom > .container {
      padding-left: 1.35rem;
      padding-right: 1.35rem;
    }
  
    .footer-mk .mk-footer-brand-col {
      text-align: center;
      margin-bottom: 0.5rem !important;
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
  
    .footer-mk .mk-footer-brand-col .mk-footer-logo-link {
      width: 5.5rem;
      height: 5.5rem;
      margin-left: auto;
      margin-right: auto;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
  
    .footer-mk .mk-footer-brand-col .mk-footer-logo {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
    }
  
    .footer-mk .mk-footer-brand-col p {
      max-width: 22rem;
      margin-left: auto;
      margin-right: auto;
      padding-left: 0.75rem;
      padding-right: 0.75rem;
      line-height: 1.45;
      font-size: 0.78rem !important;
    }
  
    .mk-footer-mobile {
      padding-left: 0.5rem;
      padding-right: 0.5rem;
      margin-bottom: 0.25rem;
    }
  
    .footer-mk .mk-footer-col--desktop {
      display: none !important;
    }
  
    .mk-footer-accordion {
      display: flex;
      flex-direction: column;
      gap: 0;
      margin-bottom: 0.85rem;
    }
  
    .mk-footer-accordion__item {
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    }
  
    .mk-footer-accordion__toggle {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 0.75rem;
      padding: 0.85rem 0;
      border: 0;
      background: transparent;
      color: #fff;
      font-size: 0.88rem;
      font-weight: 600;
      text-align: left;
      cursor: pointer;
    }
  
    .mk-footer-accordion__toggle-left {
      display: inline-flex;
      align-items: center;
      gap: 0.55rem;
    }
  
    .mk-footer-accordion__toggle-left .bi:first-child {
      color: #7cb342;
      font-size: 1rem;
      width: 1.25rem;
      text-align: center;
    }
  
    .mk-footer-accordion__chevron {
      color: rgba(255, 255, 255, 0.45);
      font-size: 0.85rem;
      transition: transform 0.2s ease;
    }
  
    .mk-footer-accordion__item.is-open .mk-footer-accordion__chevron {
      transform: rotate(180deg);
    }
  
    .mk-footer-accordion__panel {
      padding: 0 0 0.85rem;
    }
  
    .mk-footer-accordion__links {
      display: flex;
      flex-wrap: nowrap;
      gap: 0.5rem;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      padding-bottom: 0.15rem;
    }
  
    .mk-footer-accordion__links::-webkit-scrollbar {
      display: none;
    }
  
    .mk-footer-mobile-link {
      flex: 0 0 auto;
      display: inline-flex !important;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 0.3rem;
      min-width: 4.25rem;
      max-width: 5.5rem;
      padding: 0.55rem 0.4rem !important;
      margin-bottom: 0 !important;
      border-radius: 0.65rem;
      background: rgba(255, 255, 255, 0.06);
      color: rgba(255, 255, 255, 0.82) !important;
      font-size: 0.62rem !important;
      font-weight: 600;
      text-align: center;
      line-height: 1.15;
      text-decoration: none !important;
      transition: background 0.2s ease, color 0.2s ease;
    }
  
    .mk-footer-mobile-link .bi {
      font-size: 1rem;
      color: #7cb342;
    }
  
    .mk-footer-mobile-link:active {
      background: rgba(255, 255, 255, 0.12);
    }
  
    .mk-footer-follow {
      margin-bottom: 0.85rem;
    }
  
    .mk-footer-follow__title {
      display: flex;
      align-items: center;
      gap: 0.45rem;
      font-size: 0.88rem;
      font-weight: 600;
      color: #fff;
      margin-bottom: 0.65rem;
    }
  
    .mk-footer-follow__title .bi-heart-fill {
      color: #7cb342;
      font-size: 0.95rem;
    }
  
    .mk-footer-follow .footer-social {
      gap: 0.65rem;
    }
  
    .mk-footer-follow .footer-social-link {
      width: 2.5rem;
      height: 2.5rem;
      border-radius: 0.55rem;
      font-size: 1rem;
    }
  
    .footer-mk .mk-footer-email {
      display: none !important;
    }
  
    .mk-footer-contact-bar {
      display: flex;
      align-items: center;
      gap: 0.65rem;
      width: 100%;
      padding: 0.75rem 0.85rem;
      margin-bottom: 0.65rem;
      border-radius: 0.75rem;
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.08);
      color: rgba(255, 255, 255, 0.88);
      text-decoration: none;
      font-size: 0.78rem;
      word-break: break-all;
    }
  
    .mk-footer-contact-bar .bi-envelope-fill {
      color: #7cb342;
      flex-shrink: 0;
      font-size: 1rem;
    }
  
    .mk-footer-contact-bar span {
      flex: 1;
      min-width: 0;
    }
  
    .mk-footer-contact-bar__chev {
      flex-shrink: 0;
      color: rgba(255, 255, 255, 0.4);
      font-size: 0.85rem;
    }
  
    .mk-footer-secure {
      display: flex;
      align-items: center;
      gap: 0.65rem;
      padding: 0.75rem 0.85rem;
      margin-bottom: 0.5rem;
      border-radius: 0.75rem;
      border: 1px solid rgba(124, 179, 66, 0.25);
      background: rgba(124, 179, 66, 0.08);
    }
  
    .mk-footer-secure > .bi-shield-check {
      color: #7cb342;
      font-size: 1.35rem;
      flex-shrink: 0;
    }
  
    .mk-footer-secure__text {
      display: flex;
      flex-direction: column;
      gap: 0.1rem;
    }
  
    .mk-footer-secure__text strong {
      font-size: 0.78rem;
      color: #fff;
      font-weight: 700;
    }
  
    .mk-footer-secure__text span {
      font-size: 0.68rem;
      color: rgba(255, 255, 255, 0.55);
    }
  
    .footer-mk .footer-bottom {
      margin-top: 0.75rem;
      padding: 1rem 0 calc(1rem + env(safe-area-inset-bottom, 0px));
    }
  
    .footer-mk .mk-footer-bottom-row {
      text-align: center;
    }
  
    .footer-mk .mk-footer-bottom-row .col-md-6 {
      text-align: center !important;
      margin-bottom: 0.35rem;
    }
  
    .footer-mk .mk-footer-bottom-row .col-md-6:last-child {
      margin-bottom: 0;
    }
  
    .footer-mk .mk-footer-legal-col {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 0.5rem;
      flex-wrap: wrap;
    }
  
    .footer-mk .mk-footer-legal-col a {
      display: inline !important;
      margin-bottom: 0 !important;
      font-size: 0.72rem !important;
    }
  
    .footer-mk .mk-footer-legal-col a + a::before {
      content: '|';
      margin-right: 0.5rem;
      color: rgba(255, 255, 255, 0.25);
    }
  
    .footer-mk .mk-dev-credit {
      display: block;
      margin-top: 0.35rem;
      font-size: 0.72rem;
      color: #d97706 !important;
      font-weight: 600;
    }
  
    body.mk-has-mobile-dock .footer-mk {
      padding-bottom: 0;
    }
  
    body.mk-has-mobile-dock .footer-mk .footer-bottom {
      padding-bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px));
    }
  
    /* Product detail popup — respect bottom nav clearance */
    body.mk-has-mobile-dock.mk-product-detail-open .mk-product-detail {
      --mk-product-detail-chrome-bottom: calc(6.5rem + env(safe-area-inset-bottom, 0px));
    }
  
    .mk-product-detail {
      padding:
        calc(var(--mk-product-detail-chrome-top, 4.5rem) + 0.5rem)
        0.85rem
        calc(var(--mk-product-detail-chrome-bottom, 6.5rem) + 0.85rem);
    }
  
    .mk-product-detail__sheet {
      width: min(100%, 17.5rem);
      border-radius: 1.1rem;
      max-height: calc(
        100dvh
        - var(--mk-product-detail-chrome-top, 4.5rem)
        - var(--mk-product-detail-chrome-bottom, 6.5rem)
        - 1.35rem
      );
    }
  
    .mk-product-detail__media {
      aspect-ratio: 4 / 3;
      border-radius: 1.1rem 1.1rem 0 0;
    }
  
    .mk-product-detail__media-badges {
      top: 0.55rem;
      left: 0.55rem;
    }
  
    .mk-product-detail__offer-wrap .special-ribbon {
      top: 12px;
      left: -38px;
      width: min(200px, 145%);
      font-size: 0.62rem;
    }
  
    .mk-product-detail__offer-wrap .offer-label-badge {
      top: 0.45rem;
      right: 2.85rem;
      font-size: 0.58rem;
      padding: 0.2rem 0.45rem;
    }
  
    .mk-product-detail__close {
      top: 0.55rem;
      right: 0.55rem;
      width: 2rem;
      height: 2rem;
      font-size: 0.9rem;
    }
  
    .mk-product-detail__body {
      padding: 0.75rem 0.85rem 0.9rem;
    }
  
    .mk-product-detail__title {
      font-size: 1.1rem;
    }
  
    .mk-product-detail__desc {
      font-size: 0.82rem;
      margin-bottom: 0.5rem;
    }
  
    .mk-product-detail__meta {
      gap: 0.3rem;
      margin-bottom: 0.5rem;
    }
  
    .mk-product-detail__meta .mk-home-card__delivery {
      font-size: 0.8rem;
    }
  
    .mk-product-detail__slot {
      margin-bottom: 0.5rem;
    }
  
    .mk-product-detail__slot .mk-home-card__slot-chip {
      padding: 0.28rem 0.7rem;
      font-size: 0.76rem;
      background: #fff;
      color: var(--foreground, #1a2e12);
      border: 1px solid var(--border, rgba(10, 46, 0, 0.14));
    }
  
    .mk-product-detail__slot .mk-home-card__slot-input:checked + .mk-home-card__slot-chip,
    .mk-product-detail__slot .mk-home-card__slot-option input:checked + .mk-home-card__slot-chip {
      background: var(--mk-green, #3d5229);
      border-color: var(--mk-green, #3d5229);
      color: #fff;
    }
  
    .mk-product-detail__countdown {
      margin-bottom: 0.5rem;
      font-size: 0.8rem;
    }
  
    .mk-product-detail__price-row {
      margin-bottom: 0.65rem;
    }
  
    .mk-product-detail__price-row .text-primary-mk,
    .mk-product-detail__price-row .price-current,
    .mk-product-detail__price-row .price-single {
      font-size: 1.1rem;
    }
  
    .mk-product-detail__actions {
      gap: 0.55rem;
    }
  
    .mk-product-detail__qty {
      min-width: 5.75rem;
      height: 2.1rem;
    }
  
    .mk-product-detail__add {
      min-height: 2.5rem;
      font-size: 0.9rem;
    }
  
    .mk-home-menu-hub .mk-menu-empty--unavailable {
      display: grid;
      grid-template-columns: 3.25rem 1fr;
      align-items: center;
      gap: 0.85rem;
      width: 100%;
      max-width: none;
      margin: 0;
      padding: 1rem 1rem 1.05rem;
      text-align: left;
      border-radius: 1rem;
      background: #fff;
      border: 1px dashed rgba(61, 82, 41, 0.22);
      box-shadow: none;
    }
  
    .mk-home-menu-hub .mk-menu-empty--unavailable .mk-menu-empty__copy {
      display: block;
      min-width: 0;
    }
  
    .mk-home-menu-hub .mk-menu-empty--unavailable .mk-menu-empty__visual {
      width: 3.25rem;
      height: 3.25rem;
      margin-bottom: 0;
    }
  
    .mk-home-menu-hub .mk-menu-empty--unavailable .mk-menu-empty__ring {
      animation: none;
      background: rgba(61, 82, 41, 0.08);
    }
  
    .mk-home-menu-hub .mk-menu-empty--unavailable .mk-menu-empty__icon {
      font-size: 1.35rem;
    }
  
    .mk-home-menu-hub .mk-menu-empty--unavailable .mk-menu-empty__title {
      margin: 0 0 0.25rem;
      font-size: 1rem;
      line-height: 1.25;
      font-family: Georgia, "Times New Roman", serif;
    }
  
    .mk-home-menu-hub .mk-menu-empty--unavailable .mk-menu-empty__text {
      font-size: 0.8rem;
      line-height: 1.45;
      max-width: none;
      color: rgba(26, 46, 18, 0.68);
    }
  
    .mk-menu-empty--plain {
      margin-left: 0.35rem;
      margin-right: 0.35rem;
      padding: 1.25rem 1rem;
      border-radius: 0.85rem;
      background: rgba(255, 255, 255, 0.9);
      border: 1px dashed rgba(61, 82, 41, 0.18);
      text-align: center;
    }
  
    .mk-menu-empty--plain .mk-menu-empty__text {
      font-size: 0.84rem;
    }
  }
  
  @media (min-width: 992px) {
    .mk-footer-mobile {
      display: none !important;
    }
  
    .footer-mk .mk-footer-col--desktop {
      display: block !important;
    }
  }
  
  /* Fine-tune breakpoints */
  @media (max-width: 359.98px) {
    .mk-feature-card__label {
      font-size: 0.5625rem;
    }
  
    .mk-day-scroll__btn {
      min-width: 4rem;
      padding: 0.4rem 0.5rem;
    }
  }
  
  @media (prefers-reduced-motion: reduce) {
    .mk-animate-in,
    .mk-home-card__image,
    .mk-home-card .card-img-top {
      animation: none !important;
      transition: none !important;
    }
  }
  