
  :host(.dg-consent-banner) .dg-app {
    
    --dg-primary-font: "DMSans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    --dg-secondary-font: "DMSans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    --dg-slider-enabled-primary: #007E40;
    --dg-slider-enabled-secondary: #BFDFCF;
  }

  :host(.dg-consent-banner) .dg-button {
    --dg-button-color: #002613;
    --dg-button-background: #FFFFFF;
    --dg-button-border: 1px solid #002613;
  }


        #shopify-buyer-consent {
  margin-top: 1em;
  display: inline-block;
  width: 100%;
}

#shopify-buyer-consent.hidden {
  display: none;
}

#shopify-subscription-policy-button {
  background: none;
  border: none;
  padding: 0;
  text-decoration: underline;
  font-size: inherit;
  cursor: pointer;
}

#shopify-subscription-policy-button::before {
  box-shadow: none;
}

      

    #kc-discount-banner {
      
        --kc-banner-bg: #1a1a1a;
      
      
        --kc-banner-color: #f5f5f5;
      
      --kc-banner-font-size: 15px;
      --kc-banner-font: Helvetica, Arial, sans-serif;
    }
    
  

  :root {
    --frelo-cream: #FFFAF0;        /* PDP canvas (--cream, exact) */
    --frelo-cream-2: #F4ECD9;      /* PDP alternating section */
    --frelo-cream-3: #F5EFE4;      /* PDP soft section */
    --frelo-surface: #E5D5BF;      /* PDP cream surface accent */
    --frelo-gold: #B9923B;         /* PDP gold (exact) */
    --frelo-gold-hover: #9F7925;   /* PDP gold hover */
    --frelo-gold-soft: #E7C980;    /* soft gold accent — gradients only */
    --frelo-chocolate: #1B0D02;    /* PDP dark (--choc, exact) */
    --frelo-chocolate-2: #3A1F12;
    --frelo-cocoa: #5A3818;        /* PDP hero-gradient mid tone */
    --frelo-mint-muted: #C9D7C0;
  }

  html, body {
    background: var(--frelo-cream) !important;
    color: var(--frelo-chocolate) !important;
  }

  /* FRELO PDP/system background pass: warm the cloned Grüns page without changing image pixels. */
  main, .main-content, .template-index, .shopify-section, section {
    --color-green-dark: var(--frelo-chocolate) !important;
    --color-green-base: var(--frelo-cocoa) !important;
    --color-green-bright: var(--frelo-gold) !important;
    --color-yellow-base: var(--frelo-gold-soft) !important;
    --color-cream-base: var(--frelo-cream) !important;
  }

  .announcement-bar-section,
  .countdown-pill,
  .announcement-bar,
  [class*="bg-[#001f10"], [class*="bg-[#002613"], [class*="bg-[#004"], [class*="bg-[#007"], [class*="bg-[#1F852F"] {
    background: linear-gradient(90deg, var(--frelo-chocolate) 0%, var(--frelo-cocoa) 52%, var(--frelo-gold) 100%) !important;
    color: var(--frelo-cream) !important;
  }

  [class*="text-[#001f10"], [class*="text-[#002613"], [class*="text-[#007"], [class*="text-[#1F852F"] {
    color: var(--frelo-chocolate) !important;
  }

  [class*="border-[#001f10"], [class*="border-[#002613"], [class*="border-[#007"], [class*="border-[#1F852F"] {
    border-color: var(--frelo-chocolate) !important;
  }

  buybox-gallery .gallery-nav-slide.selected,
  buybox-gallery .gallery-nav-slide:hover {
    border-color: var(--frelo-gold) !important;
    box-shadow: 0 0 0 2px rgba(201,164,93,.35) !important;
  }

  .product-form,
  .buybox,
  .purchase-card,
  [class*="buybox"],
  [class*="product"] [class*="card"] {
    border-color: rgba(42,23,16,.16) !important;
  }

  /* Below-PDP homepage sections: correlate with the new PDP cards — cream bases, cocoa panels, gold accents. */
  .benefits-scroll,
  .value-props,
  .what-to-expect,
  .reviews-section,
  .clinical-section,
  .faq-section,
  .footer {
    background-color: var(--frelo-cream) !important;
  }

  .benefits-scroll .benefit-gradient,
  [class*="gradient"]:not(img):not(picture):not(source) {
    background: radial-gradient(circle at 20% 10%, #F7DC9F 0%, rgba(247,220,159,.82) 22%, rgba(106,60,36,.92) 55%, #2A1710 100%) !important;
  }

  button, .button, .btn, [class*="add-to-cart"], [class*="checkout"], [class*="subscription"] .selected {
    border-color: var(--frelo-chocolate) !important;
  }

  /* ===== FRELO real fonts: map gruns font tokens → our type system, force globally =====
     gruns: --font-primary=Work Sans (BODY), --font-secondary=Retail Display (HEADLINES, NOT loaded
     here → was falling back to Helvetica/Georgia), --font-tertiary=DM Mono.
     Correct mapping: BODY→Afacad, HEADLINE/DISPLAY→Fraunces. */
  :root {
    --font-primary:   'Afacad', system-ui, -apple-system, BlinkMacSystemFont, sans-serif !important;
    --font-worksans:  'Afacad', system-ui, sans-serif !important;
    --font-sans:      'Afacad', system-ui, sans-serif !important;
    --font-secondary: 'Fraunces', Georgia, serif !important;   /* DISPLAY/headline font */
    --font-display:   'Fraunces', Georgia, serif !important;
    --font-retail:    'Fraunces', Georgia, serif !important;
    --font-tertiary:  'Afacad', system-ui, sans-serif !important;
    --font-mono:      'Afacad', system-ui, sans-serif !important;
  }
  /* Body / UI → Afacad everywhere (kills leftover DMSans + system fallbacks) */
  body, p, li, a, span, button, input, label, .body-1, .body-2, .body-3, .body-4,
  [style*="DMSans"], [class*="dm-sans"] {
    font-family: 'Afacad', system-ui, sans-serif !important;
  }
  /* ALL display + heading classes → Fraunces with WONK personality (matches PDP).
     Covers gruns .d1–.d5 / .h1–.h4 / richtext-h / richtext-accent so headings are consistent. */
  h1, h2, h3, h4, .h1, .h2, .h3, .h4,
  .d1, .d2, .d3, .d4, .d5,
  .richtext-h, .richtext-accent,
  [class*="headline"], [class*="heading"], [class*="title"] {
    font-family: 'Fraunces', Georgia, serif !important;
    font-variation-settings: 'SOFT' 0, 'WONK' 1 !important;
    font-weight: 700 !important;
  }

  /* ===== Background match: neutralize the leftover gruns "firecracker" navy/red theme ===== */
  /* Inline gruns brand themes (green + navy/red) → frelo cocoa/chocolate/cream */
  [style*="--brand-primary"] {
    --brand-primary:    var(--frelo-cocoa) !important;
    --brand-strongest:  var(--frelo-chocolate) !important;
    --brand-selected-bg: var(--frelo-cream-2) !important;
    --product-primary-color: var(--frelo-cocoa) !important;
  }
  [style*="--sec-bg"] {
    --sec-bg:   var(--frelo-cream-2) !important;
    --text-color: var(--frelo-chocolate) !important;
    --bold-color: var(--frelo-chocolate) !important;
  }
  /* Hard-coded gruns navy/red surfaces (#000f5c / #c4121a / #ed1c24 / firecracker tints) */
  [class*="bg-[#000f5c"], [class*="bg-[#c4121a"], [class*="bg-[#ed1c24"], [class*="bg-[#c4"],
  [style*="#000f5c"], [style*="#c4121a"], [style*="#ed1c24"], [style*="#e6f0fe"], [style*="#fee9ea"] {
    background-color: var(--frelo-cream) !important;
  }
  [class*="text-[#000f5c"], [class*="text-[#c4121a"], [class*="text-[#ed1c24"] {
    color: var(--frelo-chocolate) !important;
  }
  /* Green + navy linear gradients → one frelo chocolate→cocoa→gold sweep */
  [style*="#00572c"][style*="gradient"], [style*="#00b45b"], [style*="#007e40"][style*="gradient"] {
    background: linear-gradient(90deg, var(--frelo-chocolate) 0%, var(--frelo-cocoa) 52%, var(--frelo-gold) 100%) !important;
  }

  /* ===== Unify the assorted cream/white section backgrounds to ONE canvas ===== */
  [style*="#fbf7ec"], [style*="#FFF8E8"], [style*="#FFF4D4"], [style*="#FFFDF8"] {
    background-color: var(--frelo-cream) !important;
  }

  /* ===== Remove site header (nav) + footer — not needed on this preview page ===== */
  #shopify-section-header_v2,
  #shopify-section-header,
  .shopify-section-group-footer-group,
  [id*="__footer_"],
  body > footer,
  footer[aria-label="Site footer"] {
    display: none !important;
  }

  /* ===== Remove the "NEW FRELO" limited-edition sticker badge on the product hero ===== */
  .hero-badge {
    display: none !important;
  }

  /* ============================================================================
     ROOT CAUSE FIX: remap the gruns DESIGN-SYSTEM tokens (defined in gruns-main.css
     + overridden inline to the navy/red "firecracker" theme) to frelo PDP values.
     This is what actually drives every section background — not the --frelo-* vars.
     Applied at :root AND on every inline-themed element so section overrides lose.
     ============================================================================ */
  :root, [style*="--color-"], [style*="--brand-"] {
    /* surfaces / backgrounds → PDP cream canvas (white cards stay white) */
    --color-neutral-off-white: #FFFAF0 !important;
    --color-off-white:         #FFFAF0 !important;
    --color-cream-base:        #FFFAF0 !important;
    --color-base-100:          #FFFFFF !important;
    --color-base-200:          #F4ECD9 !important;
    --color-base-300:          #E5D5BF !important;
    --color-firecracker-page-top: #FFFAF0 !important;
    --color-firecracker-offwhite: #FFFAF0 !important;
    --color-firecracker-navy-50:  #F4ECD9 !important;

    /* primary (gruns dark/green CTA + dark surfaces) → frelo chocolate */
    --color-primary:           #1B0D02 !important;
    --color-primary-base:      #1B0D02 !important;
    --color-primary-strongest: #1B0D02 !important;
    --color-primary-hover:     #3A1F12 !important;
    --color-primary-weakest:   #F4ECD9 !important;
    --product-primary-color:   #6B3C24 !important;

    /* secondary / accents → frelo gold */
    --color-secondary:         #B9923B !important;
    --color-secondary-base:    #B9923B !important;
    --color-secondary-hover:   #9F7925 !important;

    /* leftover green + yellow ramps → frelo chocolate/cocoa/gold */
    --color-green:         #6B3C24 !important;
    --color-green-dark:    #1B0D02 !important;
    --color-green-base:    #6B3C24 !important;
    --color-green-bright:  #B9923B !important;
    --color-green-weakest: #F4ECD9 !important;
    --color-yellow:        #B9923B !important;
    --color-yellow-base:   #E7C980 !important;
    --color-yellow-weakest:#F5EFE4 !important;

    /* firecracker navy/red ramp → frelo chocolate/gold */
    --color-firecracker-navy-day: #1B0D02 !important;
    --color-firecracker-navy-900: #1B0D02 !important;
    --color-firecracker-red-day:  #B9923B !important;
    --color-firecracker-red-700:  #9F7925 !important;
    --color-firecracker-sky-day:  #E5D5BF !important;

    /* foreground / text → frelo chocolate (was navy rgba); keep inverse white */
    --color-fg-primary:   #1B0D02 !important;
    --color-fg-secondary: rgba(27,13,2,0.7) !important;
    --color-fg-tertiary:  rgba(27,13,2,0.5) !important;
    --color-off-black:    #1B0D02 !important;
  }

  /* ===== PDP gallery → force a clean 1:1 square (no whitespace below the image) ===== */
  .pdp-image-carousel {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
  }
  .pdp-image-carousel .embla__viewport {
    height: 100% !important;
  }
  .pdp-image-carousel .embla__container,
  .pdp-image-carousel .embla__slide {
    height: 100% !important;
  }
  .pdp-image-carousel .embla__slide picture,
  .pdp-image-carousel .embla__slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: var(--media-position, 50% 50%) !important;
  }

  /* ===== "Ridiculously easy" brown value-props block → blend into its REAL neighbors:
     cream press-marquee ABOVE (top) and the dark benefits section BELOW (bottom).
     Matching each edge to the neighbor's edge color removes the hard seam. ===== */
  .home-value-props--mobile-carousel.bg-green,
  .home-value-props .home-value-props--mobile-carousel {
    /* Evenly-stepped cream→chocolate ramp — gradual through the whole section,
       no abrupt 12% jump (matches the smooth ramp used in the "1 Ball" scene). */
    background: linear-gradient(180deg,
      #FFFAF0 0%,     /* meets cream press marquee above */
      #E9DAC0 8%,
      #CBAA7C 17%,
      #A87E50 27%,
      #8B603A 38%,
      #6B3C24 50%,
      #57301C 62%,
      #402311 76%,
      #2A1506 88%,
      #1B0D02 100%) !important;   /* meets dark benefits section below */
  }
  /* Benefits section ("5G CREATINE") — SCROLL-DRIVEN COLOUR GRADE.
     A TALL multi-stop chocolate→cream gradient (background-size 100% 300% = 3x the box).
     JS sets --grade-pos from the section's scroll progress (0%→100%), sliding the visible
     window down the gradient, so the colour LITERALLY grades as the user scrolls through
     the section (it was a static gradient before). Wrapper is transparent so the section
     background shows through. */
  .benefits-scroll {
    background: #1B0D02 !important;
  }
  .benefits-scroll-wrapper {
    /* Same chocolate→cream palette, but 135% tall with the visible window slid by
       --grade-pos (JS, 0%→100%) — the background very gently eases toward cream as
       the user scrolls through and past the section, blending into the next
       (creamy #FFFAF0) section. */
    /* Evenly-stepped chocolate→cream ramp — no abrupt zone; every band shifts a little */
    background-image: linear-gradient(180deg,
      #1B0D02 0%,
      #281407 12%,
      #381F0D 24%,
      #4C2C15 36%,
      #63401F 48%,
      #7E582E 60%,
      #9C7546 72%,
      #C09A66 82%,
      #E0C295 90%,
      #F3E3C4 96%,
      #FDF8EE 100%) !important;
    background-size: 100% 135% !important;
    background-repeat: no-repeat !important;
    background-position: 0% var(--grade-pos, 0%) !important;
  }

  /* "3rd party-tested" section → CONTINUES the fade from the section above:
     creamy-white (top, seamless) → pure white → creamy PDP (bottom), staying light
     through the offer-card below. Text flips white→dark for legibility; cards stay
     solid chocolate so their white text + gold checks keep contrast. */
  .third-party-science,
  .third-party-science > .bg-primary-strongest,
  .third-party-science .bg-primary-strongest {
    background: linear-gradient(180deg,
      #FFFAF0 0%,      /* meets the creamy-white bottom of the section above */
      #FFFFFF 35%,     /* fades into white */
      #FFFAF0 100%) !important;   /* then into creamy PDP */
  }
  /* Flip the headline + intro copy from white to dark (legible on the light bg) */
  .third-party-science .third-party-science__inner > div:first-child h2,
  .third-party-science .third-party-science__inner > div:first-child p {
    color: #1B0D02 !important;
  }
  /* Cards: solid chocolate (were translucent bg-black/35 → grey on light bg) */
  .third-party-science__callouts > li {
    background: #1B0D02 !important;
  }
  /* Offer-card / PDP buybox + the anchor before it → solid PDP cream */
  #shopify-section-template--18534247137346__usnacks_anchor_target_YwcxxH,
  #shopify-section-template--18534247137346__usnacks_buybox_CLfPq9,
  .usnacks-buybox {
    background: #FFFAF0 !important;
  }


  /* Hide legacy Grüns discount/quiz popups that obscure FRELO section review. */
  [class*="alia"], [id*="alia"], [class*="Fondue"], [id*="fondue"], [class*="keepcart"], [id*="keepcart"], iframe[src*="alia"], iframe[src*="fondue"], iframe[src*="keepcart"] {
    display:none!important; visibility:hidden!important; opacity:0!important; pointer-events:none!important;
  }


  html { overflow-y: auto !important; height: auto !important; }
  body { overflow: visible !important; height: auto !important; }
  .upcart-cart, [class*="CartPreview"], [class*="UpcartDesktop"], [class*="UpcartMobile"], [id^="upcart"], [class^="upcart"] {
    display: none !important; visibility: hidden !important; pointer-events: none !important;
  }


  .announcement-bar-section .countdown-pill .digit {
    font-family: var(--font-primary);
    font-size: 24px;
    line-height: 16px;
    font-weight: 700;
    letter-spacing: -1.2px;
    color: #ffffff;
    font-variant-numeric: tabular-nums;
  }
  .announcement-bar-section .countdown-pill .colon {
    font-family: var(--font-primary);
    font-size: 16px;
    line-height: 16px;
    font-weight: 700;
    color: #ffffff;
    margin: 0 2px;
    transform: translateY(-7px);
  }
  .announcement-bar-section .countdown-pill .time-label {
    font-family: var(--font-primary);
    font-size: 12px;
    line-height: 12px;
    font-weight: 500;
    letter-spacing: -0.36px;
    color: #ffffff;
    text-transform: uppercase;
    margin-top: 2px;
  }


  #shopify-section-header_v2 {
     display: none;
  }
    .site-nav-drawer {
      right: 1rem;
      opacity: 0;
      pointer-events: none;
      transform: scale(0.9);
      transform-origin: top right;
      transition:
        opacity 180ms ease,
        transform 180ms ease;
    }

    .site-nav-drawer[data-open='true'] {
      opacity: 1;
      pointer-events: auto;
      transform: scale(1);
    }

    @media (min-width: 992px) {
      .site-nav-drawer {
        right: max(4.5rem, calc((100vw - var(--spacing-page)) / 2));
      }
    }

    .site-nav-overlay {
      opacity: 0;
      pointer-events: none;
      transition: opacity 180ms ease;
    }

    .site-nav-overlay[data-open='true'] {
      opacity: 1;
      pointer-events: auto;
    }

    .site-nav__promo-fallback {
      background: linear-gradient(180deg, #1B0D02 0%, #5A3818 100%);
    }

    #shopify-section-header_v2 .site-nav__promo-dots .embla__dot {
      width: 8px;
      height: 8px;
      appearance: none;
      border: 0;
      border-radius: 9999px;
      background: var(--color-gray-base);
      cursor: pointer;
      padding: 0;
      transition: background-color 180ms ease;
    }

    #shopify-section-header_v2 .site-nav__promo-dots .embla__dot.embla__dot--selected {
      background: var(--color-off-black);
    }

    .site-nav__product-placeholder {
      background: linear-gradient(180deg, var(--color-green) 0%, var(--color-green-bright) 100%);
    }

    @media (prefers-reduced-motion: reduce) {
      .site-nav-overlay,
      .site-nav-drawer {
        transition: none;
      }
    }

    
      .header-v2-section {
        margin-bottom: -60px;
      }

      @media (min-width: 992px) {
        .header-v2-section {
          margin-bottom: -68px;
        }
      }
    


  /* EXACT replica of the PDP floating CTA (frelo-s-pdp.liquid):
     wrapper = fixed bottom-center, inner <a> = .fpd-cta large gold Fraunces pill */
  .usnacks-floating-cta {
    position: fixed;
    top: 14px;
    right: 16px;
    z-index: 1100;
  }
  .usnacks-floating-cta a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #B9923B !important;
    color: #fff !important;
    font-family: 'Fraunces', Georgia, serif !important;
    font-weight: 700 !important;
    font-size: 17px !important;
    padding: 13px 32px !important;
    border: none !important;
    border-radius: 100px !important;
    box-shadow: 2px 4px 0px 0px #84600b, 0 8px 24px rgba(0,0,0,0.22) !important;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    transition: transform .08s ease, box-shadow .08s ease, background .15s ease;
  }
  .usnacks-floating-cta a:hover { background: #9F7925 !important; }
  .usnacks-floating-cta a:active { transform: translate(2px,4px); box-shadow: none !important; }


            #frelo-hero-cta{background:#B9923B!important;color:#fff!important;font-family:'Fraunces',Georgia,serif!important;font-weight:700!important;border:none!important;box-shadow:2px 4px 0 0 #84600b, 0 8px 22px rgba(0,0,0,.18)!important;transition:transform .08s ease, box-shadow .08s ease, background .15s ease!important;}
            #frelo-hero-cta:hover{background:#9F7925!important;}
            #frelo-hero-cta:active{transform:translate(2px,4px)!important;box-shadow:none!important;}
          
#press-marquee-template--18534247137346__brry_press_marquee_nF8y6X {
    overflow: hidden;
  }

  #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props__heading {
    --bold-color: #ffcc2f;
    letter-spacing: 1.68px;
  }

  #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props__cards {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  

  #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props__subcopy {
    margin: 0;
  }

  @media (max-width: 991px) {
    #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props--mobile-carousel .home-value-props__cards {
      --home-value-props-carousel-image-height: clamp(204px, 57vw, 283px);
      --home-value-props-carousel-card-width: calc((var(--home-value-props-carousel-image-height) * 4 / 3) + 16px);
      --home-value-props-carousel-edge: max(16px, calc((100vw - var(--home-value-props-carousel-card-width)) / 2));

      display: grid;
      box-sizing: border-box;
      grid-auto-columns: var(--home-value-props-carousel-card-width);
      grid-auto-flow: column;
      column-gap: 12px;
      width: 100vw;
      margin-inline: calc(50% - 50vw);
      padding-inline: var(--home-value-props-carousel-edge);
      overflow-x: auto;
      overscroll-behavior-x: contain;
      scroll-padding-inline: var(--home-value-props-carousel-edge);
      scroll-snap-type: x mandatory;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
    }

    #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props--mobile-carousel .home-value-props__cards::-webkit-scrollbar {
      display: none;
    }

    #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props--mobile-carousel .home-value-props__card {
      scroll-snap-align: center;
    }
  }

  @media (min-width: 992px) {
    #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props__heading {
      letter-spacing: 1.28px;
    }

    #shopify-section-template--18534247137346__home_value_props_K7AQhE .home-value-props__cards {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }


  html, body, p, li, a, span, button, input, label, summary, details, .body-1, .body-2, .body-3, .body-4, .body-5 {
    font-family: 'Afacad', system-ui, -apple-system, BlinkMacSystemFont, sans-serif !important;
  }
  h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5, .d1, .d2, .d3, .d4, .d5, .font-display, .richtext-accent, .fp-price, .fp-plan-name, .frelo-pdp-title {
    font-family: 'Fraunces', Georgia, serif !important;
    font-variation-settings: 'SOFT' 0, 'WONK' 1 !important;
  }
  body { background:#FFFAF0 !important; }
  .bg-neutral-off-white, .bg-off-white, .bg-cream, .bg-white { background-color:#FFFAF0 !important; }
  .frelo-one-ball-line {
    font-family: 'Afacad', system-ui, sans-serif !important;
    font-weight: 800 !important;
    letter-spacing: -0.035em !important;
    font-size: clamp(45px, 11.2vw, 92px) !important;
    line-height: .98 !important;
    color: #FDF8EE !important;
    text-align: center !important;
    text-shadow: 0 2px 24px rgba(27,13,2,.22);
  }
  .frelo-one-ball-accent, .benefits-scroll-wrapper .word-line.frelo-one-ball-accent.is-accent { color:#B9923B !important; text-shadow:0 2px 22px rgba(185,146,59,.55)!important; }
  .benefits-scroll-wrapper .words { max-width:980px!important; margin:0 auto!important; padding-top:0!important; }
  /* Mobile: floating balls hug the screen EDGES (clear of the text) and are smaller */
  .benefits-scroll-wrapper .gummy-left { left:0!important; bottom:-1svh!important; width:min(15vw,84px)!important; }
  .benefits-scroll-wrapper .gummy-right { right:0!important; top:6svh!important; width:min(10vw,56px)!important; }
  @media (min-width: 992px) {
    .frelo-one-ball-line { font-size:clamp(32px,3.2vw,50px)!important; line-height:1.1!important; }
    .benefits-scroll-wrapper .word-line-mask { margin-bottom:0.4vh; }
    .benefits-scroll-wrapper .gummy-left { width:min(7vw,90px)!important; left:6vw!important; bottom:26svh!important; }
    .benefits-scroll-wrapper .gummy-right { width:min(4.5vw,58px)!important; right:7vw!important; top:13svh!important; }
  }


  /* ============================================================================
     "1 BALL" SCENE — faithful rebuild of Gruns' GSAP pinned scroll scene
     (decoded from their gruns-section-benefits.js) using a pure-CSS sticky pin +
     a tiny vanilla-JS scrubber (no GSAP dependency).
       • The wrapper PINS to the viewport for a ~1-screen scroll track.
       • While pinned, the word-lines reveal upward one-by-one (mask reveal).
       • The sachet rises from HALF-HIDDEN (start) to FULLY VISIBLE (end), so after
         the section it is NOT half-hidden.
       • At the final beat the last line ("1 Ball") COLOURS at the SAME instant the
         ball pops out of the sachet — exactly like Gruns' "final-accent" label.
     ============================================================================ */
  /* ===== "1 Ball" scene — NATIVE position:sticky stage. The browser pins the stage
     (smooth, composited); JS only sets --rise/--tear + colours the last word. Static
     gradient background (current colours) — NO JS background fading. */
  .benefits-scroll {
    position: relative;
    height: 150vh;             /* fallback */
    height: 150lvh;            /* scroll track — lvh stable on iPhone */
  }
  .benefits-scroll-wrapper {
    position: sticky;
    top: 0;
    height: 100vh;             /* fallback for old iOS */
    height: 100lvh;            /* lvh = chrome-collapsed MAX → no black band below the scene */
    overflow: hidden;          /* clips the half-hidden sachet at the bottom edge */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 9svh 4vw 0 !important;   /* owns padding (guards against external p-sec rules) */
    box-sizing: border-box;
  }
  .benefits-scroll-wrapper .words { position: relative; width: 100%; }
  /* Word lines reveal upward from behind their masks one-by-one, scrubbed to scroll
     (Gruns' SplitText mask-reveal mechanic). --wl: 110% = hidden below mask · 0% = revealed.
     Defaults to 0% so with JS disabled all lines are simply visible. */
  .benefits-scroll-wrapper .word-line-mask { overflow: hidden; }
  .benefits-scroll-wrapper .word-line {
    color: #FDF8EE !important;
    transform: translateY(var(--wl, 0%)) !important;
    transition: color .35s ease, text-shadow .35s ease;
    will-change: transform;
  }
  /* Accent colour on "1 BALL" is owned by the .frelo-one-ball-accent.is-accent rule
     in the hardening block above (#B9923B brand gold). */
  /* Sachet pinned to the bottom of the stage. --rise 0 → HALF-HIDDEN · 1 → FULLY VISIBLE. */
  .benefits-scroll-wrapper .packet-bear {
    position: absolute;
    left: 50%;
    bottom: 0;
    margin: 0 !important;
    width: min(80vw, 420px) !important;   /* bigger sachet on mobile */
    transform: translate(-50%, calc(46% - var(--rise, 0) * 46%));
    z-index: 4;
  }
  /* The inner sachet element carries Tailwind w-50/tb:w-130 (fixed 200px/520px) which
     overflowed the packet width caps — force it to track the packet's width. */
  .benefits-scroll-wrapper .packet-bear .sachet-front { width: 100% !important; }
  /* Mobile: smaller ball, resting MOSTLY HIDDEN behind the sachet (--ball-rest pushes it
     down behind the z-3 sachet front) until the late pop. Desktop overrides below. */
  .benefits-scroll-wrapper { --ball-rest: 57px; }   /* deeper rest = ball stays hidden behind the sachet */
  .benefits-scroll-wrapper .bear { width: 29% !important; }   /* bigger ball on mobile */
  @media (min-width: 992px) {
    .benefits-scroll-wrapper { --ball-rest: 0px; }
    .benefits-scroll-wrapper .bear { width: 22% !important; }
  }
  @media (min-width: 992px) {
    .benefits-scroll { height: 175vh; height: 175lvh; }   /* taller scroll track on desktop — slower, roomier scene */
    .benefits-scroll-wrapper {
      --ball-pop: -52px;                   /* shorter pop so the ball stays UNDER the text */
    }
    .benefits-scroll-wrapper .packet-bear {
      width: min(20vw, 255px) !important;  /* much smaller product elements */
      transform: translate(-50%, calc(44% - var(--rise, 0) * 44%));
    }
  }

  .benefits-scroll-wrapper .floating {
    animation: benefits-gummy-float 4.8s ease-in-out infinite;
    transform-origin: center;
    will-change: transform;
  }

  .benefits-scroll-wrapper .frelo-floating-ball img {
    filter: contrast(1.06) drop-shadow(0 16px 16px rgba(27, 13, 2, 0.4)) drop-shadow(0 2px 2px rgba(255, 247, 154, 0.16));
  }
  .benefits-scroll-wrapper .bear img {
    filter: contrast(1.06) drop-shadow(0 12px 14px rgba(27, 13, 2, 0.5));
  }

  .benefits-scroll-wrapper .frelo-floating-ball--left {
    transform: rotate(-9deg);
  }

  .benefits-scroll-wrapper .frelo-floating-ball--right {
    transform: rotate(11deg);
  }

  .benefits-scroll-wrapper .gummy-right.floating {
    animation-delay: -2.4s;
    animation-duration: 5.4s;
  }

  @keyframes benefits-gummy-float {
    0%,
    100% {
      transform: translate3d(0, 0, 0) rotate(-2deg);
    }

    50% {
      transform: translate3d(0, -14px, 0) rotate(3deg);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .benefits-scroll-wrapper .floating {
      animation: none;
      will-change: auto;
    }
  }

  /* ===== SCROLL-DRIVEN SACHET TEAR + BALL BURST =====
     The sachet image is duplicated and split by an interlocking jagged seam (clip-path)
     into a top "flap" (the sealed top) and the "body". --tear (0→1), set by JS from the
     scroll progress, peels the flap up and fades it (the seal tears open) while the ball
     (.bear) rises out and grows. At --tear:0 the two halves recompose into the intact
     sachet, so with JS disabled it looks exactly as before. */
  .frelo-sachet { position: relative; }
  .frelo-sachet .sachet-body {
    position: relative;
    clip-path: polygon(0% 20.5%, 10% 16%, 20% 20.5%, 30% 16%, 40% 20.5%, 50% 16%, 60% 20.5%, 70% 16%, 80% 20.5%, 90% 16%, 100% 20.5%, 100% 100%, 0% 100%);
  }
  .frelo-sachet .sachet-flap {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: auto;
    transform-origin: 50% 18%;
    clip-path: polygon(0% 0%, 100% 0%, 100% 20.5%, 90% 16%, 80% 20.5%, 70% 16%, 60% 20.5%, 50% 16%, 40% 20.5%, 30% 16%, 20% 20.5%, 10% 16%, 0% 20.5%);
    transform: translateY(calc(var(--tear, 0) * -22px)) rotateX(calc(var(--tear, 0) * -88deg));
    opacity: calc(1 - var(--tear, 0) * 0.92);
    filter: drop-shadow(0 8px 10px rgba(0, 0, 0, 0.4));
    will-change: transform, opacity;
    pointer-events: none;
    backface-visibility: hidden;
  }
  .benefits-scroll-wrapper .bear {
    transform: translateY(calc(var(--ball-rest, 0px) + var(--tear, 0) * var(--ball-pop, -98px))) scale(calc(1 + var(--tear, 0) * 0.18)) rotate(calc(var(--tear, 0) * 12deg)) !important;
    will-change: transform;
  }


  @media (min-width: 992px) {
    .third-party-science__inner {
      flex-wrap: wrap;
    }

    .third-party-science__callouts {
      flex: 1 1 21.75rem;
      grid-template-columns: repeat(2, minmax(10rem, 1fr));
      min-width: min(100%, 21.75rem);
    }
  }

  @media (min-width: 1280px) {
    .third-party-science__inner {
      flex-wrap: nowrap;
    }

    .third-party-science__callouts {
      flex-basis: 39.75rem;
      grid-template-columns: repeat(4, minmax(9.5rem, 1fr));
      min-width: 39.75rem;
    }
  }


  /* Custom hand-authored SVG trust icons — brand gold; each ROAMS around its card tab (span translate) while spinning/wiggling in place (inner svg). */
  .fe-ico{display:inline-block;width:56px;height:56px;will-change:transform}
  .fe-ico svg{width:100%;height:100%;display:block;overflow:visible;transform-origin:50% 50%}
  @keyframes feBug{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
  @keyframes feSpin{to{transform:rotate(360deg)}}
  @keyframes feTilt{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
  @keyframes fePulse{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.07)}}
  @keyframes feRoamA{0%{transform:translate(0,0)}20%{transform:translate(16px,-9px)}45%{transform:translate(21px,8px)}65%{transform:translate(-6px,12px)}85%{transform:translate(-18px,-4px)}100%{transform:translate(0,0)}}
  @keyframes feRoamB{0%{transform:translate(0,0)}25%{transform:translate(-18px,7px)}50%{transform:translate(8px,12px)}75%{transform:translate(19px,-8px)}100%{transform:translate(0,0)}}
  @keyframes feRoamC{0%{transform:translate(0,0)}30%{transform:translate(16px,9px)}55%{transform:translate(-15px,6px)}80%{transform:translate(-9px,-11px)}100%{transform:translate(0,0)}}
  @keyframes feRoamD{0%{transform:translate(0,0)}22%{transform:translate(-13px,-10px)}48%{transform:translate(15px,-6px)}72%{transform:translate(10px,12px)}100%{transform:translate(0,0)}}
  .ico-bug{animation:feRoamA 6s ease-in-out infinite}
  .ico-metal{animation:feRoamB 7.5s ease-in-out infinite}
  .ico-flask{animation:feRoamC 5.5s ease-in-out infinite}
  .ico-microbe{animation:feRoamD 8s ease-in-out infinite}
  .ico-bug svg{animation:feBug 1.7s ease-in-out infinite}
  .ico-metal svg{animation:feSpin 7s linear infinite}
  .ico-flask svg{animation:feTilt 2.4s ease-in-out infinite}
  .ico-microbe svg{animation:fePulse 6s ease-in-out infinite}
  @media(prefers-reduced-motion:reduce){.fe-ico,.fe-ico svg{animation:none!important}}

/* Overwrite existing selected style */
  .usnacks-buybox .pdp-image-carousel-wrapper .gallery-nav-slide {
    transition: all 0.3s ease-in-out;
  }
  .usnacks-buybox .pdp-image-carousel-wrapper .gallery-nav-slide.selected,
  .usnacks-buybox .pdp-image-carousel-wrapper .gallery-nav-slide:hover {
    opacity: 1;
  }

  /* Hide scrollbar while keeping scroll functionality */
  .scrollbar-hide {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
  }
  .scrollbar-hide::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
  }

  /* Full-width mobile gallery */
  @media (max-width: 991px) {
    .usnacks-buybox.full-width-mobile-gallery .pdp-image-carousel {
      margin-left: -5.556%;
      margin-right: -5.556%;
      border-radius: 0;
      border: none;
    }
  }

  /* Firecracker Theming */
  .dark .usnacks-buybox.theme-firecracker,
  .usnacks-buybox.theme-firecracker.dark {
    --color-fg-primary: rgba(0, 8, 46, 0.95);
    --color-fg-secondary: rgba(0, 8, 46, 0.7);
    --color-fg-tertiary: rgba(0, 8, 46, 0.5);
    --color-fg-primary-inverse: rgba(255, 255, 255, 0.95);
    --color-fg-secondary-inverse: rgba(255, 255, 255, 0.7);
    --color-fg-tertiary-inverse: rgba(255, 255, 255, 0.5);
    --color-off-black: var(--color-firecracker-navy-900);
    --color-base-200: var(--color-firecracker-navy-50);
    --color-primary: var(--color-firecracker-red-day);
    --color-secondary: var(--color-firecracker-navy-day);
    --color-accent1-base: var(--color-firecracker-sky-day);
    --color-firecracker-offwhite: var(--color-firecracker-navy-50);
    --color-firecracker-page-top: #ffffff;
  }

  .usnacks-buybox.theme-firecracker .countdown .tabular-nums {
    color: var(--color-primary-content);
  }

  /* XL viewport gallery layout adjustments */
  @media (min-width: 1280px) {
    .usnacks-buybox .pdp-image-carousel-wrapper {
      align-items: flex-start;
    }

    /* Initially hide thumbs nav on xl until max-height is calculated */
    .usnacks-buybox .gallery-thumbs-nav {
      opacity: 0;
      transition: opacity 0.3s ease-out;
    }

    /* Fade in once JS has set max-height */
    .usnacks-buybox .gallery-thumbs-nav.thumbs-nav-ready {
      opacity: 1;
    }

    /* Make the carousel square */
    .usnacks-buybox .pdp-image-carousel-wrapper .pdp-image-carousel {
      aspect-ratio: 1 / 1;
      flex-shrink: 0;
      width: calc(100% - 105px);
    }
  }

  /* Sticky ATC Button Brand Colors */
  #buybox-pdp-sticky-atc .btn-primary {
    background-color: var(--brand-primary, #007e40);
  }

  #buybox-pdp-sticky-atc .btn-primary:hover {
    background-color: color-mix(in srgb, var(--brand-primary, #007e40) 90%, black);
  }

  /* New Nutrition Label (A/B test button — hidden by default; Intelligems reveals it) */
  .new-nutrition-label {
    display: none;
    font-size: 18px;
    transition: background-color 0.3s ease-in-out;
  }
  .new-nutrition-label:hover {
    background-color: var(--color-gray-weak);
  }
.st0{fill:#002613}
.st0{fill:#002613}

            .frelo-nutrition-label-button{font-family:Afacad,system-ui,sans-serif!important;font-size:16px!important;line-height:1!important;font-weight:600!important;border:1.5px solid #1B0D02!important;border-radius:999px!important;background:#fff!important;color:#1B0D02!important;padding:13px 18px!important;box-shadow:2px 2px 0 #1B0D02!important;transition:transform .08s ease,box-shadow .08s ease,background .15s ease!important;}
            .frelo-nutrition-label-button:hover{background:#fbf7ec!important;}
            .frelo-nutrition-label-button:active{transform:translate(2px,2px)!important;box-shadow:0 0 0 #1B0D02!important;}
            .frelo-nutrition-thumb{position:relative!important;border:1.5px solid #1B0D02!important;background:#fff!important;opacity:1!important;}
            .frelo-nutrition-thumb:after{content:'Label';position:absolute;left:4px;right:4px;bottom:4px;background:#fff;color:#1B0D02;border:1px solid #1B0D02;border-radius:999px;font-family:Afacad,system-ui,sans-serif;font-size:10px;font-weight:800;line-height:1.35;text-transform:uppercase;letter-spacing:.03em;}
            .nutriton-label-modal-windows{display:none!important;}
            #frelo-nutrition-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.62);padding:20px;}
            #frelo-nutrition-modal.is-open{display:flex;}
            #frelo-nutrition-modal .frelo-nutrition-dialog{position:relative;background:#fff;border:1.5px solid #1B0D02;border-radius:18px;box-shadow:0 16px 50px rgba(0,0,0,.28);width:min(92vw,760px);max-height:88vh;padding:42px 18px 18px;overflow:hidden;}
            #frelo-nutrition-modal .frelo-nutrition-close{position:absolute;top:12px;right:12px;width:30px;height:30px;border:1.5px solid #1B0D02;border-radius:999px;background:#fff;color:#1B0D02;display:flex;align-items:center;justify-content:center;cursor:pointer;font-family:Afacad,system-ui,sans-serif;font-size:22px;line-height:1;font-weight:700;}
            #frelo-nutrition-modal .frelo-nutrition-title{position:absolute;top:14px;left:18px;margin:0;font-family:Afacad,system-ui,sans-serif!important;font-weight:800;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:#1B0D02;}
            #frelo-nutrition-modal .frelo-nutrition-scroll{max-height:calc(88vh - 68px);overflow:auto;border-radius:12px;background:#fff;}
            #frelo-nutrition-modal img{display:block;width:100%;height:auto;margin:0 auto;}
            body.frelo-nutrition-locked{overflow:hidden!important;}
            @media (max-width: 768px){#frelo-nutrition-modal{padding:12px;align-items:flex-start;}#frelo-nutrition-modal .frelo-nutrition-dialog{width:100%;max-height:92vh;padding:40px 10px 10px;border-radius:15px;}#frelo-nutrition-modal .frelo-nutrition-scroll{max-height:calc(92vh - 58px);}}
          

   #shopify-section-template--18534247137346__usnacks_buybox_CLfPq9 .usnacks-embed {
     padding-top: 0px;
     padding-bottom: 0px;
     .ll-container {
  margin-left: auto;
     }
   }

.usnacks-buybox--reviews-eyebrow {
    padding-top: 0px;
    padding-bottom: 0px;
  }
  .usnacks-buybox--reviews-eyebrow .partial-star {
    width: 0px;
  }

    .frelo-pdp-live-hero-copy .frelo-eyebrow{font-family:Afacad,system-ui,sans-serif;font-size:13px;line-height:1.2;text-transform:uppercase;letter-spacing:.25em;color:#5C3A20;font-weight:900;margin:0 0 10px;}
    .frelo-pdp-live-hero-copy .frelo-pdp-title{font-family:Fraunces,Georgia,serif;font-weight:800;font-size:clamp(38px,5vw,56px);line-height:1.02;letter-spacing:-.035em;color:#1B0D02;margin:0 0 16px;font-variation-settings:'SOFT' 0,'WONK' 1;}
    .frelo-pdp-live-hero-copy .frelo-marker{display:inline;background-image:linear-gradient(transparent 58%,rgba(185,146,59,.42) 58%,rgba(185,146,59,.42) 90%,transparent 90%);padding:0 .05em;}
    .frelo-pdp-live-hero-copy .frelo-underlined{position:relative;display:inline-block;white-space:nowrap;font-weight:500;}
    .frelo-pdp-live-hero-copy .frelo-underlined svg{position:absolute;left:0;bottom:-8px;width:100%;height:12px;pointer-events:none;}
    .frelo-pdp-live-hero-copy .frelo-pdp-paragraph{font-family:Afacad,system-ui,sans-serif;font-size:18px;line-height:1.55;color:#5C3A20;margin:18px 0 18px;max-width:520px;}
    .frelo-pdp-live-hero-copy .frelo-bullets{display:flex;flex-direction:column;gap:9px;margin-top:18px;}
    .frelo-pdp-live-hero-copy .frelo-pill{display:flex;align-items:center;gap:12px;border:1.5px solid #1B0D02;border-radius:999px;background:#FFFDF8;color:#1B0D02;padding:10px 14px;font-family:Afacad,system-ui,sans-serif;font-size:15px;font-weight:700;line-height:1.25;}
    .frelo-pdp-live-hero-copy .frelo-check{width:24px;height:24px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 24px;background:linear-gradient(160deg,#fff79a 0%,#b9923b 60%,#9f7925 100%);color:#1B0D02;font-size:14px;font-weight:900;}
    /* Hide inherited Grüns buybox controls/offer so only FRELO PDP copy + FRELO AutoShip card remain. */
    #shopify-block-AQkRVTDVVYVljVkI3Q__usnacks_buybox_flavor_selector_EH3rJt,
    .usnacks-buybox--sugar-selector,
    .usnacks-buybox--quantity-selector,
    .product-variant-form > .plan-heading,
    .product-variant-form form > .variant-config,
    .product-variant-form form > .flex.items-stretch,
    .product-variant-form form > .discount-message,
    .product-variant-form form > .cashback-message{display:none!important;}
    #tryfrelo-live-offer-faq-preview{margin-top:8px!important;}
  
.st0{fill:#002613}
.usnacks-buybox--sugar-selector {
    margin-top: 0px;
    padding-bottom: 0px;
  }
  .usnacks-buybox--sugar-selector .variant_selection.selected {
    background-color: var(--brand-selected-bg, #DAECE3);
    font-weight: 700;
  }
.st0{fill:#002613}
.usnacks-buybox--quantity-selector {
    margin-top: 0px;
    padding-bottom: 0px;
  }

  
    .usnacks-buybox--quantity-selector[data-active-product="7362502557762"] .buybox-discount-tag.enabled {
      background-color: #00572c;
      border-color: #00572c;
    }
  
    .usnacks-buybox--quantity-selector[data-active-product="7719362428994"] .buybox-discount-tag.enabled {
      background-color: #c4121a;
      border-color: #c4121a;
    }
  
  .usnacks-buybox--quantity-selector .qty-field.active {
    display: block !important;
  }
  .usnacks-buybox--quantity-selector .qty-field input:checked + label {
    background-color: var(--brand-selected-bg, #daece3);
    border: 1px solid #0a1912;
  }
  .usnacks-buybox--quantity-selector .qty-field label:hover {
    background-color: var(--brand-selected-bg, #daece3);
  }
  .usnacks-buybox--quantity-selector .buybox-discount-tag svg path {
    fill: #585858;
    transition: all 0.3s ease-in-out;
  }
  .usnacks-buybox--quantity-selector .buybox-discount-tag.enabled {
    opacity: 1;
    background-color: var(--brand-strongest, #00582d);
    color: #ffffff;
    border: 1px solid var(--brand-strongest, #00582d);
  }
  .usnacks-buybox--quantity-selector .buybox-discount-tag.enabled svg path {
    fill: #ffffff;
  }
  .usnacks-buybox--quantity-selector .buybox-discount-tag:not(.enabled) {
    cursor: pointer;
  }
.usnacks-buybox--plan-picker {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .quantity-note strong,
  .quantity-note b {
    color: #00592D;
  }

  /* Discount message animation */
  .discount-message {
    overflow: hidden;
    transition: height 0.3s ease-out, opacity 0.3s ease-out;
  }

  /* Radio circle inner dot - requires pseudo-element */
  .plan-radio::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: var(--brand-strongest, #00351b);
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.2s ease;
  }

  .plan-btn.selected .plan-radio::after {
    opacity: 1;
  }

  /* Number input spinner removal */
  .quantity-input::-webkit-outer-spin-button,
  .quantity-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .quantity-input {
    -moz-appearance: textfield;
  }

  /* Empty state for compare price */
  .add-to-cart-compare-price:empty {
    display: none;
  }

  /* States that require JS class toggles */
  .sugar-btn.active {
    border-color: #000;
    background: #000;
    color: #fff;
  }

  .variant-config {
    display: none;
  }

  .variant-config.active {
    display: block;
  }

  .plan-btn.selected {
    border-color: var(--brand-strongest, #00351b);
    background: var(--brand-selected-bg, #daece3);
  }

  .plan-btn.selected .plan-radio {
    border-color: var(--brand-strongest, #00351b);
  }

  .otp-text-link {
    margin-top: -16px;
    margin-bottom: -16px;
  }

  .quantity-selector.disabled {
    opacity: 0.5;
    pointer-events: none;
  }

  .add-to-cart-btn.is-loading {
    pointer-events: none;
    opacity: 0.7;
  }

  .add-to-cart-btn {
    background-color: var(--brand-primary, #007E40);
  }

  .add-to-cart-btn:hover {
    background-color: color-mix(in srgb, var(--brand-primary, #007E40) 90%, black);
  }

  .add-to-cart-btn:disabled {
    background-color: var(--color-gray-strong, #b9bdc7);
    cursor: not-allowed;
    pointer-events: none;
  }

  .plan-discount-tag {
    background-color: var(--brand-strongest, #00351b);
  }

  .monthly-eyebrow {
    background-color: var(--brand-strongest, #00351b);
  }

  /* Intelligems: ATC inside plan cards */
  .plan-atc-wrapper {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.3s ease-out, opacity 0.2s ease-out, margin 0.3s ease-out;
    margin-top: 0;
  }

  .plan-btn.selected .plan-atc-wrapper {
    max-height: 80px;
    opacity: 1;
    margin-top: 12px;
  }

  .plan-atc-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 3.5rem;
    border: 1px solid black;
    color: white;
    font-size: 1.125rem;
    font-weight: 600;
    border-radius: 9999px;
    cursor: pointer;
    transition: all 0.2s;
    background-color: var(--brand-primary, #007E40);
  }

  .plan-atc-btn:hover {
    background-color: color-mix(in srgb, var(--brand-primary, #007E40) 90%, black);
  }

  .plan-atc-btn.is-loading {
    pointer-events: none;
    opacity: 0.7;
  }

          /* FRELO PDP typography override for this local preview page */
          body, button, input, select, textarea, .font-primary, .frelo-pdp-live-hero-copy, #tryfrelo-live-offer-faq-preview, .frelo-pdp-live-faq { font-family: 'Afacad', system-ui, -apple-system, BlinkMacSystemFont, sans-serif !important; }
          h1, h2, h3, h4, .font-display, .frelo-pdp-title, #tryfrelo-live-offer-faq-preview .fp-plan-name, #tryfrelo-live-offer-faq-preview .fp-price, #tryfrelo-live-offer-faq-preview .fpd-cta { font-family: 'Fraunces', Georgia, serif !important; font-variation-settings:'SOFT' 0,'WONK' 1; }
          #tryfrelo-live-offer-faq-preview{background:#fff;border:1.5px solid #1B0D02;border-radius:24px;box-shadow:0 8px 20px rgba(27,13,2,.06);color:#1B0D02;margin-top:18px;padding:20px;overflow:hidden}
          #tryfrelo-live-offer-faq-preview .fp-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
          #tryfrelo-live-offer-faq-preview .fp-title{font-weight:700;font-size:18px;line-height:1.1;margin:0;color:#1B0D02;font-family:Afacad,system-ui,sans-serif!important;}
          #tryfrelo-live-offer-faq-preview .fp-win{font-style:italic;color:#B9923B;font-size:16px;font-weight:700;transform:rotate(-3deg);white-space:nowrap;line-height:1}
          #tryfrelo-live-offer-faq-preview .fp-person-toggle{display:grid;grid-template-columns:1fr 1fr;background:#F4ECD9;border:1.5px solid rgba(27,13,2,.15);border-radius:100px;padding:3px;gap:3px;margin:4px 0 16px;overflow:visible}
          #tryfrelo-live-offer-faq-preview .fp-person-btn{border:0;background:transparent;border-radius:100px;text-align:center;padding:10px 8px;font-weight:800;font-size:16px;line-height:1.15;position:relative;color:#1B0D02;cursor:pointer;transition:.15s ease;}
          #tryfrelo-live-offer-faq-preview .fp-person-btn.fp-active{background:#fff;box-shadow:0 1px 6px rgba(27,13,2,.05)}
          #tryfrelo-live-offer-faq-preview .fp-duo-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#B9923B,#D4A84B);color:#fff;font-size:10px;font-weight:900;letter-spacing:.4px;padding:3px 8px;border-radius:999px;white-space:nowrap;pointer-events:none}
          #tryfrelo-live-offer-faq-preview .fp-plan-card{border:1.5px solid rgba(27,13,2,.14);border-radius:18px;background:#fff;overflow:hidden;margin-bottom:12px;position:relative;cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s;}
          #tryfrelo-live-offer-faq-preview .fp-plan-card.fp-selected{border:2px solid #B9923B;background:#FFFDF8;box-shadow:0 0 0 3px rgba(185,146,59,.08)}
          #tryfrelo-live-offer-faq-preview .fp-best-corner{background:linear-gradient(135deg,#B9923B,#D4A84B);color:#fff;text-align:center;font-size:11px;font-weight:900;letter-spacing:.45px;padding:6px 8px;text-transform:uppercase;display:none;}
          #tryfrelo-live-offer-faq-preview .fp-selected .fp-best-corner{display:block;}
          #tryfrelo-live-offer-faq-preview .fp-row{padding:14px 16px 0;display:flex;align-items:center;gap:10px}
          #tryfrelo-live-offer-faq-preview .fp-radio{width:18px;height:18px;border:2px solid rgba(27,13,2,.32);border-radius:50%;position:relative;flex-shrink:0;background:#fff}
          #tryfrelo-live-offer-faq-preview .fp-selected .fp-radio{border-color:#B9923B;background:#B9923B;box-shadow:inset 0 0 0 4px #fff}
          #tryfrelo-live-offer-faq-preview .fp-plan-name{font-weight:800;font-size:18px;}
          #tryfrelo-live-offer-faq-preview .fp-save-pill{background:#1B0D02;color:#fff;font-size:11px;font-weight:900;padding:3px 9px;border-radius:999px;letter-spacing:.5px;margin-left:auto;white-space:nowrap}
          #tryfrelo-live-offer-faq-preview .fp-price-row{padding:6px 16px 0;display:flex;align-items:baseline;gap:5px}
          #tryfrelo-live-offer-faq-preview .fp-price{font-weight:900;font-size:32px;line-height:1;}
          #tryfrelo-live-offer-faq-preview .fp-per{font-size:13px;color:rgba(27,13,2,.42)}
          #tryfrelo-live-offer-faq-preview .fp-strike{font-size:13px;color:rgba(27,13,2,.30);text-decoration:line-through;margin-left:4px}
          #tryfrelo-live-offer-faq-preview .fp-meta{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:5px 16px 13px;border-bottom:1px solid rgba(27,13,2,.07);font-size:13px;color:rgba(27,13,2,.48)}
          #tryfrelo-live-offer-faq-preview .fp-ball{font-weight:800;color:#1B0D02;white-space:nowrap}
          #tryfrelo-live-offer-faq-preview .fp-expanded{display:none;} #tryfrelo-live-offer-faq-preview .fp-selected .fp-expanded{display:block;}
          #tryfrelo-live-offer-faq-preview .fp-checks{list-style:none;padding:14px 16px 0;margin:0;display:flex;flex-direction:column;gap:7px}
          #tryfrelo-live-offer-faq-preview .fp-checks li{font-size:16px;display:flex;gap:8px;line-height:1.25}.fp-checks li:before{content:'✓';color:#B9923B;font-weight:900}
          #tryfrelo-live-offer-faq-preview .fp-included-head{display:flex;align-items:center;gap:8px;margin:14px 16px 8px;}
          #tryfrelo-live-offer-faq-preview .fp-included-title{font-size:11px;font-weight:900;letter-spacing:2px;text-transform:uppercase;color:rgba(27,13,2,.38);margin:0;}
          #tryfrelo-live-offer-faq-preview .fp-duo-note{font-size:11px;color:rgba(27,13,2,.45);margin:0 16px 8px;font-weight:600;display:none;}
          #tryfrelo-live-offer-faq-preview[data-people="duo"] .fp-duo-note{display:block;}
          #tryfrelo-live-offer-faq-preview .fp-duo-mult{display:none;background:linear-gradient(135deg,#B9923B,#D4A84B);color:#fff;font-size:11px;font-weight:900;padding:3px 10px;border-radius:999px;} #tryfrelo-live-offer-faq-preview[data-people="duo"] .fp-duo-mult{display:inline-block;}
          #tryfrelo-live-offer-faq-preview .fp-inc-scroll-wrap{position:relative;overflow:hidden;margin:0 16px 14px}.fp-inc-scroll-wrap:after{content:'';position:absolute;top:0;right:0;width:36px;height:100%;background:linear-gradient(to right,transparent,rgba(255,253,248,.9));pointer-events:none}
          #tryfrelo-live-offer-faq-preview .fp-inc-scroll{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;padding-right:8px;scrollbar-width:none}.fp-inc-scroll::-webkit-scrollbar{display:none}
          #tryfrelo-live-offer-faq-preview .fp-inc-item{flex:0 0 65px;text-align:center}.fp-inc-img{width:65px;height:65px;border-radius:10px;background:#F5EFE4;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:4px}.fp-inc-img img{width:100%;height:100%;object-fit:cover}.fp-inc-old{font-size:11px;color:rgba(27,13,2,.35);text-decoration:line-through;line-height:1}.fp-inc-name{font-size:12px;color:#1B0D02;font-weight:700;line-height:1.15;margin-top:2px}
          #tryfrelo-live-offer-faq-preview .fpd-cta{width:100%;border:0;border-radius:999px;background:#B9923B;color:#fff;font-size:24px;font-weight:800;padding:14px 22px;box-shadow:2px 4px 0 #84600b;line-height:1.1;margin:2px 0 12px;cursor:pointer;transition:transform .08s ease, box-shadow .08s ease;}
          #tryfrelo-live-offer-faq-preview .fpd-cta:active{transform:translate(2px,4px);box-shadow:none;}
          #tryfrelo-live-offer-faq-preview .fp-pre{position:relative;overflow:hidden;display:flex;align-items:center;gap:13px;background:linear-gradient(180deg,rgba(185,146,59,.12),rgba(185,146,59,.06));border:1.5px solid rgba(185,146,59,.4);border-radius:14px;padding:12px 16px;margin-top:12px}.fp-pre-ball{font-size:32px;line-height:1;animation:fpdBallBounce 1.15s cubic-bezier(.5,.05,.5,.95) infinite;transform-origin:center bottom}@keyframes fpdBallBounce{0%,100%{transform:translateY(0) scale(1)}22%{transform:translateY(-10px) scale(.95,1.05)}50%{transform:translateY(0) scale(1.08,.92)}64%{transform:translateY(-3px) scale(1)}}
          #tryfrelo-live-offer-faq-preview .fp-one-time{text-align:center;font-size:15px;color:rgba(27,13,2,.42);text-decoration:underline;text-underline-offset:3px;margin:12px 0 0;cursor:pointer;background:none;border:0;width:100%;}
          #tryfrelo-live-offer-faq-preview .fp-toast{display:none;margin:10px 0 0;padding:9px 12px;border-radius:12px;background:#FFF4D4;color:#1B0D02;font-size:13px;font-weight:700;text-align:center;border:1px solid rgba(185,146,59,.35)}
        

    .taste-like-wrap{display:none!important;}
    .frelo-animated-faq{background:#FFFAF0;padding:8px 0 10px;font-family:Afacad,system-ui,sans-serif;color:#1B0D02;}
    .frelo-animated-faq .faq-inner{max-width:680px;margin:0 auto;}
    .frelo-animated-faq .faq-row{border-bottom:1px solid rgba(27,13,2,.15);}
    .frelo-animated-faq .faq-trigger{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:18px 0;border:0;background:transparent;cursor:pointer;color:#1B0D02;}
    .frelo-animated-faq .faq-title{font-family:Fraunces,Georgia,serif;font-weight:800;font-size:22px;line-height:1.15;font-variation-settings:'SOFT' 0,'WONK' 1;color:#1B0D02;}
    .frelo-animated-faq .faq-plus{font-family:Afacad,system-ui,sans-serif;font-size:32px;line-height:1;color:#5C3A20;transition:transform .3s ease;transform-origin:center;}
    .frelo-animated-faq .faq-row.is-open .faq-plus{transform:rotate(45deg);}
    .frelo-animated-faq .faq-answer{max-height:0;opacity:0;overflow:hidden;transition:max-height .5s ease-out,opacity .5s ease-out;}
    .frelo-animated-faq .faq-row.is-open .faq-answer{opacity:1;}
    .frelo-animated-faq .faq-content{padding:0 0 22px;color:#5C3A20;font-size:18px;line-height:1.55;}
    .frelo-animated-faq .faq-content p{margin:0 0 14px;}
    .marker-faq{display:inline;background-image:linear-gradient(transparent 18%,rgba(185,146,59,.42) 18%,rgba(185,146,59,.42) 92%,transparent 92%);background-repeat:no-repeat;background-size:0% 100%;background-position:0% 100%;transition:background-size .85s cubic-bezier(.65,0,.35,1);padding:0 5px;margin:0 -3px;border-radius:2px;}
    .faq-row.is-open .marker-faq{background-size:100% 100%;}.faq-row.is-open .marker-faq.delay-1{transition-delay:.25s}.faq-row.is-open .marker-faq.delay-2{transition-delay:.7s}.faq-row.is-open .marker-faq.delay-3{transition-delay:1.15s}.marker-faq.rust-accent{background-image:linear-gradient(transparent 18%,rgba(185,146,59,.32) 18%,rgba(185,146,59,.32) 92%,transparent 92%)}
    .frelo-faq-cta{display:inline-flex;align-items:center;gap:8px;margin:4px auto 0;padding:12px 22px;border-radius:999px;background:#1B0D02;color:#FFF8E8!important;text-decoration:none;font-size:18px;font-weight:800;box-shadow:0 5px 14px rgba(27,13,2,.18);transition:background .2s,transform .2s;}.frelo-faq-cta:hover{background:#5C3A20;transform:translateY(-1px)}
    .ing-vis{position:relative;width:100%;max-width:380px;margin:6px auto 16px;aspect-ratio:1/1;}
    .ing-vis svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
    .ing-line{opacity:0;stroke-dasharray:100;stroke-dashoffset:100;transition:stroke-dashoffset .85s cubic-bezier(.65,0,.35,1),opacity .4s ease;}.faq-row.is-open .ing-line{opacity:.6;stroke-dashoffset:0;}
    .ing-ball-wrapper{position:absolute;left:50%;top:50%;width:35%;height:35%;transform:translate(-50%,-50%);cursor:pointer;}
    .ing-ball{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 35% 28%,#7a4931 0%,#3a170e 42%,#150603 100%);box-shadow:0 18px 34px rgba(27,13,2,.35), inset -18px -20px 28px rgba(0,0,0,.38), inset 12px 10px 18px rgba(255,235,200,.18);transform:scale(0);transition:transform .62s cubic-bezier(.34,1.56,.64,1);}
    .faq-row.is-open .ing-ball{transform:scale(1);animation:ballFloat 5.5s ease-in-out .8s infinite;}.ing-ball:after{content:'';position:absolute;top:20%;left:26%;width:13%;height:10%;border-radius:50%;background:rgba(255,250,230,.9);filter:blur(1.5px)}@keyframes ballFloat{0%{transform:scale(1) translateY(0) rotate(-2deg)}50%{transform:scale(1.02) translateY(-8px) rotate(2deg)}100%{transform:scale(1) translateY(0) rotate(-2deg)}}
    .ing-label-wrapper{position:absolute;opacity:0;transform:translate(-50%,-50%) scale(.55);transition:opacity .5s ease,transform .6s cubic-bezier(.34,1.56,.64,1);}.faq-row.is-open .ing-label-wrapper{opacity:1;transform:translate(-50%,-50%) scale(1);}
    .ing-label-pill{border:1px solid rgba(27,13,2,.15);border-radius:999px;background:#fff;color:#1B0D02;box-shadow:0 6px 14px rgba(27,13,2,.12);padding:7px 10px;font-weight:800;font-size:13px;white-space:nowrap;display:flex;gap:6px;align-items:center;cursor:pointer;transition:transform .2s cubic-bezier(.34,1.56,.64,1),background .2s,box-shadow .2s;}.ing-label-pill:hover{transform:scale(1.07);background:#E5D5BF;box-shadow:0 8px 18px -4px rgba(27,13,2,.25)}.ing-label-pill:active{transform:scale(.97)}
    .click-me-anim{display:inline-flex;align-items:center;gap:8px;background:#1B0D02;color:#FFF8E8;font-weight:800;padding:9px 15px;border-radius:999px;box-shadow:0 8px 18px rgba(27,13,2,.18);font-size:13px;letter-spacing:.03em;animation:clickMeBob 1.9s ease-in-out infinite;transform-origin:center;}@keyframes clickMeBob{0%{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(2deg) translateY(-4px)}100%{transform:rotate(-8deg) translateY(0)}}
    .frelo-viz-grid{display:grid;grid-template-columns:1fr;gap:12px;padding:4px 0 12px;}@media(min-width:640px){.frelo-viz-grid{grid-template-columns:repeat(3,1fr)}}
    .frelo-viz-card{background:#FFFDF8;border:1.5px solid rgba(27,13,2,.14);border-radius:18px;padding:16px;transform:translateY(12px);opacity:0;transition:opacity .45s ease,transform .55s cubic-bezier(.34,1.56,.64,1);}.faq-row.is-open .frelo-viz-card{opacity:1;transform:translateY(0)}.frelo-viz-card:nth-child(2){transition-delay:.1s}.frelo-viz-card:nth-child(3){transition-delay:.2s}.frelo-viz-icon{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#fff79a 0%,#b9923b 60%,#9f7925 100%);margin-bottom:9px;font-size:20px}.frelo-viz-card h4{font-family:Fraunces,Georgia,serif;font-size:19px;line-height:1.05;margin:0 0 7px;color:#1B0D02}.frelo-viz-card p{font-size:15px;line-height:1.35;margin:0;color:#5C3A20}
    .ingredient-modal{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;padding:16px}.ingredient-modal.is-open{display:flex}.ingredient-modal .modal-backdrop{position:absolute;inset:0;background:rgba(27,13,2,.55);animation:modalBackdropIn .3s ease forwards}.ingredient-modal .modal-card{position:relative;background:#FFF8E8;border-radius:28px;max-width:430px;width:100%;padding:28px;box-shadow:0 18px 48px rgba(0,0,0,.28);animation:modalCardIn .5s cubic-bezier(.16,1,.3,1)}@keyframes modalBackdropIn{from{opacity:0;backdrop-filter:blur(0)}to{opacity:1;backdrop-filter:blur(8px)}}@keyframes modalCardIn{0%{opacity:0;transform:scale(.88) translateY(20px)}100%{opacity:1;transform:scale(1) translateY(0)}}.ingredient-close{position:absolute;right:14px;top:14px;border:0;background:#F4ECD9;border-radius:50%;width:36px;height:36px;font-size:22px;color:#1B0D02;cursor:pointer}.ingredient-modal .emoji{font-size:58px;text-align:center;margin-bottom:10px}.ingredient-modal .role{text-align:center;text-transform:uppercase;letter-spacing:.23em;color:#B9923B;font-weight:900;font-size:12px}.ingredient-modal h3{text-align:center;font-family:Fraunces,Georgia,serif;font-size:30px;line-height:1.05;margin:6px 0 12px;color:#1B0D02}.ingredient-modal p{font-size:18px;line-height:1.45;color:#5C3A20;text-align:center;margin:0 0 16px}.ingredient-modal ul{list-style:none;margin:0;padding:14px;background:#fff;border:1px solid rgba(27,13,2,.1);border-radius:18px}.ingredient-modal li{font-size:17px;color:#5C3A20;margin:8px 0;display:flex;gap:9px}.ingredient-modal li:before{content:'✦';color:#B9923B;flex-shrink:0}
  
.taste-like-wrap {
    order: 3;
  }
  .tastes-like .tastes {
    display: none;
  }
  .tastes-like .tastes.selected {
    display: block;
  }

  /* ---- Drawer shell ---- */
  .nld {
    position: fixed;
    inset: 0;
    z-index: 500;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
    display: flex;
  }
  .nld[hidden] {
    display: none;
  }
  .nld[data-open='true'] {
    opacity: 1;
    pointer-events: auto;
  }
  .nld__panel {
    margin-left: auto;
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    max-width: 500px;
    background: #fff;
    transform: translateX(100%);
    transition: transform 0.22s ease;
    will-change: transform;
  }
  .nld[data-open='true'] .nld__panel {
    transform: translateX(0);
  }
  .nld__header {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 1.25rem;
  }
  .nld__heading {
    font-weight: 700;
  }
  .nld__close {
    position: absolute;
    right: 1.25rem;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    padding: 0;
    border: 0;
    background: none;
    color: #000;
    cursor: pointer;
  }
  .nld__toggle {
    flex: 0 0 auto;
    display: flex;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
  }
  .nld__toggle-btn {
    flex: 1;
    padding: 0.6rem 1rem;
    border: 1px solid #007e40;
    border-radius: 999px;
    background: #fff;
    color: #007e40;
    font-weight: 600;
    cursor: pointer;
    transition:
      background 0.15s ease,
      color 0.15s ease;
  }
  .nld__toggle-btn.is-active {
    background: #007e40;
    color: #fff;
  }
  .nld__product {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
  }
  .nld__product[hidden] {
    display: none;
  }
  .nld__scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-bottom: 20px;
    -webkit-overflow-scrolling: touch;
  }
  .nld__pane[hidden] {
    display: none;
  }
  .nld__fallback {
    display: block;
    width: 100%;
    height: auto;
  }

  /* Mobile: bottom sheet, content-height capped, ~12vh top gap, slide up (D1) */
  @media (max-width: 991px) {
    .nld {
      flex-direction: column;
      justify-content: flex-end;
    }
    .nld__panel {
      margin: 0;
      width: 100%;
      max-width: none;
      height: auto;
      max-height: 88vh;
      border-radius: 16px 16px 0 0;
      transform: translateY(100%);
    }
    .nld[data-open='true'] .nld__panel {
      transform: translateY(0);
    }
  }

  /* ---- Label body ---- */
  .nl {
    background: #00592d;
    color: #fff;
    padding: 1.5rem 1.25rem 2.5rem;
  }
  .nl__eyebrow {
    margin: 0 0 0.25rem;
    color: #ffc107;
    font-family: var(--font-tertiary);
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }
  .nl__title {
    margin: 0 0 1rem;
    font-size: 56px;
    font-weight: 700;
    line-height: 61.6px;
    letter-spacing: -2.8px;
  }
  .nl__meta {
    margin: 0 0 1.25rem;
  }
  .nl__meta div {
    margin-bottom: 0.15rem;
    font-size: 16px;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.48px;
  }
  .nl__meta dt,
  .nl__meta dd {
    display: inline;
    margin: 0;
  }
  .nl__meta dt {
    font-weight: 700;
  }
  .nl__carb-headline {
    margin: 1rem 0 0.5rem;
    color: #ffc107;
    font-weight: 800;
    font-size: 1.85rem;
    line-height: 1.05;
  }
  .nl__carb-stats {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
  }
  .nl__stat {
    display: flex;
    flex-direction: column;
  }
  .nl__stat b {
    font-size: 1.6rem;
    font-weight: 800;
  }
  .nl__stat small {
    font-size: 1rem;
    letter-spacing: -0.48px;
  }
  .nl__h {
    margin: 1.25rem 0 0.6rem;
    font-size: 24px;
    font-weight: 600;
    line-height: 28.8px;
    letter-spacing: -1.2px;
  }
  .nl__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0 0 1rem;
    padding: 0;
    list-style: none;
  }
  .nl__pill {
    background: var(--color-green-bright);
    color: var(--color-off-black);
    border: 0;
    border-radius: 999px;
    padding: 2px 6px;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: -0.48px;
    line-height: 19.2px;
  }
  .nl__notices {
    border-top: 4px solid #fff;
    padding-top: 0.5rem;
  }
  .nl__notice {
    margin-bottom: 0.5rem;
  }
  .nl__notice--bordered {
    padding: 0.5rem;
    border: 1px solid rgba(255, 255, 255, 0.5);
  }
  .nl__notice .metafield-rich_text_field,
  .nl__notice .metafield-rich_text_field p {
    font-size: 16px;
    font-weight: 400;
    line-height: 140%;
  }
  .nl__notice .metafield-rich_text_field p,
  .nl-facts__extra-cell .metafield-rich_text_field p {
    margin: 0;
  }
  .nl__notice a {
    color: inherit;
    text-decoration: underline;
  }

  /* ---- Supplement Facts table ---- */
  .nl-facts {
    width: 100%;
    table-layout: fixed;
    margin-bottom: 0;
    border-collapse: collapse;
    color: #fff;
  }
  .nl-facts__col-value {
    width: 4.5rem;
  }
  .nl-facts__col-dv {
    width: 4rem;
  }
  .nl-facts th,
  .nl-facts td {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    text-align: left;
    vertical-align: top;
  }
  .nl-facts thead th {
    border-bottom: 4px solid #fff;
    font-size: 0.8rem;
    font-weight: 700;
  }
  .nl-facts__row {
    font-size: 16px;
    font-weight: 500;
    line-height: 19.2px;
    letter-spacing: -0.48px;
  }
  .nl-facts__value {
    text-align: right;
  }
  .nl-facts__dv {
    text-align: right;
    white-space: nowrap;
  }
  .nl-facts__name {
    padding-left: calc(var(--indent, 0) * 16px);
    font-weight: 500;
    overflow-wrap: anywhere;
  }
  .nl-facts__row--border-1px > * {
    border-bottom: 1px solid rgba(255, 255, 255, 0.4);
  }
  .nl-facts__row--border-4px > * {
    border-bottom: 4px solid #fff;
  }
  .nl-facts__extra-cell,
  .nl-facts__extra-cell p {
    padding-bottom: 0.5rem;
    font-size: 14px;
    font-weight: 500;
    line-height: 140%;
  }
  .nl-facts sup {
    font-size: 0.7em;
  }

  /* Kids labels: two age-band %DV columns */
  .nl-facts--kids .nl-facts__col-value {
    width: 4.25rem; /* fit short unit values ("9.9 mcg") on one line; multi-token ("445 mcg RAE") still wrap */
  }
  .nl-facts--kids .nl-facts__col-dv {
    width: 4.5rem; /* fits "14.0%***" + padding without overflowing into the next column */
  }
  .nl-facts--kids thead th {
    vertical-align: bottom; /* bottom-align short + tall headers to the rule */
    white-space: normal; /* override .nl-facts__dv nowrap so age-band headers wrap */
  }

#Banner-template--18534247137346__final_cta_banner_FAtaw8 {
    --banner-desktop-bg: #1B0D02;
  }

  /* Brand chocolate base (continues the page's section family) with a soft warm
     glow in the MIDDLE of the panel — the frelo equivalent of Gruns' green+glow. */
  #Banner-template--18534247137346__final_cta_banner_FAtaw8 .brry-banner__panel {
    background:
      radial-gradient(ellipse 75% 60% at 50% 52%, rgba(194,138,72,0.55) 0%, rgba(142,90,46,0.28) 45%, rgba(0,0,0,0) 75%),
      linear-gradient(180deg, #2A1506 0%, #1B0D02 100%);
  }

  #Banner-template--18534247137346__final_cta_banner_FAtaw8 .brry-banner__star {
    color: #B9923B;
  }

  /* Gruns-style imagery: the pouch sits HALF-HIDDEN, cropped by the panel's bottom edge */
  #Banner-template--18534247137346__final_cta_banner_FAtaw8 .brry-banner__product-image {
    height: 100%;
    translate: none !important;   /* kill Tailwind v4's standalone translate (-translate-x-1/2) — it stacks with transform */
    transform: translate(-50%, 30%) scale(1.12) !important;
  }
  /* Below desktop: ALWAYS centered (the markup's tb: utilities anchor right from the
     tablet breakpoint — override them so the pouch stays middle on every mobile width) */
  @media (max-width: 991px) {
    #Banner-template--18534247137346__final_cta_banner_FAtaw8 .brry-banner__product-image {
      left: 50% !important;
      right: auto !important;
      translate: none !important;
      transform: translate(-50%, 30%) scale(1.12) !important;
    }
  }

  /* Single brand CTA pill (matches the PDP .fpd-cta) */
  #Banner-template--18534247137346__final_cta_banner_FAtaw8 .frelo-banner-cta {
    display: inline-flex; align-items: center; justify-content: center;
    background: #B9923B; color: #fff;
    font-family: 'Fraunces', Georgia, serif !important; font-weight: 700; font-size: 18px;
    border-radius: 100px; padding: 13px 40px; border: none; text-decoration: none;
    box-shadow: 2px 4px 0px 0px #84600b, 0 8px 24px rgba(0,0,0,0.22);
    white-space: nowrap; cursor: pointer;
    transition: transform .08s ease, box-shadow .08s ease, background .15s ease;
  }
  #Banner-template--18534247137346__final_cta_banner_FAtaw8 .frelo-banner-cta:hover { background: #9F7925; }
  #Banner-template--18534247137346__final_cta_banner_FAtaw8 .frelo-banner-cta:active { transform: translate(2px,4px); box-shadow: none !important; }

  @media all and (min-width: 992px) {
    #Banner-template--18534247137346__final_cta_banner_FAtaw8 {
      background-color: var(--banner-desktop-bg);
    }

    #Banner-template--18534247137346__final_cta_banner_FAtaw8 .brry-banner__panel {
      background:
        radial-gradient(ellipse 55% 80% at 62% 50%, rgba(194,138,72,0.5) 0%, rgba(142,90,46,0.25) 45%, rgba(0,0,0,0) 75%),
        linear-gradient(90deg, #1B0D02 0%, #2A1506 100%);
    }

    #Banner-template--18534247137346__final_cta_banner_FAtaw8 .brry-banner__product-image {
      height: clamp(88%, calc(88% + (100vw - 992px) * 0.0268), 100%);
      transform: translateY(24%) scale(1.05) !important;
    }
  }
 #family-bundle #rebuy-cart,#family-bundle .rebuy-cart__background,#surprise-family-bundle #rebuy-cart,#surprise-family-bundle .rebuy-cart__background {display: none;} 

  
    /* =========================================================
   UPCART: GLOBAL
   ========================================================= */
    :root {
        --upcart-green:         #007E40;
        --upcart-lt-green:      #BFDFCF;
        --upcart-lt-green-2:    #DFEFE7;
        --upcart-lt-green-3:    #DAECE3;
        --upcart-yellow:        #FFCC2E;
        --upcart-lt-yellow:     #FFF2CB;
        --upcart-white:         #FFFFFF;
        --upcart-black:         #002613;
        --upcart-grey:          #9A9A9A;
        --upcart-lt-grey:       #DDDDDD;
        --upcart-dk-grey:       #001F10;
        --upcart-grey-4:        #F0F1F3;
        --upcart-grey-5:        #D0D3D9;
        --upcart-red:           #DD0605;
    }
    #CartPopup {
        font-family: "DMSans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
        background-color: var(--upcart-white) !important;
        color: var(--upcart-black) !important;
        -webkit-font-smoothing: antialiased;
    }
    #CartPopup .hidden {
        display: none !important;
    }
    /* margin snippet */
    @media all and (min-width: 768px) {
        #CartPopup {
            height: 98.5%;
            max-height: 98.5%;
            margin: 8px;
            border-radius: 15px;
        }
        .styles_CartPreview__right__ {
            right: -508px !important;
        }
        .styles_CartPreview__right__.styles_active__ {
            right: 0px !important;
        }
    }

/* =========================================================
   UPCART: HEADER
   ========================================================= */
    .upcart-internal-header {
        padding: 10px 16px 10px 16px;
        border: 0;
    }
    .upcart-internal-header h2 {
        font-size: 20px;
        /* text-transform: uppercase; */
        color: var(--upcart-black);
        font-weight: 600;
        letter-spacing: -1px;
        line-height: 24px;
    }
    .upcart-header-close-button svg,
    .upcart-public-header__close-button-icon {
        width: 24px;
        height: 24px;
    }
    .upcart-internal-header__close-button {
        background-color: transparent !important;
    }
    .upcart-internal-header__close-button svg path {
        fill: var(--upcart-black);
    }
    /* .upcart-header-text {
    width: 100%;
    color: var(--upcart-white);
    text-align: center;
    } */

/* =========================================================
   UPCART: TIERED/TRIGGERED REWARDS
   ========================================================= */

   .upcart-public-rewards {
        padding: 12px 16px 16px 16px;
        background-color: var(--upcart-grey-4);
   }
   .upcart-public-rewards.completed {
        background-color: var(--upcart-lt-green-2);
   }
   .upcart-public-rewards p {
        font-size: 16px;
        font-weight: 500;
        letter-spacing: 0;
        line-height: 22.4px;
        margin-bottom: 10px !important;
   }
   .upcart-public-rewards b,
   .upcart-public-rewards strong {
        font-weight: 700;
        color: var(--upcart-green);
   }
   .upcart-public-rewards.uninitialized em,
   .upcart-public-rewards.uninitialized i {
        color: var(--upcart-green);
   }
   .upcart-public-rewards em,
   .upcart-public-rewards i {
        font-style: normal;
        font-weight: 700;
        color: var(--upcart-red);
   }
   .upcart-public-rewards .upcart-internal-component-segmented-progress-bar__segment-fill {
        background-color: var(--upcart-green);
   }

/* =========================================================
   UPCART: BELOW HEADER/ANNOUNCEMENTS/REWARDS
   ========================================================= */

   #cart-announcements {
        background-color: var(--upcart-black);
        color: var(--upcart-white);
        padding: 8px 16px;
   }
   #cart-announcements h3 {
        color: var(--upcart-white);
        font-size: 16px;
        font-weight: 600;
        letter-spacing: -0.8px;
        line-height: 16px;
        text-align: center;
        margin: 0;
   }

/* =========================================================
   UPCART: PRODUCT ITEMS & SECTIONS
   ========================================================= */

    .selling-plan-name {
        position: absolute;
        top: -8px;
        left: 0;
        background-color: var(--upcart-white);
        color: var(--upcart-black);
        font-size: 14px;
        font-weight: 600;
        line-height: 14px;
        padding-right: 8px;
    }
    .selling-plan-name span {
        text-transform: lowercase;
    }

    /* discount percentage text */
    .cust-upcart-above-items {
        color: var(--upcart-green);
        font-size: 20px;
        font-weight: 700;
        letter-spacing: -0.02em;
        text-align: center;
    }
    .upcart-internal-cart-items {
        background-color: var(--upcart-white);
        color: var(--upcart-black);
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding: 20px 16px 10px 16px;
    }
    /* line-item delete button */
    .upcart-public-component-product-tile__remove-button path {
        fill: var(--upcart-dk-grey);
        opacity: 0.7;
    }
    /* line-item */
    .upcart-public-component-product-tile {
        position: relative;
        background-color: #FFFFFF;
        padding: 16px 0 0 0;
        border: 0;
        border-top: 1px solid var(--upcart-grey-5) !important;
        margin-bottom: 10px;
    }
    /* line-item image */
    .upcart-public-component-product-tile__image-wrapper {
        /* border: 1px solid var(--upcart-lt-green); */
        overflow: hidden;
        border-radius: 8px;
        /* disable link to PDPs */
        pointer-events: none;
    }
    /* line-item title */
    .upcart-public-component-product-tile__product-title {
        font-family: "DMSans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
        font-size: 18px;
        line-height: 18px;
        font-weight: 700;
        color: var(--upcart-black);
        margin-bottom: 0;
        pointer-events: none;
    }
    /* line-item variant */
    .upcart-internal-component-product-tile__variant {
        opacity: 1 !important;
    }
    .upcart-public-component-product-tile__variant,
    .upcart-public-component-product-tile .count-and-frequency {
        font-size: 14px;
        line-height: 14px;
        font-weight: 500;
        color: var(--upcart-dk-grey) !important;
        margin-bottom: 4px;
    }
    .upcart-public-component-product-tile .count-and-frequency {
        margin-bottom: 16px;
    }
    .upcart-public-component-product-tile__variant .variant-name span,
    .upcart-public-component-product-tile .count-and-frequency span {
        opacity: 70% !important;
        font-size: 14px;
        line-height: 14px;
        font-weight: 500;
        color: var(--upcart-dk-grey) !important;
    }
    /* line-item frequency message */
    .upcart-public-component-product-tile__properties {
        display: none;
        visibility: hidden;
    }
    .subscription-discount-tags {
        margin-bottom: 16px;
    }
    .upcart-public-component-product-tile__product-pricing {
        height: 28px;
    }
    .upcart-public-component-product-tile__product-pricing,
    .upcart-internal-component-product-tile__price {
        justify-content: flex-start;
        color: var(--upcart-black);
        font-size: 18px !important;
        font-weight: 700 !important;
    }
    .upcart-public-component-product-tile__product-pricing .actual-price,
    .upcart-public-component-product-tile__product-pricing .price-quantity {
        opacity: 95%;
    }
    .upcart-public-component-product-tile__product-pricing .anchor-price {
        opacity: 70%;
        font-weight: 400;
    }
    /* line-item message */
    .subscription-savings-applied {
        color: var(--upcart-green);
        font-weight: 400;
        font-size: 12px;
        line-height: 12px;
        text-align: right;
        margin-bottom: 16px;
    }
    /* .upcart-public-component-product-tile__price-compare-at {
        color: var(--upcart-grey);
        font-size: 0.75rem;
        font-weight: normal;
        margin-right: 0.25em;
        opacity: 1;
    } */
    .quantity-and-discounts {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        gap: 8px;
    }
    /* line-item quantity */
    .upcart-public-component-product-tile__quantity-selector {
        border-radius: 44px;
        border: 1px solid var(--upcart-lt-grey);
        overflow: hidden;
        height: 44px;
    }
    .upcart-internal-component-product-tile__quantity-plus {
        border-left: 0;
    }
    .upcart-internal-component-product-tile__quantity-minus {
        border-right: 0;
    }
    .upcart-public-component-product-tile__quantity-selector input {
        color: var(--upcart-black);
        font-size: 16px;
        font-weight: 700;
    }
    .upcart-public-component-product-tile__quantity-selector button {
        width: 44px;
        padding: 0;
    }
    .upcart-public-component-product-tile__quantity-selector button svg {
        width: 24px;
        height: 24px;
    }
    .upcart-public-component-product-tile__quantity-selector button path {
        fill: var(--upcart-black);
    }
    /* line-item discount tags */
    .discounts-applied {
        /* margin-bottom: 16px; */
        display: block;
    }
    .upcart-public-component-tag {
        background-color: var(--upcart-lt-green-3);
        color: var(--upcart-black);
        border-radius: 4px;
    }
    .upcart-public-component-tag .upcart-public-component-tag__text {
        font-size: 14px !important;
        font-weight: 500 !important;
        color: var(--upcart-black);
    }
    .potential-discounts:hover {
        cursor: pointer;
    }


    /* hide product qty selector */
    /* .upcart-public-component-product-tile .Stack__item--fill .Stack .Stack__item:first-child {
        display: none;
    } */
    /* .upcart-products-section .upcart-subscription-upgrade-section {
        display: none;
    } */

/* =========================================================
   UPCART: UPSELLS
   ========================================================= */
    /* add area for AB test content */
    .upsells-intro {
        /* width: calc(100% + 32px);
        margin-left: 16px;
        margin-right: -16px; */
        /* margin-top: -15px; */
        padding-top: 15px;
        margin-bottom: 15px;
    }
    /* bring upsells to top of area */
    .styles_CartPreview__bottomModules__ {
        margin-top: 0;
    }
    .upcart-internal-upsell__vertical-layout-wrapper {
        padding-left: 16px;
        padding-right: 16px;
        background-color: var(--upcart-lt-yellow);
    }
    /* section heading */
    .upcart-internal-style__title-large {
        margin-bottom: 0;
    }
    .upcart-public-upsell__title p {
        font-size: 14px !important;
        font-weight: 400;
        letter-spacing: normal;
        color: var(--upcart-black);
        line-height: 2.6rem;
    }
    /* cross-sell messaging */
    .upcart-crosssell {
        font-size: 14px;
        font-weight: 400;
        color: var(--upcart-black);
        text-align: left;
        margin-bottom: 20px;
    }
    .upcart-crosssell-header,
    .upcart-upsell-header {
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 4px;
        letter-spacing: -1px;
        font-weight: 600;
    }
    .upcart-crosssell-intro,
    .upcart-upsell-intro {
        font-size: 14px;
        line-height: 22.4px;
        font-weight: 500;
    }
    .upcart-upsell-intro {
        margin-bottom: 12px !important;
    }
    .upcart-crosssell-footnote,
    .upcart-upsell-footnote {
        font-size: 12px;
        color: var(--upcart-black);
        font-weight: 400;
        line-height: 14px;
        /* margin-top: 12px !important; */
    }
    .upcart-upsell-item-image-wrapper {
        background-color: transparent;
    }
    .upcart-public-component-upsell-tile__image-container {
        border-radius: 8px;
    }
    .upcart-upsells {
        border-radius: 20px;
    }
    .upcart-internal-component-upsell-tile {
        background-color: var(--upcart-white);
        border-radius: 12px;
        padding: 12px !important;
        margin-bottom: 17px !important;
        align-items: flex-start;
        /* border: 1px solid #BFDFCF !important; */
        /* border: 1px solid var(--upcart-lt-green) !important; */
    }
    .upcart-public-component-upsell-tile__title {
        font-family: "DMSans", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    }
    .upsell-content {
        margin-bottom: 12px;
    }
    .upsell-title-and-price {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        gap: 4px;
    }
    @media all and (max-width: 480px) {
        .upsell-title-and-price {
            flex-wrap: wrap;
            row-gap: 0;
        } 
    }
    .upsell-title-and-price span {
        /* font-size: 16px; */
        font-weight: 700;
        line-height: 22.4px;
    }
    .upsell-title-and-price h4 {
        margin-bottom: 0 !important;
    }
    .upcart-public-component-upsell-tile__price-row {
        margin-bottom: 0 !important;
    }
    .upsell-description p,
    .upsell-description {
        font-size: 12px;
        font-weight: 500;
        line-height: 16.8px;
    }
    /* upsell images */
    .upcart-internal-component-upsell-tile__image-container {
        /* border: 1px solid #BFDFCF; */
        /* overflow: hidden; */
        /* border-radius: 10px; */
        width: 140px !important;
        height: 140px !important;
    }
    @media all and (max-width: 480px) {
        .upcart-internal-component-upsell-tile__image-container {
            width: 100px !important;
            height: 100px !important;
        }        
    }
    .upsell-media {
        /* disable link to PDPs */
        pointer-events: none;
    }
    /* upsell title */
    .upcart-internal-component-upsell-tile__title {
        font-size: 16px;
        line-height: 22.4px;
        font-weight: 700;
        color: var(--upcart-black);
    }
    /* upsell variant title */
    .upcart-internal-component-upsell-tile__variant {
        font-size: 12px;
        line-height: 16px;
        font-weight: 400;
        opacity: 1;
        color: var(--upcart-black);
    }
    /* upsell stars */
    .upcart-public-component-upsell-tile__rating-row {
        display: none;
        visibility: hidden;
    }
    .upcart-internal-component-upsell-tile__stars {
        color: var(--upcart-yellow);
    }
    .upcart-internal-component-upsell-tile__star--partial span:first-child {
        color: var(--upcart-yellow);
    }
    .upcart-internal-component-upsell-tile__star--partial span:last-child {
        color: transparent;
    }
    /* upsell prices */
    .upcart-internal-component-upsell-tile__price-row {
        justify-content: flex-end;
        flex-direction: row-reverse;
    }
    .upcart-public-component-upsell-tile__price {
        color: var(--upcart-black);
        font-size: 16px;
        font-weight: 500;
    }
    .upcart-public-component-upsell-tile__price-compare-at {
        color: var(--upcart-dk-grey);
        font-size: 0.75rem;
        line-height: 12px !important;
        margin-right: 0.25em;
        opacity: 0.7 !important;
        font-weight: 400 !important;
        text-decoration: line-through;
    }
    /* hide frequency selector */
    .upcart-internal-component-upsell-tile__variant-row select {
        display: none;
        visibility: hidden;
    }
    /* upsell ATC button */
    .upcart-internal-component-upsell-tile .upcart-internal-component__button {
        background-color: var(--upcart-yellow);
        color: var(--upcart-black);
        border: 1px solid var(--upcart-black);
        font-size: 14px;
        font-weight: 700;
        line-height: 14px;
        padding: 8px 16px;
        box-shadow: 1px 1px 0 0 var(--upcart-black);
    }


/* =========================================================
   CUSTOM: UPGRADE BUTTONS EXTRA CONTENT    
   ========================================================= */

    .subscription-upgrade,
    .quarterly-upgrade {
        position: relative;
        background-color: var(--upcart-lt-green-3);
        color: var(--upcart-black);
        border-radius: 8px;
        padding: 16px 24px;
        margin-top: 24px;
    }
    .upcart-public-component-product-tile__subscription-upgrade .subscription-upgrade-heading-tag-wrapper,
    .upcart-quarterly-upgrade-wrapper .quarterly-upgrade-heading-tag-wrapper {
        position: absolute;
        top: -15px;
        left: 0;
        width: 100%;
        text-align: center;
    }
    .upcart-public-component-product-tile__subscription-upgrade .subscription-upgrade-heading-tag,
    .upcart-quarterly-upgrade-wrapper .quarterly-upgrade-heading-tag {
        font-size: 14px;
        font-weight: 700;
        letter-spacing: -0.44px;
        line-height: 14px;
        color: var(--upcart-black);
        background-color: var(--upcart-yellow);
        padding: 3px 6px;
        border-radius: 100px;
        display: inline-block;
    }
    .upcart-public-component-product-tile__subscription-upgrade h5,
    .upcart-quarterly-upgrade-wrapper h5 {
        font-size: 18px;
        line-height: 18px;
        font-weight: 700;
        text-align: center;
        margin-bottom: 12px;
    }
    .upcart-public-component-product-tile__subscription-upgrade ul,
    .upcart-quarterly-upgrade-wrapper ul {
        font-size: 14px;
        line-height: 16.8px;
        font-weight: 500;
        margin-bottom: 16px;
    }
    .upcart-public-component-product-tile__subscription-upgrade li,
    .upcart-quarterly-upgrade-wrapper li {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        gap: 4px;
        margin: 7px 0;
    }
    .upcart-public-component-product-tile__subscription-upgrade svg path,
    .upcart-quarterly-upgrade-wrapper svg path {
        fill: var(--upcart-black);
    }


/* =========================================================
   CUSTOM: BUY MORE SAVE MORE (BMSM)
   ========================================================= */
    .upcart-cust-bmsm-feature {
        z-index: 9;
        gap: 4px;
        display: none;
        margin: 0px 0px;
        /* hide for cart v2 */
        display: none !important;
        visibility: hidden !important;
    }
    .upcart-cust-bmsm-feature.active {
        display: flex;
        margin: 12px 0px 8px 0px;
    }

    .upcart-cust-bmsm-feature-button {
        background-color: var(--upcart-white);
        color: var(--upcart-green);
        border: 1px solid var(--upcart-green);
        display: none;
        align-items: center;
        justify-content: center;
        flex: 1; /* toggle OFF if you want width based on content */
        text-align: center;
        border-radius: 30px;
        padding: 10px 15px;
        font-size: 14px;
        letter-spacing: -0.44px;
        font-weight: 400;
        pointer-events: none;
        cursor: pointer;
        line-height: normal;
        opacity: 1;
    }
    .upcart-cust-bmsm-feature-button.active {
        display: flex;
        pointer-events: all;
    }

/* =========================================================
   CUSTOM: QUARTERLY UPSELL
   ========================================================= */

    /* custom quarterly upsell */
    .upcart-public-component-product-tile__subscription-upgrade-btn {
        display: block;
        background-color: var(--upcart-green);
        font-size: 14px;
        font-weight: 700;
        padding: 10px 15px;
        position: relative;
        height: 40px;
        text-align: center;
        border: 1px solid var(--upcart-black);
        box-shadow: 1px 1px 0 0 var(--upcart-black);
    }
    .upcart-public-component-product-tile__subscription-upgrade-btn > span {
        position: relative;
        top: -3px;
        pointer-events: none;
    }
    .upcart-public-component-product-tile__subscription-upgrade-btn .upcart-internal-component-loader {
        margin-left: auto;
        margin-right: auto;
        border: 1.5px solid var(--upcart-white);
        border-top: 1.5px solid transparent;
    }
    .upcart-subscribe-and-save-btn {
        text-align: center;
    }
    .upcart-subscribe-and-save-btn > span {
        top: -3px;
        display: inline-block;
        width: 100%;
    }
    .upcart-subscribe-and-save-btn .upcart-internal-component-loader {
        margin-left: auto;
        margin-right: auto;
        border: 1.5px solid var(--upcart-white);
        border-top: 1.5px solid transparent;
    }
    .upcart-public-component-product-tile__subscription-upgrade-btn .quarterly-upgrade-icon {
        display: inline-block;
        width: 24px;
        height: 24px;
        position: relative;
        top: 7px;
    }


/* =========================================================
   EMPTY CART
   ========================================================= */

    #CartPopup.emptycart {
        background-color: var(--upcart-grey-4) !important;
    }
    #CartPopup.emptycart > .styles_CartPreview__card__ {
        background-color: var(--upcart-grey-4) !important;
    }
    #CartPopup.emptycart .upcart-public-header {
        background-color: var(--upcart-white) !important;
        border-bottom: 1px solid var(--upcart-grey-5);
    }
    .styles_CartPreview__empty__ {
        height: auto !important;
    }
    .styles_CartPreview__empty__ h3 {
        margin: 40px 0px 16px 0px !important;
        font-size: 32px;
        letter-spacing: -1px;
        font-weight: 600;
        line-height: 35.2px;
    }
    /* hide direct descendant h3 when empty */
    .styles_CartPreview__empty__ > h3 {
        display: none;
        visibility: hidden;
    }
    /* fill full width */
    #CartPopup.emptycart .styles_CartPreview__empty__ > div {
        width: 100%;
    }
    #CartPopup.emptycart .upcart-public-upsell__header {
        display: none;
    }
    .upcart-public-upsell__shop-now-button {
        background: transparent;
        padding: 0;
    }
    #CartPopup.emptycart .upcart-internal-component__button {
        width: calc(100% - 32px) !important;
    }
    .upcart-public-upsell__shop-now-button a {
        background-color: var(--upcart-yellow);
        margin-top: 0;
        padding: 16px 20px;
        border: 1px solid var(--upcart-black);
        box-shadow: 3px 3px 0 0 var(--upcart-black);
        transform: translate(0,0);
        transition: all 0.3s ease-in-out;
        width: 100%;
        display: block;
        font-size: 16px;
        font-weight: 700;
        margin-top: 0;
        line-height: 16px;
        color: var(--upcart-black);
        border-radius: 100px;
    }
    .upcart-public-upsell__shop-now-button a:hover {
        box-shadow: 2px 2px 0 0 var(--upcart-black);
        transform: translate(2px, 2px);
        cursor: pointer;
    }
    .upcart-public-upsell__shop-now-button a:active {
        box-shadow: 0 0 0 0 var(--upcart-black);
        transform: translate(3px, 3px);
    }
    #CartPopup.emptycart .upcart-public-upsell {
        display: none;
        visibility: hidden;
    }
    #CartPopup .upcart-public-upsell {
        display: block;
        visibility: visible;
    }
    /* custom empty cart DOM */
    #CartPopup.emptycart .empty-cart {
        display: block;
        width: 100%;
    }
    .empty-cart-shop-now-button {
        margin: 0px 16px 56px 16px !important;
    }
    .empty-cart-upsells {
        padding: 16px 16px 32px 16px;
    }
    .empty-cart-upsells-header {
        font-size: 20px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -1px;
        color: var(--upcart-black);
        text-align: left;
        margin-bottom: 12px;
    }
    .empty-cart-upsells-products {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .empty-cart-upsells-products .upsell-product {
        background-color: var(--upcart-white);
        border-radius: 12px;
        padding: 9.5px 12px 12px 12px;
        text-align: center;
    }
    .empty-cart-upsells-products .upsell-product img {
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
    }
    .empty-cart-upsells-products .upsell-product h5 {
        font-size: 16px;
        color: var(--upcart-black);
        font-weight: 700;
        line-height: 22.4px;
        text-align: center;
        margin-top: 8px;
        margin-bottom: 4px;
    }
    .empty-cart-upsells-products .upsell-product .upsell-prices {
        display: flex;
        /* flex-direction: row; */
        justify-content: center;
        align-items: center;
        margin-bottom: 4px;
        gap: 4px;
    }
    .empty-cart-upsells-products .upsell-product .upsell-prices span {
        font-size: 14px;
        color: var(--upcart-black);
        font-weight: 700;
        line-height: 19.6px;
        opacity: 95%;
        letter-spacing: 0 !important;
    }
    .empty-cart-upsells-products .upsell-product .upsell-prices span.anchor-price {
        font-size: 12px;
        color: var(--upcart-dk-grey);
        font-weight: 700;
        line-height: 12px;
        opacity: 70%;
        text-decoration: line-through;
    }
    .empty-cart-upsells-products .upsell-product .upsell-description  {
        display: inline-block;
        font-size: 12px;
        color: var(--upcart-black);
        font-weight: 500;
        line-height: 16.8px;
        margin-bottom: 12px !important;
    }
    .empty-cart-upsells-products .upsell-product button  {
        font-size: 14px;
        color: var(--upcart-white);
        background-color: var(--upcart-green);
        font-weight: 700;
        line-height: 14px;
        padding: 8px 16px;
        width: 100%;
        border: 1px solid var(--upcart-black);
        box-shadow: 1px 1px 0 0 var(--upcart-black);
        border-radius: 100px;
    }
    .upcart-public-component-product-tile__controls {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        gap: 8px;
    }
    .potential-discount {
        background-color: transparent;
        color: var(--upcart-dk-grey);
        opacity: 50%;
        border: 1px solid var(--upcart-dk-grey);
        border-style: dashed;
    }

/* =========================================================
   REWARDS / MESSAGING
   ========================================================= */

    .upcart-public-rewards__message {
        margin-bottom: 0 !important;
    }
    .upcart-cust-rewards-subtitle {
        /* margin-bottom: 4px; */
        font-size: 12px;
        line-height: 16px;
    }

/* =========================================================
   WORKAROUNDS / TEMP OVERRIDES
   ========================================================= */

    .upcart-savings-row {
        display: none;
    }
    .cust-disable-input {
        /* background-color: rgb(236, 235, 235) !important; */
        background-color: var(--upcart-white) !important;
    }


/* =========================================================
   CUSTOM: SUBTOTAL AREA   
   ========================================================= */

    .upcart-order-summary {
        background-color: var(--upcart-white);
        color: var(--upcart-black);
        padding: 16px;
    }
    .upcart-order-summary h3 {
        font-size: 20px;
        font-weight: 600;
        line-height: 24px;
        letter-spacing: -1px;
        margin-bottom: 12px;
    }
    .upcart-order-summary .summary-subtotal,
    .upcart-order-summary .summary-discount,
    .upcart-order-summary .summary-shipping,
    .upcart-order-summary .summary-taxes {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: 12px;
    }
    .upcart-order-summary .summary-subtotal span,
    .upcart-order-summary .summary-discount span,
    .upcart-order-summary .summary-shipping span,
    .upcart-order-summary .summary-taxes span {
        font-size: 14px;
        line-height: 14px;
        font-weight: 500;
        color: var(----upcart-dk-grey);
        opacity: 70%;
    }
    .summary-subtotal-value,
    .summary-discount-value,
    .summary-shipping-value,
    .summary-taxes-value {
        font-size: 14px;
        line-height: 14px;
        font-weight: 500;
        color: var(----upcart-black);
    }
    .summary-discount-value,
    .summary-shipping-value {
        font-weight: 700;
        color: var(--upcart-green);
    }
    .summary-shipping-value.otp-only {
        font-weight: 500;
        color: var(--upcart-black);
        text-transform: none;

    }
    .summary-shipping-value {
        text-transform: uppercase;
    }
    .summary-discount-tags-wrapper {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 4px;
    }
    .summary-discount-tags-wrapper.populated {
        margin-bottom: 12px;
    }

/* =========================================================
   FOOTER: SUBTOTAL LAYOUT & TYPOGRAPHY
   ========================================================= */

    .upcart-footer {
        background-color: var(--upcart-white);
        border: 0;
        border-top: 1px solid var(--upcart-lt-grey);
        padding: 16px;
    }
    .styles_Footer__cartSubtotalTitle__ {
        display: flex !important;
        justify-content: space-between !important;
        width: 100% !important;
        align-items: center !important;
        margin-bottom: 16px;
    }
    .styles_Footer__cartSubtotalTitle__ > span:first-child {
        margin-right: auto; /* push everything else to the right */
    }
    .styles_Footer__cartSubtotalTitle__ * {
        font-size: 18px;
        line-height: 18px;
        color: var(--upcart-black);
        font-weight: 700;
    }
    .styles_Footer__cartSubtotalValue__ {
        color: var(--upcart-black) !important;
        align-self: flex-end;
    }
    .upcart-checkout-button {
        background-color: var(--upcart-green) !important;
        color: var(--upcart-white);
        font-size: 18px !important;
        transition: all 0.3s ease-in-out !important;
        transform: translate(0,0);
        letter-spacing: -0.9px;
        font-weight: 600;
        line-height: 21.6px;
        border: 1px solid var(--upcart-black);
        box-shadow: 3px 3px 0 0 var(--upcart-black);
    }
    .upcart-checkout-button:hover {
        box-shadow: 2px 2px var(--upcart-black);
        transform: translate(2px, 2px);
        opacity: 1 !important;
    }
    .upcart-checkout-button:active {
        box-shadow: 0 0 var(--upcart-black);
        transform: translate(3px, 3px);
    }
    .upcart-checkout-button span {
        background-color: transparent;
        margin-left: -32px;
        display: inline-block;
        position: relative;
    }
    .upcart-checkout-button span:after {
        content: "";
        background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDI0IDI0Ij4KICA8dGl0bGU+SWNvbiAtIExvY2s8L3RpdGxlPgogIDxwYXRoIGQ9Ik01LjMsMjEuN2MtLjUsMC0uOS0uMi0xLjMtLjUtLjQtLjQtLjUtLjgtLjUtMS4zdi05LjRjMC0uNS4yLS45LjUtMS4zLjQtLjQuOC0uNSwxLjMtLjVoMi4ydi0yYzAtMS4yLjQtMi4zLDEuMy0zLjIuOS0uOSwxLjktMS4zLDMuMi0xLjNzMi4zLjQsMy4yLDEuM2MuOS45LDEuMywxLjksMS4zLDMuMnYyaDIuMmMuNSwwLC45LjIsMS4zLjUuNC40LjUuOC41LDEuM3Y5LjRjMCwuNS0uMi45LS41LDEuM3MtLjguNS0xLjMuNUg1LjNaTTUuMywyMC4yaDEzLjRjMCwwLC4yLDAsLjIsMCwwLDAsMC0uMSwwLS4ydi05LjRjMCwwLDAtLjIsMC0uMiwwLDAtLjEsMC0uMiwwSDUuM2MwLDAtLjIsMC0uMiwwLDAsMCwwLC4xLDAsLjJ2OS40YzAsMCwwLC4yLDAsLjIsMCwwLC4xLDAsLjIsMFpNMTIsMTdjLjUsMCwuOS0uMiwxLjItLjUuMy0uMy41LS44LjUtMS4ycy0uMi0uOS0uNS0xLjItLjgtLjUtMS4yLS41LS45LjItMS4yLjVjLS4zLjMtLjUuOC0uNSwxLjJzLjIuOS41LDEuMmMuMy4zLjguNSwxLjIuNVpNOSw4LjdoNnYtMmMwLS44LS4zLTEuNS0uOS0yLjEtLjYtLjYtMS4zLS45LTIuMS0uOXMtMS41LjMtMi4xLjljLS42LjYtLjksMS4zLS45LDIuMXYyWiIgc3R5bGU9ImZpbGw6I2ZmZiIvPgo8L3N2Zz4K);
        display: block;
        position: absolute;
        width: 24px;
        height: 24px;
        left: calc(100% + 8px);
        top: -2px;
        overflow: clip;
    }

/* =========================================================
   FOOTER: CUSTOM INJECTED ELEMENTS (WRAPPER / SAVINGS / OG PRICE)
   ========================================================= */

    .cust-upcart-wrapper {
        align-self: flex-end;
    }
    .styles_Footer__cartSummarySection__ {
        padding: 0;
    }
    .cust-upcart-og-price {
        -webkit-font-smoothing: antialiased;
        -webkit-text-size-adjust: 100%;
        text-rendering: optimizeSpeed;
        font: inherit;
        font-style: inherit;
        letter-spacing: inherit;
        text-indent: inherit;
        text-shadow: inherit;
        text-transform: inherit;
        word-spacing: inherit;
        line-height: 16px;
        text-align: right;
        color: var(--upcart-dk-grey);
        opacity: 70%;
        font-size: 0.88em;
        font-weight: 500;
        margin-left: 0px;
        text-decoration-line: line-through;
        box-sizing: border-box;
    }
    .cust-upcart-savings {
        padding: 4px 12px;
        margin-right: 4px;
        background-color: var(--upcart-yellow);
        border-radius: 30px;
        color: var(--upcart-black);
        font-size: 0.75em;
    }

    /* keep right-side grouping tight and on one line */
    .cust-upcart-wrapper,
    .styles_Footer__cartSubtotalValue__ {
        margin-left: 0.5rem; /* small gap between elements */
        white-space: nowrap;  /* keep them on one line */
    }


/* =========================================================
   FOOTER: POST-CHECKOUT BUTTON
   ========================================================= */

    .post-checkout-button {
        padding: 12px 0 0 0;
    }
    .post-checkout-button-wrapper {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 4px;
    }
    .cart-footer-area .content {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        flex-wrap: nowrap;
        gap: 4px;
    }
    .cart-footer-area .content span {
        font-size: 12px;
        line-height: 14px;
        font-weight: 500;
        max-width: 8em;
    }
    .cart-footer-area .content svg {
        width: 20px;
        height: 20px;
    }

  
