/* ============================================================
   MealPrep.nz — shared page surface and matte-card palette
   28/08/2026

   One warm stone canvas across the six primary storefront pages.
   Dark cards remain deliberate, but use one matte charcoal instead
   of near-black. This file is loaded after every page/section sheet.
   ============================================================ */

:root {
  --mp-uniform-stone: #C9C9C4;
  --mp-uniform-stone-top: #D3D3CE;
  --mp-uniform-stone-bottom: #C1C1BC;
  --mp-uniform-ink: #11130E;
  --mp-uniform-matte: #3B3C34;
  --mp-uniform-matte-hi: #41423A;
  --mp-uniform-matte-lo: #383931;
  --mp-uniform-on-matte: #F4F4EE;
}

html body[data-mp-editorial-family],
html body[data-mp-plan-family],
html body[data-mp-hero-family],
html body[data-mp-template="index"],
html body[data-mp-template="page.lunch-dinner-selection"],
html body:has(#MainContent:is(
  [data-template="index"],
  [data-template="page.lunch-dinner-selection"],
  [data-template="page.meal-plan"],
  [data-template="page.supplement-page"],
  [data-template="page.about"],
  [data-template="page.faq"]
)) {
  background-color: var(--mp-uniform-stone) !important;
  background-image: linear-gradient(
    158deg,
    var(--mp-uniform-stone-top),
    var(--mp-uniform-stone) 46%,
    var(--mp-uniform-stone-bottom)
  ) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-blend-mode: normal !important;
}

#MainContent:is(
  [data-template="index"],
  [data-template="page.lunch-dinner-selection"],
  [data-template="page.meal-plan"],
  [data-template="page.supplement-page"],
  [data-template="page.about"],
  [data-template="page.faq"]
) {
  color: var(--mp-uniform-ink);
  background-color: var(--mp-uniform-stone) !important;
  background-image: linear-gradient(
    158deg,
    var(--mp-uniform-stone-top),
    var(--mp-uniform-stone) 46%,
    var(--mp-uniform-stone-bottom)
  ) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-blend-mode: normal !important;
}

/* The Home, Menu and Meal Plan heroes were using an opaque grain
   layer. Although their declared base was #C9C9C4, the grain painted
   them dark grey. Keep the shared stone gradient and remove that layer. */
#MainContent[data-template="index"] .mp.mp-hero,
#MainContent[data-template="page.lunch-dinner-selection"] .mp.mp-hero {
  background-color: var(--mp-uniform-stone) !important;
  background-image: linear-gradient(
    158deg,
    var(--mp-uniform-stone-top),
    var(--mp-uniform-stone) 46%,
    var(--mp-uniform-stone-bottom)
  ) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-blend-mode: normal !important;
}

/* These full-page wrappers already intended to use the same palette.
   State it here so a page can never fall back to the theme's black body. */
#MainContent[data-template="page.supplement-page"] [class*="mc-wrapper-"],
#MainContent[data-template="page.about"] [class*="au-wrap-"],
#MainContent[data-template="page.faq"] .mpb {
  background-color: var(--mp-uniform-stone) !important;
  background-image: linear-gradient(
    158deg,
    var(--mp-uniform-stone-top),
    var(--mp-uniform-stone) 46%,
    var(--mp-uniform-stone-bottom)
  ) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-blend-mode: normal !important;
}

/* Shared matte recipe for cards, plan panels and dark conversion bands. */
#MainContent :is(
  .mp-tile:not(.is-active):not(.is-selected):not([aria-pressed="true"]),
  .mp-step,
  .mp-meal,
  .mp-sizer__panel,
  .mp-sets .mp-card,
  .mp-revs .mp-card,
  .mp-proof-story,
  .mp-google-review,
  .mp-rung--hi,
  .mp-pm__card,
  .mp-plan-intro__note,
  #mealplan-builder,
  .mp-panel--sky:has(.mp-acc),
  .mp-transform-proof,
  .mp.mp-closer
) {
  color: var(--mp-uniform-on-matte) !important;
  background-color: var(--mp-uniform-matte) !important;
  background-image: linear-gradient(
    145deg,
    var(--mp-uniform-matte-hi),
    var(--mp-uniform-matte-lo)
  ) !important;
  background-blend-mode: normal !important;
  border-color: rgba(255, 255, 255, .16) !important;
}

#MainContent[data-template="page.acc"] .mp-revs .mp-rev :is(.mp-rev__text, .mp-rev__who b),
#MainContent[data-template="article"] .mp-revs .mp-card.mp-rev :is(.mp-rev__text, .mp-rev__who b) {
  color: #F4F4EE !important;
  text-shadow: none !important;
}

#MainContent[data-template="page.acc"] .mp-revs .mp-rev :is(.mp-rev__who i, .mp-rev__when),
#MainContent[data-template="article"] .mp-revs .mp-card.mp-rev :is(.mp-rev__who i, .mp-rev__when) {
  color: #D6D6CC !important;
  text-shadow: none !important;
}

#MainContent[data-template="page.acc"] .mp-revs .mp-rev .mp-rev__more,
#MainContent[data-template="article"] .mp-revs .mp-card.mp-rev .mp-rev__more {
  color: #C0C63C !important;
  text-shadow: none !important;
}

/* Hero labels and fixed image captions: charcoal, never translucent black. */
#MainContent :is(
  .mp-eyebrow,
  .mp-plan-intro__eyebrow,
  .mc-hero-eyebrow,
  .au-kicker,
  .au-section-kicker,
  .mpb__kicker
) {
  color: var(--mp-uniform-on-matte) !important;
  background-color: var(--mp-uniform-matte) !important;
  background-image: linear-gradient(
    145deg,
    var(--mp-uniform-matte-hi),
    var(--mp-uniform-matte-lo)
  ) !important;
  background-blend-mode: normal !important;
}

