/** Shopify CDN: Minification failed

Line 155:0 Expected "}" to go with "{"

**/

/* =========================================
   Sold out product cards
   ========================================= */
product-card.product-card--sold-out img {
 filter:grayscale(90%) saturate(50%) brightness(1.01) contrast(.90) !important;
}
product-card.product-card--sold-out .text-block {
  opacity: .50;
}


/* =========================================
   Menu hover
   ========================================= */

@media screen and (min-width: 750px) and (hover: hover) {

  /* Menu text / clickable area */
  #header-component .header-menu .menu-list__link-title {
    padding: 8px 12px;
    border-radius: 999px;
    transition:
      background-color 160ms ease,
      color 160ms ease;
  }

  /* Disable Horizon's default "dim other menu items" effect */
  #header-component
  .header-menu
  .menu-list:has(.menu-list__list-item:hover)
  .menu-list__link {
    color: var(--menu-top-level-font-color);
  }

  /* ElevenLabs-style hover pill */
  #header-component
  .header-menu
  .menu-list__list-item:hover
  .menu-list__link-title,
  
  #header-component
  .header-menu
  .menu-list__link:focus-visible
  .menu-list__link-title {
    background-color:
      rgb(var(--menu-top-level-font-color-rgb) / 0.06);
  }

}

/* =========================================================
   MEGA MENU BACKDROP
   frosted content below open mega menu
   ========================================================= */
@media screen and (min-width: 750px) {

  /*
   * Frosted layer behind the Mega Menu.
   * Page content is blurred while the Header remains sharp.
   */
  body::after {
    content: "";
    position: fixed;

    /*
     * Start below the main header row.
     * The Mega Menu itself sits above this layer.
     */
    top: var(--header-height);
    right: 0;
    bottom: 0;
    left: 0;

    background: rgb(var(--color-background-rgb) / 0.42);

    -webkit-backdrop-filter:
      blur(26px)
      saturate(110%);

    backdrop-filter:
      blur(26px)
      saturate(110%);

    /*
     * Horizon:
     * page < this layer < Mega Menu / Header
     */
    z-index: var(--layer-window-overlay);

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
      opacity 220ms ease,
      visibility 0s linear 220ms;
  }


/* Show frosted backdrop whenever a desktop mega menu is open */
body:has(
  #header-component
  .menu-list__list-item
  [aria-expanded="true"]
)::after {
  opacity: 1;
  visibility: visible;

  transition:
    opacity 220ms ease,
    visibility 0s;
}

/* 

*/
/* =========================================================
   Untested
   ========================================================= */
@media (max-width: 749px) {
  .menu-drawer__menu-item--child {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    margin: 10px 0 !important;
    padding: 0 !important;
    overflow: hidden;
    background: #fff;
    border: 0 !important;
    border-radius: 18px !important;
    text-align: center;
  }
  .menu-drawer__menu-item--child .menu-drawer__link-image {
    display: block;
    width: 100% !important;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 18px !important;
  }
  .menu-drawer__menu-item--child .menu-drawer__menu-item-text {
    display: block;
    width: 100%;
    padding: 10px 8px 6px !important;
    font-size: 14px;
    line-height: 1.35;
    text-align: center;
  }
}