#MainContent :is(
  .mp-float,
  .mc-hero-badge,
  .mpb__hero-media figcaption,
  .mpb__image-card figcaption,
  .mp-proof-story__photo-label
) {
  color: var(--mp-uniform-on-matte) !important;
  background: rgba(59, 60, 52, .94) !important;
  border-color: rgba(255, 255, 255, .18) !important;
  backdrop-filter: blur(8px);
}

/* Supplements: navigation, product cards and utility controls. */
#MainContent[data-template="page.supplement-page"] :is(
  .mc-category-nav,
  .mc-sticky-filters,
  .mc__grid .card,
  .mc-cart,
  .mc-popup-content
) {
  color: var(--mp-uniform-on-matte) !important;
  background-color: var(--mp-uniform-matte) !important;
  background-image: linear-gradient(
    145deg,
    var(--mp-uniform-matte-hi),
    var(--mp-uniform-matte-lo)
  ) !important;
  background-blend-mode: normal !important;
  border-color: rgba(255, 255, 255, .16) !important;
}

/* About: keep the editorial dark boxes, but lift them out of black. */
#MainContent[data-template="page.about"] :is(
  .au-story,
  .au-form-card,
  .au-contact,
  .au-cta-banner
) {
  color: var(--mp-uniform-on-matte) !important;
  background-color: var(--mp-uniform-matte) !important;
  background-image: linear-gradient(
    145deg,
    var(--mp-uniform-matte-hi),
    var(--mp-uniform-matte-lo)
  ) !important;
  background-blend-mode: normal !important;
  border-color: rgba(255, 255, 255, .16) !important;
}

/* FAQ/help centre: preserve the alternating chapters, but make every
   dark chapter and information card the same matte charcoal. */
#MainContent[data-template="page.faq"] :is(
  .mpb__chapter--dark,
  .mpb__chapter--reviews,
  .mpb__chapter--local,
  .mpb__audit-card,
  .mpb__review-card,
  .mpb__timeline,
  .mpb__goal-cards article,
  .mpb__local-cards article,
  .mpb__faq-category,
  .mpb__closer,
  .mpb__nav,
  .mpb__button--dark
) {
  color: var(--mp-uniform-on-matte) !important;
  background-color: var(--mp-uniform-matte) !important;
  background-image: linear-gradient(
    145deg,
    var(--mp-uniform-matte-hi),
    var(--mp-uniform-matte-lo)
  ) !important;
  background-blend-mode: normal !important;
  border-color: rgba(255, 255, 255, .16) !important;
}

/* Protect readable type inside the lifted dark surfaces. */
#MainContent :is(
  .mp-tile,
  .mp-step,
  .mp-meal,
  .mp-sizer__panel,
  .mp-sets .mp-card,
  .mp-proof-story,
  .mp-google-review,
  .mp-plan-intro__note,
  #mealplan-builder,
  .mc__grid .card,
  .au-story,
  .au-form-card,
  .au-contact,
  .au-cta-banner,
  .mpb__chapter--dark,
  .mpb__chapter--reviews,
  .mpb__chapter--local,
  .mpb__faq-category,
  .mpb__closer
) :is(h2, h3, h4, strong, summary) {
  color: #FFFFFF !important;
}

#MainContent :is(
  .mp-tile,
  .mp-step,
  .mp-meal,
  .mp-sizer__panel,
  .mp-sets .mp-card,
  .mp-proof-story,
  .mp-google-review,
  .mp-plan-intro__note,
  #mealplan-builder,
  .mc__grid .card,
  .au-story,
  .au-form-card,
  .au-contact,
  .au-cta-banner,
  .mpb__chapter--dark,
  .mpb__chapter--reviews,
  .mpb__chapter--local,
  .mpb__faq-category,
  .mpb__closer
) :is(p, li, small) {
  color: rgba(244, 244, 238, .82) !important;
}

/* FAQ desktop: keep hero actions and proof statistics from overlapping. */
@media (min-width: 900px) {
  #MainContent[data-template="page.faq"] .mpb__micro {
    display: none !important;
  }

}

/* Supplements: lift the persistent order bar from black to the shared matte charcoal. */
#MainContent[data-template="page.supplement-page"] .mc-runbox {
  background: linear-gradient(145deg, var(--mp-uniform-matte-hi), var(--mp-uniform-matte-lo)) !important;
  border-top-color: rgba(255, 255, 255, 0.14) !important;
}

/* Meal Plan goal-template family.
   Every dedicated goal page keeps its own Shopify template and inherits
   the same stone canvas, hero and matte-card system automatically. */
html body:has(#MainContent[data-template^="page.meal-plan-"]),
#MainContent[data-template^="page.meal-plan-"] {
  background-color: var(--mp-uniform-stone) !important;
  background-image: linear-gradient(
    158deg,
    var(--mp-uniform-stone-top),
    var(--mp-uniform-stone) 46%,
    var(--mp-uniform-stone-bottom)
  ) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
  background-blend-mode: normal !important;
}

#MainContent[data-template^="page.meal-plan-"] {
  color: var(--mp-uniform-ink);
}

/* 28/08/2026 — mobile heroes retain the desktop split-image composition.
   Reference: copy and actions on the left, photograph on the right behind
   one continuous stone fade, with the proof row immediately below. */
@media (max-width: 749px) {
  /* Shared Home, Menu and goal-page hero system. */
  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero {
    position: relative !important;
    min-height: 0 !important;
    padding: 84px 16px 26px !important;
    overflow: hidden !important;
    isolation: isolate !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero > .mp-wrap {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero .mp-hero__grid {
    position: relative !important;
    display: block !important;
    grid-template: none !important;
    min-height: 520px !important;
    isolation: isolate !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero .mp-hero__grid > div:first-child {
    position: relative !important;
    z-index: 3 !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    background: transparent !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-h-xl {
    width: 92% !important;
    max-width: 92% !important;
    margin: 14px 0 0 !important;
    font-size: clamp(34px, 10vw, 42px) !important;
    line-height: .98 !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-lede {
    width: 56% !important;
    max-width: 56% !important;
    margin: 18px 0 0 !important;
    font-size: 15.5px !important;
    line-height: 1.42 !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-hero__cta {
    position: relative !important;
    z-index: 3 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 52% !important;
    margin: 15px 0 0 !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-hero__cta .mp-btn {
    width: 100% !important;
    min-height: 44px !important;
    padding-inline: 10px !important;
    font-size: 13px !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-afterpay {
    width: 58% !important;
    max-width: 58% !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: rgba(17, 19, 14, .78) !important;
    font-size: 10.5px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    backdrop-filter: none !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero .mp-hero__art {
    position: absolute !important;
    z-index: 1 !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--mp-uniform-stone) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    -webkit-mask: none !important;
    mask: none !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero .mp-hero__art::after {
    content: "" !important;
    position: absolute !important;
    z-index: 2 !important;
    inset: 0 !important;
    display: block !important;
    pointer-events: none !important;
    background:
      linear-gradient(
        90deg,
        rgba(211, 211, 206, .98) 0%,
        rgba(211, 211, 206, .96) 34%,
        rgba(205, 205, 200, .78) 50%,
        rgba(201, 201, 196, .28) 72%,
        rgba(201, 201, 196, .05) 100%
      ),
      linear-gradient(
        180deg,
        rgba(211, 211, 206, .08) 0%,
        rgba(201, 201, 196, .02) 72%,
        rgba(17, 19, 14, .10) 100%
      ) !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero .mp-hero__slide,
  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero .mp-frame {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    min-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"],[data-template^="page.meal-plan-"])
  .mp.mp-hero .mp-hero__slide .mp-frame img.mp-img {
    width: 100% !important;
    min-width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    object-fit: cover !important;
    object-position: 66% 50% !important;
    opacity: 1 !important;
    filter: saturate(.90) contrast(.96) brightness(1.04) !important;
  }

  /* The goal copy is longer, but remains on the same left-to-right canvas. */

  /* Main Meal Plan. */

  html body:has(#MainContent[data-template="page.meal-plan"])
  #MainContent[data-template="page.meal-plan"] .mp-plan-intro__note {
    z-index: 3 !important;
    top: auto !important;
    right: 12px !important;
    bottom: 16px !important;
    left: auto !important;
    min-height: 0 !important;
    padding: 14px !important;
    border-radius: 14px !important;
  }

  /* Supplements. */

  html body:has(#MainContent[data-template="page.supplement-page"])
  #MainContent[data-template="page.supplement-page"] .mc-hero-badge {
    z-index: 3 !important;
    top: auto !important;
    right: 10px !important;
    bottom: 12px !important;
    left: auto !important;
    width: 54% !important;
    max-width: 54% !important;
  }

  /* About. */

  /* FAQ. */

}

/* Ensure the reference fades and floating proof labels sit above legacy
   mobile rules that hid generated overlays. */
@media (max-width: 749px) {

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-float {
    position: absolute !important;
    z-index: 4 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #F4F4EE !important;
  }
}

/* Final reference polish: one active hero proof label, non-overlapping
   Meal Plan callouts, a full-height Supplements photograph, and compact stats. */
@media (max-width: 749px) {
  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-hero__slide:not([data-active]) .mp-float {
    display: none !important;
  }

  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-hero__slide[data-active] .mp-float {
    position: absolute !important;
    z-index: 4 !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #F4F4EE !important;
  }

  html body:has(#MainContent[data-template="page.meal-plan"])
  #MainContent[data-template="page.meal-plan"] .mp-plan-intro__note {
    width: 46% !important;
    max-width: 46% !important;
  }

}

/* Final visual match to the supplied mobile reference. */
@media (max-width: 749px) {
  html body:has(#MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"]))
  #MainContent:is([data-template="index"],[data-template="page.lunch-dinner-selection"])
  .mp.mp-hero .mp-float--b {
    display: none !important;
  }

}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] {
  --mp-plan-fade-inline:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.08) 18%,rgba(0,0,0,.55) 38%,#000 60%,#000 calc(100% - 24px),transparent 100%);
  --mp-plan-fade-block:linear-gradient(180deg,transparent 0%,#000 24px,#000 70%,transparent 100%);
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-plan-intro__note {
  box-shadow:none!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] > .shopify-section > .mp.mp-sec:not(.mp-hero):not(.mp-closer) {
  padding-block:48px 24px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] > .shopify-section > .mp.mp-closer {
  padding-block:64px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-tile,.mp-step,.mp-meal,.mp-set,.mp-transform-proof,.mp-proof-story,.mp-google-review,#mealplan-builder) {
  background-size:100% 100%!important;
  background-repeat:no-repeat!important;
  background-blend-mode:normal!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-set__body,.mp-set__price) {
  background:transparent!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-set__body h3,.mp-meal__title,.mp-proof-story__unit,.mp-proof-story__customer,.mp-transform-proof .mp-h-lg) {
  color:#f4f4ee!important;
  text-shadow:none!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-set__desc p,.mp-set__price s,.mp-meal__blurb,.mp-proof-story__time,.mp-google-review cite,.mp-transform-proof__intro,.mp-transform-proof__disclaimer) {
  color:#d6d6cc!important;
  opacity:1!important;
  text-shadow:none!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-set__for,.mp-set__price b,.mp-meal__price,.mp-proof-story__number,.mp-google-review__stars,.mp-google-proof__source) {
  color:var(--mp-brand-text-light,#cfd46b)!important;
  text-shadow:none!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-set__price em {
  flex-basis:100%;
  margin:0!important;
  color:#f4f4ee!important;
  font-size:14px!important;
  line-height:1.4!important;
  font-style:normal!important;
  opacity:1!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-proof-story,.mp-google-review) {
  border-color:rgba(244,244,238,.23)!important;
  box-shadow:none!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-proof-story blockquote,.mp-google-review blockquote) {
  color:#f4f4ee!important;
  line-height:1.6!important;
}

#MainContent:is([data-template="page.acc"], [data-template="article"]) #menu[data-mp-menu-preview] .mp-meal__media,
html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-meal__media {
  position:relative!important;
}

#MainContent:is([data-template="page.acc"], [data-template="article"]) #menu[data-mp-menu-preview] .mp-meal__media > .mp-meal__top,
html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-meal__media > .mp-meal__top {
  position:absolute!important;
  inset:10px 10px auto!important;
  z-index:2;
  display:flex!important;
  flex-wrap:wrap;
  gap:6px!important;
  width:auto!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  pointer-events:none;
}

#MainContent:is([data-template="page.acc"], [data-template="article"]) #menu[data-mp-menu-preview] .mp-meal__media .mp-tag--diet,
html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-meal__media .mp-tag--diet {
  color:#1a1c0f!important;
  background:var(--mp-brand-green,#c0c63c)!important;
  font-size:10px!important;
  line-height:1.3!important;
  white-space:normal!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] #faq,
html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] [id$="__mp_guarantee"] > .mp {
  background:transparent!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-guar__item,.mp-faq__item,.mp-goal-faq__item) {
  color:#f4f4ee!important;
  background:#3b3c34!important;
  border:1px solid rgba(244,244,238,.2)!important;
  border-radius:18px!important;
  box-shadow:0 6px 16px rgba(17,19,14,.08)!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-guar__item summary,.mp-guar__t,.mp-faq__question,.mp-goal-faq__question) {
  color:#f4f4ee!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-guar__item p,.mp-faq__answer p,.mp-goal-faq__answer) {
  color:#d6d6cc!important;
  line-height:1.6!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-guar__item a,.mp-faq__answer a,.mp-goal-faq__answer a) {
  color:var(--mp-brand-text-light,#cfd46b)!important;
  text-decoration:underline;
  text-underline-offset:3px;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-faq--rail,.mp-goal-faq__list) {
  padding-left:0!important;
  border:0!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-goal-faq__list {
  display:grid;
  gap:12px;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-faq--rail::before,
html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-faq__dot {
  display:none!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-faq__question,.mp-goal-faq__question) {
  padding:20px 24px!important;
  min-height:68px!important;
  gap:16px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-faq__answer,.mp-goal-faq__answer) {
  padding:0 56px 24px 24px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-plan-inline__intro {
  margin-bottom:24px!important;
}

@media (min-width:750px) {

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-set__desc p {
  display:block!important;
  max-height:none!important;
}

}

@media (max-width:749px) {

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] {
  --mp-plan-fade-inline:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.03) 34%,rgba(0,0,0,.12) 70%,#000 88%,#000 calc(100% - 16px),transparent 100%);
  --mp-plan-fade-block:linear-gradient(180deg,transparent 0%,#000 28px,#000 calc(100% - 72px),transparent 100%);
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-plan-intro__note strong {
  font-size:18px!important;
  line-height:1.25!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] > .shopify-section > .mp.mp-sec:not(.mp-hero):not(.mp-closer) {
  padding-block:24px 16px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] > .shopify-section > .mp.mp-closer {
  padding-block:40px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-step h3 {
  font-size:13px!important;
  line-height:1.25!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-step__short {
  font-size:11px!important;
  line-height:1.3!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-set__body h3 {
  font-size:19px!important;
  line-height:1.2!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-set__desc p {
  font-size:14px!important;
  line-height:1.5!important;
  max-height:none!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] .mp-set__price b {
  font-size:24px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-faq__question,.mp-goal-faq__question) {
  padding:18px!important;
}

html body[data-mp-plan-family]:has(#MainContent) #MainContent[data-template] :is(.mp-faq__answer,.mp-goal-faq__answer) {
  padding:0 18px 20px!important;
}

}

html body[data-mp-hero-family]:has(#MainContent.content-for-layout[data-template]) #MainContent.content-for-layout[data-template] {
  --mp-hero-copy-width: 900px;
  --mp-hero-title-size: clamp(56px, 6.4vw, 96px);
  --mp-hero-title-line: .94;
  --mp-hero-title-spacing: -.04em;
  --mp-hero-gutter: 26px;
  --mp-hero-top: 150px;
  --mp-hero-fade-inline: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.08) 18%, rgba(0,0,0,.55) 38%, #000 60%, #000 calc(100% - 24px), transparent 100%);
  --mp-hero-fade-block: linear-gradient(180deg, transparent 0%, #000 24px, #000 70%, transparent 100%);
  background: transparent !important;

  & :is(.mp.mp-hero, .mp-plan-intro, .mc-hero, .mpb__hero) {
    position: relative !important;
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    padding: var(--mp-hero-top) 0 4px !important;
    background: transparent !important;
    overflow: hidden !important;
    isolation: isolate;
  }
  & [class^="au-hero-"]:has(> .au-hero-shell) {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: hidden !important;
    isolation: isolate;
  }
  & :is(.mp.mp-hero > .mp-wrap, .mp-plan-intro__shell, .mpb__hero-grid, .au-hero-shell) {
    position: var(--mp-hero-shell-position, static) !important;
    display: block !important;
    width: 100% !important;
    max-width: 1320px !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: var(--mp-hero-shell-padding, 0 var(--mp-hero-gutter)) !important;
    gap: 0 !important;
  }
  & .au-hero-shell { --mp-hero-shell-padding: var(--mp-hero-top) var(--mp-hero-gutter) 4px; }
  & :is(.mp-hero__grid, .mp-plan-intro__hero) {
    position: static !important;
    display: block !important;
    grid-template: none !important;
    min-height: 0 !important;
    gap: 0 !important;
  }
  & :is(.mp-hero__grid > div:first-child, .mp-plan-intro__copy, .mc-hero-content, .au-hero-inner, .mpb__hero-copy) {
    position: relative !important;
    z-index: 3 !important;
    display: block !important;
    inset: auto !important;
    width: min(var(--mp-hero-copy-width), 100%) !important;
    max-width: var(--mp-hero-copy-width) !important;
    padding: 0 !important;
    margin: var(--mp-hero-copy-margin, 0) !important;
    text-align: left !important;
    transform: none !important;
    animation: none !important;
    opacity: 1 !important;
    text-shadow: none !important;
  }
  & .mc-hero-content {
    --mp-hero-copy-width: min(900px, calc(100% - 52px));
    --mp-hero-copy-margin: 0 0 0 max(26px, calc((100% - 1320px) / 2 + 26px));
  }
  & :is(.mp-hero .mp-h-xl, .mp-plan-intro h1, .mc-hero-title, .au-hero-title, .mpb__hero h1) {
    --mp-brand-text-dark: #11130e;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 24px !important;
    font-family: var(--font-accent--family, "Bricolage Grotesque", sans-serif) !important;
    font-size: var(--mp-hero-title-size) !important;
    font-weight: 800 !important;
    line-height: var(--mp-hero-title-line) !important;
    letter-spacing: var(--mp-hero-title-spacing) !important;
    color: #11130e !important;
    text-transform: none !important;
    text-wrap: balance !important;
    white-space: normal !important;
    text-shadow: none !important;
  }
  & :is(.mp-hero h1, .mp-plan-intro h1, .mc-hero-title, .au-hero-title, .mpb__hero h1) :is(.mp-swash, em, .au-hero-brandline) {
    color: inherit !important;
    background: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
    font-style: normal !important;
    white-space: normal !important;
  }
  & :is(.mp-hero h1, .mp-plan-intro h1, .mc-hero-title, .au-hero-title, .mpb__hero h1) :is(.mp-swash, em)::after {
    content: none !important;
  }
  & :is(.mp-hero .mp-eyebrow, .mp-plan-intro__eyebrow, .mc-hero-eyebrow, .au-hero-inner .au-kicker, .mpb__hero .mpb__kicker) {
    position: relative !important;
    display: inline-flex !important;
    width: fit-content !important;
    max-width: 100% !important;
    padding: 9px 18px 9px 28px !important;
    margin: 0 0 22px !important;
    font: 800 12px/1.65 var(--font-body--family, Inter, sans-serif) !important;
    letter-spacing: .18em !important;
    white-space: normal !important;
  }
  & :is(.mc-hero-eyebrow, .au-hero-inner .au-kicker, .mpb__hero .mpb__kicker) {
    background: var(--mp-uniform-matte) linear-gradient(145deg, var(--mp-uniform-matte-hi), var(--mp-uniform-matte-lo)) !important;
    align-items: center !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 4px !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    text-transform: uppercase !important;
    text-shadow: 0 -1px 0 rgba(0,0,0,.55) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.24), inset 0 -1px 0 rgba(0,0,0,.5), 0 2px 0 rgba(0,0,0,.42), 0 12px 24px -10px rgba(0,0,0,.6) !important;
  }
  & :is(.mc-hero-eyebrow, .au-hero-inner .au-kicker, .mpb__hero .mpb__kicker)::before {
    content: "" !important;
    position: absolute !important;
    display: block !important;
    inset: 50% auto auto 11px !important;
    width: 8px !important;
    height: 8px !important;
    margin: -4px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #c0c63c !important;
    box-shadow: none !important;
    transform: none !important;
  }
  & :is(.mp-hero .mp-lede, .mp-plan-intro__body, .mc-hero-lede, .au-hero-sub, .mpb__hero .mpb__lede) {
    width: 100% !important;
    max-width: 589px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #11130e !important;
    font-size: 21px !important;
    font-weight: 500 !important;
    line-height: 1.55 !important;
    text-shadow: none !important;
  }
  & :is(.mp-hero__cta, .mp-plan-intro__actions, .mc-hero-actions, .au-hero-actions, .mpb__hero-actions) {
    position: relative !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 13px !important;
    width: auto !important;
    margin: 36px 0 20px !important;
  }
  & :is(.mp-hero__cta, .mp-plan-intro__actions, .mc-hero-actions, .au-hero-actions, .mpb__hero-actions) > :is(a, button) {
    width: auto !important;
    min-width: 0 !important;
    min-height: 52px !important;
    height: auto !important;
    padding: 12px 20px !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
    text-align: center !important;
    white-space: normal !important;
  }
  & :is(.mp-hero .mp-micro, .mp-plan-intro__trust, .au-hero-reassurance, .mpb__hero .mpb__micro) {
    position: relative !important;
    color: #41433c !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
  }
  &[data-template="page.acc"] .mp.mp-hero .mp-afterpay {
    color: #11130e !important;
  }
  & .mp.mp-hero > .mp-wrap > .mp-afterpay {
    position: relative !important;
    z-index: 3 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 14px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    backdrop-filter: none !important;
    color: #11130e !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    text-align: left !important;
  }
  & :is(.mp-hero__art, .mp-plan-intro__visual, .mc-hero-bg, .au-hero-art, .mpb__hero-media) {
    position: absolute !important;
    z-index: 1 !important;
    inset: 0 0 0 auto !important;
    display: block !important;
    width: 52.5% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    overflow: hidden !important;
    -webkit-mask: none !important;
    mask: none !important;
  }
  & :is(.mp-hero__art, .mp-plan-intro__visual, .mc-hero-bg, .au-hero-art, .mpb__hero-media, .mp-frame)::before,
  & :is(.mp-hero__art, .mp-plan-intro__visual, .mc-hero-bg, .au-hero-art, .mpb__hero-media, .mp-frame)::after {
    content: none !important;
    display: none !important;
    background: none !important;
  }
  & :is(.mp-hero__art .mp-frame, .mp-plan-intro__visual > img, .mc-hero-bg > img, .au-hero-image, .mpb__hero-slide > img) {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    aspect-ratio: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    opacity: 1 !important;
    object-fit: cover !important;
    -webkit-mask-image: var(--mp-hero-fade-inline), var(--mp-hero-fade-block) !important;
    mask-image: var(--mp-hero-fade-inline), var(--mp-hero-fade-block) !important;
    -webkit-mask-size: 100% 100% !important;
    mask-size: 100% 100% !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    -webkit-mask-composite: source-in !important;
    mask-composite: intersect !important;
  }
  & .mpb__hero-slide > img { transform: none !important; transition: none !important; }
  & .mp-hero__art .mp-frame > img.mp-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  & .mp-hero__art > .mp-hero__slide {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  & .mp-hero__art > .mp-hero__slide[data-active] {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
  & .mp-plan-intro__note {
    color: #f4f4ee !important;
    background: #3b3c34 !important;
    border: 1px solid rgba(244,244,238,.2) !important;
    box-shadow: none !important;
  }
  & :is(.mp.mp-hero .mp-float, .mpb__hero-slide figcaption) { box-shadow: none !important; }
  & > .shopify-section:has(> .mp > .mp-wrap > .mp-proof) > .mp,
  & .mpb__proof-strip {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }
  & > .shopify-section:has(> .mp > .mp-wrap > .mp-proof) > .mp > .mp-wrap {
    width: 100% !important;
    max-width: 1320px !important;
    padding-inline: var(--mp-hero-gutter) !important;
  }
  & :is(.mc-supplement-trust, [class^="au-stats-"], .mpb__proof-row) {
    width: calc(100% - var(--mp-hero-gutter) * 2) !important;
    max-width: 1268px !important;
    margin: 0 auto !important;
  }
  & :is(.mp.mp-sec > .mp-wrap > .mp-proof, .mc-supplement-trust, [class^="au-stats-"], .mpb__proof-row) {
    display: grid !important;
    grid-template-columns: repeat(4,minmax(0,1fr)) !important;
    grid-template-rows: auto !important;
    grid-auto-flow: row !important;
    gap: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  & :is(.mp.mp-sec > .mp-wrap > .mp-proof > li, .mc-supplement-trust__item, .au-stat, .mpb__proof-row > div) {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    grid-row: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 4px 28px 0 !important;
    color: #11130e !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: left !important;
  }
  & :is(.mp.mp-sec > .mp-wrap > .mp-proof > li, .mc-supplement-trust__item, .au-stat, .mpb__proof-row > div):not(:first-child) { border-left: 1px solid rgba(21,22,18,.18) !important; }
  & :is(.mp.mp-sec > .mp-wrap > .mp-proof > li, .mc-supplement-trust__item, .au-stat, .mpb__proof-row > div)::before {
    content: "" !important;
    position: static !important;
    display: block !important;
    flex: none !important;
    width: 38px !important;
    height: 2px !important;
    margin: 0 0 12px !important;
    background: #a7ad22 !important;
    border: 0 !important;
    border-radius: 999px !important;
    transform: none !important;
    box-shadow: none !important;
  }
  & :is(.mp.mp-sec > .mp-wrap > .mp-proof b, .mc-supplement-trust__item strong, .au-stat-num, .mpb__proof-row strong) {
    display: block !important;
    margin: 0 !important;
    color: #151612 !important;
    font-family: var(--font-accent--family, "Bricolage Grotesque", sans-serif) !important;
    font-size: clamp(30px, 3vw, 50px) !important;
    font-weight: 900 !important;
    line-height: .96 !important;
    letter-spacing: -.045em !important;
    text-shadow: none !important;
    white-space: nowrap !important;
  }
  & :is(.mp.mp-sec > .mp-wrap > .mp-proof li > span, .mc-supplement-trust__item > span, .au-stat-lab, .mpb__proof-row div > span) {
    margin: 10px 0 0 !important;
    display: block !important;
    color: #24261f !important;
    font-family: var(--font-body--family, Inter, sans-serif) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    letter-spacing: .075em !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
  }
  &:is([data-template="page.lunch-dinner-selection"], [data-template="page.lunch-and-dinner-page"]) #menu.mp.mp-sec,
  &:is([data-template="page.meal-plan-lean-muscle"], [data-template="page.meal-plan-healthy-eating"], [data-template="page.meal-plan-dinners"], [data-template="page.meal-plan-lunches"]) #build-your-plan.mp-plan-inline,
  &[data-template="page.meal-plan-weight-loss"] #mp-starter-sets.mp.mp-sec {
    padding-top: 32px !important;
  }
  &[data-template="page.meal-plan"] > .shopify-section[id$="__mp_plan_builder"] {
    margin-top: 0 !important;
  }
  &[data-template="page.meal-plan"] > .shopify-section[id$="__mp_plan_builder"] > .mealplan-flow {
    padding-top: 32px !important;
  }
  &[data-template="page.meal-plan"] #mealplan-builder {
    padding-block: 24px !important;
  }

}

@media (min-width: 750px) and (max-width: 1100px) {
  html body[data-mp-hero-family]:has(#MainContent.content-for-layout[data-template]) #MainContent.content-for-layout[data-template] {
    --mp-hero-top: 130px;
  }
}

@media (max-width: 749px) {
  html body[data-mp-hero-family]:has(#MainContent.content-for-layout[data-template]) #MainContent.content-for-layout[data-template] {
    --mp-hero-copy-width: 100%;
    --mp-hero-title-size: clamp(34px, 10vw, 42px);
    --mp-hero-title-line: .98;
    --mp-hero-title-spacing: -.03em;
    --mp-hero-gutter: 16px;
    --mp-hero-top: 84px;
    --mp-hero-fade-inline: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.03) 34%, rgba(0,0,0,.12) 58%, rgba(0,0,0,.78) 76%, #000 88%, #000 calc(100% - 16px), transparent 100%);
    --mp-hero-fade-block: linear-gradient(180deg, transparent 0%, #000 28px, #000 calc(100% - 72px), transparent 100%);
    & :is(.mp-hero__grid, .mp-plan-intro__hero) { position: relative !important; }
    & :is(.au-hero-shell, .mpb__hero-grid) { --mp-hero-shell-position: relative; }
    & :is(.mp-hero__grid, .mc-hero-content, .au-hero-inner, .mpb__hero-copy) { min-height: 520px !important; }
    & .mc-hero-content { --mp-hero-copy-width: calc(100% - 32px); --mp-hero-copy-margin: 0 16px; }
    & :is(.mp-hero .mp-h-xl, .mp-plan-intro h1, .mc-hero-title, .au-hero-title, .mpb__hero h1) {
      width: 92% !important;
      max-width: 92% !important;
      margin: 14px 0 0 !important;
    }
    & :is(.mp-hero .mp-eyebrow, .mp-plan-intro__eyebrow, .mc-hero-eyebrow, .au-hero-inner .au-kicker, .mpb__hero .mpb__kicker) {
      padding: 9px 14px 9px 26px !important;
      margin-bottom: 14px !important;
      font-size: 9px !important;
      line-height: 1.3 !important;
      letter-spacing: 1.1px !important;
    }
    & :is(.mp-hero .mp-lede, .mp-plan-intro__body, .mc-hero-lede, .au-hero-sub, .mpb__hero .mpb__lede) {
      width: 56% !important;
      max-width: 56% !important;
      margin: 18px 0 0 !important;
      font-size: 15.5px !important;
      line-height: 1.42 !important;
    }
    & :is(.mp-hero__cta, .mp-plan-intro__actions, .mc-hero-actions, .au-hero-actions, .mpb__hero-actions) {
      display: grid !important;
      grid-template-columns: minmax(0,1fr) !important;
      width: 52% !important;
      gap: 8px !important;
      margin: 15px 0 20px !important;
    }
    & :is(.mp-hero__cta, .mp-plan-intro__actions, .mc-hero-actions, .au-hero-actions, .mpb__hero-actions) > :is(a, button) {
      width: 100% !important;
      min-height: 52px !important;
      padding: 11px 14px !important;
      font-size: 13px !important;
    }
    & :is(.mp-hero .mp-micro, .mp-plan-intro__trust, .au-hero-reassurance, .mpb__hero .mpb__micro) { width: 56% !important; max-width: 56% !important; }
    & .mp.mp-hero > .mp-wrap > .mp-afterpay { font-size: 13px !important; }
    & :is(.mp-hero__art, .au-hero-art, .mpb__hero-media) { inset: 0 !important; width: 100% !important; }
    & .mc-hero-bg { inset: var(--mp-hero-top) 16px 4px !important; width: auto !important; height: auto !important; }
    & .au-hero-art { inset: var(--mp-hero-top) 16px 4px !important; width: auto !important; height: auto !important; }
    & .mpb__hero-media { inset: 0 16px !important; width: auto !important; height: auto !important; }
    /* Keep the complete meal photograph below readable mobile plan copy. */
    & .mp-plan-intro__hero {
      display: flex !important;
      flex-direction: column !important;
      gap: 20px !important;
      min-height: 0 !important;
    }
    & .mp-plan-intro__hero :is(.mp-plan-intro__body, .mp-plan-intro__actions, .mp-plan-intro__trust) {
      width: 100% !important;
      max-width: 100% !important;
    }
    & .mp-plan-intro__hero .mp-plan-intro__visual {
      display: grid !important;
      position: relative !important;
      inset: auto !important;
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      gap: 12px !important;
    }
    & .mp-plan-intro__hero .mp-plan-intro__visual > img {
      position: relative !important;
      z-index: 1 !important;
      inset: auto !important;
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      aspect-ratio: auto !important;
      border-radius: 16px !important;
      object-fit: contain !important;
      -webkit-mask: none !important;
      mask: none !important;
      opacity: 1 !important;
      transition: none !important;
    }
    & .mp-plan-intro__hero .mp-plan-intro__placeholder { display: none !important; }
    &[data-template="page.acc"] .mp-hero__art {
      inset: var(--mp-hero-art-top, 208px) 0 0 !important;
      height: calc(100% - var(--mp-hero-art-top, 208px)) !important;
      min-height: 0 !important;
      opacity: var(--mp-hero-art-ready, 0) !important;
      transition: opacity .2s ease !important;
    }
    &[data-template="page.acc"] .mp-hero__grid > div:first-child { padding-bottom: 100px !important; }
    & .mp-plan-intro__note {
      position: relative !important;
      z-index: 3 !important;
      inset: auto !important;
      width: 100% !important;
      max-width: 100% !important;
      margin: 0 !important;
      padding: 18px !important;
    }
    & .mp-plan-intro__note strong { color: #f4f4ee !important; font-size: 18px !important; line-height: 1.25 !important; }
    &:is([data-template="page.meal-plan"], [data-template="page.meal-plan-page-1-13-02"]) #menu[data-mp-menu-preview] > .mp-wrap { padding-inline: 16px !important; }
    &:is([data-template="page.meal-plan"], [data-template="page.meal-plan-page-1-13-02"]) #menu[data-mp-menu-preview] > .mp-wrap > .mp-panel { padding-inline: 0 !important; }
    & :is(.mp.mp-sec > .mp-wrap > .mp-proof > li, .mc-supplement-trust__item, .au-stat, .mpb__proof-row > div) {
      align-items: center !important;
      padding: 4px 3px 0 !important;
      border-left: 0 !important;
      border-right: 1px solid rgba(15,15,12,.13) !important;
      text-align: center !important;
    }
    & :is(.mp.mp-sec > .mp-wrap > .mp-proof > li, .mc-supplement-trust__item, .au-stat, .mpb__proof-row > div)::before { width: 28px !important; margin-bottom: 8px !important; }
    & :is(.mp.mp-sec > .mp-wrap > .mp-proof > li, .mc-supplement-trust__item, .au-stat, .mpb__proof-row > div):not(:first-child) { border-left: 0 !important; }
    & :is(.mp.mp-sec > .mp-wrap > .mp-proof > li, .mc-supplement-trust__item, .au-stat, .mpb__proof-row > div):last-child { border-right: 0 !important; }
    & :is(.mp.mp-sec > .mp-wrap > .mp-proof b, .mc-supplement-trust__item strong, .au-stat-num, .mpb__proof-row strong) { font-size: clamp(13.5px, 4vw, 15.6px) !important; line-height: 1 !important; }
    & :is(.mp.mp-sec > .mp-wrap > .mp-proof li > span, .mc-supplement-trust__item > span, .au-stat-lab, .mpb__proof-row div > span) { margin: 5px 0 0 !important; font-size: 7.5px !important; line-height: 1.12 !important; letter-spacing: .045em !important; }
  }
}

/* Informational body surfaces; hero system is owned above. */
html body[data-mp-info-family]:has(#MainContent[data-template="page.about"]) #MainContent[data-template="page.about"] [class^="au-wrap-"],html body[data-mp-info-family]:has(#MainContent[data-template="page.faq"]) #MainContent[data-template="page.faq"] .mpb{background:transparent!important}html body[data-mp-info-family]:has(#MainContent[data-template="page.about"]) #MainContent[data-template="page.about"] :is(.au-story,.au-path-card,.au-value-card,.au-acc,.au-form-card,.au-contact,.au-cta-banner,.au-faq-item),html body[data-mp-info-family]:has(#MainContent[data-template="page.faq"]) #MainContent[data-template="page.faq"] :is(.mpb__chapter--dark,.mpb__chapter--reviews,.mpb__chapter--local,.mpb__audit-card,.mpb__review-card,.mpb__timeline,.mpb__goal-cards article,.mpb__local-cards article,.mpb__faq-category,.mpb__closer,.mpb__nav){background:#3b3c34 linear-gradient(145deg,#41423a,#383931)!important;background-size:100% 100%!important;background-repeat:no-repeat!important;background-blend-mode:normal!important;border-color:rgba(255,255,255,.16)!important;color:#f4f4ee!important}html body[data-mp-info-family]:has(#MainContent[data-template="page.about"]) #MainContent[data-template="page.about"] :is(.au-form-field label,.au-faq-btn,.au-faq-answer,.au-faq-answer p,.au-faq-answer strong),html body[data-mp-info-family]:has(#MainContent[data-template="page.faq"]) #MainContent[data-template="page.faq"] :is(.mpb__audit-card,.mpb__review-card,.mpb__timeline,.mpb__goal-cards article,.mpb__local-cards article,.mpb__faq-category) :is(h3,p,dd,summary){color:#f4f4ee!important}html body[data-mp-info-family]:has(#MainContent[data-template="page.about"]) #MainContent[data-template="page.about"] .au-form-field label span{color:#d5d7cc!important}html body[data-mp-info-family]:has(#MainContent[data-template="page.about"]) #MainContent[data-template="page.about"] .au-faq-answer a{color:#c0c63c!important;text-decoration:underline!important;text-underline-offset:.18em}html body[data-mp-info-family]:has(#MainContent[data-template="page.about"]) #MainContent[data-template="page.about"] .au-section,html body[data-mp-info-family]:has(#MainContent[data-template="page.faq"]) #MainContent[data-template="page.faq"] .mpb__chapter{padding-block:48px 24px!important}@media (max-width:749px){html body[data-mp-info-family]:has(#MainContent[data-template="page.about"]) #MainContent[data-template="page.about"] .au-section,html body[data-mp-info-family]:has(#MainContent[data-template="page.faq"]) #MainContent[data-template="page.faq"] .mpb__chapter{padding-block:24px 16px!important}}