/** Shopify CDN: Minification failed

Line 16286:21 Unexpected "__content"

**/
/* Header */
.site-header{
  position: sticky;
  top: 0;
  z-index: 70;
  height: var(--header-height);
  background: rgba(255, 255, 255, 0.94);
  border-bottom: 1px solid var(--color-border);
  transition:
    background 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease,
    backdrop-filter 220ms ease;
}
.site-header--transparent{
  position: fixed;
  inset-inline: 0;
  background: transparent;
  border-color: transparent;
  backdrop-filter: none;
}
.site-header--transparent.is-scrolled{
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(18, 57, 93, 0.1);
  box-shadow: 0 0.75rem 2rem rgba(18, 57, 93, 0.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.site-header__inner{
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.site-header__logo-text{
  font-family: var(--font-heading);
  font-size: 1.2rem;
  letter-spacing: 0.02em;
}
.site-header__logo-image{
  width: min(180px, 44vw);
  height: auto;
}
.site-header__nav{
  display: none;
}
.site-header__nav-link{
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.site-header__actions{
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.85rem;
}
.site-header__cart{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--color-ink);
  font-weight: 900;
  line-height: 1;
}
.site-header--icons-white .site-header__cart,
.site-header--icons-white .site-header__menu-toggle{
  color: var(--color-white);
}
.site-header--icons-dark .site-header__cart,
.site-header--icons-dark .site-header__menu-toggle{
  color: var(--color-ink);
}
.site-header__cart-count{
  min-width: 1rem;
  font-size: 0.78rem;
  font-weight: 900;
}
.site-header__menu-toggle{
  display: none;
}
.site-header__mobile{
  display: none !important;
}
/* Hero */
.hero-themeblocks-skincare{
  position: relative;
  min-height: 100svh;
  display: flex;
  align-items: flex-start;
  overflow: hidden;
  padding-block: calc(var(--header-height) + 4.25rem) 2rem;
  background:
    radial-gradient(circle at 78% 22%, rgba(216, 166, 41, 0.16), transparent 25rem),
    linear-gradient(105deg, #f8f3ea 0%, #ffffff 48%, #dfeef8 100%);
}
.hero-themeblocks-skincare::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.98) 0%,
      rgba(255, 255, 255, 0.9) 34%,
      rgba(255, 255, 255, 0.28) 58%,
      rgba(255, 255, 255, 0) 78%
    );
}
.hero-themeblocks-skincare__background{
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.hero-themeblocks-skincare__background-image{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: 88% bottom;
  filter: drop-shadow(0 2rem 4rem rgba(18, 57, 93, 0.12));
}
.hero-themeblocks-skincare__inner{
  position: relative;
  z-index: 4;
  display: grid;
  align-items: center;
}
.hero-themeblocks-skincare__content{
  max-width: 31rem;
}
.hero-themeblocks-skincare__eyebrow{
  display: none;
}
.hero-themeblocks-skincare__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.9rem, 6vw, 4.35rem);
  font-weight: 400;
  line-height: 1.02;
  letter-spacing: -0.035em;
}
.hero-themeblocks-skincare__heading em{
  display: block;
  margin-top: 0.15rem;
  color: var(--color-blue);
  font-style: italic;
  font-weight: 400;
  letter-spacing: -0.045em;
}
.hero-themeblocks-skincare__text{
  max-width: 22rem;
  margin: 1.55rem 0 1.7rem;
  color: var(--color-ink-soft);
  font-size: clamp(1.05rem, 1.45vw, 1.3rem);
  font-weight: 700;
  line-height: 1.32;
}
/* Buttons */
.button{
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  padding: 0.85rem 1.4rem;
  background: var(--color-blue);
  color: var(--color-white);
  box-shadow: 0 0.75rem 1.5rem rgba(31, 111, 174, 0.18);
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition:
    transform 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}
.button:hover{
  transform: translateY(-1px);
  background: var(--color-blue-dark);
  box-shadow: 0 1rem 2rem rgba(31, 111, 174, 0.24);
}
/* Footer */
.site-footer{
  padding-block: 3rem;
  background: var(--color-ink);
  color: var(--color-white);
}
.site-footer__brand{
  margin: 0;
  font-family: var(--font-heading);
  font-size: 1.5rem;
}
.site-footer__text{
  margin: 0.5rem 0 0;
  color: rgba(255, 255, 255, 0.72);
}
/* Water ripple */
.hero-themeblocks-skincare[data-water-effect]::after{
  display: none !important;
}
.hero-themeblocks-skincare__water-ripple{
  position: absolute !important;
  z-index: 90 !important;
  left: var(--ripple-x) !important;
  top: var(--ripple-y) !important;
  width: 18px !important;
  height: 18px !important;
  pointer-events: none !important;
  border-radius: 999px !important;
  border: 2px solid rgba(31, 111, 174, 0.55) !important;
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.52),
    inset 0 0 1.25rem rgba(255, 255, 255, 0.35),
    0 0 2rem rgba(31, 111, 174, 0.2) !important;
  transform: translate(-50%, -50%) scale(0.2);
  opacity: 0;
  mix-blend-mode: normal !important;
  filter: none !important;
}
.hero-themeblocks-skincare__water-ripple::before,
.hero-themeblocks-skincare__water-ripple::after{
  content: "";
  position: absolute;
  border-radius: 999px !important;
  pointer-events: none;
}
.hero-themeblocks-skincare__water-ripple::before{
  inset: -9px;
  border: 1px solid rgba(255, 255, 255, 0.55);
}
.hero-themeblocks-skincare__water-ripple::after{
  inset: -18px;
  border: 1px solid rgba(31, 111, 174, 0.22);
}
/* Desktop */
@media (min-width: 900px){
  .site-header__nav {
    display: flex !important;
    align-items: center;
    gap: clamp(1.2rem, 2.4vw, 2.25rem);
  }

  .site-header__menu-toggle {
    display: none !important;
  }

  .site-header__mobile {
    display: none !important;
  }
}
/* Large desktop */
@media (min-width: 1500px){
  .hero-themeblocks-skincare__background-image {
    object-position: 90% bottom;
  }
}
/* Mobile */


@media (max-width: 749px) {
.hero-themeblocks-skincare{
    min-height: 590px;
    padding-block: 3.6rem 1.5rem;
  }
.hero-themeblocks-skincare::before{
    background:
      linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.94) 0%,
        rgba(255, 255, 255, 0.84) 28%,
        rgba(255, 255, 255, 0.58) 50%,
        rgba(255, 255, 255, 0.18) 76%,
        rgba(255, 255, 255, 0.02) 100%
      );
  }
.hero-themeblocks-skincare__inner{
    width: min(100% - 2rem, var(--page-width));
  }
.hero-themeblocks-skincare__content{
    max-width: 20.5rem;
  }
.hero-themeblocks-skincare__heading{
    font-size: clamp(1.95rem, 10vw, 2.5rem);
    line-height: 1;
  }
.hero-themeblocks-skincare__heading em{
    margin-top: 0.05rem;
  }
.hero-themeblocks-skincare__text{
    max-width: 16rem;
    margin: 0.9rem 0 1.1rem;
    font-size: 0.92rem;
    line-height: 1.35;
  }
.button{
    min-height: 42px;
    padding: 0.65rem 1rem;
    border-radius: 0.6rem;
    font-size: 0.74rem;
    letter-spacing: 0.1em;
  }
.hero-themeblocks-skincare__background-image{
    object-position: 72% bottom;
    opacity: 0.62;
  }
}

@media (max-width: 420px) {
.hero-themeblocks-skincare{
    min-height: 580px;
    padding-block: 3.45rem 1.5rem;
  }
.hero-themeblocks-skincare__heading{
    font-size: clamp(1.9rem, 10vw, 2.45rem);
  }
.hero-themeblocks-skincare__text{
    max-width: 15.8rem;
    font-size: 0.9rem;
  }
.hero-themeblocks-skincare__background-image{
    object-position: 74% bottom;
    opacity: 0.58;
  }
}
/* Product cards */
.product-card{
  display: grid;
  gap: 0.9rem;
}
.product-card__media{
  display: block;
  overflow: hidden;
  border-radius: var(--radius-md);
  background:
    radial-gradient(circle at 50% 20%, rgba(255, 255, 255, 0.8), transparent 18rem),
    var(--color-cream);
}
.product-card__image{
  width: 100%;
  aspect-ratio: 1 / 1.18;
  object-fit: cover;
  transition:
    transform 420ms ease,
    filter 420ms ease;
}
.product-card:hover .product-card__image{
  transform: scale(1.045);
  filter: saturate(1.04);
}
.product-card__placeholder{
  min-height: 18rem;
  display: grid;
  place-items: center;
  padding: 1rem;
  color: var(--color-ink-soft);
  text-align: center;
}
.product-card__content{
  display: grid;
  gap: 0.25rem;
}
.product-card__vendor{
  margin: 0;
  color: var(--color-gold);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.product-card__title{
  margin: 0;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.25;
}
.price{
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  color: var(--color-ink-soft);
  font-size: 0.95rem;
  font-weight: 800;
}
.price__sale{
  color: var(--color-blue);
}
.price__compare{
  color: rgba(18, 57, 93, 0.45);
  font-weight: 700;
}
/* Collection page */
.section{
  padding-block: clamp(3rem, 8vw, 6rem);
}
.main-collection{
  background:
    radial-gradient(circle at 10% 0%, rgba(216, 166, 41, 0.12), transparent 22rem),
    linear-gradient(180deg, var(--color-white), #f8fbfd);
}
.main-collection__header{
  max-width: 44rem;
  margin-bottom: clamp(2rem, 5vw, 3.5rem);
}
.main-collection__eyebrow{
  margin: 0 0 0.8rem;
  color: var(--color-gold);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.main-collection__title{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.4rem, 6vw, 4.75rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.045em;
}
.main-collection__description{
  max-width: 38rem;
  margin-top: 1rem;
  color: var(--color-ink-soft);
  font-size: clamp(1rem, 1.6vw, 1.15rem);
}
.main-collection__grid{
  --grid-gap: clamp(1.2rem, 3vw, 2rem);
}
.main-collection__pagination{
  margin-top: 3rem;
  display: flex;
  justify-content: center;
}
.main-collection__empty{
  max-width: 34rem;
  padding: 2rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.72);
}
.main-collection__empty h2{
  margin: 0 0 0.5rem;
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 400;
}
.main-collection__empty p{
  margin: 0;
  color: var(--color-ink-soft);
}
/* Product cards */
.product-card{
  display: grid;
  gap: 0.9rem;
}
.product-card__media{
  display: block;
  overflow: hidden;
  border-radius: var(--radius-md);
  background:
    radial-gradient(circle at 50% 20%, rgba(255, 255, 255, 0.8), transparent 18rem),
    var(--color-cream);
}
.product-card__image{
  width: 100%;
  aspect-ratio: 1 / 1.18;
  object-fit: cover;
  transition:
    transform 420ms ease,
    filter 420ms ease;
}
.product-card:hover .product-card__image{
  transform: scale(1.045);
  filter: saturate(1.04);
}
.product-card__placeholder{
  min-height: 18rem;
  display: grid;
  place-items: center;
  padding: 1rem;
  color: var(--color-ink-soft);
  text-align: center;
}
.product-card__content{
  display: grid;
  gap: 0.25rem;
}
.product-card__vendor{
  margin: 0;
  color: var(--color-gold);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.product-card__title{
  margin: 0;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.25;
}
.price{
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  color: var(--color-ink-soft);
  font-size: 0.95rem;
  font-weight: 800;
}
.price__sale{
  color: var(--color-blue);
}
.price__compare{
  color: rgba(18, 57, 93, 0.45);
  font-weight: 700;
}
/* Product card visual refinement */
.product-card{
  gap: 1rem;
}
.product-card__media{
  min-height: clamp(18rem, 28vw, 26rem);
  display: grid;
  place-items: center;
  padding: clamp(1.25rem, 2.4vw, 2rem);
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.35rem;
  background:
    radial-gradient(circle at 50% 18%, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.35) 38%, transparent 62%),
    linear-gradient(180deg, #f7f9fb 0%, #eef4f8 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 1.25rem 3rem rgba(18, 57, 93, 0.055);
}
.product-card__image{
  width: 100%;
  height: clamp(15rem, 23vw, 22rem);
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  mix-blend-mode: normal;
}
.product-card:hover .product-card__media{
  border-color: rgba(31, 111, 174, 0.18);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1.5rem 3.5rem rgba(18, 57, 93, 0.09);
}
.product-card:hover .product-card__image{
  transform: scale(1.035);
  filter: saturate(1.03);
}
.product-card__content{
  padding-inline: 0.25rem;
}
.product-card__vendor{
  color: var(--color-gold);
  font-size: 0.68rem;
}
.product-card__title{
  max-width: 17rem;
  font-size: 0.92rem;
  letter-spacing: 0.01em;
  text-transform: uppercase;
}
.price{
  font-size: 0.88rem;
}

@media (max-width: 749px) {
.product-card__media{
    min-height: 17rem;
    padding: 1.25rem;
    border-radius: 1.1rem;
  }
.product-card__image{
    height: 14rem;
  }
.product-card__title{
    font-size: 0.86rem;
  }
}
/* Product image scale + white background blending */
.product-card__media{
  padding: clamp(0.85rem, 1.6vw, 1.25rem);
}
.product-card__image{
  height: clamp(17.5rem, 25vw, 24rem);
  transform: scale(1.12);
  mix-blend-mode: multiply;
}
.product-card:hover .product-card__image{
  transform: scale(1.17);
}

@media (max-width: 749px) {
.product-card__media{
    padding: 0.85rem;
  }
.product-card__image{
    height: 15.5rem;
    transform: scale(1.1);
  }
.product-card:hover .product-card__image{
    transform: scale(1.14);
  }
}
/* Featured products */
.featured-products{
  background:
    radial-gradient(circle at 8% 12%, rgba(216, 166, 41, 0.1), transparent 22rem),
    linear-gradient(180deg, #ffffff 0%, #f7fbfd 100%);
}
.featured-products__header{
  max-width: 42rem;
  margin-bottom: clamp(2rem, 5vw, 3.5rem);
}
.featured-products__eyebrow{
  margin: 0 0 0.8rem;
  color: var(--color-gold);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.featured-products__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.35rem, 5.6vw, 4.5rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.045em;
}
.featured-products__text{
  max-width: 34rem;
  margin: 1rem 0 0;
  color: var(--color-ink-soft);
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  line-height: 1.5;
}
.featured-products__grid{
  --grid-gap: clamp(1.2rem, 3vw, 2rem);
}
.featured-products__actions{
  margin-top: clamp(2rem, 5vw, 3rem);
  display: flex;
  justify-content: center;
}
.featured-products__empty{
  padding: 1.5rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.75);
  color: var(--color-ink-soft);
}

@media (max-width: 749px) {
.featured-products__actions{
    justify-content: flex-start;
  }
}
/* Brand promise */
.brand-promise{
  background:
    radial-gradient(circle at 80% 10%, rgba(31, 111, 174, 0.08), transparent 24rem),
    linear-gradient(180deg, #f7fbfd 0%, #ffffff 100%);
}
.brand-promise__grid{
  display: grid;
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
.brand-promise__content{
  max-width: 38rem;
}
.brand-promise__eyebrow{
  margin: 0 0 0.85rem;
  color: var(--color-gold);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.brand-promise__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.3rem, 5.8vw, 4.6rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.045em;
}
.brand-promise__text{
  max-width: 34rem;
  margin: 1.2rem 0 0;
  color: var(--color-ink-soft);
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  line-height: 1.55;
}
.brand-promise__cards{
  display: grid;
  gap: 1rem;
}
.brand-promise__card{
  padding: clamp(1.25rem, 3vw, 1.75rem);
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.35rem;
  background: rgba(255, 255, 255, 0.74);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1.25rem 3rem rgba(18, 57, 93, 0.055);
}
.brand-promise__icon{
  display: inline-flex;
  width: 2.35rem;
  height: 2.35rem;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  border-radius: 999px;
  background: rgba(216, 166, 41, 0.12);
  color: var(--color-gold);
  font-size: 1.15rem;
  font-weight: 900;
}
.brand-promise__card-title{
  margin: 0;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.brand-promise__card-text{
  margin: 0.65rem 0 0;
  color: var(--color-ink-soft);
  line-height: 1.5;
}

@media (min-width: 900px) {
.brand-promise__grid{
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  }
.brand-promise__cards{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
/* Category strip */
.category-strip{
  position: relative;
  z-index: 5;
  padding-block: clamp(1.4rem, 3vw, 2.1rem);
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid rgba(18, 57, 93, 0.08);
}
.category-strip__grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.category-strip__item{
  display: grid;
  justify-items: center;
  gap: 0.45rem;
  padding: 0.85rem 0.55rem;
  border-radius: 1rem;
  text-align: center;
  transition:
    background 180ms ease,
    transform 180ms ease;
}
.category-strip__item:hover{
  background: rgba(31, 111, 174, 0.055);
  transform: translateY(-2px);
}
.category-strip__media{
  height: 5.25rem;
  display: grid;
  place-items: end center;
}
.category-strip__image{
  width: auto;
  max-width: 5.5rem;
  max-height: 5.25rem;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.category-strip__placeholder{
  width: 4.2rem;
  height: 4.2rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: linear-gradient(180deg, #f7f9fb, #eef4f8);
  color: var(--color-ink-soft);
  font-size: 0.65rem;
  font-weight: 800;
}
.category-strip__title{
  color: var(--color-ink);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.category-strip__text{
  color: var(--color-ink-soft);
  font-size: 0.72rem;
  line-height: 1.25;
}

@media (min-width: 750px) {
.category-strip__grid{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 749px) {
.category-strip{
    padding-block: 1rem;
  }
.category-strip__grid{
    display: flex;
    overflow-x: auto;
    gap: 0.75rem;
    scroll-snap-type: x mandatory;
    padding-bottom: 0.25rem;
  }
.category-strip__item{
    min-width: 8.5rem;
    scroll-snap-align: start;
  }
}
/* Clinical banner */
.clinical-banner{
  padding-block: 0;
  background: #ffffff;
}
.clinical-banner__panel{
  position: relative;
  display: grid;
  overflow: hidden;
  min-height: clamp(24rem, 42vw, 34rem);
  border-radius: 0;
  background:
    radial-gradient(circle at 78% 20%, rgba(255, 255, 255, 0.28), transparent 22rem),
    linear-gradient(135deg, #1d6f9c 0%, #8bc7dd 100%);
}
.clinical-banner__content{
  position: relative;
  z-index: 2;
  max-width: 30rem;
  padding: clamp(2rem, 5vw, 4rem);
  color: #ffffff;
}
.clinical-banner__eyebrow{
  margin: 0 0 0.8rem;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.clinical-banner__heading{
  margin: 0;
  font-family: var(--font-heading);
  font-size: clamp(2.25rem, 5vw, 4rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.045em;
}
.clinical-banner__heading em{
  display: block;
  color: rgba(255, 255, 255, 0.86);
  font-style: italic;
}
.clinical-banner__text{
  max-width: 24rem;
  margin: 1.15rem 0 1.6rem;
  color: rgba(255, 255, 255, 0.86);
  font-size: clamp(0.98rem, 1.4vw, 1.1rem);
  line-height: 1.5;
}
.clinical-banner__button{
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 0.4rem;
  padding: 0.75rem 1.05rem;
  background: #ffffff;
  color: var(--color-blue);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.clinical-banner__media{
  position: relative;
  min-height: 18rem;
}
.clinical-banner__image{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(0 2rem 4rem rgba(18, 57, 93, 0.18));
}
.clinical-banner__placeholder{
  min-height: 18rem;
  display: grid;
  place-items: center;
  color: rgba(255, 255, 255, 0.78);
  border: 1px dashed rgba(255, 255, 255, 0.35);
}

@media (min-width: 900px) {
.clinical-banner__panel{
    grid-template-columns: 0.85fr 1.15fr;
    align-items: stretch;
  }
.clinical-banner__media{
    min-height: inherit;
  }
.clinical-banner__image{
    position: absolute;
    inset: auto 0 0 auto;
    width: min(58vw, 50rem);
    height: auto;
  }
}

@media (max-width: 749px) {
.clinical-banner__panel{
    min-height: auto;
  }
.clinical-banner__content{
    padding: 2rem 1.25rem 1rem;
  }
}
/* Clinical banner full-width correction */
.clinical-banner{
  padding-block: 0;
}
.clinical-banner__panel{
  width: 100%;
  border-radius: 0;
}
/* Clinical banner inner alignment */
.clinical-banner__inner{
  min-height: clamp(24rem, 42vw, 34rem);
  display: grid;
  align-items: stretch;
}

@media (min-width: 900px) {
.clinical-banner__inner{
    grid-template-columns: 0.85fr 1.15fr;
  }
.clinical-banner__panel{
    min-height: auto;
  }
.clinical-banner__media{
    min-height: inherit;
  }
}
/* Category strip refinement */
.category-strip{
  padding-block: clamp(2.1rem, 4vw, 3.25rem);
}
.category-strip__grid{
  align-items: start;
}
.category-strip--count-3 .category-strip__grid{
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: 760px;
  margin-inline: auto;
}
.category-strip--count-4 .category-strip__grid{
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 980px;
  margin-inline: auto;
}
.category-strip--count-5 .category-strip__grid{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.category-strip__item{
  gap: 0.55rem;
  padding: 0.65rem 0.55rem;
}
.category-strip__media{
  height: clamp(6.75rem, 8vw, 8.75rem);
  align-items: end;
}
.category-strip__image{
  max-width: clamp(7rem, 9vw, 9.5rem);
  max-height: clamp(6.75rem, 8vw, 8.75rem);
  object-fit: contain;
}
.category-strip__placeholder{
  width: clamp(5.4rem, 7vw, 6.75rem);
  height: clamp(5.4rem, 7vw, 6.75rem);
}
.category-strip__title{
  margin-top: 0.25rem;
  font-size: clamp(0.76rem, 0.9vw, 0.86rem);
}
.category-strip__text{
  font-size: clamp(0.74rem, 0.85vw, 0.84rem);
}

@media (max-width: 749px) {
.category-strip--count-3 .category-strip__grid,
.category-strip--count-4 .category-strip__grid,
.category-strip--count-5 .category-strip__grid{
    max-width: none;
    margin-inline: 0;
  }
.category-strip__media{
    height: 6.5rem;
  }
.category-strip__image{
    max-width: 7rem;
    max-height: 6.5rem;
  }
}
/* Category strip fluid container correction */
.category-strip--count-3 .category-strip__grid,
.category-strip--count-4 .category-strip__grid,
.category-strip--count-5 .category-strip__grid{
  width: 100%;
  max-width: none;
  margin-inline: 0;
}
.category-strip--count-3 .category-strip__grid{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.category-strip--count-4 .category-strip__grid{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.category-strip--count-5 .category-strip__grid{
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.category-strip__media{
  height: clamp(8rem, 11vw, 11rem);
}
.category-strip__image{
  width: min(100%, clamp(8.5rem, 12vw, 12.5rem));
  max-width: none;
  max-height: clamp(8rem, 11vw, 11rem);
  object-fit: contain;
}
.category-strip__item{
  padding-inline: 1rem;
}

@media (min-width: 1200px) {
.category-strip__image{
    width: min(100%, 13.5rem);
    max-height: 11.75rem;
  }
.category-strip__media{
    height: 11.75rem;
  }
}

@media (max-width: 749px) {
.category-strip__image{
    width: min(100%, 8rem);
    max-height: 7.5rem;
  }
.category-strip__media{
    height: 7.5rem;
  }
}
/* Clinical banner mockup-match image correction */
.clinical-banner__panel{
  min-height: clamp(25rem, 42vw, 34rem);
  overflow: hidden;
}
.clinical-banner__inner{
  position: relative;
  min-height: inherit;
}
.clinical-banner__content{
  position: relative;
  z-index: 3;
}
.clinical-banner__media{
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
}
.clinical-banner__image{
  position: absolute;
  right: clamp(-3rem, -3vw, -1rem);
  bottom: 0;
  width: min(68vw, 58rem);
  height: auto;
  max-width: none;
  object-fit: contain;
  object-position: right bottom;
  filter: drop-shadow(0 2rem 4rem rgba(18, 57, 93, 0.22));
}
.clinical-banner__placeholder{
  position: absolute;
  right: var(--site-gutter);
  bottom: 2rem;
  width: min(58vw, 46rem);
  min-height: 16rem;
}

@media (min-width: 1400px) {
.clinical-banner__image{
    right: calc((100vw - var(--page-width)) / 2 - 3rem);
    width: min(62vw, 62rem);
  }
}

@media (max-width: 899px) {
.clinical-banner__panel{
    min-height: 42rem;
  }
.clinical-banner__inner{
    display: block;
  }
.clinical-banner__content{
    max-width: 28rem;
  }
.clinical-banner__media{
    inset: auto 0 0;
    min-height: 20rem;
  }
.clinical-banner__image{
    right: 50%;
    bottom: 0;
    width: min(110vw, 42rem);
    transform: translateX(50%);
  }
}
/* Clinical banner product image right-side containment */
.clinical-banner__media{
  left: 34%;
  right: 0;
  width: auto;
  overflow: visible;
}
.clinical-banner__image{
  right: calc((100vw - var(--page-width)) / 2);
  bottom: 0;
  width: min(52vw, 48rem);
  max-height: 92%;
  object-fit: contain;
  object-position: right bottom;
}
.clinical-banner__placeholder{
  left: 0;
  right: calc((100vw - var(--page-width)) / 2);
  width: auto;
}

@media (max-width: 1199px) {
.clinical-banner__image{
    right: var(--site-gutter);
    width: min(58vw, 44rem);
  }
}

@media (max-width: 899px) {
.clinical-banner__media{
    left: 0;
    right: 0;
  }
.clinical-banner__image{
    right: 50%;
    width: min(105vw, 40rem);
    max-height: none;
    transform: translateX(50%);
  }
}
/* Clinical banner image asset-position fix */
@media (min-width: 900px){
  .clinical-banner__media {
    left: 0;
    right: 0;
    overflow: hidden;
  }

  .clinical-banner__image {
    left: 38%;
    right: auto;
    bottom: 0;
    width: min(64vw, 62rem);
    max-height: 100%;
    transform: none;
    object-fit: contain;
    object-position: left bottom;
  }
}

@media (min-width: 1400px) {
.clinical-banner__image{
    left: calc((100vw - var(--page-width)) / 2 + 28rem);
    width: min(58vw, 62rem);
  }
}
/* Clinical banner hard image visibility fix */
@media (min-width: 900px){
  .clinical-banner__media {
    position: absolute !important;
    inset: 0 !important;
    overflow: hidden !important;
    pointer-events: none;
  }

  .clinical-banner__image {
    position: absolute !important;
    left: 36vw !important;
    right: auto !important;
    bottom: 0 !important;
    width: 58vw !important;
    max-width: none !important;
    max-height: none !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: left bottom !important;
    transform: scale(1.75) !important;
    transform-origin: left bottom !important;
  }
}

@media (min-width: 1400px) {
.clinical-banner__image{
    left: 34vw !important;
    width: 54vw !important;
    transform: scale(1.8) !important;
  }
}

@media (max-width: 899px) {
.clinical-banner__image{
    left: 50% !important;
    right: auto !important;
    bottom: 0 !important;
    width: 100vw !important;
    transform: translateX(-50%) scale(1.35) !important;
    transform-origin: center bottom !important;
  }
}
/* Clinical banner final reset - force desktop image visible */
.clinical-banner__panel{
  position: relative !important;
  min-height: 34rem !important;
  overflow: hidden !important;
}
.clinical-banner__inner{
  position: relative !important;
  min-height: 34rem !important;
  display: grid !important;
  grid-template-columns: 0.82fr 1.18fr !important;
  align-items: stretch !important;
}
.clinical-banner__content{
  position: relative !important;
  z-index: 5 !important;
  max-width: 30rem !important;
}
.clinical-banner__media{
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: block !important;
  overflow: visible !important;
  pointer-events: none !important;
}
.clinical-banner__image{
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  left: 42% !important;
  right: auto !important;
  bottom: 0 !important;
  top: auto !important;
  width: 48rem !important;
  max-width: none !important;
  max-height: none !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: left bottom !important;
  transform: none !important;
  filter: drop-shadow(0 2rem 4rem rgba(18, 57, 93, 0.22)) !important;
}

@media (min-width: 1400px) {
.clinical-banner__image{
    left: 42% !important;
    width: 52rem !important;
  }
}

@media (max-width: 899px) {
.clinical-banner__inner{
    display: block !important;
    min-height: 42rem !important;
  }
.clinical-banner__image{
    left: 50% !important;
    bottom: 0 !important;
    width: min(105vw, 40rem) !important;
    transform: translateX(-50%) !important;
  }
}
/* Clinical banner final visual alignment */
@media (min-width: 900px){
  .clinical-banner__image {
    left: 38% !important;
    width: 60rem !important;
    bottom: 0 !important;
  }
}

@media (min-width: 1400px) {
.clinical-banner__image{
    left: 37% !important;
    width: 66rem !important;
  }
}

@media (min-width: 1700px) {
.clinical-banner__image{
    left: 38% !important;
    width: 68rem !important;
  }
}
/* Clinical banner right-bottom product anchor */
@media (min-width: 900px){
  .clinical-banner__image {
    left: auto !important;
    right: clamp(2rem, 6vw, 7rem) !important;
    bottom: -0.15rem !important;
    width: min(54vw, 58rem) !important;
    transform: none !important;
    transform-origin: right bottom !important;
  }
}

@media (min-width: 1400px) {
.clinical-banner__image{
    right: calc((100vw - var(--page-width)) / 2 - 1.5rem) !important;
    width: min(52vw, 60rem) !important;
  }
}

@media (min-width: 1700px) {
.clinical-banner__image{
    right: calc((100vw - var(--page-width)) / 2 - 2rem) !important;
    width: min(50vw, 62rem) !important;
  }
}
/* Clinical banner final 2-column reset */
.clinical-banner{
  padding-block: 0 !important;
  background: #ffffff;
}
.clinical-banner__panel{
  position: relative !important;
  min-height: auto !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 78% 20%, rgba(255, 255, 255, 0.24), transparent 24rem),
    linear-gradient(135deg, #1d6f9c 0%, #8bc7dd 100%) !important;
}
.clinical-banner__inner{
  position: relative !important;
  min-height: clamp(25rem, 42vw, 34rem) !important;
  display: grid !important;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr) !important;
  gap: clamp(2rem, 4vw, 4rem) !important;
  align-items: end !important;
}
.clinical-banner__content{
  position: relative !important;
  z-index: 2 !important;
  max-width: 30rem !important;
  padding: clamp(2.5rem, 5vw, 4rem) 0 !important;
  color: #ffffff !important;
}
.clinical-banner__media{
  position: relative !important;
  inset: auto !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  min-height: inherit !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
.clinical-banner__image{
  position: static !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: min(100%, 56rem) !important;
  max-width: none !important;
  height: auto !important;
  max-height: clamp(21rem, 38vw, 31rem) !important;
  object-fit: contain !important;
  object-position: right bottom !important;
  transform: none !important;
  filter: drop-shadow(0 2rem 4rem rgba(18, 57, 93, 0.22)) !important;
}
.clinical-banner__placeholder{
  position: static !important;
  width: 100% !important;
  min-height: 18rem !important;
}

@media (max-width: 899px) {
.clinical-banner__inner{
    min-height: auto !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
    align-items: start !important;
  }
.clinical-banner__content{
    padding: 2.5rem 0 0 !important;
  }
.clinical-banner__media{
    min-height: 18rem !important;
    justify-content: center !important;
  }
.clinical-banner__image{
    width: min(100%, 34rem) !important;
    max-height: 22rem !important;
  }
}
/* Clinical banner crop workaround for full-banner image assets */
.clinical-banner__media{
  overflow: hidden !important;
  min-height: inherit !important;
}
.clinical-banner__image{
  width: 190% !important;
  max-width: none !important;
  max-height: none !important;
  height: auto !important;
  transform: translateX(-36%) !important;
  transform-origin: left bottom !important;
  object-fit: contain !important;
  object-position: left bottom !important;
}

@media (min-width: 1200px) {
.clinical-banner__image{
    width: 210% !important;
    transform: translateX(-40%) !important;
  }
}

@media (max-width: 899px) {
.clinical-banner__image{
    width: 150% !important;
    transform: translateX(-18%) !important;
  }
}
/* Clinical banner crop workaround for full-banner image assets */
.clinical-banner__media{
  overflow: hidden !important;
  min-height: inherit !important;
}
.clinical-banner__image{
  width: 190% !important;
  max-width: none !important;
  max-height: none !important;
  height: auto !important;
  transform: translateX(-36%) !important;
  transform-origin: left bottom !important;
  object-fit: contain !important;
  object-position: left bottom !important;
}

@media (min-width: 1200px) {
.clinical-banner__image{
    width: 210% !important;
    transform: translateX(-40%) !important;
  }
}

@media (max-width: 899px) {
.clinical-banner__image{
    width: 150% !important;
    transform: translateX(-18%) !important;
  }
}
/* Clinical banner crop workaround for full-banner image assets */
.clinical-banner__media{
  overflow: hidden !important;
  min-height: inherit !important;
}
.clinical-banner__image{
  width: 190% !important;
  max-width: none !important;
  max-height: none !important;
  height: auto !important;
  transform: translateX(-36%) !important;
  transform-origin: left bottom !important;
  object-fit: contain !important;
  object-position: left bottom !important;
}

@media (min-width: 1200px) {
.clinical-banner__image{
    width: 210% !important;
    transform: translateX(-40%) !important;
  }
}

@media (max-width: 899px) {
.clinical-banner__image{
    width: 150% !important;
    transform: translateX(-18%) !important;
  }
}
/* Clinical banner background-image mode */
.clinical-banner{
  padding-block: 0 !important;
  background: #ffffff;
}
.clinical-banner__panel{
  position: relative !important;
  min-height: clamp(25rem, 42vw, 34rem) !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 78% 20%, rgba(255, 255, 255, 0.24), transparent 24rem),
    linear-gradient(135deg, #1d6f9c 0%, #8bc7dd 100%) !important;
}
.clinical-banner__background{
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}
.clinical-banner__background-image{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center bottom !important;
  opacity: 1 !important;
}
.clinical-banner__panel::before{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(29, 111, 156, 0.92) 0%,
      rgba(29, 111, 156, 0.7) 28%,
      rgba(29, 111, 156, 0.18) 52%,
      rgba(29, 111, 156, 0) 76%
    );
}
.clinical-banner__inner{
  position: relative !important;
  z-index: 3 !important;
  min-height: clamp(25rem, 42vw, 34rem) !important;
  display: flex !important;
  align-items: center !important;
}
.clinical-banner__content{
  position: relative !important;
  z-index: 4 !important;
  max-width: 30rem !important;
  padding-block: clamp(2.5rem, 5vw, 4rem) !important;
  color: #ffffff !important;
}
.clinical-banner__media,
.clinical-banner__image,
.clinical-banner__placeholder{
  display: none !important;
}

@media (max-width: 899px) {
.clinical-banner__panel{
    min-height: 34rem !important;
  }
.clinical-banner__background-image{
    object-position: 62% bottom !important;
  }
.clinical-banner__panel::before{
    background:
      linear-gradient(
        180deg,
        rgba(29, 111, 156, 0.95) 0%,
        rgba(29, 111, 156, 0.78) 48%,
        rgba(29, 111, 156, 0.22) 76%,
        rgba(29, 111, 156, 0) 100%
      );
  }
.clinical-banner__inner{
    min-height: 34rem !important;
    align-items: flex-start !important;
  }
.clinical-banner__content{
    padding-block: 2.5rem 1rem !important;
  }
}
/* Clinical banner desktop polish */
@media (min-width: 1200px){
  .clinical-banner__panel {
    min-height: 32rem !important;
  }

  .clinical-banner__inner {
    min-height: 32rem !important;
  }

  .clinical-banner__background-image {
    object-position: 62% bottom !important;
    transform: scale(0.92);
    transform-origin: center bottom;
  }

  .clinical-banner__panel::before {
    background:
      linear-gradient(
        90deg,
        rgba(29, 111, 156, 0.96) 0%,
        rgba(29, 111, 156, 0.9) 23%,
        rgba(29, 111, 156, 0.58) 38%,
        rgba(29, 111, 156, 0.18) 56%,
        rgba(29, 111, 156, 0) 78%
      ) !important;
  }

  .clinical-banner__content {
    max-width: 31rem !important;
  }

  .clinical-banner__heading {
    font-size: clamp(3.2rem, 4.7vw, 4.8rem);
  }

  .clinical-banner__text {
    max-width: 27rem;
  }
}

@media (min-width: 1500px) {
.clinical-banner__background-image{
    object-position: 64% bottom !important;
    transform: scale(0.9);
  }
}
/* Clinical banner: keep product image fully visible and bottom-aligned */
@media (min-width: 900px){
  .clinical-banner__background {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
  }

  .clinical-banner__background-image {
    position: absolute !important;
    inset: auto 0 0 auto !important;
    width: min(78vw, 82rem) !important;
    height: auto !important;
    max-width: none !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: right bottom !important;
    transform: none !important;
  }

  .clinical-banner__panel {
    min-height: 34rem !important;
  }

  .clinical-banner__inner {
    min-height: 34rem !important;
  }
}

@media (min-width: 1400px) {
.clinical-banner__background-image{
    width: min(76vw, 86rem) !important;
  }
}

@media (min-width: 1700px) {
.clinical-banner__background-image{
    width: min(74vw, 88rem) !important;
  }
}
/* Clinical banner content container alignment */
.clinical-banner__inner{
  width: min(100% - (var(--site-gutter) * 2), var(--page-width)) !important;
  margin-inline: auto !important;
}
.clinical-banner__content{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

@media (min-width: 900px) {
.clinical-banner__content{
    max-width: 30rem !important;
  }
}
/* Clinical banner hard content alignment */
.clinical-banner__inner{
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  padding-inline: max(var(--site-gutter), calc((100vw - var(--page-width)) / 2)) !important;
}
.clinical-banner__content{
  margin-left: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

@media (min-width: 1200px) {
.clinical-banner__content{
    max-width: 31rem !important;
  }
}
/* Clinical banner typography polish */
@media (min-width: 900px){
  .clinical-banner__inner {
    min-height: 34rem !important;
    align-items: center !important;
  }

  .clinical-banner__content {
    max-width: 28rem !important;
    padding-block: 3.25rem !important;
  }

  .clinical-banner__eyebrow {
    margin-bottom: 1rem !important;
    font-size: 0.78rem !important;
    line-height: 1.15 !important;
    letter-spacing: 0.18em !important;
  }

  .clinical-banner__heading {
    max-width: 27rem !important;
    font-size: clamp(3.1rem, 4.7vw, 5.25rem) !important;
    line-height: 0.94 !important;
    letter-spacing: -0.055em !important;
  }

  .clinical-banner__heading em {
    margin-top: 0.12rem !important;
    line-height: 0.96 !important;
  }

  .clinical-banner__text {
    max-width: 25rem !important;
    margin: 1.35rem 0 1.85rem !important;
    font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
    line-height: 1.45 !important;
  }

  .clinical-banner__button {
    min-height: 46px !important;
    padding: 0.85rem 1.25rem !important;
    border-radius: 0.38rem !important;
    font-size: 0.76rem !important;
    letter-spacing: 0.11em !important;
  }
}

@media (min-width: 1400px) {
.clinical-banner__content{
    max-width: 30rem !important;
  }
.clinical-banner__heading{
    font-size: clamp(4.25rem, 4.8vw, 5.6rem) !important;
  }
}
/* Clinical banner typography polish */
@media (min-width: 900px){
  .clinical-banner__inner {
    min-height: 34rem !important;
    align-items: center !important;
  }

  .clinical-banner__content {
    max-width: 28rem !important;
    padding-block: 3.25rem !important;
  }

  .clinical-banner__eyebrow {
    margin-bottom: 1rem !important;
    font-size: 0.78rem !important;
    line-height: 1.15 !important;
    letter-spacing: 0.18em !important;
  }

  .clinical-banner__heading {
    max-width: 27rem !important;
    font-size: clamp(3.1rem, 4.7vw, 5.25rem) !important;
    line-height: 0.94 !important;
    letter-spacing: -0.055em !important;
  }

  .clinical-banner__heading em {
    margin-top: 0.12rem !important;
    line-height: 0.96 !important;
  }

  .clinical-banner__text {
    max-width: 25rem !important;
    margin: 1.35rem 0 1.85rem !important;
    font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
    line-height: 1.45 !important;
  }

  .clinical-banner__button {
    min-height: 46px !important;
    padding: 0.85rem 1.25rem !important;
    border-radius: 0.38rem !important;
    font-size: 0.76rem !important;
    letter-spacing: 0.11em !important;
  }
}

@media (min-width: 1400px) {
.clinical-banner__content{
    max-width: 30rem !important;
  }
.clinical-banner__heading{
    font-size: clamp(4.25rem, 4.8vw, 5.6rem) !important;
  }
}
/* Category strip final compact mockup pass */
.category-strip{
  padding-block: clamp(1.4rem, 2.4vw, 2.1rem) !important;
}
.category-strip__grid{
  gap: clamp(1rem, 2.5vw, 2rem) !important;
  align-items: center !important;
}
.category-strip__item{
  gap: 0.45rem !important;
  padding: 0.35rem 0.75rem !important;
}
.category-strip__media{
  height: clamp(6.5rem, 8vw, 8.75rem) !important;
  display: grid !important;
  place-items: end center !important;
}
.category-strip__image{
  width: auto !important;
  max-width: clamp(7.5rem, 10vw, 11rem) !important;
  max-height: clamp(6.5rem, 8vw, 8.75rem) !important;
  object-fit: contain !important;
}
.category-strip__title{
  margin-top: 0.2rem !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.12em !important;
}
.category-strip__text{
  font-size: 0.78rem !important;
}

@media (min-width: 1200px) {
.category-strip__image{
    max-width: 11.75rem !important;
    max-height: 9.25rem !important;
  }
.category-strip__media{
    height: 9.25rem !important;
  }
}

@media (max-width: 749px) {
.category-strip{
    padding-block: 1rem !important;
  }
.category-strip__item{
    min-width: 8.75rem !important;
  }
.category-strip__media{
    height: 6.5rem !important;
  }
.category-strip__image{
    max-width: 7.5rem !important;
    max-height: 6.5rem !important;
  }
}
/* Category strip larger product images */
.category-strip{
  padding-block: clamp(1.7rem, 3vw, 2.6rem) !important;
}
.category-strip__media{
  height: clamp(8.5rem, 10vw, 11rem) !important;
}
.category-strip__image{
  max-width: clamp(9.5rem, 13vw, 14.5rem) !important;
  max-height: clamp(8.5rem, 10vw, 11rem) !important;
  transform: scale(1.22) !important;
  transform-origin: center bottom !important;
}
.category-strip__item:hover .category-strip__image{
  transform: scale(1.28) !important;
}

@media (min-width: 1200px) {
.category-strip__media{
    height: 11.5rem !important;
  }
.category-strip__image{
    max-width: 15.5rem !important;
    max-height: 11.5rem !important;
  }
}

@media (max-width: 749px) {
.category-strip__media{
    height: 7.5rem !important;
  }
.category-strip__image{
    max-width: 9rem !important;
    max-height: 7.5rem !important;
    transform: scale(1.15) !important;
  }
}
/* Category strip spacing + hover bleed fix */
.category-strip{
  padding-block: clamp(2.25rem, 4vw, 3.5rem) !important;
  overflow: hidden !important;
}
.category-strip__grid{
  align-items: stretch !important;
}
.category-strip__item{
  overflow: hidden !important;
  border-radius: 1.25rem !important;
  padding: 1rem 0.85rem 1.15rem !important;
}
.category-strip__media{
  overflow: hidden !important;
  border-radius: 1rem !important;
  padding-block: 0.35rem !important;
}
.category-strip__image{
  will-change: transform;
}
.category-strip__item:hover{
  background: rgba(31, 111, 174, 0.055) !important;
  transform: translateY(-2px) !important;
}

@media (min-width: 1200px) {
.category-strip{
    padding-block: 3rem !important;
  }
}

@media (max-width: 749px) {
.category-strip{
    padding-block: 1.4rem !important;
  }
.category-strip__item{
    padding: 0.85rem 0.75rem 1rem !important;
  }
}
/* Clinical banner wide desktop text correction */
@media (min-width: 1200px){
  .clinical-banner__content {
    max-width: 46rem !important;
  }

  .clinical-banner__heading {
    max-width: 46rem !important;
    font-size: clamp(3.8rem, 4.4vw, 5rem) !important;
    line-height: 0.96 !important;
    letter-spacing: -0.055em !important;
  }

  .clinical-banner__heading em {
    display: block !important;
    white-space: nowrap !important;
  }

  .clinical-banner__text {
    max-width: 33rem !important;
  }
}

@media (min-width: 1400px) {
.clinical-banner__content{
    max-width: 50rem !important;
  }
.clinical-banner__heading{
    max-width: 50rem !important;
    font-size: clamp(4.1rem, 4.3vw, 5.25rem) !important;
  }
}

@media (min-width: 1600px) {
.clinical-banner__heading{
    font-size: 5.25rem !important;
  }
}
/* Skin goals */
.skin-goals{
  background: #ffffff;
  text-align: center;
}
.skin-goals__header{
  max-width: 52rem;
  margin-inline: auto;
  margin-bottom: clamp(1.75rem, 4vw, 2.75rem);
}
.skin-goals__eyebrow,
.bestsellers__eyebrow{
  margin: 0 0 0.55rem;
  color: var(--color-blue);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.skin-goals__heading,
.bestsellers__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.3rem, 4.2vw, 3.9rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.04em;
}
.skin-goals__grid{
  display: grid;
  gap: clamp(1.25rem, 3vw, 2.5rem);
}
.skin-goals__card{
  display: grid;
  gap: 1.1rem;
}
.skin-goals__media{
  display: block;
  overflow: hidden;
  background: #eef4f8;
}
.skin-goals__image{
  width: 100%;
  aspect-ratio: 1.9 / 1;
  object-fit: cover;
  transition: transform 500ms ease;
}
.skin-goals__card:hover .skin-goals__image{
  transform: scale(1.035);
}
.skin-goals__placeholder{
  min-height: 15rem;
  display: grid;
  place-items: center;
  color: var(--color-ink-soft);
}
.skin-goals__title{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(1.3rem, 2vw, 1.7rem);
  font-weight: 400;
}
.skin-goals__text{
  max-width: 16rem;
  margin: 0.4rem auto 0;
  color: var(--color-ink-soft);
  line-height: 1.45;
}
.skin-goals__link{
  display: inline-flex;
  margin-top: 0.7rem;
  color: var(--color-blue);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media (min-width: 750px) {
.skin-goals__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
/* Trust icons */
.trust-icons{
  padding-block: clamp(1.5rem, 3vw, 2.25rem);
  background: #ffffff;
}
.trust-icons__grid{
  display: grid;
  gap: 1rem;
  padding-top: clamp(1.25rem, 3vw, 2rem);
  border-top: 1px solid rgba(18, 57, 93, 0.12);
}
.trust-icons__item{
  display: flex;
  gap: 0.8rem;
  align-items: center;
  justify-content: center;
  color: var(--color-ink);
}
.trust-icons__icon{
  display: inline-grid;
  width: 2.15rem;
  height: 2.15rem;
  place-items: center;
  color: var(--color-blue);
  font-size: 1.35rem;
}
.trust-icons__title{
  margin: 0;
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1.1;
}
.trust-icons__text{
  margin: 0.15rem 0 0;
  color: var(--color-ink-soft);
  font-size: 0.78rem;
  line-height: 1.25;
}

@media (min-width: 750px) {
.trust-icons__grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
/* Bestsellers */
.bestsellers{
  background: #ffffff;
  text-align: center;
}
.bestsellers__header{
  max-width: 54rem;
  margin-inline: auto;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}
.bestsellers__grid{
  display: grid;
  gap: clamp(1.25rem, 3vw, 2.5rem);
}
.bestsellers__product{
  display: grid;
  gap: 0.95rem;
  justify-items: center;
}
.bestsellers__media{
  display: grid;
  width: 100%;
  min-height: clamp(14rem, 20vw, 19rem);
  place-items: end center;
}
.bestsellers__image{
  width: auto;
  max-width: min(100%, 12rem);
  max-height: clamp(13rem, 18vw, 18rem);
  object-fit: contain;
  mix-blend-mode: multiply;
  transition: transform 420ms ease;
}
.bestsellers__product:hover .bestsellers__image{
  transform: translateY(-3px) scale(1.03);
}
.bestsellers__title{
  margin: 0;
  color: var(--color-blue);
  font-size: 0.95rem;
  font-weight: 900;
  line-height: 1.2;
}
.bestsellers__subtitle{
  margin: 0.3rem 0 0.3rem;
  color: var(--color-ink-soft);
  font-size: 0.86rem;
  line-height: 1.35;
}
.bestsellers .price{
  justify-content: center;
}
.bestsellers__actions{
  margin-top: clamp(2rem, 4vw, 3rem);
}
.bestsellers__empty{
  padding: 1.5rem;
  border: 1px solid var(--color-border);
  color: var(--color-ink-soft);
}

@media (min-width: 750px) {
.bestsellers__grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
/* Why ThemeBlocks */
.why-themeblocks-skincare{
  background: #eef7fb;
}
.why-themeblocks-skincare__inner{
  display: grid;
  min-height: clamp(24rem, 36vw, 32rem);
}
.why-themeblocks-skincare__content{
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(3rem, 6vw, 5rem) max(var(--site-gutter), calc((100vw - var(--page-width)) / 2));
}
.why-themeblocks-skincare__eyebrow,
.skincare-guide__eyebrow{
  margin: 0 0 0.75rem;
  color: var(--color-blue);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.why-themeblocks-skincare__heading,
.skincare-guide__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.2rem, 4.6vw, 4rem);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.045em;
}
.why-themeblocks-skincare__text{
  max-width: 27rem;
  margin: 1.25rem 0 1.5rem;
  color: var(--color-ink-soft);
  font-size: clamp(1rem, 1.4vw, 1.14rem);
  line-height: 1.5;
}
.why-themeblocks-skincare__link{
  color: var(--color-blue);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.why-themeblocks-skincare__media{
  min-height: 20rem;
  overflow: hidden;
}
.why-themeblocks-skincare__image{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.why-themeblocks-skincare__placeholder{
  min-height: inherit;
  display: grid;
  place-items: center;
  color: var(--color-ink-soft);
  background: linear-gradient(135deg, #f7fbfd, #d9ecf6);
}

@media (min-width: 900px) {
.why-themeblocks-skincare__inner{
    grid-template-columns: 1fr 1fr;
  }
}
/* Skincare guide */
.skincare-guide{
  background: #ffffff;
  text-align: center;
}
.skincare-guide__header{
  max-width: 56rem;
  margin-inline: auto;
  margin-bottom: clamp(2rem, 4vw, 3rem);
}
.skincare-guide__grid{
  display: grid;
  gap: clamp(1.25rem, 3vw, 2rem);
}
.skincare-guide__card{
  display: grid;
  justify-items: center;
  gap: 1rem;
}
.skincare-guide__media{
  width: 100%;
  overflow: hidden;
  background: #eef4f8;
}
.skincare-guide__image{
  width: 100%;
  aspect-ratio: 1.65 / 1;
  object-fit: cover;
  transition: transform 500ms ease;
}
.skincare-guide__card:hover .skincare-guide__image{
  transform: scale(1.035);
}
.skincare-guide__placeholder{
  min-height: 13rem;
  display: grid;
  place-items: center;
  color: var(--color-ink-soft);
}
.skincare-guide__title{
  max-width: 18rem;
  margin: 0;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.25;
}
.skincare-guide__link{
  color: var(--color-blue);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media (min-width: 750px) {
.skincare-guide__grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
/* Newsletter CTA */
.newsletter-cta{
  padding-block: clamp(2rem, 4vw, 3rem);
  background: #e9f5fb;
}
.newsletter-cta__main{
  display: grid;
  gap: 1.5rem;
  align-items: center;
  padding-bottom: clamp(1.75rem, 3vw, 2.5rem);
  border-bottom: 1px solid rgba(18, 57, 93, 0.12);
}
.newsletter-cta__heading{
  margin: 0;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.newsletter-cta__text{
  max-width: 32rem;
  margin: 0.55rem 0 0;
  color: var(--color-ink-soft);
  line-height: 1.45;
}
.newsletter-cta__form{
  display: flex;
  min-height: 52px;
  border-radius: 0.35rem;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 1rem 2.5rem rgba(18, 57, 93, 0.08);
}
.newsletter-cta__input{
  min-width: 0;
  flex: 1;
  border: 0;
  padding-inline: 1.1rem;
  color: var(--color-ink);
  outline: 0;
}
.newsletter-cta__button{
  border: 0;
  padding-inline: 1.45rem;
  background: var(--color-blue);
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.newsletter-cta__perks{
  display: grid;
  gap: 1rem;
  padding-top: clamp(1.5rem, 3vw, 2.2rem);
}
.newsletter-cta__perk{
  display: flex;
  gap: 0.85rem;
  align-items: center;
}
.newsletter-cta__perk-icon{
  display: inline-grid;
  width: 2.2rem;
  height: 2.2rem;
  place-items: center;
  color: var(--color-ink);
  font-size: 1.35rem;
}
.newsletter-cta__perk-title{
  margin: 0;
  color: var(--color-ink);
  font-size: 0.86rem;
  font-weight: 900;
}
.newsletter-cta__perk-text{
  margin: 0.2rem 0 0;
  color: var(--color-ink-soft);
  font-size: 0.78rem;
}

@media (min-width: 900px) {
.newsletter-cta__main{
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  }
.newsletter-cta__perks{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
/* Footer mockup refinement */
.site-footer{
  padding-block: clamp(2.5rem, 5vw, 4rem) 1.5rem !important;
  background: #ffffff !important;
  color: var(--color-ink) !important;
  border-top: 1px solid rgba(18, 57, 93, 0.08);
}
.site-footer__grid{
  display: grid;
  gap: clamp(2rem, 4vw, 4rem);
}
.site-footer__brand-column{
  display: grid;
  justify-items: start;
  gap: 1rem;
}
.site-footer__logo{
  display: inline-flex;
  align-items: center;
}
.site-footer__logo-image{
  width: min(13rem, 60vw);
  height: auto;
}
.site-footer__logo-text{
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1;
}
.site-footer__text{
  max-width: 22rem;
  margin: 0 !important;
  color: var(--color-ink-soft) !important;
  font-size: 0.95rem;
  line-height: 1.5;
}
.site-footer__socials{
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}
.site-footer__social-link{
  display: inline-flex;
  min-height: 2.1rem;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(18, 57, 93, 0.14);
  border-radius: 999px;
  padding-inline: 0.8rem;
  color: var(--color-blue);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition:
    background 180ms ease,
    border-color 180ms ease,
    transform 180ms ease;
}
.site-footer__social-link:hover{
  background: rgba(31, 111, 174, 0.06);
  border-color: rgba(31, 111, 174, 0.28);
  transform: translateY(-1px);
}
.site-footer__menu-heading{
  margin: 0 0 0.9rem;
  color: var(--color-blue);
  font-size: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.site-footer__menu-list{
  display: grid;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.site-footer__menu-list a{
  color: var(--color-ink-soft);
  font-size: 0.92rem;
  line-height: 1.4;
  transition: color 180ms ease;
}
.site-footer__menu-list a:hover{
  color: var(--color-blue);
}
.site-footer__bottom{
  margin-top: clamp(2rem, 4vw, 3rem);
  padding-top: 1.25rem;
  border-top: 1px solid rgba(18, 57, 93, 0.08);
}
.site-footer__copyright{
  margin: 0;
  color: var(--color-ink-soft);
  font-size: 0.82rem;
}

@media (min-width: 750px) {
.site-footer__grid{
    grid-template-columns: 1.45fr repeat(3, minmax(0, 0.75fr));
    align-items: start;
  }
}

@media (max-width: 749px) {
.site-footer__grid{
    grid-template-columns: 1fr 1fr;
  }
.site-footer__brand-column{
    grid-column: 1 / -1;
  }
}

.bestseller-card__dummy-body{
  width: 58%;
  height: 76%;
  display: block;
  border-radius: 0.9rem 0.9rem 1.7rem 1.7rem;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.92), rgba(232,240,242,0.72), rgba(255,255,255,0.96)),
    linear-gradient(180deg, #ffffff, #dbe7ea);
  box-shadow:
    inset 0 0 0 1px rgba(18, 57, 93, 0.08),
    1.2rem 1.4rem 1.8rem rgba(18, 57, 93, 0.12);
}
.bestseller-card__dummy-cap{
  position: absolute;
  top: 5%;
  width: 45%;
  height: 22%;
  border-radius: 0.75rem 0.75rem 0.25rem 0.25rem;
  background:
    linear-gradient(90deg, #d2d5d5, #ffffff, #aeb5b8);
  box-shadow: inset 0 -0.25rem 0 rgba(18, 57, 93, 0.08);
}
.bestseller-card__dummy-label{
  position: absolute;
  bottom: 28%;
  width: 46%;
  height: 19%;
  border-radius: 0.25rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.98), rgba(245,248,250,0.98));
  box-shadow: inset 0 0 0 1px rgba(18, 57, 93, 0.08);
}
.bestseller-card__dummy-label::before{
  content: "CARE";
  position: absolute;
  inset: 35% 0 auto;
  color: rgba(18, 57, 93, 0.55);
  font-size: 0.52rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-align: center;
}









/* Bestsellers carousel hard layout fix */
.bestsellers{
  overflow: hidden !important;
}
.bestsellers__panels{
  width: 100% !important;
}
.bestsellers__panel{
  width: 100% !important;
}
.bestsellers__carousel{
  display: flex !important;
  grid-auto-flow: initial !important;
  grid-auto-columns: initial !important;
  grid-template-columns: none !important;
  gap: clamp(1.5rem, 3vw, 3rem) !important;
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none !important;
  padding: 0 0 0.75rem !important;
}
.bestsellers__carousel::-webkit-scrollbar{
  display: none !important;
}
.bestseller-card{
  flex: 0 0 calc((100% - (3 * clamp(1.5rem, 3vw, 3rem))) / 4) !important;
  width: auto !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-rows: auto minmax(18rem, 1fr) auto !important;
  gap: clamp(1rem, 2vw, 1.5rem) !important;
  scroll-snap-align: start !important;
  text-align: left !important;
}
.bestseller-card__badge{
  order: 0 !important;
  min-height: 1.25rem !important;
  margin: 0 !important;
}
.bestseller-card__content{
  order: 2 !important;
  width: 100% !important;
  display: grid !important;
  gap: 0.7rem !important;
}
.bestseller-card__title-row{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 1rem !important;
  align-items: start !important;
}
.bestseller-card__title{
  text-align: left !important;
}
.bestseller-card__price{
  text-align: right !important;
}
.bestseller-card__bottom{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

@media (max-width: 1199px) {
.bestseller-card{
    flex-basis: calc((100% - clamp(1.5rem, 3vw, 3rem)) / 2) !important;
  }
}

@media (max-width: 749px) {
.bestseller-card{
    flex-basis: 82% !important;
  }
}
/* Bestsellers premium ThemeBlocks Skincare polish */
.bestsellers.section{
  padding-block: clamp(4rem, 7vw, 7rem) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(31, 111, 174, 0.035), transparent 34rem),
    #ffffff !important;
  text-align: left !important;
}
.bestsellers .container{
  width: min(100% - (var(--site-gutter) * 2), var(--page-width)) !important;
}
.bestsellers__top{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 2rem !important;
  align-items: end !important;
  margin-bottom: clamp(2.75rem, 5vw, 4.5rem) !important;
}
.bestsellers__header{
  max-width: 44rem !important;
  margin: 0 !important;
  text-align: left !important;
}
.bestsellers__eyebrow{
  display: block !important;
  margin: 0 0 0.75rem !important;
  color: var(--color-blue) !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}
.bestsellers__heading{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: clamp(2.8rem, 4.6vw, 5rem) !important;
  font-weight: 400 !important;
  line-height: 0.95 !important;
  letter-spacing: -0.055em !important;
  text-align: left !important;
}
.bestsellers__tabs{
  display: inline-flex !important;
  justify-self: end !important;
  gap: clamp(1.2rem, 2.4vw, 2.5rem) !important;
  align-items: flex-end !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.2) !important;
}
.bestsellers__tab{
  appearance: none !important;
  -webkit-appearance: none !important;
  position: relative !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 0 0.8rem !important;
  color: rgba(18, 57, 93, 0.68) !important;
  font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  letter-spacing: -0.015em !important;
  text-transform: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.bestsellers__tab::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -1px !important;
  height: 2px !important;
  background: transparent !important;
  transform: scaleX(0.6) !important;
  transform-origin: center !important;
  transition:
    background 180ms ease,
    transform 180ms ease !important;
}
.bestsellers__tab.is-active{
  color: var(--color-ink) !important;
}
.bestsellers__tab.is-active::after{
  background: var(--color-ink) !important;
  transform: scaleX(1) !important;
}
.bestsellers__panels{
  position: relative !important;
  width: 100% !important;
}
.bestsellers__carousel{
  display: flex !important;
  gap: clamp(2rem, 3.2vw, 3.5rem) !important;
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none !important;
  padding: 0 0 0.5rem !important;
}
.bestsellers__carousel::-webkit-scrollbar{
  display: none !important;
}
.bestseller-card{
  flex: 0 0 calc((100% - (3 * clamp(2rem, 3.2vw, 3.5rem))) / 4) !important;
  display: grid !important;
  grid-template-rows: auto clamp(18rem, 24vw, 25rem) auto !important;
  gap: 1.25rem !important;
  min-width: 0 !important;
  scroll-snap-align: start !important;
  color: var(--color-ink) !important;
  text-align: left !important;
}
.bestseller-card__badge{
  margin: 0 !important;
  min-height: 1.35rem !important;
  color: #23983a !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

.bestseller-card__content{
  display: grid !important;
  gap: 0.75rem !important;
  width: 100% !important;
}
.bestseller-card__title-row{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 1rem !important;
  align-items: start !important;
}
.bestseller-card__title{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: clamp(1.2rem, 1.55vw, 1.55rem) !important;
  font-weight: 500 !important;
  line-height: 1.12 !important;
  letter-spacing: -0.035em !important;
  text-align: left !important;
}
.bestseller-card__price{
  color: var(--color-ink) !important;
  font-size: clamp(1rem, 1.25vw, 1.15rem) !important;
  line-height: 1.15 !important;
  white-space: nowrap !important;
  text-align: right !important;
}
.bestseller-card__subtitle{
  margin: 0 !important;
  color: rgba(18, 57, 93, 0.78) !important;
  font-size: clamp(0.95rem, 1.2vw, 1.08rem) !important;
  line-height: 1.35 !important;
}
.bestseller-card__bottom{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  margin-top: 0.4rem !important;
}
.bestseller-card__rating{
  color: #207b31 !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
}
.bestseller-card__cart{
  width: 2rem !important;
  height: 2rem !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(18, 57, 93, 0.24) !important;
  border-radius: 0.25rem !important;
  background: #ffffff !important;
  color: var(--color-ink) !important;
  box-shadow: none !important;
  transition:
    background 180ms ease,
    border-color 180ms ease,
    transform 180ms ease !important;
}
.bestseller-card__cart:hover{
  background: rgba(31, 111, 174, 0.06) !important;
  border-color: rgba(18, 57, 93, 0.45) !important;
  transform: translateY(-1px) !important;
}
.bestseller-card__cart svg{
  width: 1.15rem !important;
  height: 1.15rem !important;
}
.bestsellers__controls{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1rem, 2vw, 1.5rem) !important;
  margin-top: clamp(1.75rem, 3vw, 2.5rem) !important;
}
.bestsellers__arrow{
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 2.3rem !important;
  height: 2.3rem !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--color-ink) !important;
  font-size: 2rem !important;
  line-height: 1 !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.bestsellers__dots{
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
}
.bestsellers__dot{
  width: 0.55rem !important;
  height: 0.55rem !important;
  border-radius: 999px !important;
  background: rgba(18, 57, 93, 0.28) !important;
}
.bestsellers__dot.is-active{
  background: var(--color-ink) !important;
}
.bestsellers__actions{
  display: none !important;
}

@media (max-width: 1199px) {
.bestsellers__top{
    grid-template-columns: 1fr !important;
    align-items: start !important;
  }
.bestsellers__tabs{
    justify-self: start !important;
  }
.bestseller-card{
    flex-basis: calc((100% - clamp(2rem, 3.2vw, 3.5rem)) / 2) !important;
  }
}

@media (max-width: 749px) {
.bestsellers.section{
    padding-block: 3rem !important;
  }
.bestsellers__heading{
    font-size: clamp(2.35rem, 12vw, 3.25rem) !important;
  }
.bestsellers__tabs{
    max-width: 100% !important;
    overflow-x: auto !important;
    gap: 1.25rem !important;
    scrollbar-width: none !important;
  }
.bestsellers__tabs::-webkit-scrollbar{
    display: none !important;
  }
.bestseller-card{
    flex-basis: 82% !important;
    grid-template-rows: auto 18rem auto !important;
  }
.bestseller-card__title-row{
    grid-template-columns: 1fr !important;
    gap: 0.35rem !important;
  }
.bestseller-card__price{
    text-align: left !important;
  }
}
/* Bestsellers ThemeBlocks Skincare color alignment */
.bestseller-card__badge{
  color: #c9a227 !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
}
.bestseller-card__rating{
  color: var(--color-blue) !important;
  font-size: 0.96rem !important;
  font-weight: 800 !important;
}
.bestseller-card__rating::first-letter{
  color: #c9a227;
}
.bestseller-card__cart{
  border-color: rgba(18, 57, 93, 0.18) !important;
  color: var(--color-ink) !important;
  background: rgba(255, 255, 255, 0.92) !important;
}
.bestseller-card__cart:hover{
  border-color: rgba(201, 162, 39, 0.55) !important;
  background: rgba(201, 162, 39, 0.08) !important;
  color: var(--color-ink) !important;
}
.bestsellers__tab.is-active::after{
  background: #c9a227 !important;
}
.bestsellers__tab.is-active{
  color: var(--color-ink) !important;
}
.bestsellers__dot{
  background: rgba(18, 57, 93, 0.2) !important;
}
.bestsellers__dot.is-active{
  background: #c9a227 !important;
}
.bestsellers__arrow{
  color: var(--color-ink) !important;
}
.bestsellers__arrow:hover{
  color: #c9a227 !important;
}
.bestseller-card__title{
  text-transform: none !important;
}
.bestseller-card__price{
  color: var(--color-ink) !important;
  font-weight: 600 !important;
}
.bestseller-card__subtitle{
  color: rgba(18, 57, 93, 0.68) !important;
}
/* Newsletter CTA final layout + sharper icons */
.newsletter-cta{
  padding-block: clamp(3.25rem, 5vw, 4.5rem) !important;
  background: #e8f5fb !important;
}
.newsletter-cta__main{
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr) !important;
  gap: clamp(2rem, 5vw, 5rem) !important;
  align-items: center !important;
  padding-bottom: clamp(2.4rem, 4vw, 3.25rem) !important;
  border-bottom: 0 !important;
}
.newsletter-cta__heading{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
  font-weight: 900 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}
.newsletter-cta__text{
  max-width: 34rem !important;
  margin-top: 0.85rem !important;
  color: rgba(18, 57, 93, 0.76) !important;
  font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
  line-height: 1.45 !important;
}
.newsletter-cta__form{
  min-height: 58px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  border-radius: 0.35rem !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
.newsletter-cta__input{
  height: 58px !important;
  border: 0 !important;
  padding: 0 1.5rem !important;
  color: var(--color-ink) !important;
  font-size: 1rem !important;
  background: #ffffff !important;
}
.newsletter-cta__input::placeholder{
  color: rgba(18, 57, 93, 0.5) !important;
}
.newsletter-cta__button{
  min-width: 12rem !important;
  height: 58px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.86rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}
.newsletter-cta__perks{
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1.5rem, 4vw, 4rem) !important;
  padding-top: clamp(2.25rem, 4vw, 3.1rem) !important;
}
.newsletter-cta__perk{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 1rem !important;
  align-items: center !important;
}
.newsletter-cta__perk-icon{
  width: 2.6rem !important;
  height: 2.6rem !important;
  display: grid !important;
  place-items: center !important;
  color: var(--color-ink) !important;
}
.newsletter-cta__perk-icon svg{
  width: 2rem !important;
  height: 2rem !important;
  display: block !important;
  stroke: currentColor !important;
}
.newsletter-cta__perk-title{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: clamp(0.9rem, 1.05vw, 1rem) !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
}
.newsletter-cta__perk-text{
  margin: 0.35rem 0 0 !important;
  color: rgba(18, 57, 93, 0.72) !important;
  font-size: clamp(0.82rem, 0.95vw, 0.92rem) !important;
  line-height: 1.25 !important;
}

@media (max-width: 899px) {
.newsletter-cta__main{
    grid-template-columns: 1fr !important;
  }
.newsletter-cta__perks{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 549px) {
.newsletter-cta__form{
    grid-template-columns: 1fr !important;
  }
.newsletter-cta__button{
    width: 100% !important;
  }
.newsletter-cta__perks{
    grid-template-columns: 1fr !important;
  }
}
/* Global accessibility helper */
.visually-hidden{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* Newsletter form row correction */
.newsletter-cta__form{
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  min-height: 58px !important;
  width: 100% !important;
  max-width: 760px !important;
  justify-self: end !important;
  border-radius: 0.35rem !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 0.75rem 2rem rgba(18, 57, 93, 0.06) !important;
}
.newsletter-cta__form .visually-hidden{
  position: absolute !important;
}
.newsletter-cta__input{
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: auto !important;
  height: 58px !important;
  border: 0 !important;
  padding: 0 1.6rem !important;
  background: #ffffff !important;
  color: var(--color-ink) !important;
  font-size: 1rem !important;
  line-height: 58px !important;
  outline: 0 !important;
}
.newsletter-cta__button{
  flex: 0 0 auto !important;
  min-width: 12.5rem !important;
  height: 58px !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 1.75rem !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.86rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}

@media (max-width: 899px) {
.newsletter-cta__form{
    justify-self: stretch !important;
    max-width: none !important;
  }
}

@media (max-width: 549px) {
.newsletter-cta__form{
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
.newsletter-cta__button{
    width: 100% !important;
    min-width: 0 !important;
  }
}
/* Trust icons stronger ThemeBlocks Skincare polish */
.trust-icons{
  padding-block: clamp(2rem, 4vw, 3rem) !important;
  background: #ffffff !important;
}
.trust-icons__grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1.5rem, 4vw, 4rem) !important;
  padding-top: clamp(2rem, 4vw, 2.7rem) !important;
  border-top: 1px solid rgba(18, 57, 93, 0.13) !important;
}
.trust-icons__item{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  gap: 1rem !important;
  align-items: center !important;
  justify-content: start !important;
  text-align: left !important;
  color: var(--color-ink) !important;
}
.trust-icons__icon{
  width: 2.65rem !important;
  height: 2.65rem !important;
  display: grid !important;
  place-items: center !important;
  color: var(--color-blue) !important;
}
.trust-icons__icon svg{
  width: 2.15rem !important;
  height: 2.15rem !important;
  display: block !important;
  stroke: currentColor !important;
}
.trust-icons__title{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: clamp(0.86rem, 1vw, 0.96rem) !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
}
.trust-icons__text{
  margin: 0.25rem 0 0 !important;
  color: rgba(18, 57, 93, 0.68) !important;
  font-size: clamp(0.78rem, 0.92vw, 0.88rem) !important;
  line-height: 1.25 !important;
}

@media (max-width: 899px) {
.trust-icons__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 549px) {
.trust-icons__grid{
    grid-template-columns: 1fr !important;
  }
}
/* Skincare guide image alignment fix */
.skincare-guide__grid{
  align-items: start !important;
}
.skincare-guide__card{
  display: grid !important;
  grid-template-rows: auto auto auto !important;
  align-content: start !important;
  justify-items: center !important;
}
.skincare-guide__media{
  width: 100% !important;
  height: clamp(16rem, 21vw, 21rem) !important;
  display: block !important;
  overflow: hidden !important;
  background: #eef4f8 !important;
}
.skincare-guide__image{
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}
.skincare-guide__title{
  min-height: 2.5rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 1.15rem !important;
  text-align: center !important;
}
.skincare-guide__link{
  margin-top: 0.65rem !important;
}

@media (min-width: 1200px) {
.skincare-guide__media{
    height: 21rem !important;
  }
}

@media (max-width: 749px) {
.skincare-guide__media{
    height: 15rem !important;
  }
.skincare-guide__title{
    min-height: auto !important;
  }
}
/* Skin goals image/card alignment fix */
.skin-goals__grid{
  align-items: start !important;
}
.skin-goals__card{
  display: grid !important;
  grid-template-rows: auto auto !important;
  align-content: start !important;
}
.skin-goals__media{
  width: 100% !important;
  height: clamp(22rem, 28vw, 30rem) !important;
  display: block !important;
  overflow: hidden !important;
  background: #eef4f8 !important;
}
.skin-goals__image{
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}
.skin-goals__content{
  min-height: 9.25rem !important;
  display: grid !important;
  align-content: start !important;
  justify-items: center !important;
  padding-top: 1.15rem !important;
}
.skin-goals__title{
  margin: 0 !important;
  line-height: 1.1 !important;
}
.skin-goals__text{
  min-height: 2.7rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.skin-goals__link{
  margin-top: 0.3rem !important;
}

@media (min-width: 1200px) {
.skin-goals__media{
    height: 29rem !important;
  }
}

@media (max-width: 749px) {
.skin-goals__media{
    height: 18rem !important;
  }
.skin-goals__content{
    min-height: auto !important;
  }
.skin-goals__text{
    min-height: auto !important;
  }
}
/* Category strip product-linked image support */
.category-strip__fallback{
  width: clamp(6.5rem, 8vw, 8.75rem);
  height: clamp(6.5rem, 8vw, 8.75rem);
  display: grid;
  place-items: center;
  border-radius: 999px;
  background:
    radial-gradient(circle at 35% 25%, #ffffff, #edf4f8 72%);
  color: rgba(18, 57, 93, 0.76);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.2;
  text-align: center;
}
.category-strip__image{
  mix-blend-mode: multiply;
}
/* Bestsellers carousel function/layout correction */
.bestsellers.section{
  padding-block: clamp(3.5rem, 6vw, 5.5rem) !important;
}
.bestsellers__top{
  margin-bottom: clamp(2rem, 4vw, 3rem) !important;
}
.bestsellers__panels{
  overflow: visible !important;
}
.bestsellers__carousel{
  display: flex !important;
  align-items: stretch !important;
  gap: clamp(1.75rem, 3vw, 3.25rem) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding-bottom: 0.5rem !important;
  scroll-snap-type: x mandatory !important;
}
.bestseller-card{
  flex: 0 0 calc((100% - (3 * clamp(1.75rem, 3vw, 3.25rem))) / 4) !important;
  display: grid !important;
  grid-template-rows: auto 18.5rem auto !important;
  gap: 1rem !important;
  min-height: auto !important;
}

.bestseller-card__content{
  min-height: 8.25rem !important;
}
.bestseller-card__title{
  font-size: clamp(1.05rem, 1.35vw, 1.35rem) !important;
}
.bestseller-card__subtitle{
  font-size: clamp(0.88rem, 1vw, 1rem) !important;
}
.bestsellers__controls{
  position: relative !important;
  z-index: 3 !important;
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  margin-top: 1.75rem !important;
}
.bestsellers__arrow{
  opacity: 1 !important;
}
.bestsellers__arrow:disabled{
  opacity: 0.28 !important;
  cursor: default !important;
}
.bestsellers:not(.has-carousel-overflow) .bestsellers__controls{
  opacity: 0.45 !important;
}

@media (max-width: 1199px) {
.bestseller-card{
    flex-basis: calc((100% - clamp(1.75rem, 3vw, 3.25rem)) / 2) !important;
  }
}

@media (max-width: 749px) {
.bestseller-card{
    flex-basis: 82% !important;
    grid-template-rows: auto 17rem auto !important;
  }
}
/* Hide bestseller carousel controls unless active tab has more than 4 cards */
.bestsellers:not(.has-more-than-four-products) .bestsellers__controls{
  display: none !important;
}
.bestsellers__controls[hidden]{
  display: none !important;
}
/* Bestsellers animated tab gradient background */
.bestsellers.section{
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background: #ffffff !important;
}
.bestsellers.section::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  pointer-events: none !important;
  opacity: 1 !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(201, 162, 39, 0.12), transparent 18rem),
    radial-gradient(circle at 78% 22%, rgba(31, 111, 174, 0.11), transparent 26rem),
    linear-gradient(135deg, #ffffff 0%, #f6fbfd 52%, #eef8fc 100%) !important;
  transition:
    background 700ms ease,
    opacity 700ms ease,
    transform 900ms ease !important;
}
.bestsellers.section::after{
  content: "" !important;
  position: absolute !important;
  inset: -18% -10% auto auto !important;
  width: min(48vw, 44rem) !important;
  height: min(48vw, 44rem) !important;
  z-index: -1 !important;
  pointer-events: none !important;
  border-radius: 999px !important;
  opacity: 0.42 !important;
  filter: blur(38px) !important;
  background:
    conic-gradient(
      from 135deg,
      rgba(201, 162, 39, 0.18),
      rgba(31, 111, 174, 0.14),
      rgba(142, 205, 224, 0.2),
      rgba(201, 162, 39, 0.18)
    ) !important;
  transform: translate3d(0, 0, 0) rotate(0deg) !important;
  transition:
    transform 900ms cubic-bezier(0.22, 1, 0.36, 1),
    opacity 700ms ease,
    background 700ms ease !important;
}
.bestsellers.section[data-active-tab-theme="tab-1"]::before{
  background:
    radial-gradient(circle at 16% 14%, rgba(201, 162, 39, 0.13), transparent 18rem),
    radial-gradient(circle at 78% 18%, rgba(31, 111, 174, 0.12), transparent 26rem),
    linear-gradient(135deg, #ffffff 0%, #f8fbfc 48%, #eef8fc 100%) !important;
}
.bestsellers.section[data-active-tab-theme="tab-2"]::before{
  background:
    radial-gradient(circle at 24% 20%, rgba(142, 205, 224, 0.22), transparent 20rem),
    radial-gradient(circle at 82% 16%, rgba(201, 162, 39, 0.1), transparent 24rem),
    linear-gradient(115deg, #ffffff 0%, #f4faf7 48%, #edf8f2 100%) !important;
}
.bestsellers.section[data-active-tab-theme="tab-3"]::before{
  background:
    radial-gradient(circle at 18% 22%, rgba(201, 162, 39, 0.14), transparent 19rem),
    radial-gradient(circle at 74% 18%, rgba(31, 111, 174, 0.16), transparent 27rem),
    linear-gradient(150deg, #ffffff 0%, #f5f9fc 48%, #eaf4fb 100%) !important;
}
.bestsellers.section[data-active-tab-theme="tab-1"]::after{
  transform: translate3d(0, 0, 0) rotate(0deg) !important;
}
.bestsellers.section[data-active-tab-theme="tab-2"]::after{
  opacity: 0.36 !important;
  transform: translate3d(-8vw, 4vw, 0) rotate(38deg) !important;
  background:
    conic-gradient(
      from 90deg,
      rgba(142, 205, 224, 0.2),
      rgba(201, 162, 39, 0.12),
      rgba(31, 111, 174, 0.1),
      rgba(142, 205, 224, 0.2)
    ) !important;
}
.bestsellers.section[data-active-tab-theme="tab-3"]::after{
  opacity: 0.45 !important;
  transform: translate3d(-3vw, -2vw, 0) rotate(-32deg) !important;
  background:
    conic-gradient(
      from 180deg,
      rgba(201, 162, 39, 0.17),
      rgba(31, 111, 174, 0.16),
      rgba(142, 205, 224, 0.16),
      rgba(201, 162, 39, 0.17)
    ) !important;
}
.bestsellers.section.is-switching-gradient::after{
  animation: bestsellersGradientPulse 900ms cubic-bezier(0.22, 1, 0.36, 1);
}

@keyframes bestsellersGradientPulse {
  0% {
    filter: blur(42px);
    opacity: 0.22;
    scale: 0.96;
  }

  55% {
    filter: blur(34px);
    opacity: 0.52;
    scale: 1.04;
  }

  100% {
    filter: blur(38px);
    scale: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
.bestsellers.section::before,
.bestsellers.section::after{
    transition: none !important;
    animation: none !important;
  }
}

@media (max-width: 749px) {
.bestsellers.section::after{
    width: 22rem !important;
    height: 22rem !important;
    inset: -7rem -8rem auto auto !important;
  }
}
.bestseller-card__badge{
  color: #c9a227 !important;
}
.bestseller-card__title{
  color: var(--color-ink) !important;
}
.bestseller-card__price{
  color: var(--color-ink) !important;
}
.bestseller-card__cart{
  border-color: rgba(18, 57, 93, 0.18) !important;
  background: rgba(255, 255, 255, 0.72) !important;
}
/* Bestsellers: make white JPG product backgrounds disappear without frames */
.bestsellers.section{
  background:
    linear-gradient(
      180deg,
      #f7fbfd 0%,
      #f8fcfd 38%,
      #ffffff 58%,
      #ffffff 100%
    ) !important;
}
.bestsellers.section::before{
  height: 46% !important;
  bottom: auto !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(201, 162, 39, 0.11), transparent 18rem),
    radial-gradient(circle at 78% 22%, rgba(31, 111, 174, 0.11), transparent 26rem),
    linear-gradient(135deg, rgba(255,255,255,0.92), rgba(239,248,252,0.88)) !important;
}
.bestsellers.section::after{
  top: -14% !important;
  bottom: auto !important;
  opacity: 0.28 !important;
}
/* Bestsellers: seamless white product row band to hide JPG backgrounds */
.bestsellers.section{
  background:
    linear-gradient(
      180deg,
      #f7fbfd 0%,
      #f3fbfd 42%,
      #ffffff 42%,
      #ffffff 100%
    ) !important;
}
.bestsellers__panels{
  position: relative !important;
  z-index: 1 !important;
}
.bestsellers__panels::before{
  content: "" !important;
  position: absolute !important;
  left: calc(var(--site-gutter) * -1) !important;
  right: calc(var(--site-gutter) * -1) !important;
  top: clamp(2.2rem, 4vw, 3.3rem) !important;
  height: clamp(17rem, 22vw, 21rem) !important;
  z-index: -1 !important;
  background: #ffffff !important;
  border-radius: 0 !important;
  pointer-events: none !important;
}
.bestsellers__carousel{
  position: relative !important;
  z-index: 2 !important;
}
.bestseller-card{
  grid-template-rows: auto 17rem auto !important;
}
/* Keep the top gradient glow subtle only above products */
.bestsellers.section::before{
  height: 40% !important;
  opacity: 0.75 !important;
}
.bestsellers.section::after{
  opacity: 0.22 !important;
}
/* Bestsellers: restrict gradient to top only so product JPG backgrounds disappear */
.bestsellers.section{
  background:
    linear-gradient(
      180deg,
      #f5fbfd 0%,
      #f8fcfd 12%,
      #ffffff 22%,
      #ffffff 100%
    ) !important;
}
.bestsellers.section::before{
  height: 18% !important;
  opacity: 0.55 !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(201, 162, 39, 0.09), transparent 16rem),
    radial-gradient(circle at 78% 10%, rgba(31, 111, 174, 0.08), transparent 22rem),
    linear-gradient(135deg, rgba(255,255,255,0.8), rgba(239,248,252,0.62)) !important;
}
.bestsellers.section::after{
  top: -22% !important;
  opacity: 0.16 !important;
}
.bestsellers__panels::before{
  top: 0 !important;
  height: 100% !important;
  background: #ffffff !important;
}

@keyframes themeblocks-skincareLogoWaterGlow {
  0% {
    opacity: 0;
    transform: scale(0.84) translateY(12px);
    filter: blur(24px);
  }

  48% {
    opacity: 1;
    transform: scale(1.05) translateY(0);
    filter: blur(16px);
  }

  100% {
    opacity: 0.42;
    transform: scale(1) translateY(0);
    filter: blur(20px);
  }
}

@keyframes themeblocks-skincareLogoWaterSweep {
  0% {
    opacity: 0;
    transform: translateX(-120%) skewX(-10deg);
  }

  18% {
    opacity: 1;
  }

  100% {
    opacity: 0;
    transform: translateX(120%) skewX(-10deg);
  }
}
/* Hero image clarity pass: remove white haze over model shoulder */
@media (min-width: 900px){
  .hero-themeblocks-skincare__background {
    opacity: 1 !important;
    filter: none !important;
  }

  .hero-themeblocks-skincare__background::before,
  .hero-themeblocks-skincare__background::after {
    opacity: 0 !important;
    display: none !important;
  }

  .hero-themeblocks-skincare__background-image {
    opacity: 1 !important;
    filter: none !important;
  }

  .hero-themeblocks-skincare::before,
  .hero-themeblocks-skincare::after {
    opacity: 0 !important;
    display: none !important;
  }
}
/* Sticky header logo */
.site-header__inner{
  position: relative !important;
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
  gap: 1.5rem !important;
}
.site-header__logo-link{
  display: inline-flex !important;
  align-items: center !important;
  justify-self: start !important;
  width: clamp(8.5rem, 12vw, 12rem) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(-6px) scale(0.96) !important;
  transition:
    opacity 220ms ease,
    visibility 220ms ease,
    transform 220ms ease !important;
}
.site-header.is-scrolled .site-header__logo-link,
.site-header:hover .site-header__logo-link{
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
}
.site-header__logo-image{
  width: 100% !important;
  height: auto !important;
  display: block !important;
}
.site-header__logo-text{
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: 1.45rem !important;
  line-height: 1 !important;
}
.site-header__nav{
  justify-self: center !important;
}
.site-header__cart,
.site-header__cart-link,
.header-cart{
  justify-self: end !important;
}


/* Header repair: undo broken grid layout */
.site-header__inner{
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  min-height: 4.5rem !important;
}
/* Keep logo independent from nav flow */
.site-header__logo-link{
  position: absolute !important;
  left: max(var(--site-gutter), calc((100vw - var(--page-width)) / 2)) !important;
  top: 50% !important;
  width: clamp(8rem, 10vw, 11rem) !important;
  transform: translateY(-50%) translateX(-8px) scale(0.96) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  z-index: 3 !important;
  pointer-events: none !important;
  transition:
    opacity 220ms ease,
    visibility 220ms ease,
    transform 220ms ease !important;
}
/* Show logo only after sticky/scrolled state */
.site-header.is-scrolled .site-header__logo-link{
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(-50%) translateX(0) scale(1) !important;
  pointer-events: auto !important;
}
.site-header__logo-image{
  width: 100% !important;
  height: auto !important;
  display: block !important;
}
/* Nav stays centered */
.site-header__nav{
  position: static !important;
  justify-self: auto !important;
  margin-inline: auto !important;
}
/* Cart stays right */
.site-header__cart,
.site-header__cart-link,
.header-cart{
  position: absolute !important;
  right: max(var(--site-gutter), calc((100vw - var(--page-width)) / 2)) !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  justify-self: auto !important;
}
/* Mobile: don't show desktop sticky logo inside hero header */
@media (max-width: 749px){

  .header-cart {
    position: static !important;
    transform: none !important;
  }
}
/* Sticky header logo fallback visibility fix */
.site-header__logo-link{
  min-width: 8rem !important;
  min-height: 2.4rem !important;
}
.site-header__logo-text{
  display: inline-flex !important;
  align-items: center !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: clamp(1.45rem, 2vw, 1.9rem) !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
  white-space: nowrap !important;
}
.site-header.is-scrolled .site-header__logo-link{
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(-50%) translateX(0) scale(1) !important;
  pointer-events: auto !important;
}
/* TEMP/FIX: force desktop header logo visible */
@media (min-width: 750px){
  .site-header__logo-link {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: absolute !important;
    left: max(var(--site-gutter), calc((100vw - var(--page-width)) / 2)) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 20 !important;
    width: clamp(8rem, 10vw, 11rem) !important;
    min-width: 8rem !important;
    min-height: 2.4rem !important;
  }

  .site-header__logo-image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  .site-header__logo-text {
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
}
/* Final header logo behavior: hide on homepage hero,
show only after sticky scroll */
@media (min-width: 750px){

  .site-header__logo-link {
    left: max(var(--site-gutter), calc((100vw - var(--page-width)) / 2)) !important;
    top: 50% !important;
    width: clamp(6.8rem, 8vw, 8.8rem) !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  .site-header__logo-image {
    width: 100% !important;
    max-height: 3.15rem !important;
    object-fit: contain !important;
  }

  .site-header__logo-text {
    font-size: clamp(1.15rem, 1.5vw, 1.45rem) !important;
  }
.site-header.is-scrolled{
    background: rgba(255, 255, 255, 0.9) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    box-shadow: 0 0.65rem 2rem rgba(18, 57, 93, 0.06) !important;
  }
.site-header.is-scrolled .site-header__inner{
    min-height: 4rem !important;
  }
}
/* Shoppable videos / Tolstoy-style carousel */
.shoppable-videos{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 14% 12%, rgba(201, 162, 39, 0.08), transparent 18rem),
    radial-gradient(circle at 88% 18%, rgba(31, 111, 174, 0.08), transparent 24rem),
    #ffffff;
}
.shoppable-videos__top{
  max-width: 58rem;
  margin-inline: auto;
  margin-bottom: clamp(1.75rem, 3vw, 2.75rem);
  text-align: center;
}
.shoppable-videos__eyebrow{
  margin: 0 0 0.65rem;
  color: var(--color-blue);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.shoppable-videos__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.4rem, 4.4vw, 4.6rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.055em;
}
.shoppable-videos__viewport{
  position: relative;
}
.shoppable-videos__track{
  display: flex;
  gap: clamp(1rem, 1.7vw, 1.5rem);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding: 0.25rem 0.15rem 0.75rem;
}
.shoppable-videos__track::-webkit-scrollbar{
  display: none;
}
.shoppable-video-card{
  flex: 0 0 calc((100% - (3 * clamp(1rem, 1.7vw, 1.5rem))) / 4);
  min-width: 0;
  scroll-snap-align: start;
  display: grid;
  gap: 0.85rem;
}
.shoppable-video-card__media{
  position: relative;
  display: block;
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border-radius: 1.15rem;
  background:
    linear-gradient(145deg, rgba(31, 111, 174, 0.16), rgba(201, 162, 39, 0.08)),
    #eaf5fa;
  box-shadow:
    0 1.2rem 3rem rgba(18, 57, 93, 0.12),
    inset 0 0 0 1px rgba(255,255,255,0.55);
}
.shoppable-video-card__image,
.shoppable-video-card__video{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.shoppable-video-card__scrim{
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(18, 57, 93, 0.04), transparent 36%),
    linear-gradient(0deg, rgba(18, 57, 93, 0.68), transparent 46%);
  pointer-events: none;
}
.shoppable-video-card__play{
  position: absolute;
  left: 50%;
  top: 50%;
  width: 3.4rem;
  height: 3.4rem;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.46);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transform: translate(-50%, -50%);
  transition:
    transform 220ms ease,
    background 220ms ease;
}
.shoppable-video-card__play svg{
  width: 1.8rem;
  height: 1.8rem;
}
.shoppable-video-card:hover .shoppable-video-card__play{
  transform: translate(-50%, -50%) scale(1.08);
  background: rgba(255,255,255,0.26);
}
.shoppable-video-card__copy{
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  display: grid;
  gap: 0.3rem;
  color: #ffffff;
  text-shadow: 0 0.35rem 1.25rem rgba(0,0,0,0.3);
}
.shoppable-video-card__title{
  font-size: clamp(0.95rem, 1vw, 1.05rem);
  font-weight: 900;
  line-height: 1.15;
}
.shoppable-video-card__handle{
  font-size: 0.78rem;
  font-weight: 800;
  opacity: 0.9;
}
.shoppable-video-card__product{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.65rem;
  align-items: center;
  min-height: 4.2rem;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 1rem;
  padding: 0.55rem;
  background: rgba(255,255,255,0.86);
  box-shadow: 0 0.8rem 2rem rgba(18, 57, 93, 0.07);
}
.shoppable-video-card__product-image{
  width: 3rem;
  height: 3rem;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.shoppable-video-card__product-title,
.shoppable-video-card__product-price{
  display: block;
}
.shoppable-video-card__product-title{
  color: var(--color-ink);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.shoppable-video-card__product-price{
  margin-top: 0.2rem;
  color: rgba(18, 57, 93, 0.68);
  font-size: 0.78rem;
  font-weight: 800;
}
.shoppable-video-card__placeholder{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 20%, rgba(255,255,255,0.75), transparent 12rem),
    linear-gradient(145deg, rgba(31,111,174,0.26), rgba(142,205,224,0.18), rgba(201,162,39,0.12));
}
.shoppable-video-card__placeholder-bottle{
  width: 4rem;
  height: 10rem;
  border-radius: 1.5rem 1.5rem 2rem 2rem;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.95), rgba(232,240,242,0.72), rgba(255,255,255,0.96));
  box-shadow: 0 1rem 2rem rgba(18, 57, 93, 0.16);
}
.shoppable-video-card__placeholder-bottle::before{
  content: "";
  display: block;
  width: 2.5rem;
  height: 2rem;
  margin: -1.8rem auto 0;
  border-radius: 0.8rem 0.8rem 0.2rem 0.2rem;
  background: linear-gradient(90deg, #d2d5d5, #fff, #aeb5b8);
}
.shoppable-videos__arrow{
  position: absolute;
  top: 43%;
  z-index: 3;
  width: 2.8rem;
  height: 2.8rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(18, 57, 93, 0.12);
  border-radius: 999px;
  background: rgba(255,255,255,0.88);
  color: var(--color-blue);
  font-size: 2rem;
  line-height: 1;
  box-shadow: 0 0.8rem 2.5rem rgba(18, 57, 93, 0.12);
  cursor: pointer;
}
.shoppable-videos__arrow--prev{
  left: -1.4rem;
}
.shoppable-videos__arrow--next{
  right: -1.4rem;
}
.shoppable-videos__arrow:disabled{
  opacity: 0.28;
  cursor: default;
}
.shoppable-videos:not(.has-shoppable-overflow) .shoppable-videos__arrow{
  display: none;
}

@media (max-width: 1199px) {
.shoppable-video-card{
    flex-basis: calc((100% - clamp(1rem, 1.7vw, 1.5rem)) / 2);
  }
}

@media (max-width: 749px) {
.shoppable-videos__heading{
    font-size: clamp(2.25rem, 10vw, 3.2rem);
  }
.shoppable-video-card{
    flex-basis: 76%;
  }
.shoppable-videos__arrow{
    display: none !important;
  }
}
/* Shoppable video modal */
.shoppable-video-card__media{
  border: 0;
  padding: 0;
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.shoppable-video-modal{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 3vw, 2rem);
}
.shoppable-video-modal[hidden]{
  display: none !important;
}
.shoppable-video-modal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(8, 22, 36, 0.58);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.shoppable-video-modal__dialog{
  position: relative;
  z-index: 1;
  width: min(100%, 28rem);
  max-height: min(92vh, 58rem);
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  overflow: hidden;
  border-radius: 1.4rem;
  background: #ffffff;
  box-shadow: 0 2rem 7rem rgba(8, 22, 36, 0.35);
}
.shoppable-video-modal__close{
  position: absolute;
  top: 0.8rem;
  right: 0.8rem;
  z-index: 5;
  width: 2.45rem;
  height: 2.45rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,0.4);
  border-radius: 999px;
  background: rgba(8, 22, 36, 0.36);
  color: #ffffff;
  font-size: 1.8rem;
  line-height: 1;
  cursor: pointer;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.shoppable-video-modal__media{
  position: relative;
  aspect-ratio: 9 / 16;
  background: #061424;
  overflow: hidden;
}
.shoppable-video-modal__media video,
.shoppable-video-modal__media img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.shoppable-video-modal__media video{
  background: #061424;
}
.shoppable-video-modal__content{
  display: grid;
  gap: 0.45rem;
  padding: 1rem;
  background:
    radial-gradient(circle at 0% 0%, rgba(201, 162, 39, 0.08), transparent 14rem),
    #ffffff;
}
.shoppable-video-modal__handle{
  margin: 0;
  color: rgba(18, 57, 93, 0.68);
  font-size: 0.82rem;
  font-weight: 800;
}
.shoppable-video-modal__title{
  margin: 0;
  color: var(--color-ink);
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1.2;
}
.shoppable-video-modal__cta{
  margin-top: 0.6rem;
  justify-self: stretch;
  text-align: center;
}
body.has-shoppable-modal-open{
  overflow: hidden;
}

@media (min-width: 750px) {
.shoppable-video-modal__dialog{
    width: min(100%, 30rem);
  }
}

@media (max-width: 549px) {
.shoppable-video-modal{
    padding: 0.75rem;
  }
.shoppable-video-modal__dialog{
    max-height: 94vh;
    border-radius: 1.1rem;
  }
}
/* Shoppable video: cleaner modal + perfect portrait fit */
.shoppable-video-modal__backdrop{
  background: rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
}
.shoppable-video-modal__dialog{
  background: transparent !important;
  box-shadow: 0 2rem 7rem rgba(18, 57, 93, 0.22) !important;
}
.shoppable-video-modal__media{
  aspect-ratio: 9 / 16 !important;
  background: transparent !important;
  border-radius: 1.4rem !important;
  overflow: hidden !important;
}
.shoppable-video-modal__media video,
.shoppable-video-modal__media img,
.shoppable-video-modal__source{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: transparent !important;
  display: block !important;
}
.shoppable-video-modal__content{
  margin-top: 0.75rem !important;
  border-radius: 1rem !important;
  box-shadow: 0 1rem 3rem rgba(18, 57, 93, 0.12) !important;
}
/* Shoppable cards: make uploaded videos/images fill the card perfectly */
.shoppable-video-card__media{
  aspect-ratio: 9 / 16 !important;
  background: transparent !important;
}
.shoppable-video-card__image,
.shoppable-video-card__video{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: transparent !important;
}
/* Remove black/grey feel caused by video element background */
.shoppable-video-card__video,
.shoppable-video-modal__media video{
  background-color: transparent !important;
}
/* Keep card polish without grey canvas */
.shoppable-video-card__media{
  box-shadow:
    0 1.2rem 3rem rgba(18, 57, 93, 0.11),
    inset 0 0 0 1px rgba(255,255,255,0.5) !important;
}
/* Make close button visible on light modal backdrop */
.shoppable-video-modal__close{
  background: rgba(18, 57, 93, 0.72) !important;
  border-color: rgba(255,255,255,0.55) !important;
}
/* Stronger portrait crop for videos with letterboxing */
.shoppable-video-card__video,
.shoppable-video-modal__media video{
  object-fit: cover !important;
  transform: scale(1.015) !important;
}
/* Shoppable videos: hard crop letterboxing + remove grey card background */
.shoppable-videos{
  background:
    radial-gradient(circle at 12% 8%, rgba(201, 162, 39, 0.055), transparent 18rem),
    radial-gradient(circle at 88% 10%, rgba(31, 111, 174, 0.055), transparent 24rem),
    #ffffff !important;
}
.shoppable-video-card{
  background: transparent !important;
}
.shoppable-video-card__media{
  position: relative !important;
  aspect-ratio: 9 / 16 !important;
  background: transparent !important;
  background-color: transparent !important;
  overflow: hidden !important;
  border-radius: 1.15rem !important;
  isolation: isolate !important;
}
.shoppable-video-card__media::before,
.shoppable-video-card__media::after{
  display: none !important;
  content: none !important;
}
/* Kill grey/black video canvas caused by native video rendering */
.shoppable-video-card__video,
.shoppable-video-card__image,
.shoppable-video-card__media video,
.shoppable-video-card__media img{
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: transparent !important;
  background-color: transparent !important;
  transform: translate(-50%, -50%) scale(1.18) !important;
}
/* Extra crop for videos with baked top/bottom bars */
.shoppable-video-card__media video{
  width: 112% !important;
  height: 112% !important;
  transform: translate(-50%, -50%) scale(1.22) !important;
}
/* Put overlays back above absolute media */
.shoppable-video-card__scrim,
.shoppable-video-card__play,
.shoppable-video-card__copy{
  z-index: 2 !important;
}
/* Remove any unwanted grey from product pill/card area */
.shoppable-video-card__product{
  background: #ffffff !important;
  border-color: rgba(18, 57, 93, 0.08) !important;
}
/* Modal: hard crop video the same way */
.shoppable-video-modal__dialog{
  background: transparent !important;
}
.shoppable-video-modal__media{
  position: relative !important;
  aspect-ratio: 9 / 16 !important;
  background: transparent !important;
  background-color: transparent !important;
  overflow: hidden !important;
  border-radius: 1.4rem !important;
}
.shoppable-video-modal__media video,
.shoppable-video-modal__media img,
.shoppable-video-modal__source{
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  width: 112% !important;
  height: 112% !important;
  max-width: none !important;
  max-height: none !important;
  min-width: 112% !important;
  min-height: 112% !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: transparent !important;
  background-color: transparent !important;
  transform: translate(-50%, -50%) scale(1.08) !important;
}
.shoppable-video-modal__backdrop{
  background: rgba(255, 255, 255, 0.76) !important;
}
/* Shoppable videos: aggressive crop for baked letterbox videos */
.shoppable-video-card__media video,
.shoppable-video-modal__media video{
  width: 126% !important;
  height: 126% !important;
  transform: translate(-50%, -50%) scale(1.12) !important;
}
/* Shoppable videos: remove grey strip behind product pills */
.shoppable-videos{
  background: #ffffff !important;
}
.shoppable-videos__track{
  background: transparent !important;
  padding-bottom: 0 !important;
}
.shoppable-video-card{
  background: transparent !important;
}
.shoppable-video-card__product{
  position: relative !important;
  z-index: 3 !important;
  background: #ffffff !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow:
    0 0.75rem 2rem rgba(18, 57, 93, 0.055),
    inset 0 0 0 1px rgba(255, 255, 255, 0.75) !important;
}
.shoppable-video-card__product::before,
.shoppable-video-card__product::after{
  display: none !important;
  content: none !important;
}
.shoppable-video-card__product-image{
  background: #ffffff !important;
  mix-blend-mode: multiply !important;
}
.shoppable-videos__viewport{
  background: transparent !important;
}
.shoppable-videos .container{
  background: transparent !important;
}
/* Shoppable videos: force clean white bottom area */
.shoppable-videos{
  padding-bottom: clamp(3.5rem, 6vw, 5rem) !important;
  border-bottom: 0 !important;
}
.shoppable-videos + *{
  margin-top: 0 !important;
}
/* Shoppable videos: intentional soft product tray */
.shoppable-videos__track{
  position: relative !important;
  padding: 0.25rem clamp(0.75rem, 1.5vw, 1.25rem) clamp(1.25rem, 2vw, 1.75rem) !important;
}
.shoppable-videos__track::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: clamp(5.8rem, 7vw, 7rem) !important;
  z-index: 0 !important;
  border-radius: 1.6rem !important;
  background:
    linear-gradient(180deg, rgba(248, 252, 253, 0.96), rgba(241, 247, 250, 0.92)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(18, 57, 93, 0.045),
    0 1.25rem 3rem rgba(18, 57, 93, 0.045) !important;
  pointer-events: none !important;
}
.shoppable-video-card{
  position: relative !important;
  z-index: 1 !important;
}
.shoppable-video-card__product{
  margin-top: 0.15rem !important;
  border-radius: 1.15rem !important;
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow:
    0 0.75rem 1.8rem rgba(18, 57, 93, 0.055),
    inset 0 0 0 1px rgba(255, 255, 255, 0.75) !important;
}

@media (max-width: 749px) {
.shoppable-videos__track::after{
    height: 6.5rem !important;
    border-radius: 1.25rem !important;
  }
}
/* Shoppable videos: keep tray only behind product pills,
not videos */
.shoppable-videos__track{
  align-items: start !important;
  padding-top: 0.25rem !important;
  padding-bottom: clamp(1rem, 2vw, 1.4rem) !important;
}
.shoppable-videos__track::after{
  top: auto !important;
  bottom: 0.35rem !important;
  height: clamp(5.2rem, 6vw, 6.25rem) !important;
  border-radius: 1.45rem !important;
  background:
    linear-gradient(180deg, rgba(247, 252, 253, 0.96), rgba(240, 247, 250, 0.92)) !important;
  transform: none !important;
}
.shoppable-video-card__media{
  position: relative !important;
  z-index: 2 !important;
}
.shoppable-video-card__product{
  position: relative !important;
  z-index: 3 !important;
  margin-top: 0.8rem !important;
}
/* prevent tray from visually touching/bleeding into the rounded video corners */
.shoppable-video-card{
  isolation: isolate !important;
}
/* Stricter product-only tray */
.shoppable-videos__track::after{
  bottom: 0.15rem !important;
  height: 5.4rem !important;
}
.shoppable-video-card__product{
  min-height: 4.6rem !important;
}
/* Shoppable videos: remove tray,
keep clean product pills only */
.shoppable-videos__track{
  padding: 0.25rem 0.15rem 0.75rem !important;
  background: transparent !important;
}
.shoppable-videos__track::after{
  content: none !important;
  display: none !important;
}
.shoppable-video-card{
  isolation: auto !important;
  background: transparent !important;
}
.shoppable-video-card__media{
  z-index: auto !important;
}
.shoppable-video-card__product{
  margin-top: 0.9rem !important;
  position: relative !important;
  z-index: auto !important;
  border-radius: 1.15rem !important;
  background: #ffffff !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.07),
    inset 0 0 0 1px rgba(255, 255, 255, 0.85) !important;
}
/* Shoppable videos: hide product pills from carousel cards */
.shoppable-video-card__product{
  display: none !important;
}
/* Shoppable video modal product pill */
.shoppable-video-modal__content{
  padding: 1rem !important;
  border-radius: 0 0 1.4rem 1.4rem !important;
  background: #ffffff !important;
}
.shoppable-video-modal__cta{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 0.75rem !important;
  align-items: center !important;
  margin-top: 0.85rem !important;
  min-height: 4.6rem !important;
  padding: 0.65rem 0.85rem !important;
  border-radius: 1rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  background: #f8fcfd !important;
  color: var(--color-ink) !important;
  text-align: left !important;
  text-decoration: none !important;
  box-shadow:
    0 0.75rem 2rem rgba(18, 57, 93, 0.08),
    inset 0 0 0 1px rgba(255,255,255,0.85) !important;
}
.shoppable-video-modal__cta::after{
  content: "Shop now" !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.45rem !important;
  padding: 0 0.9rem !important;
  border-radius: 0.7rem !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}
.shoppable-video-modal__cta:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(201, 162, 39, 0.32) !important;
}
.shoppable-video-modal__cta-image{
  width: 3.2rem !important;
  height: 3.2rem !important;
  object-fit: contain !important;
  border-radius: 0.55rem !important;
  background: #ffffff !important;
  mix-blend-mode: multiply !important;
}
.shoppable-video-modal__cta-copy{
  min-width: 0 !important;
  display: grid !important;
  gap: 0.18rem !important;
}
.shoppable-video-modal__cta-title{
  color: var(--color-ink) !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.shoppable-video-modal__cta-price{
  color: rgba(18, 57, 93, 0.68) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
}
/* Shoppable modal: product pill must always be visible */
.shoppable-video-modal__cta{
  opacity: 1 !important;
  visibility: visible !important;
  display: grid !important;
  pointer-events: auto !important;
  transform: none !important;
}
.shoppable-video-modal__cta *,
.shoppable-video-modal__cta-image,
.shoppable-video-modal__cta-copy,
.shoppable-video-modal__cta-title,
.shoppable-video-modal__cta-price{
  opacity: 1 !important;
  visibility: visible !important;
}
.shoppable-video-modal__cta:hover,
.shoppable-video-modal__cta:focus,
.shoppable-video-modal__cta:focus-visible{
  opacity: 1 !important;
  visibility: visible !important;
}
.shoppable-video-modal__cta .shoppable-video-modal__cta-copy{
  display: grid !important;
}
.shoppable-video-modal__cta .shoppable-video-modal__cta-title,
.shoppable-video-modal__cta .shoppable-video-modal__cta-price{
  display: block !important;
}
/* Neutralize generic .button styles inside modal CTA */
.shoppable-video-modal__cta.button{
  min-height: 4.6rem !important;
  border-radius: 1rem !important;
  padding: 0.65rem 0.85rem !important;
  line-height: 1.2 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
/* Shoppable modal: final CTA pill visibility fix */
.shoppable-video-modal__cta{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 0.75rem !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: var(--color-ink) !important;
  background: #f8fcfd !important;
  text-decoration: none !important;
  transform: none !important;
}
.shoppable-video-modal__cta::before{
  display: none !important;
  content: none !important;
}
.shoppable-video-modal__cta::after{
  content: "Shop now" !important;
  position: static !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
.shoppable-video-modal__cta-image,
.shoppable-video-modal__cta-copy,
.shoppable-video-modal__cta-title,
.shoppable-video-modal__cta-price{
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
/* Shoppable modal: structured product CTA,
always visible */
.shoppable-video-modal__cta{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 0.75rem !important;
  align-items: center !important;
  margin-top: 0.85rem !important;
  min-height: 4.6rem !important;
  padding: 0.65rem 0.85rem !important;
  border-radius: 1rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  background: #f8fcfd !important;
  color: var(--color-ink) !important;
  text-align: left !important;
  text-decoration: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  pointer-events: auto !important;
  box-shadow:
    0 0.75rem 2rem rgba(18, 57, 93, 0.08),
    inset 0 0 0 1px rgba(255,255,255,0.85) !important;
}
.shoppable-video-modal__cta[hidden]{
  display: none !important;
}
.shoppable-video-modal__cta::before,
.shoppable-video-modal__cta::after{
  content: none !important;
  display: none !important;
}
.shoppable-video-modal__cta-image{
  width: 3.2rem !important;
  height: 3.2rem !important;
  display: block !important;
  object-fit: contain !important;
  border-radius: 0.55rem !important;
  background: #ffffff !important;
  mix-blend-mode: multiply !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.shoppable-video-modal__cta-image[hidden]{
  display: none !important;
}
.shoppable-video-modal__cta-copy{
  min-width: 0 !important;
  display: grid !important;
  gap: 0.18rem !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.shoppable-video-modal__cta-title{
  display: block !important;
  color: var(--color-ink) !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
  line-height: 1.12 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.shoppable-video-modal__cta-price{
  display: block !important;
  color: rgba(18, 57, 93, 0.68) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.shoppable-video-modal__cta-price[hidden]{
  display: none !important;
}
.shoppable-video-modal__cta-action{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.45rem !important;
  padding: 0 0.9rem !important;
  border-radius: 0.7rem !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* Shoppable modal CTA image wrapper */
.shoppable-video-modal__cta-image-wrap{
  width: 3.2rem !important;
  height: 3.2rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 0.55rem !important;
  background: #ffffff !important;
  overflow: hidden !important;
}
.shoppable-video-modal__cta-image-wrap[hidden]{
  display: none !important;
}
.shoppable-video-modal__cta-image-wrap .shoppable-video-modal__cta-image{
  width: 3.2rem !important;
  height: 3.2rem !important;
  display: block !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
}
/* Shoppable modal: fix product CTA overlap/z-index */
.shoppable-video-modal__dialog{
  display: flex !important;
  flex-direction: column !important;
  width: min(100%, 30rem) !important;
  max-height: 92vh !important;
  overflow: visible !important;
  border-radius: 1.4rem !important;
  background: transparent !important;
}
.shoppable-video-modal__media{
  position: relative !important;
  z-index: 1 !important;
  flex: 0 1 auto !important;
  width: 100% !important;
  aspect-ratio: 9 / 16 !important;
  max-height: calc(92vh - 7.8rem) !important;
  overflow: hidden !important;
  border-radius: 1.4rem !important;
  background: #061424 !important;
  box-shadow: 0 1.6rem 5rem rgba(18, 57, 93, 0.24) !important;
}
.shoppable-video-modal__content{
  position: relative !important;
  z-index: 5 !important;
  flex: 0 0 auto !important;
  margin-top: 0.85rem !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.shoppable-video-modal__handle,
.shoppable-video-modal__title{
  display: none !important;
}
/* Product pill now becomes modal footer card */
.shoppable-video-modal__cta{
  position: relative !important;
  z-index: 10 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 0.85rem !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 5.1rem !important;
  margin: 0 !important;
  padding: 0.75rem 0.85rem !important;
  border-radius: 1.15rem !important;
  border: 1px solid rgba(201, 162, 39, 0.32) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: var(--color-ink) !important;
  text-decoration: none !important;
  box-shadow:
    0 1.2rem 3.5rem rgba(18, 57, 93, 0.16),
    inset 0 0 0 1px rgba(255,255,255,0.9) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.shoppable-video-modal__cta-image-wrap{
  width: 3.7rem !important;
  height: 3.7rem !important;
  border-radius: 0.75rem !important;
  background: #ffffff !important;
  overflow: hidden !important;
  display: grid !important;
  place-items: center !important;
}
.shoppable-video-modal__cta-image-wrap .shoppable-video-modal__cta-image{
  width: 3.7rem !important;
  height: 3.7rem !important;
  object-fit: contain !important;
}
.shoppable-video-modal__cta-title{
  font-size: 1rem !important;
  line-height: 1.1 !important;
}
.shoppable-video-modal__cta-price{
  margin-top: 0.25rem !important;
  font-size: 0.9rem !important;
}
.shoppable-video-modal__cta-action{
  min-height: 3rem !important;
  padding: 0 1.15rem !important;
  border-radius: 0.85rem !important;
  white-space: nowrap !important;
}
/* Keep close button over video */
.shoppable-video-modal__close{
  z-index: 20 !important;
}

@media (max-width: 549px) {
.shoppable-video-modal__dialog{
    width: min(100%, 25rem) !important;
    max-height: 94vh !important;
  }
.shoppable-video-modal__media{
    max-height: calc(94vh - 7.4rem) !important;
  }
.shoppable-video-modal__cta{
    grid-template-columns: auto minmax(0, 1fr) !important;
  }
.shoppable-video-modal__cta-action{
    grid-column: 1 / -1 !important;
    width: 100% !important;
  }
}
/* Shoppable modal: refined video + product CTA composition */
.shoppable-video-modal__dialog{
  width: min(100%, 29rem) !important;
  max-height: 94vh !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border-radius: 1.45rem !important;
  background: #ffffff !important;
  box-shadow:
    0 2rem 7rem rgba(18, 57, 93, 0.26),
    inset 0 0 0 1px rgba(255,255,255,0.75) !important;
}
.shoppable-video-modal__media{
  width: 100% !important;
  max-height: calc(94vh - 6.5rem) !important;
  aspect-ratio: 9 / 16 !important;
  border-radius: 1.45rem 1.45rem 0 0 !important;
  box-shadow: none !important;
  background: #061424 !important;
}
.shoppable-video-modal__content{
  z-index: 5 !important;
  margin-top: 0 !important;
  padding: 0.85rem !important;
  background: #ffffff !important;
  border-radius: 0 0 1.45rem 1.45rem !important;
  box-shadow: none !important;
}
/* Modal product pill: compact,
clean,
always below video */
.shoppable-video-modal__cta{
  min-height: 4.85rem !important;
  margin: 0 !important;
  padding: 0.65rem 0.75rem !important;
  border-radius: 1.05rem !important;
  border: 1px solid rgba(201, 162, 39, 0.24) !important;
  background:
    linear-gradient(180deg, #ffffff, #f8fcfd) !important;
  box-shadow:
    0 0.7rem 1.7rem rgba(18, 57, 93, 0.08),
    inset 0 0 0 1px rgba(255,255,255,0.9) !important;
}
.shoppable-video-modal__cta-image-wrap{
  width: 3.35rem !important;
  height: 3.35rem !important;
  border-radius: 0.75rem !important;
}
.shoppable-video-modal__cta-image-wrap .shoppable-video-modal__cta-image{
  width: 3.35rem !important;
  height: 3.35rem !important;
}
.shoppable-video-modal__cta-title{
  font-size: 0.96rem !important;
  line-height: 1.1 !important;
}
.shoppable-video-modal__cta-price{
  margin-top: 0.2rem !important;
  font-size: 0.88rem !important;
}
.shoppable-video-modal__cta-action{
  min-height: 2.75rem !important;
  padding: 0 1rem !important;
  border-radius: 0.78rem !important;
  font-size: 0.76rem !important;
}
/* Close button placement after dialog overflow hidden */
.shoppable-video-modal__close{
  top: 0.75rem !important;
  right: 0.75rem !important;
}
/* Remove any old spacer/ghost effects around modal footer */
.shoppable-video-modal__content::before,
.shoppable-video-modal__content::after,
.shoppable-video-modal__cta::before,
.shoppable-video-modal__cta::after{
  content: none !important;
  display: none !important;
}

@media (max-width: 549px) {
.shoppable-video-modal__dialog{
    width: min(100%, 25.5rem) !important;
  }
.shoppable-video-modal__media{
    max-height: calc(94vh - 7.2rem) !important;
  }
.shoppable-video-modal__cta{
    min-height: 4.75rem !important;
  }
}
/* Category strip: larger product images */
.category-strip{
  padding-block: clamp(3.25rem, 5vw, 5rem) !important;
}
.category-strip__grid{
  align-items: start !important;
}
.category-strip__media{
  height: clamp(9.5rem, 11vw, 13rem) !important;
  display: grid !important;
  place-items: center !important;
  margin-bottom: 1.15rem !important;
  overflow: visible !important;
}
.category-strip__image{
  max-width: min(100%, 10rem) !important;
  max-height: clamp(8.8rem, 10vw, 12rem) !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  transform: scale(1.45) !important;
  transform-origin: center center !important;
  mix-blend-mode: multiply !important;
}
/* Wide jar/category images should not become too huge */
.category-strip__image[alt*="Mask"],
.category-strip__image[alt*="Cream"],
.category-strip__image[alt*="CREAM"],
.category-strip__image[alt*="Trio"],
.category-strip__image[alt*="Collection"]{
  transform: scale(1.2) !important;
  max-width: min(100%, 12rem) !important;
}
.category-strip__title{
  margin-top: 0 !important;
}

@media (max-width: 1199px) {
.category-strip__media{
    height: 10.5rem !important;
  }
.category-strip__image{
    max-height: 9.5rem !important;
    transform: scale(1.28) !important;
  }
}

@media (max-width: 749px) {
.category-strip__media{
    height: 8.25rem !important;
  }
.category-strip__image{
    max-height: 7.5rem !important;
    transform: scale(1.08) !important;
  }
}
/* Category strip: additional 30% image size increase */
.category-strip__media{
  height: clamp(11.5rem, 14vw, 16rem) !important;
  margin-bottom: 1.25rem !important;
}
.category-strip__image{
  max-width: min(100%, 13rem) !important;
  max-height: clamp(10.8rem, 13vw, 15rem) !important;
  transform: scale(1.9) !important;
}
/* Keep wider jar/bundle-style images controlled */
.category-strip__image[alt*="Mask"],
.category-strip__image[alt*="Cream"],
.category-strip__image[alt*="CREAM"],
.category-strip__image[alt*="Trio"],
.category-strip__image[alt*="Collection"]{
  max-width: min(100%, 15rem) !important;
  max-height: clamp(10.8rem, 13vw, 15rem) !important;
  transform: scale(1.45) !important;
}

@media (max-width: 1199px) {
.category-strip__media{
    height: 12rem !important;
  }
.category-strip__image{
    max-height: 11rem !important;
    transform: scale(1.55) !important;
  }
.category-strip__image[alt*="Mask"],
.category-strip__image[alt*="Cream"],
.category-strip__image[alt*="CREAM"],
.category-strip__image[alt*="Trio"],
.category-strip__image[alt*="Collection"]{
    transform: scale(1.25) !important;
  }
}

@media (max-width: 749px) {
.category-strip__media{
    height: 8.75rem !important;
  }
.category-strip__image{
    max-height: 8rem !important;
    transform: scale(1.18) !important;
  }
}
/* Product page: main PDP */
.product-main{
  background:
    radial-gradient(circle at 12% 8%, rgba(142, 205, 224, 0.12), transparent 24rem),
    radial-gradient(circle at 92% 16%, rgba(201, 162, 39, 0.08), transparent 22rem),
    #ffffff;
  padding-top: clamp(2rem, 4vw, 4rem);
}
.product-main__breadcrumb{
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin-bottom: clamp(1.25rem, 2.5vw, 2rem);
  color: rgba(18, 57, 93, 0.58);
  font-size: 0.78rem;
  font-weight: 700;
}
.product-main__breadcrumb a{
  color: rgba(18, 57, 93, 0.68);
  text-decoration: none;
}
.product-main__breadcrumb a:hover{
  color: var(--color-blue);
}
.product-main__grid{
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(22rem, 0.96fr);
  gap: clamp(2.5rem, 5vw, 5rem);
  align-items: start;
}
.product-main__gallery{
  display: grid;
  gap: 1.25rem;
}
.product-main__media-frame{
  position: relative;
  aspect-ratio: 1 / 1.04;
  overflow: hidden;
  border-radius: 0.15rem;
  background:
    linear-gradient(135deg, rgba(239, 248, 252, 0.95), rgba(255, 255, 255, 0.72));
  box-shadow:
    0 1.25rem 3.5rem rgba(18, 57, 93, 0.08),
    inset 0 0 0 1px rgba(18, 57, 93, 0.05);
}
.product-main__image,
.product-main__video{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.product-main__placeholder{
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: rgba(18, 57, 93, 0.44);
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 5vw, 5rem);
  background:
    radial-gradient(circle at 50% 36%, rgba(255, 255, 255, 0.8), transparent 16rem),
    linear-gradient(135deg, rgba(142, 205, 224, 0.18), rgba(201, 162, 39, 0.08));
}
.product-main__zoom{
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  width: 2.7rem;
  height: 2.7rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: var(--color-ink);
  cursor: pointer;
  box-shadow: 0 0.7rem 1.6rem rgba(18, 57, 93, 0.12);
}
.product-main__zoom svg{
  width: 1.2rem;
  height: 1.2rem;
}
.product-main__thumbs{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}
.product-main__thumb{
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 0.05rem;
  background: #eef8fb;
  padding: 0;
  cursor: pointer;
}
.product-main__thumb.is-active{
  border-color: var(--color-blue);
  box-shadow: 0 0 0 1px var(--color-blue);
}
.product-main__thumb-image{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.product-main__info{
  padding-top: clamp(0.5rem, 2vw, 1.25rem);
}
.product-main__eyebrow{
  margin: 0 0 0.9rem;
  color: var(--color-blue);
  font-size: 0.75rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.product-main__title{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.5rem, 4.2vw, 4.8rem);
  font-weight: 400;
  line-height: 0.96;
  letter-spacing: -0.055em;
}
.product-main__subtitle{
  margin: 0.7rem 0 0;
  color: var(--color-gold);
  font-family: var(--font-heading);
  font-size: clamp(1.25rem, 2vw, 1.7rem);
  line-height: 1.1;
}
.product-main__rating{
  display: flex;
  gap: 0.55rem;
  align-items: center;
  margin-top: 1rem;
  color: rgba(18, 57, 93, 0.76);
  font-size: 0.88rem;
  font-weight: 800;
}
.product-main__stars{
  color: var(--color-gold);
  letter-spacing: 0.08em;
}
.product-main__price{
  margin-top: 1.2rem;
  color: var(--color-ink);
  font-size: 1.35rem;
  font-weight: 900;
}
.product-main__price s{
  margin-left: 0.65rem;
  color: rgba(18, 57, 93, 0.4);
  font-weight: 700;
}
.product-main__description{
  max-width: 36rem;
  margin-top: 1.25rem;
  color: rgba(18, 57, 93, 0.86);
  font-size: 1rem;
  line-height: 1.65;
}
.product-main__benefits{
  display: grid;
  gap: 1rem;
  margin-top: 1.65rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(18, 57, 93, 0.12);
}
.product-main__benefit{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.85rem;
  align-items: start;
}
.product-main__benefit-icon{
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  color: var(--color-blue);
  font-size: 1.35rem;
}
.product-main__benefit strong,
.product-main__benefit small{
  display: block;
}
.product-main__benefit strong{
  color: var(--color-ink);
  font-size: 0.95rem;
  line-height: 1.2;
}
.product-main__benefit small{
  margin-top: 0.18rem;
  color: rgba(18, 57, 93, 0.72);
  font-size: 0.82rem;
  line-height: 1.35;
}
.product-main__form{
  margin-top: 1.65rem;
}
.product-main__options{
  display: grid;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.product-main__option{
  border: 0;
  padding: 0;
  margin: 0;
}
.product-main__option legend,
.product-main__quantity label{
  margin-bottom: 0.55rem;
  color: var(--color-ink);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.product-main__option-values{
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}
.product-main__option-value input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.product-main__option-value span{
  display: inline-flex;
  min-height: 2.6rem;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(18, 57, 93, 0.12);
  border-radius: 999px;
  padding: 0 1rem;
  color: rgba(18, 57, 93, 0.72);
  font-size: 0.85rem;
  font-weight: 800;
  cursor: pointer;
}
.product-main__option-value input:checked + span{
  border-color: var(--color-blue);
  background: rgba(31, 111, 174, 0.08);
  color: var(--color-blue);
}
.product-main__purchase-row{
  display: grid;
  grid-template-columns: 9.5rem minmax(0, 1fr);
  gap: 1rem;
  align-items: end;
}
.product-main__quantity-box{
  display: grid;
  grid-template-columns: 2.6rem minmax(0, 1fr) 2.6rem;
  min-height: 3.25rem;
  border: 1px solid rgba(18, 57, 93, 0.14);
  background: #ffffff;
}
.product-main__quantity-box button,
.product-main__quantity-box input{
  border: 0;
  background: transparent;
  color: var(--color-ink);
  font: inherit;
  font-weight: 900;
  text-align: center;
}
.product-main__quantity-box button{
  cursor: pointer;
}
.product-main__quantity-box input{
  width: 100%;
  appearance: textfield;
}
.product-main__quantity-box input::-webkit-outer-spin-button,
.product-main__quantity-box input::-webkit-inner-spin-button{
  appearance: none;
  margin: 0;
}
.product-main__add{
  min-height: 3.25rem;
  width: 100%;
}
.product-main__dynamic-checkout{
  margin-top: 0.85rem;
}
.product-main__dynamic-checkout .shopify-payment-button__button{
  min-height: 3.25rem;
  border: 1px solid var(--color-blue) !important;
  border-radius: 0 !important;
  background: #ffffff !important;
  color: var(--color-blue) !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
.product-main__trust-row{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1.65rem;
  color: rgba(18, 57, 93, 0.72);
}
.product-main__trust-row div{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 0.55rem;
  align-items: start;
}
.product-main__trust-row span{
  grid-row: span 2;
  color: var(--color-blue);
  font-size: 1.3rem;
}
.product-main__trust-row strong{
  color: var(--color-ink);
  font-size: 0.78rem;
  line-height: 1.2;
}
.product-main__trust-row small{
  font-size: 0.72rem;
  line-height: 1.25;
}

@media (max-width: 989px) {
.product-main__grid{
    grid-template-columns: 1fr;
  }
.product-main__info{
    padding-top: 0;
  }
}

@media (max-width: 749px) {
.product-main{
    padding-top: 1.25rem;
  }
.product-main__thumbs{
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.7rem;
  }
.product-main__purchase-row{
    grid-template-columns: 1fr;
  }
.product-main__trust-row{
    grid-template-columns: 1fr;
  }
.product-main__title{
    font-size: clamp(2.4rem, 15vw, 4rem);
  }
}
/* Product page: Judge.me integration */
.product-main__rating--judgeme{
  min-height: 1.5rem;
  margin-top: 1rem;
}
.product-main__rating--judgeme .jdgm-preview-badge{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  color: rgba(18, 57, 93, 0.76) !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
}
.product-main__rating--judgeme .jdgm-star,
.product-main__rating--judgeme .jdgm-prev-badge__stars{
  color: var(--color-gold) !important;
}
.product-main__judgeme-reviews{
  margin-top: clamp(3rem, 6vw, 5rem);
  padding: clamp(2rem, 4vw, 3rem);
  border: 1px solid rgba(18, 57, 93, 0.08);
  background:
    radial-gradient(circle at 12% 0%, rgba(142, 205, 224, 0.12), transparent 20rem),
    #ffffff;
  box-shadow: 0 1rem 3rem rgba(18, 57, 93, 0.055);
}
.product-main__judgeme-reviews .jdgm-rev-widg{
  border: 0 !important;
  padding: 0 !important;
}
.product-main__judgeme-reviews .jdgm-rev-widg__title{
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: clamp(2.1rem, 3vw, 3.2rem) !important;
  font-weight: 400 !important;
  letter-spacing: -0.04em !important;
}
/* Product page: detail strip + tabs */
.product-details{
  margin-top: clamp(3rem, 6vw, 5rem);
}
.product-details__highlights{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border: 1px solid rgba(18, 57, 93, 0.08);
  background:
    radial-gradient(circle at 10% 0%, rgba(142, 205, 224, 0.12), transparent 20rem),
    linear-gradient(180deg, #f4fbfe, #eef8fc);
}
.product-details__highlight{
  min-height: 10.5rem;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 0.55rem;
  padding: 1.7rem 1.25rem;
  text-align: center;
  border-right: 1px solid rgba(18, 57, 93, 0.07);
}
.product-details__highlight:last-child{
  border-right: 0;
}
.product-details__icon{
  width: 2.75rem;
  height: 2.75rem;
  display: grid;
  place-items: center;
  color: var(--color-blue);
  font-size: 2rem;
  line-height: 1;
}
.product-details__highlight h3{
  margin: 0;
  color: var(--color-ink);
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.2;
}
.product-details__highlight p{
  max-width: 14rem;
  margin: 0;
  color: rgba(18, 57, 93, 0.74);
  font-size: 0.82rem;
  line-height: 1.42;
}
.product-tabs{
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-top: 0;
  background: #ffffff;
  box-shadow: 0 1.25rem 3.5rem rgba(18, 57, 93, 0.055);
}
.product-tabs__nav{
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08);
  padding-inline: clamp(1rem, 3vw, 2rem);
}
.product-tabs__button{
  position: relative;
  min-height: 4.2rem;
  border: 0;
  background: transparent;
  color: rgba(18, 57, 93, 0.72);
  padding: 0 1.25rem;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
}
.product-tabs__button::after{
  content: "";
  position: absolute;
  left: 1.25rem;
  right: 1.25rem;
  bottom: -1px;
  height: 2px;
  background: var(--color-blue);
  opacity: 0;
  transform: scaleX(0.35);
  transform-origin: center;
  transition:
    opacity 180ms ease,
    transform 220ms ease;
}
.product-tabs__button.is-active{
  color: var(--color-blue);
}
.product-tabs__button.is-active::after{
  opacity: 1;
  transform: scaleX(1);
}
.product-tabs__panel{
  padding: clamp(1.5rem, 3vw, 2.25rem) clamp(1.25rem, 4vw, 3rem);
}
.product-tabs__rte{
  max-width: 64rem;
  color: rgba(18, 57, 93, 0.86);
  font-size: 0.98rem;
  line-height: 1.75;
}
.product-tabs__rte p{
  margin-top: 0;
}
.product-tabs__rte p:last-child{
  margin-bottom: 0;
}
.product-tabs__badges{
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgba(18, 57, 93, 0.08);
}
.product-tabs__badges span{
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: rgba(18, 57, 93, 0.78);
  font-size: 0.82rem;
  font-weight: 800;
}
.product-tabs__badges span::before{
  content: "♧";
  color: var(--color-blue);
  font-size: 1.2rem;
  line-height: 1;
}
.product-tabs__reviews .jdgm-rev-widg{
  border: 0 !important;
  padding: 0 !important;
}
.product-tabs__reviews .jdgm-rev-widg__title{
  margin: 0 0 1.5rem !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: clamp(2rem, 3vw, 3.2rem) !important;
  font-weight: 400 !important;
  letter-spacing: -0.045em !important;
}

@media (max-width: 989px) {
.product-details__highlights{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
.product-details__highlight:nth-child(2){
    border-right: 0;
  }
.product-details__highlight:nth-child(-n + 2){
    border-bottom: 1px solid rgba(18, 57, 93, 0.07);
  }
.product-tabs__badges{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 749px) {
.product-details__highlights{
    grid-template-columns: 1fr;
  }
.product-details__highlight{
    border-right: 0;
    border-bottom: 1px solid rgba(18, 57, 93, 0.07);
  }
.product-details__highlight:last-child{
    border-bottom: 0;
  }
.product-tabs__nav{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-inline: 0.5rem;
  }
.product-tabs__button{
    min-height: 3.7rem;
    padding: 0 0.75rem;
    font-size: 0.72rem;
  }
.product-tabs__badges{
    grid-template-columns: 1fr;
  }
}
/* Product page: related products */
.related-products{
  background:
    radial-gradient(circle at 12% 0%, rgba(142, 205, 224, 0.08), transparent 22rem),
    radial-gradient(circle at 92% 8%, rgba(201, 162, 39, 0.055), transparent 20rem),
    #ffffff;
}
.related-products__header{
  margin-bottom: clamp(1.75rem, 3vw, 2.75rem);
  text-align: center;
}
.related-products__eyebrow{
  margin: 0 0 0.55rem;
  color: var(--color-blue);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.related-products__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.4rem, 4vw, 4rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.055em;
}
.related-products__viewport{
  position: relative;
}
.related-products__track{
  display: flex;
  gap: clamp(1rem, 2vw, 1.75rem);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  padding: 0.15rem 0.15rem 1rem;
}
.related-products__track::-webkit-scrollbar{
  display: none;
}
.related-product-card{
  flex: 0 0 calc((100% - (3 * clamp(1rem, 2vw, 1.75rem))) / 4);
  min-width: 0;
  scroll-snap-align: start;
  border: 1px solid rgba(18, 57, 93, 0.08);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 1.25rem 3rem rgba(18, 57, 93, 0.055);
  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    border-color 220ms ease;
}
.related-product-card:hover{
  transform: translateY(-4px);
  border-color: rgba(201, 162, 39, 0.26);
  box-shadow: 0 1.6rem 4rem rgba(18, 57, 93, 0.09);
}
.related-product-card__media{
  min-height: clamp(15rem, 20vw, 20rem);
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 1.5rem;
  background:
    radial-gradient(circle at 50% 30%, rgba(255,255,255,0.86), transparent 10rem),
    linear-gradient(180deg, rgba(244, 251, 254, 0.76), rgba(255,255,255,0.96));
  text-decoration: none;
}
.related-product-card__image{
  width: 100%;
  height: clamp(12rem, 16vw, 16rem);
  object-fit: contain;
  object-position: center;
  mix-blend-mode: multiply;
  transform: scale(1.06);
  transition: transform 260ms ease;
}
.related-product-card:hover .related-product-card__image{
  transform: scale(1.12);
}
.related-product-card__placeholder{
  color: rgba(18, 57, 93, 0.42);
  font-family: var(--font-heading);
  font-size: 1.8rem;
}
.related-product-card__body{
  display: grid;
  gap: 0.55rem;
  padding: 1.2rem;
}
.related-product-card__title{
  color: var(--color-ink);
  font-size: 0.98rem;
  font-weight: 900;
  line-height: 1.16;
  text-decoration: none;
}
.related-product-card__title:hover{
  color: var(--color-blue);
}
.related-product-card__vendor{
  margin: 0;
  color: rgba(18, 57, 93, 0.66);
  font-size: 0.82rem;
  line-height: 1.3;
}
.related-product-card__rating{
  display: flex;
  gap: 0.35rem;
  align-items: center;
  color: var(--color-blue);
  font-size: 0.82rem;
  font-weight: 900;
}
.related-product-card__rating span{
  color: var(--color-gold);
  letter-spacing: 0.05em;
}
.related-product-card__rating small{
  color: rgba(18, 57, 93, 0.64);
  font-weight: 800;
}
.related-product-card__bottom{
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  margin-top: 0.35rem;
}
.related-product-card__price{
  color: var(--color-ink);
  font-size: 0.95rem;
  font-weight: 900;
}
.related-product-card__form{
  margin: 0;
}
.related-product-card__cart{
  width: 2.35rem;
  height: 2.35rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(18, 57, 93, 0.12);
  border-radius: 0.6rem;
  background: #ffffff;
  color: var(--color-blue);
  cursor: pointer;
  transition:
    background 180ms ease,
    color 180ms ease,
    border-color 180ms ease;
}
.related-product-card__cart:hover{
  border-color: var(--color-blue);
  background: var(--color-blue);
  color: #ffffff;
}
.related-product-card__cart svg{
  width: 1.05rem;
  height: 1.05rem;
}
.related-products__arrow{
  position: absolute;
  top: 42%;
  z-index: 2;
  width: 2.7rem;
  height: 2.7rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--color-blue);
  font-size: 2rem;
  line-height: 1;
  box-shadow: 0 0.85rem 2.5rem rgba(18, 57, 93, 0.12);
  cursor: pointer;
}
.related-products__arrow--prev{
  left: -1.35rem;
}
.related-products__arrow--next{
  right: -1.35rem;
}
.related-products__arrow:disabled{
  opacity: 0.26;
  cursor: default;
}
.related-products:not(.has-related-overflow) .related-products__arrow{
  display: none;
}

@media (max-width: 1199px) {
.related-product-card{
    flex-basis: calc((100% - clamp(1rem, 2vw, 1.75rem)) / 2);
  }
}

@media (max-width: 749px) {
.related-product-card{
    flex-basis: 78%;
  }
.related-products__arrow{
    display: none !important;
  }
.related-product-card__media{
    min-height: 15rem;
  }
}
/* Related products: premium ThemeBlocks Skincare refinement */
.related-products{
  background: #ffffff !important;
  padding-top: clamp(4rem, 7vw, 7rem) !important;
  padding-bottom: clamp(4.5rem, 7vw, 7rem) !important;
}
.related-products__header{
  margin-bottom: clamp(2.5rem, 4vw, 4rem) !important;
}
.related-products__eyebrow{
  color: var(--color-blue) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.28em !important;
}
.related-products__heading{
  max-width: 58rem !important;
  margin-inline: auto !important;
  font-size: clamp(3.2rem, 5.2vw, 6.2rem) !important;
  line-height: 0.92 !important;
}
.related-products__track{
  gap: clamp(1.4rem, 2.2vw, 2rem) !important;
  padding: 0.25rem 0.15rem 1.5rem !important;
}
.related-product-card{
  border: 1px solid rgba(18, 57, 93, 0.07) !important;
  background: #ffffff !important;
  box-shadow: none !important;
  display: grid !important;
  grid-template-rows: auto 1fr !important;
  transition:
    transform 240ms ease,
    border-color 240ms ease,
    box-shadow 240ms ease !important;
}
.related-product-card:hover{
  transform: translateY(-5px) !important;
  border-color: rgba(201, 162, 39, 0.36) !important;
  box-shadow: 0 1.5rem 4rem rgba(18, 57, 93, 0.075) !important;
}
/* Remove grey image box */
.related-product-card__media{
  min-height: clamp(19rem, 23vw, 25rem) !important;
  padding: clamp(2rem, 3vw, 3rem) !important;
  background:
    radial-gradient(circle at 50% 45%, rgba(142, 205, 224, 0.1), transparent 12rem),
    #ffffff !important;
  overflow: visible !important;
}
.related-product-card__image{
  width: 100% !important;
  height: clamp(15rem, 18vw, 20rem) !important;
  object-fit: contain !important;
  object-position: center !important;
  mix-blend-mode: multiply !important;
  transform: scale(1.18) !important;
  filter: drop-shadow(0 1.1rem 1.4rem rgba(18, 57, 93, 0.08)) !important;
}
.related-product-card:hover .related-product-card__image{
  transform: scale(1.24) !important;
}
.related-product-card__body{
  align-content: start !important;
  gap: 0.6rem !important;
  padding: 0 clamp(1.15rem, 1.5vw, 1.45rem) clamp(1.35rem, 2vw, 1.65rem) !important;
}
.related-product-card__title{
  min-height: 2.4em !important;
  color: var(--color-ink) !important;
  font-size: clamp(1rem, 1.05vw, 1.16rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.035em !important;
}
.related-product-card__vendor{
  color: rgba(18, 57, 93, 0.62) !important;
  font-size: 0.9rem !important;
}
.related-product-card__rating{
  margin-top: 0.35rem !important;
  color: var(--color-blue) !important;
}
.related-product-card__rating span{
  color: var(--color-gold) !important;
}
.related-product-card__bottom{
  margin-top: 1rem !important;
}
.related-product-card__price{
  font-size: 1.02rem !important;
  color: var(--color-ink) !important;
}
.related-product-card__cart{
  width: 2.65rem !important;
  height: 2.65rem !important;
  border-radius: 0.85rem !important;
  border-color: rgba(18, 57, 93, 0.12) !important;
  background: #ffffff !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.06) !important;
}
.related-product-card__cart:hover{
  border-color: var(--color-blue) !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
}
/* Remove awkward highlighted middle card look */
.related-product-card:nth-child(n){
  outline: none !important;
}
/* Full-background bundle images should not multiply/blend badly */
.related-product-card__image[alt*="TRIO"],
.related-product-card__image[alt*="Trio"],
.related-product-card__image[alt*="RITUAL"],
.related-product-card__image[alt*="Ritual"],
.related-product-card__image[alt*="COLLECTION"],
.related-product-card__image[alt*="Collection"],
.related-product-card__image[alt*="LUXE"],
.related-product-card__image[alt*="Luxe"]{
  mix-blend-mode: normal !important;
  transform: scale(1) !important;
  filter: none !important;
}
.related-product-card:hover .related-product-card__image[alt*="TRIO"],
.related-product-card:hover .related-product-card__image[alt*="Trio"],
.related-product-card:hover .related-product-card__image[alt*="RITUAL"],
.related-product-card:hover .related-product-card__image[alt*="Ritual"],
.related-product-card:hover .related-product-card__image[alt*="COLLECTION"],
.related-product-card:hover .related-product-card__image[alt*="Collection"],
.related-product-card:hover .related-product-card__image[alt*="LUXE"],
.related-product-card:hover .related-product-card__image[alt*="Luxe"]{
  transform: scale(1.03) !important;
}
/* Cleaner arrows */
.related-products__arrow{
  background: rgba(255, 255, 255, 0.94) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 1rem 2.8rem rgba(18, 57, 93, 0.12) !important;
}
.related-products__arrow:hover{
  color: #ffffff !important;
  background: var(--color-blue) !important;
}

@media (max-width: 1199px) {
.related-product-card__media{
    min-height: 21rem !important;
  }
.related-product-card__image{
    height: 17rem !important;
    transform: scale(1.12) !important;
  }
}

@media (max-width: 749px) {
.related-products__heading{
    font-size: clamp(2.7rem, 13vw, 4rem) !important;
  }
.related-product-card__media{
    min-height: 17rem !important;
    padding: 1.5rem !important;
  }
.related-product-card__image{
    height: 14rem !important;
    transform: scale(1.05) !important;
  }
.related-product-card__title{
    min-height: 0 !important;
  }
}
/* Related products: premium carousel arrows */
.related-products__arrow{
  width: 3rem !important;
  height: 3rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.12) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--color-ink) !important;
  font-family: var(--font-body) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  box-shadow:
    0 0.8rem 2.2rem rgba(18, 57, 93, 0.09),
    inset 0 0 0 1px rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    background 220ms ease,
    color 220ms ease,
    box-shadow 220ms ease,
    opacity 220ms ease !important;
}
.related-products__arrow::before{
  content: "" !important;
  width: 0.72rem !important;
  height: 0.72rem !important;
  display: block !important;
  border-top: 2px solid currentColor !important;
  border-left: 2px solid currentColor !important;
}
.related-products__arrow--prev::before{
  transform: translateX(0.12rem) rotate(-45deg) !important;
}
.related-products__arrow--next::before{
  transform: translateX(-0.12rem) rotate(135deg) !important;
}
.related-products__arrow:hover:not(:disabled){
  transform: translateY(-50%) scale(1.04) !important;
  border-color: rgba(201, 162, 39, 0.42) !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: var(--color-blue) !important;
  box-shadow:
    0 1rem 2.8rem rgba(18, 57, 93, 0.13),
    0 0 0 0.28rem rgba(201, 162, 39, 0.08),
    inset 0 0 0 1px rgba(255, 255, 255, 0.92) !important;
}
.related-products__arrow:disabled{
  opacity: 0.18 !important;
  background: rgba(255, 255, 255, 0.52) !important;
  box-shadow: none !important;
}
.related-products__arrow--prev{
  left: -1.5rem !important;
}
.related-products__arrow--next{
  right: -1.5rem !important;
}
/* Keep vertical centering consistent after hover transform override */
.related-products__arrow{
  transform: translateY(-50%) !important;
}
/* Related products: minimal premium arrows,
no shadows */
.related-products__arrow{
  width: 2.8rem !important;
  height: 2.8rem !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: rgba(18, 57, 93, 0.78) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 0.72 !important;
  transform: translateY(-50%) !important;
}
.related-products__arrow::before{
  width: 0.8rem !important;
  height: 0.8rem !important;
  border-top: 2px solid currentColor !important;
  border-left: 2px solid currentColor !important;
}
.related-products__arrow:hover:not(:disabled){
  background: transparent !important;
  color: var(--color-blue) !important;
  box-shadow: none !important;
  border-color: transparent !important;
  transform: translateY(-50%) scale(1.08) !important;
  opacity: 1 !important;
}
.related-products__arrow:disabled{
  opacity: 0.16 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.related-products__arrow--prev{
  left: -2.25rem !important;
}
.related-products__arrow--next{
  right: -2.25rem !important;
}
/* Related products: remove heavy shadows and hide white image boxes better */
.related-product-card,
.related-product-card:hover{
  box-shadow: none !important;
}
.related-product-card__media{
  background:
    radial-gradient(circle at 50% 45%, rgba(142, 205, 224, 0.10), transparent 11rem),
    linear-gradient(180deg, rgba(247, 252, 253, 0.82), rgba(255, 255, 255, 0.96)) !important;
  box-shadow: none !important;
}
.related-product-card__image{
  mix-blend-mode: multiply !important;
  filter: none !important;
  background: transparent !important;
}
/* Reduce visible square edges on product images that have white backgrounds */
.related-product-card__media::before{
  content: "" !important;
  position: absolute !important;
  inset: clamp(1.4rem, 2vw, 2rem) !important;
  z-index: 0 !important;
  background:
    radial-gradient(circle at center, rgba(255,255,255,0.96), rgba(247,252,253,0.2) 62%, transparent 76%) !important;
  pointer-events: none !important;
}
.related-product-card__media{
  position: relative !important;
}
.related-product-card__image,
.related-product-card__placeholder{
  position: relative !important;
  z-index: 1 !important;
}
/* If product image itself has a full lifestyle/background frame,
don't multiply it */
.related-product-card__image[alt*="TRIO"],
.related-product-card__image[alt*="Trio"],
.related-product-card__image[alt*="RITUAL"],
.related-product-card__image[alt*="Ritual"],
.related-product-card__image[alt*="COLLECTION"],
.related-product-card__image[alt*="Collection"],
.related-product-card__image[alt*="LUXE"],
.related-product-card__image[alt*="Luxe"]{
  mix-blend-mode: normal !important;
}
/* Related products: prevent hover/media clipping */
.related-products__viewport{
  overflow: visible !important;
}
.related-products__track{
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding-top: 1rem !important;
  padding-bottom: 1.75rem !important;
}
.related-product-card{
  overflow: visible !important;
}
.related-product-card__media{
  overflow: visible !important;
}
/* Related products: Judge.me preview badge styling */
.related-product-card__rating--judgeme{
  min-height: 1.25rem !important;
  margin-top: 0.35rem !important;
}
.related-product-card__rating--judgeme .jdgm-preview-badge{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  color: rgba(18, 57, 93, 0.64) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
}
.related-product-card__rating--judgeme .jdgm-prev-badge__stars,
.related-product-card__rating--judgeme .jdgm-star{
  color: var(--color-gold) !important;
}
.related-product-card__rating--judgeme .jdgm-prev-badge__text{
  color: rgba(18, 57, 93, 0.64) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
}
/* Keep placeholder fallback stars aligned */
.related-product-card--placeholder .related-product-card__rating span{
  color: var(--color-gold) !important;
}
/* Product page: newsletter banner */
.product-newsletter{
  background: #ffffff;
  padding-top: clamp(2rem, 4vw, 4rem);
  padding-bottom: clamp(3rem, 5vw, 5rem);
}
.product-newsletter__inner{
  position: relative;
  min-height: clamp(15rem, 20vw, 20rem);
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(24rem, 1fr);
  align-items: center;
  gap: clamp(2rem, 4vw, 4rem);
  overflow: hidden;
  border: 1px solid rgba(18, 57, 93, 0.08);
  background:
    radial-gradient(circle at 12% 20%, rgba(255,255,255,0.88), transparent 18rem),
    linear-gradient(90deg, #eaf7fc 0%, #f5fbfe 48%, #eaf7fc 100%);
  box-shadow: 0 1.4rem 4rem rgba(18, 57, 93, 0.06);
}
.product-newsletter__copy{
  position: relative;
  z-index: 2;
  padding: clamp(2rem, 4vw, 4rem);
  max-width: 39rem;
}
.product-newsletter__eyebrow{
  margin: 0 0 1.1rem;
  color: var(--color-blue);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}
.product-newsletter__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.1rem, 3.2vw, 4rem);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -0.055em;
}
.product-newsletter__form-wrap{
  position: relative;
  z-index: 3;
  padding-right: clamp(2rem, 4vw, 4rem);
}
.product-newsletter__form{
  display: grid;
  grid-template-columns: minmax(16rem, 1fr) auto;
  max-width: 42rem;
  margin-left: auto;
  border: 1px solid rgba(18, 57, 93, 0.1);
  background: #ffffff;
  box-shadow: 0 0.9rem 2.4rem rgba(18, 57, 93, 0.08);
}
.product-newsletter__input{
  min-height: 3.8rem;
  width: 100%;
  border: 0;
  background: #ffffff;
  padding: 0 1.35rem;
  color: var(--color-ink);
  font: inherit;
  font-size: 0.96rem;
  outline: none;
}
.product-newsletter__input::placeholder{
  color: rgba(18, 57, 93, 0.42);
}
.product-newsletter__button{
  min-height: 3.8rem;
  border: 0;
  background: var(--color-blue);
  color: #ffffff;
  padding: 0 1.85rem;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    background 180ms ease,
    transform 180ms ease;
}
.product-newsletter__button:hover{
  background: var(--color-ink);
}
.product-newsletter__message{
  grid-column: 1 / -1;
  margin: 0;
  padding: 0.8rem 1.35rem;
  font-size: 0.86rem;
  font-weight: 800;
}
.product-newsletter__message--success{
  color: #1f6f3f;
}
.product-newsletter__message--error{
  color: #9f2d2d;
}
.product-newsletter__media{
  position: absolute;
  inset: 0 0 0 auto;
  width: min(42%, 34rem);
  z-index: 1;
  pointer-events: none;
}
.product-newsletter__image{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center right;
  display: block;
}
.product-newsletter__media::after{
  content: "";
  position: absolute;
  inset: 0 auto 0 -18rem;
  width: 22rem;
  background: linear-gradient(90deg, #eaf7fc 0%, rgba(234,247,252,0.72) 45%, transparent 100%);
}
.product-newsletter__media--fallback{
  background:
    radial-gradient(circle at 70% 28%, rgba(255,255,255,0.92), transparent 8rem),
    radial-gradient(circle at 82% 44%, rgba(142,205,224,0.22), transparent 12rem);
}
.product-newsletter__media--fallback span{
  position: absolute;
  right: 4rem;
  top: 50%;
  width: 14rem;
  height: 14rem;
  border-radius: 50%;
  background:
    radial-gradient(circle at 40% 35%, rgba(255,255,255,0.98), rgba(222,239,247,0.7));
  transform: translateY(-50%);
  box-shadow: 0 1.4rem 4rem rgba(18, 57, 93, 0.1);
}

@media (max-width: 989px) {
.product-newsletter__inner{
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
.product-newsletter__copy{
    padding-bottom: 0;
  }
.product-newsletter__form-wrap{
    padding: 0 clamp(2rem, 4vw, 4rem) clamp(2rem, 4vw, 4rem);
  }
.product-newsletter__form{
    margin-left: 0;
  }
.product-newsletter__media{
    opacity: 0.28;
    width: 52%;
  }
}

@media (max-width: 749px) {
.product-newsletter__inner{
    min-height: auto;
  }
.product-newsletter__copy{
    padding: 2rem 1.25rem 0;
  }
.product-newsletter__form-wrap{
    padding: 0 1.25rem 2rem;
  }
.product-newsletter__form{
    grid-template-columns: 1fr;
  }
.product-newsletter__button{
    width: 100%;
  }
.product-newsletter__media{
    display: none;
  }
}
/* Product newsletter: refined PDP banner layout */
.product-newsletter__inner{
  min-height: clamp(17rem, 23vw, 23rem) !important;
  grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr) !important;
  gap: 0 !important;
  border-color: rgba(18, 57, 93, 0.07) !important;
  background:
    linear-gradient(90deg, #eaf7fc 0%, #f4fbfe 42%, rgba(244,251,254,0.78) 58%, transparent 100%) !important;
  box-shadow: 0 1.25rem 4rem rgba(18, 57, 93, 0.055) !important;
}
.product-newsletter__copy{
  padding: clamp(2rem, 4vw, 4.2rem) clamp(2rem, 5vw, 5rem) !important;
  max-width: 44rem !important;
}
.product-newsletter__eyebrow{
  margin-bottom: 1.25rem !important;
  font-size: 0.76rem !important;
  letter-spacing: 0.24em !important;
}
.product-newsletter__heading{
  max-width: 36rem !important;
  font-size: clamp(2.25rem, 3.15vw, 4rem) !important;
  line-height: 1.02 !important;
  letter-spacing: -0.06em !important;
}
.product-newsletter__form-wrap{
  align-self: center !important;
  justify-self: center !important;
  width: min(100% - 4rem, 44rem) !important;
  padding: 0 !important;
  margin-left: -3rem !important;
  z-index: 4 !important;
}
.product-newsletter__form{
  width: 100% !important;
  max-width: none !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  margin: 0 !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow:
    0 1rem 2.8rem rgba(18, 57, 93, 0.1),
    inset 0 0 0 1px rgba(255,255,255,0.88) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
.product-newsletter__input{
  min-height: 4.15rem !important;
  font-size: 0.96rem !important;
  background: transparent !important;
}
.product-newsletter__button{
  min-height: 4.15rem !important;
  padding-inline: clamp(1.45rem, 2.2vw, 2.25rem) !important;
}
.product-newsletter__media{
  width: 58% !important;
  height: 100% !important;
  opacity: 1 !important;
}
.product-newsletter__image{
  object-position: center right !important;
}
.product-newsletter__media::after{
  inset: 0 auto 0 -18rem !important;
  width: 24rem !important;
  background:
    linear-gradient(
      90deg,
      #f4fbfe 0%,
      rgba(244,251,254,0.88) 34%,
      rgba(244,251,254,0.34) 68%,
      transparent 100%
    ) !important;
}
/* remove visible middle panel/seam */
.product-newsletter__inner::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 auto 0 40% !important;
  width: 18rem !important;
  z-index: 1 !important;
  background: linear-gradient(90deg, rgba(234,247,252,0.86), rgba(234,247,252,0)) !important;
  pointer-events: none !important;
}

@media (max-width: 989px) {
.product-newsletter__inner{
    grid-template-columns: 1fr !important;
  }
.product-newsletter__copy{
    padding: 2.5rem 2rem 1rem !important;
  }
.product-newsletter__form-wrap{
    width: calc(100% - 4rem) !important;
    justify-self: start !important;
    margin: 0 2rem 2.5rem !important;
  }
.product-newsletter__media{
    width: 100% !important;
    opacity: 0.22 !important;
  }
.product-newsletter__inner::before{
    display: none !important;
  }
}

@media (max-width: 749px) {
.product-newsletter__copy{
    padding: 2rem 1.25rem 1rem !important;
  }
.product-newsletter__heading{
    font-size: clamp(2.15rem, 11vw, 3.2rem) !important;
  }
.product-newsletter__form-wrap{
    width: calc(100% - 2.5rem) !important;
    margin: 0 1.25rem 2rem !important;
  }
.product-newsletter__form{
    grid-template-columns: 1fr !important;
  }
.product-newsletter__input,
.product-newsletter__button{
    min-height: 3.7rem !important;
  }
}
/* Product newsletter: premium rounded refinement */
.product-newsletter__inner{
  border-radius: 1.4rem !important;
  overflow: hidden !important;
  min-height: clamp(18rem, 24vw, 24rem) !important;
  border: 1px solid rgba(18, 57, 93, 0.065) !important;
  background:
    linear-gradient(90deg, #eaf7fc 0%, #f5fbfe 41%, rgba(245,251,254,0.64) 58%, transparent 100%) !important;
  box-shadow:
    0 1.4rem 4.5rem rgba(18, 57, 93, 0.06),
    inset 0 0 0 1px rgba(255,255,255,0.72) !important;
}
.product-newsletter__copy{
  padding: clamp(2.4rem, 4.5vw, 4.8rem) clamp(2.4rem, 5vw, 5.25rem) !important;
}
.product-newsletter__eyebrow{
  margin-bottom: 1.15rem !important;
  color: var(--color-blue) !important;
  font-size: 0.74rem !important;
  letter-spacing: 0.26em !important;
}
.product-newsletter__heading{
  max-width: 34rem !important;
  font-size: clamp(2.35rem, 2.95vw, 3.8rem) !important;
  line-height: 1.01 !important;
  letter-spacing: -0.065em !important;
}
.product-newsletter__form-wrap{
  width: min(100% - 4.5rem, 42rem) !important;
  margin-left: -1.5rem !important;
  align-self: center !important;
  justify-self: center !important;
}
.product-newsletter__form{
  min-height: 4.25rem !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  border-radius: 1rem !important;
  overflow: hidden !important;
  border: 1px solid rgba(18, 57, 93, 0.085) !important;
  background: rgba(255,255,255,0.92) !important;
  box-shadow:
    0 1rem 2.8rem rgba(18, 57, 93, 0.11),
    inset 0 0 0 1px rgba(255,255,255,0.88) !important;
}
.product-newsletter__input{
  min-height: 4.25rem !important;
  padding-inline: 1.45rem !important;
  border-radius: 1rem 0 0 1rem !important;
}
.product-newsletter__button{
  min-height: 4.25rem !important;
  border-radius: 0.85rem !important;
  margin: 0.28rem !important;
  padding-inline: clamp(1.6rem, 2.2vw, 2.3rem) !important;
  box-shadow:
    0 0.5rem 1.2rem rgba(31, 111, 174, 0.18),
    inset 0 0 0 1px rgba(255,255,255,0.16) !important;
}
.product-newsletter__button:hover{
  transform: translateY(-1px) !important;
}
.product-newsletter__media{
  width: 60% !important;
}
.product-newsletter__image{
  filter: saturate(1.02) contrast(1.02) !important;
}
.product-newsletter__media::after{
  width: 27rem !important;
  background:
    linear-gradient(
      90deg,
      #f5fbfe 0%,
      rgba(245,251,254,0.9) 30%,
      rgba(245,251,254,0.48) 62%,
      transparent 100%
    ) !important;
}
.product-newsletter__inner::before{
  inset: 0 auto 0 38% !important;
  width: 20rem !important;
  background:
    linear-gradient(
      90deg,
      rgba(234,247,252,0.92),
      rgba(245,251,254,0.42),
      rgba(245,251,254,0)
    ) !important;
}
/* Make form feel anchored,
not pasted */
.product-newsletter__form-wrap::before{
  content: "" !important;
  position: absolute !important;
  inset: -1rem -1.4rem !important;
  z-index: -1 !important;
  border-radius: 1.4rem !important;
  background: rgba(255,255,255,0.16) !important;
  filter: blur(18px) !important;
  pointer-events: none !important;
}
.product-newsletter__form-wrap{
  position: relative !important;
}
/* Product newsletter mobile refinement */
@media (max-width: 989px){
  .product-newsletter__inner {
    border-radius: 1.2rem !important;
  }

  .product-newsletter__form-wrap {
    width: calc(100% - 4rem) !important;
    margin: 0 2rem 2.5rem !important;
  }

  .product-newsletter__heading {
    max-width: 40rem !important;
  }
}

@media (max-width: 749px) {
.product-newsletter__form{
    border-radius: 1rem !important;
  }
.product-newsletter__input{
    border-radius: 1rem 1rem 0 0 !important;
  }
.product-newsletter__button{
    border-radius: 0.85rem !important;
    margin: 0.35rem !important;
  }
}
/* Product newsletter: button loading state */
.product-newsletter__button{
  position: relative !important;
  display: inline-grid !important;
  grid-auto-flow: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.65rem !important;
}
.product-newsletter__button-loader{
  width: 1rem !important;
  height: 1rem !important;
  display: none !important;
  border-radius: 999px !important;
  border: 2px solid rgba(255, 255, 255, 0.42) !important;
  border-top-color: #ffffff !important;
  animation: themeblocks-skincareButtonSpin 720ms linear infinite !important;
}
.product-newsletter__form.is-submitting .product-newsletter__button{
  opacity: 0.92 !important;
  cursor: wait !important;
  pointer-events: none !important;
}
.product-newsletter__form.is-submitting .product-newsletter__button-loader{
  display: inline-block !important;
}
.product-newsletter__form.is-submitting .product-newsletter__button-label{
  opacity: 0.92 !important;
}

@keyframes themeblocks-skincareButtonSpin {
  to {
    transform: rotate(360deg);
  }
}
/* Hide inline newsletter messages after JS converts them to snackbar */
.product-newsletter__message.is-toast-source{
  display: none !important;
}
/* ThemeBlocks Skincare snackbar */
.themeblocks-skincare-snackbar{
  position: fixed !important;
  right: clamp(1rem, 2vw, 1.5rem) !important;
  bottom: clamp(1rem, 2vw, 1.5rem) !important;
  z-index: 999999 !important;
  width: min(calc(100vw - 2rem), 28rem) !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 0.9rem !important;
  align-items: start !important;
  padding: 1rem 1rem 1rem 0.95rem !important;
  border-radius: 1.1rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,252,253,0.96)) !important;
  color: var(--color-ink) !important;
  box-shadow:
    0 1.5rem 4rem rgba(18, 57, 93, 0.18),
    inset 0 0 0 1px rgba(255,255,255,0.9) !important;
  transform: translateY(1rem) scale(0.98) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition:
    opacity 220ms ease,
    transform 260ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}
.themeblocks-skincare-snackbar.is-visible{
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
  pointer-events: auto !important;
}
.themeblocks-skincare-snackbar__icon{
  width: 2.2rem !important;
  height: 2.2rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  font-size: 1rem !important;
  font-weight: 900 !important;
}
.themeblocks-skincare-snackbar--success .themeblocks-skincare-snackbar__icon{
  background: rgba(46, 125, 82, 0.1) !important;
  color: #2e7d52 !important;
}
.themeblocks-skincare-snackbar--error .themeblocks-skincare-snackbar__icon{
  background: rgba(148, 45, 45, 0.1) !important;
  color: #942d2d !important;
}
.themeblocks-skincare-snackbar__content{
  display: grid !important;
  gap: 0.18rem !important;
}
.themeblocks-skincare-snackbar__title{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: 0.92rem !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}
.themeblocks-skincare-snackbar__text{
  margin: 0 !important;
  color: rgba(18, 57, 93, 0.72) !important;
  font-size: 0.86rem !important;
  line-height: 1.4 !important;
}
.themeblocks-skincare-snackbar__close{
  width: 2rem !important;
  height: 2rem !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: rgba(18, 57, 93, 0.58) !important;
  cursor: pointer !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
}
.themeblocks-skincare-snackbar__close:hover{
  background: rgba(18, 57, 93, 0.06) !important;
  color: var(--color-ink) !important;
}

@media (max-width: 749px) {
.themeblocks-skincare-snackbar{
    left: 1rem !important;
    right: 1rem !important;
    bottom: 1rem !important;
    width: auto !important;
  }
}
/* Product page: premium thumbnail carousel */
.product-main__thumb-carousel{
  position: relative !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  gap: 0.8rem !important;
  align-items: center !important;
  margin-top: 1.25rem !important;
}
.product-main__thumbs{
  display: flex !important;
  gap: 0.9rem !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none !important;
  padding: 0.15rem 0.1rem 0.35rem !important;
}
.product-main__thumbs::-webkit-scrollbar{
  display: none !important;
}
.product-main__thumb{
  flex: 0 0 clamp(5.4rem, 7vw, 7.1rem) !important;
  width: clamp(5.4rem, 7vw, 7.1rem) !important;
  height: clamp(5.4rem, 7vw, 7.1rem) !important;
  aspect-ratio: 1 / 1 !important;
  scroll-snap-align: start !important;
  overflow: hidden !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  border-radius: 0.8rem !important;
  background:
    radial-gradient(circle at center, rgba(255,255,255,0.98), rgba(246,251,253,0.84)) !important;
  padding: 0.25rem !important;
  cursor: pointer !important;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease !important;
}
.product-main__thumb:hover{
  transform: translateY(-2px) !important;
  border-color: rgba(31, 111, 174, 0.28) !important;
  box-shadow: 0 0.7rem 1.6rem rgba(18, 57, 93, 0.08) !important;
}
.product-main__thumb.is-active{
  border-color: var(--color-blue) !important;
  box-shadow:
    0 0 0 1px var(--color-blue),
    0 0.9rem 1.8rem rgba(18, 57, 93, 0.1) !important;
}
.product-main__thumb-image{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  border-radius: 0.55rem !important;
}
.product-main__thumb-arrow{
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.88) !important;
  color: var(--color-ink) !important;
  font-size: 1.65rem !important;
  line-height: 1 !important;
  cursor: pointer !important;
  box-shadow:
    0 0.75rem 1.8rem rgba(18, 57, 93, 0.08),
    inset 0 0 0 1px rgba(255,255,255,0.86) !important;
  transition:
    transform 180ms ease,
    color 180ms ease,
    border-color 180ms ease,
    opacity 180ms ease !important;
}
.product-main__thumb-arrow:hover:not(:disabled){
  transform: scale(1.05) !important;
  color: var(--color-blue) !important;
  border-color: rgba(201, 162, 39, 0.32) !important;
}
.product-main__thumb-arrow:disabled{
  opacity: 0.18 !important;
  cursor: default !important;
}
.product-main__thumb-carousel:not(.has-thumb-overflow) .product-main__thumb-arrow{
  display: none !important;
}
.product-main__thumb-carousel:not(.has-thumb-overflow){
  grid-template-columns: minmax(0, 1fr) !important;
}

@media (max-width: 749px) {
.product-main__thumb-carousel{
    gap: 0.55rem !important;
  }
.product-main__thumb{
    flex-basis: 5.1rem !important;
    width: 5.1rem !important;
    height: 5.1rem !important;
  }
.product-main__thumb-arrow{
    width: 2.25rem !important;
    height: 2.25rem !important;
  }
}
/* Product page: zoom button disabled until real lightbox is added */
.product-main__zoom{
  display: none !important;
}
/* Product page: dedicated Judge.me reviews section */
.product-reviews{
  background:
    radial-gradient(circle at 12% 0%, rgba(142, 205, 224, 0.1), transparent 24rem),
    radial-gradient(circle at 92% 8%, rgba(201, 162, 39, 0.055), transparent 22rem),
    #ffffff;
}
.product-reviews__shell{
  display: grid;
  grid-template-columns: minmax(18rem, 0.34fr) minmax(0, 0.66fr);
  gap: clamp(2rem, 4vw, 4rem);
  align-items: start;
  padding: clamp(2rem, 4vw, 3.25rem);
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.35rem;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,252,253,0.96));
  box-shadow:
    0 1.4rem 4.2rem rgba(18, 57, 93, 0.06),
    inset 0 0 0 1px rgba(255,255,255,0.86);
}
.product-reviews__eyebrow{
  margin: 0 0 0.9rem;
  color: var(--color-blue);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.product-reviews__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading);
  font-size: clamp(2.6rem, 4vw, 4.8rem);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.06em;
}
.product-reviews__subheading{
  max-width: 26rem;
  margin: 1rem 0 0;
  color: rgba(18, 57, 93, 0.72);
  font-size: 0.98rem;
  line-height: 1.6;
}
.product-reviews__badge{
  margin-top: 1.35rem;
}
.product-reviews__badge .jdgm-preview-badge{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  color: rgba(18, 57, 93, 0.76) !important;
  font-size: 0.95rem !important;
  font-weight: 900 !important;
}
.product-reviews__badge .jdgm-star,
.product-reviews__badge .jdgm-prev-badge__stars{
  color: var(--color-gold) !important;
}
.product-reviews__widget{
  min-width: 0;
}
.product-reviews__widget .jdgm-rev-widg{
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}
.product-reviews__widget .jdgm-rev-widg__title{
  display: none !important;
}
.product-reviews__widget .jdgm-rev-widg__summary{
  color: var(--color-ink) !important;
}
.product-reviews__widget .jdgm-star{
  color: var(--color-gold) !important;
}
.product-tabs__reviews-cta{
  display: grid;
  gap: 1rem;
  max-width: 34rem;
}
.product-tabs__reviews-cta p{
  margin: 0;
  color: rgba(18, 57, 93, 0.78);
  line-height: 1.6;
}
.product-tabs__reviews-cta .button{
  width: fit-content;
}

@media (max-width: 989px) {
.product-reviews__shell{
    grid-template-columns: 1fr;
  }
.product-reviews__subheading{
    max-width: 42rem;
  }
}

@media (max-width: 749px) {
.product-reviews__shell{
    padding: 1.5rem;
    border-radius: 1rem;
  }
.product-reviews__heading{
    font-size: clamp(2.4rem, 11vw, 3.5rem);
  }
}
/* Product reviews: avoid duplicate preview badges when Judge.me app embed is enabled */
.product-reviews__badge{
  display: none !important;
}
/* Product reviews: app block layout */
.product-reviews__app-block{
  width: 100%;
  min-width: 0;
}
.product-reviews__empty{
  min-height: 10rem;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(18, 57, 93, 0.18);
  border-radius: 1rem;
  color: rgba(18, 57, 93, 0.58);
  font-size: 0.95rem;
  text-align: center;
}
/* Judge.me real widget inside ThemeBlocks Skincare reviews section */
.product-reviews__widget .jdgm-rev-widg{
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
}
.product-reviews__widget .jdgm-rev-widg__title{
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: clamp(2rem, 3vw, 3.4rem) !important;
  font-weight: 400 !important;
  letter-spacing: -0.045em !important;
}
.product-reviews__widget .jdgm-star,
.product-reviews__widget .jdgm-rev__rating .jdgm-star,
.product-reviews__widget .jdgm-histogram__star{
  color: var(--color-gold) !important;
}
.product-reviews__widget .jdgm-write-rev-link,
.product-reviews__widget .jdgm-btn{
  border-radius: 0.85rem !important;
  border-color: var(--color-blue) !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: 0.05em !important;
}
.product-reviews__widget .jdgm-write-rev-link:hover,
.product-reviews__widget .jdgm-btn:hover{
  background: var(--color-ink) !important;
  border-color: var(--color-ink) !important;
}
.product-reviews__widget .jdgm-rev{
  border-top-color: rgba(18, 57, 93, 0.1) !important;
}
.product-reviews__widget .jdgm-rev__author,
.product-reviews__widget .jdgm-rev__title{
  color: var(--color-ink) !important;
  font-weight: 900 !important;
}
.product-reviews__widget .jdgm-rev__body{
  color: rgba(18, 57, 93, 0.84) !important;
  line-height: 1.65 !important;
}
/* Judge.me: ThemeBlocks Skincare brand override */
.product-reviews__widget,
.product-reviews__widget .jdgm-widget{
  color: var(--color-ink) !important;
  font-family: var(--font-body) !important;
}
/* Widget title + summary */
.product-reviews__widget .jdgm-rev-widg__title{
  margin: 0 0 0.7rem !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: clamp(1.5rem, 2vw, 2.15rem) !important;
  font-weight: 400 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.045em !important;
}
.product-reviews__widget .jdgm-rev-widg__summary,
.product-reviews__widget .jdgm-rev-widg__summary-text,
.product-reviews__widget .jdgm-rev-widg__summary-average{
  color: var(--color-ink) !important;
  font-weight: 800 !important;
}
/* Stars: force ThemeBlocks Skincare gold */
.product-reviews__widget .jdgm-star,
.product-reviews__widget .jdgm-star.jdgm--on,
.product-reviews__widget .jdgm-star.jdgm--half,
.product-reviews__widget .jdgm-rev__rating .jdgm-star,
.product-reviews__widget .jdgm-prev-badge__stars .jdgm-star{
  color: var(--color-gold) !important;
}
.product-reviews__widget .jdgm-star::before,
.product-reviews__widget .jdgm-star.jdgm--on::before,
.product-reviews__widget .jdgm-star.jdgm--half::before{
  color: var(--color-gold) !important;
}
/* Write review button */
.product-reviews__widget .jdgm-write-rev-link,
.product-reviews__widget .jdgm-btn,
.product-reviews__widget .jdgm-submit-rev{
  min-height: 2.85rem !important;
  border: 1px solid var(--color-blue) !important;
  border-radius: 0.9rem !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  padding: 0 1.6rem !important;
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  box-shadow: 0 0.65rem 1.5rem rgba(31, 111, 174, 0.16) !important;
  transition:
    background 180ms ease,
    border-color 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease !important;
}
.product-reviews__widget .jdgm-write-rev-link:hover,
.product-reviews__widget .jdgm-btn:hover,
.product-reviews__widget .jdgm-submit-rev:hover{
  background: var(--color-ink) !important;
  border-color: var(--color-ink) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 0.85rem 1.8rem rgba(18, 57, 93, 0.18) !important;
}
/* Filter/sort buttons */
.product-reviews__widget .jdgm-sort-dropdown-wrapper,
.product-reviews__widget .jdgm-rev-widg__sort-wrapper,
.product-reviews__widget .jdgm-histogram,
.product-reviews__widget .jdgm-widget-actions-wrapper{
  color: var(--color-ink) !important;
}
.product-reviews__widget .jdgm-sort-dropdown,
.product-reviews__widget .jdgm-rev-widg__sort,
.product-reviews__widget .jdgm-rev-widg__filter,
.product-reviews__widget .jdgm-medals__container,
.product-reviews__widget .jdgm-btn--border{
  border-color: rgba(18, 57, 93, 0.16) !important;
  border-radius: 0.75rem !important;
  background: #ffffff !important;
  color: var(--color-ink) !important;
}
/* Review cards */
.product-reviews__widget .jdgm-rev{
  border-top: 1px solid rgba(18, 57, 93, 0.1) !important;
  padding: 1.6rem 0 !important;
}
.product-reviews__widget .jdgm-rev:last-child{
  border-bottom: 1px solid rgba(18, 57, 93, 0.1) !important;
}
.product-reviews__widget .jdgm-rev__author,
.product-reviews__widget .jdgm-rev__buyer-badge,
.product-reviews__widget .jdgm-rev__title{
  color: var(--color-ink) !important;
  font-weight: 900 !important;
}
.product-reviews__widget .jdgm-rev__body,
.product-reviews__widget .jdgm-rev__body p,
.product-reviews__widget .jdgm-rev__timestamp,
.product-reviews__widget .jdgm-rev__location{
  color: rgba(18, 57, 93, 0.82) !important;
  font-size: 0.95rem !important;
  line-height: 1.58 !important;
}
/* Reviewer avatar */
.product-reviews__widget .jdgm-rev__icon,
.product-reviews__widget .jdgm-rev__avatar,
.product-reviews__widget .jdgm-rev__author-wrapper .jdgm-rev__icon{
  background: rgba(142, 205, 224, 0.16) !important;
  color: var(--color-ink) !important;
  font-weight: 900 !important;
}
/* More link */
.product-reviews__widget .jdgm-rev__read-full,
.product-reviews__widget .jdgm-rev__read-full:hover,
.product-reviews__widget .jdgm-rev__body-read-more,
.product-reviews__widget a{
  color: var(--color-blue) !important;
  font-weight: 900 !important;
}
/* Pagination */
.product-reviews__widget .jdgm-paginate{
  margin-top: 1.5rem !important;
  color: var(--color-ink) !important;
}
.product-reviews__widget .jdgm-paginate__page{
  color: rgba(18, 57, 93, 0.72) !important;
  border-radius: 999px !important;
}
.product-reviews__widget .jdgm-paginate__page.jdgm-curt{
  background: var(--color-blue) !important;
  color: #ffffff !important;
}
/* Judge.me forms/modal */
.product-reviews__widget .jdgm-form,
.product-reviews__widget .jdgm-form-wrapper{
  color: var(--color-ink) !important;
}
.product-reviews__widget input,
.product-reviews__widget textarea,
.product-reviews__widget select{
  border-color: rgba(18, 57, 93, 0.14) !important;
  border-radius: 0.85rem !important;
  color: var(--color-ink) !important;
}
.product-reviews__widget input:focus,
.product-reviews__widget textarea:focus,
.product-reviews__widget select:focus{
  border-color: var(--color-blue) !important;
  box-shadow: 0 0 0 0.18rem rgba(31, 111, 174, 0.12) !important;
  outline: none !important;
}
/* Make Judge.me right column breathe */
.product-reviews__widget .jdgm-rev-widg{
  max-width: 100% !important;
}
.product-reviews__widget .jdgm-rev-widg__header{
  margin-bottom: 1.5rem !important;
}
/* Mobile */
@media (max-width: 749px){
  .product-reviews__widget .jdgm-rev-widg__title {
    font-size: 1.6rem !important;
  }

  .product-reviews__widget .jdgm-write-rev-link,
  .product-reviews__widget .jdgm-btn {
    width: 100% !important;
  }
}
/* Judge.me Revamp widget: ThemeBlocks Skincare variables + classes */
#judgeme-reviews #judgeme_product_reviews,
#judgeme-reviews .jm-review-widget,
#judgeme-reviews .jm-review-item{
  --jm-review-widget-star-and-histogram-color: #c9a227 !important;
  --jm-review-widget-button-color: #1f6fae !important;
  --jm-review-widget-button-text-color: #ffffff !important;
  --jm-review-widget-text-color: #12395d !important;
  --jm-review-widget-lighter-text-color: rgba(18, 57, 93, 0.62) !important;
  --jm-widget-primary-color: #1f6fae !important;
  --jm-review-widget-form-button-color: #1f6fae !important;
  --jm-review-widget-form-button-text-color: #ffffff !important;
}
#judgeme-reviews .jm-star-rating__font-icon{
  color: #c9a227 !important;
  -webkit-text-fill-color: #c9a227 !important;
}
#judgeme-reviews .jm-button--primary,
#judgeme-reviews .jm-action-buttons__button,
#judgeme-reviews [data-testid="write-review-button"]{
  background: #1f6fae !important;
  background-color: #1f6fae !important;
  border-color: #1f6fae !important;
  color: #ffffff !important;
  border-radius: 0.9rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
#judgeme-reviews .jm-button--primary:hover,
#judgeme-reviews .jm-action-buttons__button:hover,
#judgeme-reviews [data-testid="write-review-button"]:hover{
  background: #12395d !important;
  background-color: #12395d !important;
  border-color: #12395d !important;
}
#judgeme-reviews .jm-reviewer-avatar,
#judgeme-reviews .jm-reviewer-avatar__initial{
  background-color: rgba(142, 205, 224, 0.16) !important;
  color: #12395d !important;
}
#judgeme-reviews .jm-review-widget-minimal-header__title,
#judgeme-reviews .jm-reviewer-info__name{
  color: #12395d !important;
}
#judgeme-reviews .jm-review-content__body,
#judgeme-reviews .jm-review-content__body p{
  color: rgba(18, 57, 93, 0.84) !important;
  line-height: 1.65 !important;
}
#judgeme-reviews .jm-pagination-controls__button--active{
  --jm-btn-bg: #1f6fae !important;
  --jm-btn-border: #1f6fae !important;
  --jm-btn-color: #ffffff !important;
  background: #1f6fae !important;
  border-color: #1f6fae !important;
  color: #ffffff !important;
}
/* Filter/sort icons should not become gold */
#judgeme-reviews .jm-custom-answer-filter svg,
#judgeme-reviews .jm-sort-filter svg,
#judgeme-reviews .jm-pagination-controls svg{
  color: #12395d !important;
  fill: #12395d !important;
  stroke: #12395d !important;
}
#judgeme-reviews .jm-custom-answer-filter svg *,
#judgeme-reviews .jm-sort-filter svg *,
#judgeme-reviews .jm-pagination-controls svg *{
  color: #12395d !important;
  fill: #12395d !important;
  stroke: #12395d !important;
}
/* Judge.me Revamp: safe ThemeBlocks Skincare brand override */
#judgeme-reviews #judgeme_product_reviews,
#judgeme-reviews .jm-review-widget,
#judgeme-reviews .jm-review-item,
#judgeme-reviews .jm-star-rating,
#judgeme-reviews .jm-button{
  --jm-review-widget-star-and-histogram-color: #c9a227 !important;
  --jm-review-widget-button-color: #1f6fae !important;
  --jm-review-widget-button-text-color: #ffffff !important;
  --jm-review-widget-text-color: #12395d !important;
  --jm-review-widget-lighter-text-color: rgba(18, 57, 93, 0.62) !important;
  --jm-widget-primary-color: #1f6fae !important;
  --jm-review-widget-form-button-color: #1f6fae !important;
  --jm-review-widget-form-button-text-color: #ffffff !important;
}
#judgeme-reviews .jm-star-rating__font-icon{
  color: #c9a227 !important;
  -webkit-text-fill-color: #c9a227 !important;
}
#judgeme-reviews .jm-button--primary,
#judgeme-reviews [data-testid="write-review-button"]{
  --jm-btn-bg: #1f6fae !important;
  --jm-btn-border: #1f6fae !important;
  --jm-btn-color: #ffffff !important;
  background-color: #1f6fae !important;
  border-color: #1f6fae !important;
  color: #ffffff !important;
  border-radius: 0.9rem !important;
}
#judgeme-reviews .jm-pagination-controls__button--active{
  --jm-btn-bg: #1f6fae !important;
  --jm-btn-border: #1f6fae !important;
  --jm-btn-color: #ffffff !important;
}
/* Related products: controlled review rating alignment */
.related-product-card__rating{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.42rem !important;
  min-height: 1.25rem !important;
  width: 100% !important;
  margin-top: 0.25rem !important;
  color: rgba(18, 57, 93, 0.64) !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}
.related-product-card__stars{
  position: relative !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  width: 4.95rem !important;
  height: 1rem !important;
  color: rgba(18, 57, 93, 0.16) !important;
  font-size: 0.9rem !important;
  line-height: 1 !important;
  letter-spacing: 0.04em !important;
}
.related-product-card__stars-base,
.related-product-card__stars-fill{
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  line-height: 1 !important;
  letter-spacing: 0.04em !important;
}
.related-product-card__stars-base{
  color: rgba(18, 57, 93, 0.16) !important;
}
.related-product-card__stars-fill{
  width: 0;
  overflow: hidden !important;
  color: var(--color-gold) !important;
  white-space: nowrap !important;
}
.related-product-card__stars--empty{
  color: rgba(18, 57, 93, 0.14) !important;
}
.related-product-card__review-count{
  min-width: 0 !important;
  color: rgba(18, 57, 93, 0.62) !important;
  font-size: 0.76rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
/* Kill leftover Judge.me preview badge styles inside related cards if any remain */
.related-product-card .jdgm-preview-badge,
.related-product-card .jdgm-prev-badge,
.related-product-card .jdgm-prev-badge__stars,
.related-product-card .jdgm-prev-badge__text{
  display: none !important;
}
/* Product page: controlled main rating row */
.product-main__rating{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  width: fit-content !important;
  margin-top: 0.85rem !important;
  color: rgba(18, 57, 93, 0.7) !important;
  text-decoration: none !important;
  font-size: 0.95rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
.product-main__rating:hover .product-main__review-count{
  color: var(--color-blue) !important;
}
.product-main__stars{
  position: relative !important;
  display: inline-block !important;
  width: 5.8rem !important;
  height: 1.1rem !important;
  color: rgba(18, 57, 93, 0.16) !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  letter-spacing: 0.05em !important;
}
.product-main__stars-base,
.product-main__stars-fill{
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  line-height: 1 !important;
  letter-spacing: 0.05em !important;
}
.product-main__stars-base{
  color: rgba(18, 57, 93, 0.16) !important;
}
.product-main__stars-fill{
  width: 0;
  overflow: hidden !important;
  color: var(--color-gold) !important;
  white-space: nowrap !important;
}
.product-main__stars--empty{
  color: rgba(18, 57, 93, 0.16) !important;
}
.product-main__review-count{
  color: rgba(18, 57, 93, 0.7) !important;
  font-size: 0.95rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  transition: color 180ms ease !important;
}
/* Hide any leftover Judge.me preview badge in the product hero */
.product-main__info .jdgm-preview-badge,
.product-main__info .jdgm-prev-badge,
.product-main__info .jdgm-prev-badge__stars,
.product-main__info .jdgm-prev-badge__text{
  display: none !important;
}
/* PDP thumbnails: premium minimal carousel arrows */
.product-main__thumb-arrow{
  width: 2.7rem !important;
  height: 2.7rem !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: rgba(18, 57, 93, 0.72) !important;
  box-shadow: none !important;
  font-size: 0 !important;
  line-height: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition:
    color 180ms ease,
    opacity 180ms ease,
    transform 180ms ease !important;
}
.product-main__thumb-arrow::before{
  content: "" !important;
  width: 0.78rem !important;
  height: 0.78rem !important;
  display: block !important;
  border-top: 2px solid currentColor !important;
  border-left: 2px solid currentColor !important;
}
.product-main__thumb-arrow--prev::before{
  transform: translateX(0.12rem) rotate(-45deg) !important;
}
.product-main__thumb-arrow--next::before{
  transform: translateX(-0.12rem) rotate(135deg) !important;
}
.product-main__thumb-arrow:hover:not(:disabled){
  color: var(--color-blue) !important;
  transform: scale(1.12) !important;
  border-color: transparent !important;
  box-shadow: none !important;
  background: transparent !important;
}
.product-main__thumb-arrow:disabled{
  opacity: 0.16 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.product-main__thumb-carousel{
  gap: 0.65rem !important;
}
/* PDP quantity selector: rounded premium control */
.product-main__quantity{
  border-radius: 1rem !important;
  overflow: hidden !important;
  border: 1px solid rgba(18, 57, 93, 0.13) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.72) !important;
}
.product-main__quantity button,
.product-main__quantity input{
  border: 0 !important;
  background: transparent !important;
}
.product-main__quantity button{
  color: var(--color-ink) !important;
  transition:
    background 180ms ease,
    color 180ms ease !important;
}
.product-main__quantity button:hover{
  background: rgba(31, 111, 174, 0.08) !important;
  color: var(--color-blue) !important;
}
.product-main__quantity input{
  color: var(--color-ink) !important;
  font-weight: 900 !important;
}
/* PDP dynamic checkout: rounded Shopify payment button wrapper */
.product-main__dynamic-checkout{
  margin-top: 0.85rem !important;
  border-radius: 1rem !important;
  overflow: hidden !important;
}
.product-main__dynamic-checkout .shopify-payment-button{
  border-radius: 1rem !important;
  overflow: hidden !important;
}
.product-main__dynamic-checkout .shopify-payment-button__button,
.product-main__dynamic-checkout .shopify-payment-button__button--unbranded,
.product-main__dynamic-checkout .shopify-payment-button__button--branded,
.product-main__dynamic-checkout button,
.product-main__dynamic-checkout iframe{
  border-radius: 1rem !important;
  overflow: hidden !important;
}
.product-main__dynamic-checkout .shopify-payment-button__button{
  min-height: 4.15rem !important;
}
/* Keep Add to Cart matching rounded geometry */
.product-main__submit,
.product-main__form button[type="submit"]{
  border-radius: 1rem !important;
}
/* PDP quantity: clean premium control */
.product-main__purchase-row{
  align-items: end !important;
  gap: clamp(0.9rem, 1.6vw, 1.4rem) !important;
}
.product-main__quantity-wrap,
.product-main__quantity-field{
  display: grid !important;
  gap: 0.55rem !important;
}
.product-main__quantity-label,
.product-main__form label[for*="Quantity"],
.product-main__form .quantity__label{
  position: static !important;
  display: block !important;
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  transform: none !important;
  background: transparent !important;
}
.product-main__quantity{
  width: clamp(10.5rem, 13vw, 12.25rem) !important;
  height: 4.15rem !important;
  display: grid !important;
  grid-template-columns: 3.2rem minmax(2.5rem, 1fr) 3.2rem !important;
  align-items: center !important;
  border: 1px solid rgba(18, 57, 93, 0.13) !important;
  border-radius: 1rem !important;
  overflow: hidden !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,0.72),
    0 0.45rem 1.25rem rgba(18, 57, 93, 0.035) !important;
}
.product-main__quantity button{
  width: 100% !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--color-ink) !important;
  font-size: 1.55rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition:
    background 180ms ease,
    color 180ms ease !important;
}
.product-main__quantity button:hover{
  background: rgba(31, 111, 174, 0.08) !important;
  color: var(--color-blue) !important;
}
.product-main__quantity input{
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--color-ink) !important;
  font-size: 1.08rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  appearance: textfield !important;
  -moz-appearance: textfield !important;
}
.product-main__quantity input::-webkit-outer-spin-button,
.product-main__quantity input::-webkit-inner-spin-button{
  margin: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}
.product-main__submit{
  min-height: 4.15rem !important;
}
/* Mobile: stack cleanly */
@media (max-width: 749px){
  .product-main__purchase-row {
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
  }

  .product-main__quantity {
    width: 100% !important;
  }
}
/* PDP quantity: emergency reset after bad overlap */
.product-main__purchase-row{
  display: grid !important;
  grid-template-columns: clamp(10.5rem, 13vw, 12.25rem) minmax(0, 1fr) !important;
  gap: clamp(1rem, 1.6vw, 1.4rem) !important;
  align-items: end !important;
}
.product-main__quantity-wrap{
  display: grid !important;
  gap: 0.65rem !important;
  min-width: 0 !important;
}
.product-main__quantity-label{
  position: static !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--color-ink) !important;
  font-size: 0.76rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.product-main__quantity{
  width: 100% !important;
  height: 4.15rem !important;
  display: grid !important;
  grid-template-columns: 3.2rem 1fr 3.2rem !important;
  align-items: center !important;
  border: 1px solid rgba(18, 57, 93, 0.13) !important;
  border-radius: 1rem !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
.product-main__quantity button,
.product-main__quantity input{
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  transform: none !important;
}
.product-main__quantity button{
  display: grid !important;
  place-items: center !important;
  color: var(--color-ink) !important;
  font-size: 1.45rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.product-main__quantity button:hover{
  background: rgba(31, 111, 174, 0.08) !important;
  color: var(--color-blue) !important;
}
.product-main__quantity input{
  color: var(--color-ink) !important;
  font-size: 1.08rem !important;
  font-weight: 900 !important;
  text-align: center !important;
}
.product-main__submit{
  min-height: 4.15rem !important;
  border-radius: 1rem !important;
}

@media (max-width: 749px) {
.product-main__purchase-row{
    grid-template-columns: 1fr !important;
  }
}
/* Header: premium ThemeBlocks Skincare refinement */
.site-header{
  min-height: 5.25rem !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: 0 0.8rem 2.6rem rgba(18, 57, 93, 0.045) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
.site-header__inner{
  min-height: 5.25rem !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 14rem) minmax(0, 1fr) minmax(9rem, 14rem) !important;
  align-items: center !important;
  gap: 1.5rem !important;
}
.site-header__logo,
.site-header__logo-link{
  position: static !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 10.5rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-self: start !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  pointer-events: auto !important;
  z-index: auto !important;
}
.site-header__logo-image{
  width: clamp(7.8rem, 9vw, 10.25rem) !important;
  height: auto !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.site-header__logo-text{
  color: var(--color-ink) !important;
  font-family: var(--font-heading) !important;
  font-size: 1.3rem !important;
  line-height: 1 !important;
}
.site-header__nav{
  justify-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: clamp(1.8rem, 3vw, 3.2rem) !important;
}
.site-header__nav-link{
  position: relative !important;
  color: var(--color-ink) !important;
  font-size: 0.76rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 0.96 !important;
  transition:
    color 180ms ease,
    opacity 180ms ease !important;
}
.site-header__nav-link::after{
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: -0.65rem !important;
  width: 0 !important;
  height: 1px !important;
  background: var(--color-gold) !important;
  transform: translateX(-50%) !important;
  transition: width 220ms ease !important;
}
.site-header__nav-link:hover{
  color: var(--color-blue) !important;
  opacity: 1 !important;
}
.site-header__nav-link:hover::after{
  width: 100% !important;
}
.site-header__actions{
  justify-self: end !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.55rem !important;
}
/* Header icons: force visible on PDP/default header */
.site-header__actions a,
.site-header__actions button,
.site-header__cart,
.site-header__icon,
.site-header__menu-toggle{
  color: var(--color-ink) !important;
  background: transparent !important;
}
.site-header__actions svg,
.site-header__cart svg,
.site-header__icon svg{
  width: 1.25rem !important;
  height: 1.25rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  fill: none !important;
  stroke: currentColor !important;
}
.site-header__actions svg path,
.site-header__cart svg path,
.site-header__icon svg path{
  stroke: currentColor !important;
}
/* Cart icon pill */
.site-header__cart{
  position: relative !important;
  width: 2.75rem !important;
  height: 2.75rem !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  color: var(--color-ink) !important;
  text-decoration: none !important;
  box-shadow: 0 0.45rem 1.35rem rgba(18, 57, 93, 0.055) !important;
  transition:
    border-color 180ms ease,
    color 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease !important;
}
.site-header__cart:hover{
  color: var(--color-blue) !important;
  border-color: rgba(31, 111, 174, 0.22) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 0.7rem 1.7rem rgba(18, 57, 93, 0.08) !important;
}
.site-header__cart-count{
  position: absolute !important;
  top: -0.35rem !important;
  right: -0.25rem !important;
  min-width: 1.1rem !important;
  height: 1.1rem !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0.28rem !important;
  border-radius: 999px !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
/* Hide empty cart badge cleanly */
.site-header__cart-count:empty,
.site-header__cart-count[data-cart-count="0"]{
  display: none !important;
}
/* Mobile menu icon should be navy,
not white */
.site-header__menu-toggle span{
  background: var(--color-ink) !important;
}
/* Product/default pages should never use invisible floating-home icon colors */
body:not(.template-index) .site-header,
.site-header:not(.site-header--transparent){
  background: rgba(255, 255, 255, 0.94) !important;
}
body:not(.template-index) .site-header *,
.site-header:not(.site-header--transparent) *{
  border-color: inherit;
}
body:not(.template-index) .site-header__nav-link,
body:not(.template-index) .site-header__actions,
body:not(.template-index) .site-header__cart,
body:not(.template-index) .site-header__actions svg{
  color: var(--color-ink) !important;
}
/* Desktop only */
@media (min-width: 750px){
}
/* Mobile header */

/* Internal/PDP header: stable premium sticky bar */
body:not(.template-index) .site-header,
.template-product .site-header,
.template-collection .site-header,
.template-page .site-header{
  position: sticky !important;
  top: 0 !important;
  z-index: 80 !important;
  width: 100% !important;
  min-height: 5.4rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow: 0 0.9rem 2.8rem rgba(18, 57, 93, 0.045) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
/* Internal header grid */
body:not(.template-index) .site-header__inner,
.template-product .site-header__inner,
.template-collection .site-header__inner,
.template-page .site-header__inner{
  min-height: 5.4rem !important;
  display: grid !important;
  grid-template-columns: minmax(10rem, 15rem) minmax(0, 1fr) minmax(10rem, 15rem) !important;
  align-items: center !important;
  gap: 1.5rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* Internal header logo: stop absolute/floating behavior */
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link,
.template-product .site-header__logo,
.template-product .site-header__logo-link,
.template-collection .site-header__logo,
.template-collection .site-header__logo-link,
.template-page .site-header__logo,
.template-page .site-header__logo-link{
  position: static !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-self: start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 10.75rem !important;
  min-height: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 2 !important;
}
body:not(.template-index) .site-header__logo-image,
.template-product .site-header__logo-image,
.template-collection .site-header__logo-image,
.template-page .site-header__logo-image{
  display: block !important;
  width: clamp(8.2rem, 9vw, 10.5rem) !important;
  height: auto !important;
  max-height: 4rem !important;
  object-fit: contain !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* Internal nav centered */
body:not(.template-index) .site-header__nav,
.template-product .site-header__nav,
.template-collection .site-header__nav,
.template-page .site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(2rem, 3.5vw, 3.6rem) !important;
  width: auto !important;
  margin: 0 !important;
}
body:not(.template-index) .site-header__nav-link,
.template-product .site-header__nav-link,
.template-collection .site-header__nav-link,
.template-page .site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.75rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
/* Internal actions/cart right aligned */
body:not(.template-index) .site-header__actions,
.template-product .site-header__actions,
.template-collection .site-header__actions,
.template-page .site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.65rem !important;
  min-width: 0 !important;
}
/* Cart icon must be visible and aligned */
body:not(.template-index) .site-header__cart,
.template-product .site-header__cart,
.template-collection .site-header__cart,
.template-page .site-header__cart{
  position: relative !important;
  width: 2.75rem !important;
  height: 2.75rem !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.55rem 1.35rem rgba(18, 57, 93, 0.06) !important;
  transform: none !important;
}
body:not(.template-index) .site-header__cart svg,
.template-product .site-header__cart svg,
.template-collection .site-header__cart svg,
.template-page .site-header__cart svg{
  width: 1.2rem !important;
  height: 1.2rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
body:not(.template-index) .site-header__cart svg *,
.template-product .site-header__cart svg *,
.template-collection .site-header__cart svg *,
.template-page .site-header__cart svg *{
  stroke: currentColor !important;
}
/* Cart count badge */
body:not(.template-index) .site-header__cart-count,
.template-product .site-header__cart-count,
.template-collection .site-header__cart-count,
.template-page .site-header__cart-count{
  position: absolute !important;
  top: -0.35rem !important;
  right: -0.25rem !important;
  min-width: 1.1rem !important;
  height: 1.1rem !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0.3rem !important;
  border-radius: 999px !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
.template-index .site-header.is-scrolled{
  position: sticky !important;
  top: 0 !important;
  z-index: 80 !important;
  min-height: 5.4rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow: 0 0.9rem 2.8rem rgba(18, 57, 93, 0.045) !important;
}
/* Mobile internal header */

/* Internal/PDP header: sticky + container-aligned */
body:not(.template-index) .site-header,
.template-product .site-header,
.template-collection .site-header,
.template-page .site-header,
.template-blog .site-header,
.template-article .site-header{
  position: sticky !important;
  top: 0 !important;
  inset-inline: 0 !important;
  z-index: 999 !important;
  width: 100% !important;
  min-height: 5.15rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
/* Match PDP/content container instead of full viewport edges */
body:not(.template-index) .site-header__inner,
.template-product .site-header__inner,
.template-collection .site-header__inner,
.template-page .site-header__inner,
.template-blog .site-header__inner,
.template-article .site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.15rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr) minmax(8rem, 14rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Logo aligned with left content edge */
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link,
.template-product .site-header__logo,
.template-product .site-header__logo-link,
.template-collection .site-header__logo,
.template-collection .site-header__logo-link,
.template-page .site-header__logo,
.template-page .site-header__logo-link,
.template-blog .site-header__logo,
.template-blog .site-header__logo-link,
.template-article .site-header__logo,
.template-article .site-header__logo-link{
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 10rem !important;
  min-width: 0 !important;
  min-height: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
body:not(.template-index) .site-header__logo-image,
.template-product .site-header__logo-image,
.template-collection .site-header__logo-image,
.template-page .site-header__logo-image,
.template-blog .site-header__logo-image,
.template-article .site-header__logo-image{
  width: clamp(7.2rem, 8.2vw, 9.5rem) !important;
  max-height: 3.5rem !important;
  height: auto !important;
  object-fit: contain !important;
}
/* Nav centered inside content grid */
body:not(.template-index) .site-header__nav,
.template-product .site-header__nav,
.template-collection .site-header__nav,
.template-page .site-header__nav,
.template-blog .site-header__nav,
.template-article .site-header__nav{
  justify-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.7rem, 3vw, 3.4rem) !important;
  margin: 0 !important;
  width: auto !important;
}
/* Actions aligned with right content edge */
body:not(.template-index) .site-header__actions,
.template-product .site-header__actions,
.template-collection .site-header__actions,
.template-page .site-header__actions,
.template-blog .site-header__actions,
.template-article .site-header__actions{
  justify-self: end !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
}
/* Cart visual refinement */
body:not(.template-index) .site-header__cart,
.template-product .site-header__cart,
.template-collection .site-header__cart,
.template-page .site-header__cart,
.template-blog .site-header__cart,
.template-article .site-header__cart{
  width: 2.55rem !important;
  height: 2.55rem !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  box-shadow: 0 0.5rem 1.3rem rgba(18, 57, 93, 0.055) !important;
}
/* Prevent old absolute cart/logo rules from winning */
body:not(.template-index) .site-header__cart,
body:not(.template-index) .site-header__logo{
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
}
/* Make room if browser/admin bar causes weird top overlap only in preview */
.shopify-design-mode body:not(.template-index) .site-header,
.shopify-design-mode .template-product .site-header{
  top: 0 !important;
}
/* Mobile internal header alignment */

/* FINAL OVERRIDE: Internal/PDP fixed premium header */
body:not(.template-index) .site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.15rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.045) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
/* Prevent fixed header from covering internal page content */
body:not(.template-index) #MainContent{
  padding-top: 5.15rem !important;
}
/* Header uses same content width rhythm as PDP */
body:not(.template-index) .site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.15rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Logo aligned to left container edge */
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link{
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 9.5rem !important;
  min-width: 0 !important;
  min-height: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
body:not(.template-index) .site-header__logo-image{
  width: clamp(7.2rem, 8vw, 9.25rem) !important;
  max-height: 3.45rem !important;
  height: auto !important;
  object-fit: contain !important;
}
/* Nav centered inside header container */
body:not(.template-index) .site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  width: auto !important;
  margin: 0 !important;
}
body:not(.template-index) .site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.74rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
/* Cart/actions aligned to right container edge */
body:not(.template-index) .site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.6rem !important;
  min-width: 0 !important;
}
body:not(.template-index) .site-header__cart{
  position: relative !important;
  width: 2.55rem !important;
  height: 2.55rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.5rem 1.3rem rgba(18, 57, 93, 0.055) !important;
  transform: none !important;
}
body:not(.template-index) .site-header__cart svg{
  width: 1.15rem !important;
  height: 1.15rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
body:not(.template-index) .site-header__cart svg *{
  stroke: currentColor !important;
}
/* Cart badge */
body:not(.template-index) .site-header__cart-count{
  position: absolute !important;
  top: -0.35rem !important;
  right: -0.25rem !important;
  min-width: 1.1rem !important;
  height: 1.1rem !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0.3rem !important;
  border-radius: 999px !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
/* Mobile internal fixed header */
@media (max-width: 749px){

  body:not(.template-index) #MainContent {
    padding-top: 4.35rem !important;
  }
}
/* FINAL FIX: internal fixed header logo vertical alignment */
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link{
  height: 5.15rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: visible !important;
  line-height: 0 !important;
}
body:not(.template-index) .site-header__logo-image{
  display: block !important;
  width: clamp(7.4rem, 8vw, 9.4rem) !important;
  height: auto !important;
  max-height: 3.55rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.18rem) !important;
}
body:not(.template-index) .site-header.is-scrolled .site-header__logo,
body:not(.template-index) .site-header.is-scrolled .site-header__logo-link{
  top: auto !important;
  left: auto !important;
  transform: none !important;
  height: 5.15rem !important;
  align-items: center !important;
}
/* Mobile logo alignment */

/* FINAL FIX: internal fixed header logo vertical alignment */
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link{
  height: 5.15rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  overflow: visible !important;
  line-height: 0 !important;
}
body:not(.template-index) .site-header__logo-image{
  display: block !important;
  width: clamp(7.4rem, 8vw, 9.4rem) !important;
  height: auto !important;
  max-height: 3.55rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.18rem) !important;
}
body:not(.template-index) .site-header.is-scrolled .site-header__logo,
body:not(.template-index) .site-header.is-scrolled .site-header__logo-link{
  top: auto !important;
  left: auto !important;
  transform: none !important;
  height: 5.15rem !important;
  align-items: center !important;
}
/* Mobile logo alignment */

/* FINAL HEADER SYSTEM: consistent sticky nav across all pages */
.site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.15rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.045) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
/* Prevent fixed header from covering content */
#MainContent{
  padding-top: 5.15rem !important;
}
/* Header container rhythm */
.site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.15rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Logo slot */
.site-header__logo,
.site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 9.5rem !important;
  min-width: 0 !important;
  height: 5.15rem !important;
  min-height: 0 !important;
  line-height: 0 !important;
  transform: none !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
.site-header__logo-image{
  display: block !important;
  width: clamp(7.4rem, 8vw, 9.4rem) !important;
  height: auto !important;
  max-height: 3.55rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.18rem) !important;
}
/* HOME PAGE: hide only nav logo,
keep hero logo untouched */
.template-index .site-header__logo,
.template-index .site-header__logo-link{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Internal pages: logo visible */
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Nav centered consistently */
.site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  width: auto !important;
  margin: 0 !important;
}
.site-header__nav-link{
  position: relative !important;
  color: var(--color-ink) !important;
  font-size: 0.74rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
.site-header__nav-link::after{
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  bottom: -0.65rem !important;
  width: 0 !important;
  height: 1px !important;
  background: var(--color-gold) !important;
  transform: translateX(-50%) !important;
  transition: width 220ms ease !important;
}
.site-header__nav-link:hover{
  color: var(--color-blue) !important;
}
.site-header__nav-link:hover::after{
  width: 100% !important;
}
/* Actions/cart aligned consistently */
.site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.6rem !important;
  min-width: 0 !important;
}
.site-header__cart{
  position: relative !important;
  width: 2.55rem !important;
  height: 2.55rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.5rem 1.3rem rgba(18, 57, 93, 0.055) !important;
  transform: none !important;
}
.site-header__cart svg{
  width: 1.15rem !important;
  height: 1.15rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
.site-header__cart svg *{
  stroke: currentColor !important;
}
.site-header__cart-count{
  position: absolute !important;
  top: -0.35rem !important;
  right: -0.25rem !important;
  min-width: 1.1rem !important;
  height: 1.1rem !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0.3rem !important;
  border-radius: 999px !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
/* Cart empty state */
.site-header__cart-count:empty{
  display: none !important;
}
.template-index .site-header.is-scrolled .site-header__logo{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Mobile */

/* FINAL HEADER SPLIT:
   Homepage = floating hero nav,
no nav logo.
   Internal pages = fixed sticky header with logo.
*/

/* Homepage: restore smooth floating hero header */
.template-index .site-header{
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 60 !important;
  width: 100% !important;
  min-height: 5.15rem !important;
  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.template-index #MainContent{
  padding-top: 0 !important;
}
/* Homepage header container */
.template-index .site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.15rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Homepage: hide only nav logo; hero logo remains separate */
.template-index .site-header__logo,
.template-index .site-header__logo-link{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Homepage nav centered */
.template-index .site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  margin: 0 !important;
}
.template-index .site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.74rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
/* Homepage cart aligned to the same header row */
.template-index .site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}
.template-index .site-header__cart{
  position: relative !important;
  width: 2.55rem !important;
  height: 2.55rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.5rem 1.3rem rgba(18, 57, 93, 0.055) !important;
  transform: none !important;
}
.template-index .site-header__cart svg{
  width: 1.15rem !important;
  height: 1.15rem !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
.template-index .site-header__cart svg *{
  stroke: currentColor !important;
}
/* Internal pages: fixed header remains */
body:not(.template-index) .site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.15rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.045) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
body:not(.template-index) #MainContent{
  padding-top: 5.15rem !important;
}
/* Mobile homepage */

/* FINAL HOME HEADER RESET: restore original hero overlay behavior */
body.template-index .site-header{
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 70 !important;
  width: 100% !important;
  min-height: 4.75rem !important;
  height: 4.75rem !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Homepage content must not be pushed down by fixed-header padding */
body.template-index #MainContent{
  padding-top: 0 !important;
}
/* Homepage header row: overlay on top of hero */
body.template-index .site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 4.75rem !important;
  height: 4.75rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(7rem, 12rem) minmax(0, 1fr) minmax(5rem, 12rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Homepage: no logo in top nav */
body.template-index .site-header__logo,
body.template-index .site-header__logo-link{
  display: flex !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  position: static !important;
  transform: none !important;
  height: 4.75rem !important;
}
/* Homepage nav: centered,
clean,
no jumping */
body.template-index .site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.7rem, 3vw, 3.25rem) !important;
  width: auto !important;
  margin: 0 !important;
  transform: none !important;
}
body.template-index .site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 1 !important;
}
/* Homepage cart: aligned to same row,
no floating drift */
body.template-index .site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  transform: none !important;
}
body.template-index .site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.06) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
  transform: none !important;
}
body.template-index .site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
body.template-index .site-header__cart svg *{
  stroke: currentColor !important;
}
body.template-index .site-header__cart-count{
  position: absolute !important;
  top: -0.32rem !important;
  right: -0.24rem !important;
  min-width: 1.05rem !important;
  height: 1.05rem !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0.28rem !important;
  border-radius: 999px !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.6rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
body.template-index .site-header.is-scrolled{
  position: absolute !important;
  top: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.template-index .site-header.is-scrolled .site-header__logo{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Mobile homepage */

/* FINAL HEADER CONTRACT
   Home: fixed nav over hero,
logo hidden,
no hero push-down.
   Internal/PDP: fixed nav,
logo visible,
content pushed down.
*/

/* Global fixed header */
.site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
/* Internal pages need room for fixed header */
body:not(.template-index) #MainContent{
  padding-top: 5.05rem !important;
}
/* Home hero should stay behind fixed nav */
body.template-index #MainContent{
  padding-top: 0 !important;
}
/* Header container */
.site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Logo slot */
.site-header__logo,
.site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 9.4rem !important;
  min-width: 0 !important;
  height: 5.05rem !important;
  min-height: 0 !important;
  line-height: 0 !important;
  transform: none !important;
  overflow: visible !important;
}
.site-header__logo-image{
  display: block !important;
  width: clamp(7.3rem, 8vw, 9.3rem) !important;
  height: auto !important;
  max-height: 3.45rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.16rem) !important;
}
/* Home: hide nav logo only */
body.template-index .site-header__logo,
body.template-index .site-header__logo-link{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Internal: show nav logo */
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Nav */
.site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  width: auto !important;
  margin: 0 !important;
  transform: none !important;
}
.site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.73rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 1 !important;
}
/* Actions/cart */
.site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  transform: none !important;
}
.site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
  transform: none !important;
}
.site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
.site-header__cart svg *{
  stroke: currentColor !important;
}
.site-header__cart-count{
  position: absolute !important;
  top: -0.32rem !important;
  right: -0.24rem !important;
  min-width: 1.05rem !important;
  height: 1.05rem !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 0.28rem !important;
  border-radius: 999px !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  font-size: 0.6rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
/* Kill old scroll-state visual changes */
.site-header.is-scrolled{
  position: fixed !important;
  top: 0 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
}
/* Home remains logo-hidden even if old classes somehow exist */
body.template-index .site-header.is-scrolled .site-header__logo{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Mobile */

/* FINAL FINAL: homepage top nav must remain fixed while scrolling */
body.template-index .site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
/* Homepage hero must not be pushed down */
body.template-index #MainContent{
  padding-top: 0 !important;
}
/* Homepage: consistent row alignment */
body.template-index .site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Homepage: hide nav logo,
but keep the grid slot */
body.template-index .site-header__logo,
body.template-index .site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-self: start !important;
  height: 5.05rem !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
}
/* Homepage nav centered */
body.template-index .site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  margin: 0 !important;
  transform: none !important;
}
body.template-index .site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.73rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
/* Homepage cart aligned */
body.template-index .site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  transform: none !important;
}
body.template-index .site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
  transform: none !important;
}
body.template-index .site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
body.template-index .site-header__cart svg *{
  stroke: currentColor !important;
}
/* Mobile homepage fixed nav */

/* FINAL OVERRIDE: homepage floating header,
sticky only after scroll */

/* Home top state: floating menu over hero */
body.template-index .site-header:not(.is-scrolled){
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 80 !important;
  width: 100% !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  background: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Home scrolled state: sticky/fixed premium nav */
body.template-index .site-header.is-scrolled{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
/* Home hero should not be pushed down */
body.template-index #MainContent{
  padding-top: 0 !important;
}
/* Home header row: same alignment in both states */
body.template-index .site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Home: hide nav logo always */
body.template-index .site-header__logo,
body.template-index .site-header__logo-link,
body.template-index .site-header.is-scrolled .site-header__logo,
body.template-index .site-header.is-scrolled .site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-self: start !important;
  height: 5.05rem !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: none !important;
}
/* Home nav: stable centered menu */
body.template-index .site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  margin: 0 !important;
  transform: none !important;
}
body.template-index .site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.73rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
/* Home cart: aligned in floating and sticky state */
body.template-index .site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  transform: none !important;
}
body.template-index .site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
  transform: none !important;
}
body.template-index .site-header.is-scrolled .site-header__cart{
  background: rgba(255, 255, 255, 0.92) !important;
}
body.template-index .site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
body.template-index .site-header__cart svg *{
  stroke: currentColor !important;
}
/* Internal/PDP pages: fixed header from start */
body:not(.template-index) .site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
body:not(.template-index) #MainContent{
  padding-top: 5.05rem !important;
}
/* Mobile home */

/* FINAL HEADER BEHAVIOR
   - Homepage floating_no_logo: transparent floating menu,
then slide-down sticky on scroll.
   - Homepage default + internal pages: fixed header with logo.
*/

/* Base fixed header for internal pages and default homepage */
.site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  transform: translateY(0) !important;
  transition:
    transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
    background 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease !important;
}
/* Internal/default pages need space for fixed header */
body:not(.template-index) #MainContent,
body.template-index .site-header ~ #MainContent{
  padding-top: 5.05rem !important;
}
/* Header row */
.site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Logo */
.site-header__logo,
.site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 9.4rem !important;
  min-width: 0 !important;
  height: 5.05rem !important;
  min-height: 0 !important;
  line-height: 0 !important;
  transform: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.site-header__logo-image{
  display: block !important;
  width: clamp(7.3rem, 8vw, 9.3rem) !important;
  height: auto !important;
  max-height: 3.45rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.16rem) !important;
}
/* Nav */
.site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  width: auto !important;
  margin: 0 !important;
  transform: none !important;
}
.site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.73rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  opacity: 1 !important;
}
/* Actions/cart */
.site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  transform: none !important;
}
.site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
  transform: none !important;
}
.site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
.site-header__cart svg *{
  stroke: currentColor !important;
}
/* If homepage header style is Default with logo,
behave like PDP/internal */
body.template-index .site-header{
  position: fixed !important;
  top: 0 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

@keyframes themeblocks-skincareHeaderSlideDown {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Mobile */

/* TRUE FINAL HEADER MODE
   data-transparent-hero="true" = homepage transparent hero + sticky nav on scroll.
   Everything else = sticky header with logo.
*/

/* Default behavior: fixed sticky header */
.site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  height: 5.05rem !important;
  min-height: 5.05rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  transform: translateY(0) !important;
  transition:
    transform 340ms cubic-bezier(0.22, 1, 0.36, 1),
    background 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease !important;
}
/* Internal/default pages need offset */
body:not(.template-index) #MainContent{
  padding-top: 5.05rem !important;
}
/* Homepage transparent hero mode should not push hero down */
body.template-index .site-header[data-transparent-hero="true"] ~ #MainContent{
  padding-top: 0 !important;
}
/* Homepage default sticky-header mode should push content down */
body.template-index .site-header[data-transparent-hero="false"] ~ #MainContent{
  padding-top: 5.05rem !important;
}
/* Header layout */
.site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  height: 5.05rem !important;
  min-height: 5.05rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
.site-header__logo,
.site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 9.4rem !important;
  height: 5.05rem !important;
  min-height: 0 !important;
  line-height: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.site-header__logo-image{
  display: block !important;
  width: clamp(7.3rem, 8vw, 9.3rem) !important;
  height: auto !important;
  max-height: 3.45rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.16rem) !important;
}
/* Transparent hero mode: hide nav logo always */
body.template-index .site-header[data-transparent-hero="true"] .site-header__logo,
body.template-index .site-header[data-transparent-hero="true"] .site-header__logo-link{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Transparent hero top state */
body.template-index .site-header[data-transparent-hero="true"]:not(.is-scrolled){
  position: absolute !important;
  top: 0 !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Transparent hero scrolled state: slide down sticky nav */
body.template-index .site-header[data-transparent-hero="true"].is-scrolled{
  position: fixed !important;
  top: 0 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  animation: themeblocks-skincareHeaderDrop 340ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}

@keyframes themeblocks-skincareHeaderDrop {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Nav */
.site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  width: auto !important;
  margin: 0 !important;
}
.site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.73rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
/* Actions/cart */
.site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
}
.site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
}
body.template-index .site-header[data-transparent-hero="true"]:not(.is-scrolled) .site-header__cart{
  background: rgba(255, 255, 255, 0.72) !important;
}
.site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
.site-header__cart svg *{
  stroke: currentColor !important;
}
/* Mobile */

/* TRUE FINAL HEADER MODE
   data-transparent-hero="true" = homepage transparent hero + sticky nav on scroll.
   Everything else = sticky header with logo.
*/

/* Default behavior: fixed sticky header */
.site-header{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  width: 100% !important;
  height: 5.05rem !important;
  min-height: 5.05rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  transform: translateY(0) !important;
  transition:
    transform 340ms cubic-bezier(0.22, 1, 0.36, 1),
    background 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease !important;
}
/* Internal/default pages need offset */
body:not(.template-index) #MainContent{
  padding-top: 5.05rem !important;
}
/* Homepage transparent hero mode should not push hero down */
body.template-index .site-header[data-transparent-hero="true"] ~ #MainContent{
  padding-top: 0 !important;
}
/* Homepage default sticky-header mode should push content down */
body.template-index .site-header[data-transparent-hero="false"] ~ #MainContent{
  padding-top: 5.05rem !important;
}
/* Header layout */
.site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  height: 5.05rem !important;
  min-height: 5.05rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
.site-header__logo,
.site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 9.4rem !important;
  height: 5.05rem !important;
  min-height: 0 !important;
  line-height: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.site-header__logo-image{
  display: block !important;
  width: clamp(7.3rem, 8vw, 9.3rem) !important;
  height: auto !important;
  max-height: 3.45rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.16rem) !important;
}
/* Transparent hero mode: hide nav logo always */
body.template-index .site-header[data-transparent-hero="true"] .site-header__logo,
body.template-index .site-header[data-transparent-hero="true"] .site-header__logo-link{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Transparent hero top state */
body.template-index .site-header[data-transparent-hero="true"]:not(.is-scrolled){
  position: absolute !important;
  top: 0 !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Transparent hero scrolled state: slide down sticky nav */
body.template-index .site-header[data-transparent-hero="true"].is-scrolled{
  position: fixed !important;
  top: 0 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  animation: themeblocks-skincareHeaderDrop 340ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}

@keyframes themeblocks-skincareHeaderDrop {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Nav */
.site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  width: auto !important;
  margin: 0 !important;
}
.site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.73rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
/* Actions/cart */
.site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
}
.site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
}
body.template-index .site-header[data-transparent-hero="true"]:not(.is-scrolled) .site-header__cart{
  background: rgba(255, 255, 255, 0.72) !important;
}
.site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
.site-header__cart svg *{
  stroke: currentColor !important;
}
/* Mobile */

/* =========================================================
   FINAL HEADER CONTRACT
   static = normal flow
   sticky = fixed across all pages
   transparent_hero_sticky = homepage floating transparent,
sticky reveal on scroll
   ========================================================= */

/* Shared header layout */
.site-header{
  width: 100% !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  z-index: 9999 !important;
}
.site-header__inner{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width)) !important;
  max-width: var(--page-width) !important;
  min-height: 5.05rem !important;
  height: 5.05rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(9rem, 13rem) minmax(0, 1fr) minmax(7rem, 13rem) !important;
  align-items: center !important;
  gap: clamp(1rem, 2vw, 2rem) !important;
}
/* Shared logo */
.site-header__logo,
.site-header__logo-link{
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 9.4rem !important;
  height: 5.05rem !important;
  min-height: 0 !important;
  line-height: 0 !important;
  transform: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.site-header__logo-image{
  display: block !important;
  width: clamp(7.3rem, 8vw, 9.3rem) !important;
  height: auto !important;
  max-height: 3.45rem !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: translateY(0.16rem) !important;
}
/* Shared nav */
.site-header__nav{
  justify-self: center !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(1.8rem, 3vw, 3.3rem) !important;
  width: auto !important;
  margin: 0 !important;
}
.site-header__nav-link{
  color: var(--color-ink) !important;
  font-size: 0.73rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
/* Shared actions/cart */
.site-header__actions{
  justify-self: end !important;
  align-self: center !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.55rem !important;
  margin: 0 !important;
}
.site-header__cart{
  position: relative !important;
  width: 2.45rem !important;
  height: 2.45rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--color-ink) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.05) !important;
}
.site-header__cart svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
  display: block !important;
  color: var(--color-ink) !important;
  stroke: currentColor !important;
  fill: none !important;
}
.site-header__cart svg *{
  stroke: currentColor !important;
}
/* Mode 1: static header */
.site-header--static{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.site-header--static ~ #MainContent{
  padding-top: 0 !important;
}
/* Mode 2: sticky header */
.site-header--sticky{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
.site-header--sticky ~ #MainContent{
  padding-top: 5.05rem !important;
}
/* Mode 3: transparent hero + sticky reveal */

/* Internal pages using transparent_hero_sticky should behave as sticky */
body:not(.template-index) .site-header--transparent_hero_sticky{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
body:not(.template-index) .site-header--transparent_hero_sticky ~ #MainContent{
  padding-top: 5.05rem !important;
}
/* Homepage transparent hero top state */
body.template-index .site-header--transparent_hero_sticky:not(.is-scrolled){
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.template-index .site-header--transparent_hero_sticky ~ #MainContent{
  padding-top: 0 !important;
}
/* Hide nav logo only in homepage transparent hero mode */
body.template-index .site-header--transparent_hero_sticky .site-header__logo,
body.template-index .site-header--transparent_hero_sticky .site-header__logo-link{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Homepage sticky reveal after 10% scroll */
body.template-index .site-header--transparent_hero_sticky.is-scrolled{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  animation: themeblocks-skincareHeaderReveal 360ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}
body.template-index .site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__cart{
  background: rgba(255, 255, 255, 0.72) !important;
}

@keyframes themeblocks-skincareHeaderReveal {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Mobile */

/* FINAL FIX: Default static header must never be sticky/fixed */
.site-header.site-header--static,
body .site-header.site-header--static,
body.template-index .site-header.site-header--static,
body:not(.template-index) .site-header.site-header--static{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 50 !important;
  width: 100% !important;
  transform: none !important;
  animation: none !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Static header should not reserve fixed-header spacing */
.site-header.site-header--static ~ #MainContent,
body .site-header.site-header--static ~ #MainContent,
body.template-index .site-header.site-header--static ~ #MainContent,
body:not(.template-index) .site-header.site-header--static ~ #MainContent{
  padding-top: 0 !important;
}
/* Even if JS adds is-scrolled,
static mode stays static */
.site-header.site-header--static.is-scrolled{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  animation: none !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: none !important;
}
/* Static homepage should show logo if selected as default static */
body.template-index .site-header.site-header--static .site-header__logo,
body.template-index .site-header.site-header--static .site-header__logo-link{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* FINAL FIX: transparent hero top state must not show nav logo */
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo,
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo-link,
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo-image{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Sticky reveal state: logo appears in nav */
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo-link,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Static and sticky modes are not affected */
body.template-index .site-header.site-header--static .site-header__logo,
body.template-index .site-header.site-header--static .site-header__logo-link,
body.template-index .site-header.site-header--static .site-header__logo-image,
body.template-index .site-header.site-header--sticky .site-header__logo,
body.template-index .site-header.site-header--sticky .site-header__logo-link,
body.template-index .site-header.site-header--sticky .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* FINAL POLISH: transparent hero sticky reveal animation */
body.template-index .site-header.site-header--transparent_hero_sticky{
  transition:
    background 260ms ease,
    border-color 260ms ease,
    box-shadow 320ms ease,
    backdrop-filter 260ms ease,
    -webkit-backdrop-filter 260ms ease !important;
  will-change: transform, opacity, background, box-shadow !important;
}
/* Top transparent state stays clean and calm */
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled){
  opacity: 1 !important;
  transform: translateY(0) !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Scrolled reveal: premium slide from top */
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  background: rgba(255, 255, 255, 0.955) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow:
    0 0.7rem 2.2rem rgba(18, 57, 93, 0.045),
    0 1px 0 rgba(255, 255, 255, 0.55) inset !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
  animation: themeblocks-skincareStickyRevealClean 520ms cubic-bezier(0.19, 1, 0.22, 1) both !important;
}
/* Logo/nav/cart settle in subtly after bar reveals */
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__nav,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__actions{
  animation: themeblocks-skincareStickyContentSettle 620ms cubic-bezier(0.19, 1, 0.22, 1) both !important;
}
/* Keep top state logo hidden until reveal */
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo,
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo-link,
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo-image{
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Reveal logo cleanly on sticky state */
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo-link,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

@keyframes themeblocks-skincareStickyRevealClean {
  0% {
    opacity: 0;
    transform: translate3d(0, -112%, 0);
  }

  55% {
    opacity: 1;
    transform: translate3d(0, 2px, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes themeblocks-skincareStickyContentSettle {
  0% {
    opacity: 0;
    transform: translate3d(0, -0.55rem, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__logo,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__nav,
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled .site-header__actions{
    animation: none !important;
  }
}
/* Sticky header mode must keep the nav logo visible */
body.template-index .site-header--sticky .site-header__logo,
body.template-index .site-header--sticky .site-header__logo-link,
body.template-index .site-header--sticky .site-header__logo-image{
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* =========================================================
   FINAL SIMPLIFIED HEADER + HOMEPAGE HERO LOGO CONTRACT
   - static: not sticky
   - sticky: sticky/fixed across pages
   - transparent_hero_sticky: homepage floats,
then sticky reveal
   - homepage_logo_inside_hero: controls hero logo only
   ========================================================= */

/* Header modes */
.site-header.site-header--static{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  animation: none !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.site-header.site-header--static ~ #MainContent{
  padding-top: 0 !important;
}
.site-header.site-header--sticky{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
.site-header.site-header--sticky ~ #MainContent{
  padding-top: 5.05rem !important;
}
/* Transparent hero mode: internal pages act sticky */
body:not(.template-index) .site-header.site-header--transparent_hero_sticky{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 0.7rem 2.2rem rgba(18, 57, 93, 0.04) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
body:not(.template-index) .site-header.site-header--transparent_hero_sticky ~ #MainContent{
  padding-top: 5.05rem !important;
}
/* Transparent hero mode: homepage top state */
body.template-index .site-header.site-header--transparent_hero_sticky:not(.is-scrolled){
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 80 !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body.template-index .site-header.site-header--transparent_hero_sticky ~ #MainContent{
  padding-top: 0 !important;
}
/* Transparent hero mode: homepage sticky reveal */
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9999 !important;
  background: rgba(255, 255, 255, 0.955) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow:
    0 0.7rem 2.2rem rgba(18, 57, 93, 0.045),
    0 1px 0 rgba(255, 255, 255, 0.55) inset !important;
  backdrop-filter: blur(18px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.08) !important;
  animation: themeblocks-skincareStickyRevealClean 520ms cubic-bezier(0.19, 1, 0.22, 1) both !important;
}
/* Nav logo is always visible in nav for sticky/reveal/default except static normal rules */
.site-header .site-header__logo,
.site-header .site-header__logo-link,
.site-header .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Animation */
@keyframes themeblocks-skincareStickyRevealClean{
  0% {
    opacity: 0;
    transform: translate3d(0, -112%, 0);
  }

  55% {
    opacity: 1;
    transform: translate3d(0, 2px, 0);
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
/* Mobile offsets */

/* FINAL SIMPLIFICATION: homepage hero logo checkbox applies to all header styles */

/* Header/nav logo should remain visible for all header styles */
.site-header .site-header__logo,
.site-header .site-header__logo-link,
.site-header .site-header__logo-image,
body.template-index .site-header .site-header__logo,
body.template-index .site-header .site-header__logo-link,
body.template-index .site-header .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Transparent hero top state still keeps header logo visible now;
   the checkbox controls only the hero/banner logo,
not nav logo. */
body.template-index .site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo,
body.template-index .site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo-link,
body.template-index .site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Internal pages always show nav logo,
regardless of homepage hero logo setting */
body:not(.template-index) .site-header .site-header__logo,
body:not(.template-index) .site-header .site-header__logo-link,
body:not(.template-index) .site-header .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* FINAL LOGO RULE BACKUP
   JS is the source of truth. This CSS is only backup.
*/

/* Header/nav logo is always visible */
.site-header .site-header__logo,
.site-header .site-header__logo-link,
.site-header .site-header__logo-image,
body.template-index .site-header .site-header__logo,
body.template-index .site-header .site-header__logo-link,
body.template-index .site-header .site-header__logo-image,
body:not(.template-index) .site-header .site-header__logo,
body:not(.template-index) .site-header .site-header__logo-link,
body:not(.template-index) .site-header .site-header__logo-image{
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* FINAL FIX: static header must not create fixed-header whitespace */
.site-header.site-header--static,
body .site-header.site-header--static,
body.template-index .site-header.site-header--static,
body:not(.template-index) .site-header.site-header--static{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  height: auto !important;
  min-height: 5.05rem !important;
  transform: none !important;
  animation: none !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Static header content should sit naturally */
.site-header.site-header--static .site-header__inner{
  min-height: 5.05rem !important;
  height: 5.05rem !important;
}
/* Static mode: no top padding on main content */
.site-header.site-header--static ~ #MainContent,
body .site-header.site-header--static ~ #MainContent,
body.template-index .site-header.site-header--static ~ #MainContent,
body:not(.template-index) .site-header.site-header--static ~ #MainContent{
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/* Static mode: kill old internal page offsets */
body:not(.template-index):has(.site-header.site-header--static) #MainContent,
body.template-index:has(.site-header.site-header--static) #MainContent{
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/* Static mode: first section should start immediately after header */
.site-header.site-header--static ~ #MainContent > .shopify-section:first-child,
.site-header.site-header--static ~ #MainContent > section:first-child{
  margin-top: 0 !important;
}
/* Internal pages always show nav logo */
body:not(.template-index) .site-header .site-header__logo,
body:not(.template-index) .site-header .site-header__logo-link,
body:not(.template-index) .site-header .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
body:not(.template-index) .site-header__logo,
body:not(.template-index) .site-header__logo-link,
body:not(.template-index) .site-header__logo-image{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* FINAL FIX: Header icon color option */
.site-header.site-header--icons-dark{
  --header-icon-color: var(--color-ink);
  --header-nav-color: var(--color-ink);
}
.site-header.site-header--icons-light{
  --header-icon-color: #ffffff;
  --header-nav-color: #ffffff;
}
/* Make header icon color option actually win */
.site-header.site-header--icons-dark .site-header__cart,
.site-header.site-header--icons-dark .site-header__cart svg,
.site-header.site-header--icons-dark .site-header__cart svg *,
.site-header.site-header--icons-dark .site-header__actions,
.site-header.site-header--icons-dark .site-header__actions svg,
.site-header.site-header--icons-dark .site-header__actions svg *{
  color: var(--color-ink) !important;
  stroke: var(--color-ink) !important;
}
.site-header.site-header--icons-light .site-header__cart,
.site-header.site-header--icons-light .site-header__cart svg,
.site-header.site-header--icons-light .site-header__cart svg *,
.site-header.site-header--icons-light .site-header__actions,
.site-header.site-header--icons-light .site-header__actions svg,
.site-header.site-header--icons-light .site-header__actions svg *{
  color: #ffffff !important;
  stroke: #ffffff !important;
}
/* Optional: make nav links follow the same setting */
.site-header.site-header--icons-dark .site-header__nav-link{
  color: var(--color-ink) !important;
}
.site-header.site-header--icons-light .site-header__nav-link{
  color: #ffffff !important;
}
/* Keep sticky/revealed white header readable.
   Once sticky reveal is active,
force dark icons/nav regardless of light option. */
.site-header.is-scrolled .site-header__cart,
.site-header.is-scrolled .site-header__cart svg,
.site-header.is-scrolled .site-header__cart svg *,
.site-header.is-scrolled .site-header__actions,
.site-header.is-scrolled .site-header__actions svg,
.site-header.is-scrolled .site-header__actions svg *,
.site-header.is-scrolled .site-header__nav-link,
.site-header.site-header--sticky .site-header__cart,
.site-header.site-header--sticky .site-header__cart svg,
.site-header.site-header--sticky .site-header__cart svg *,
.site-header.site-header--sticky .site-header__nav-link,
body:not(.template-index) .site-header .site-header__cart,
body:not(.template-index) .site-header .site-header__cart svg,
body:not(.template-index) .site-header .site-header__cart svg *,
body:not(.template-index) .site-header .site-header__nav-link{
  color: var(--color-ink) !important;
  stroke: var(--color-ink) !important;
}
/* Light icon mode needs lighter cart button background on transparent hero top state */
body.template-index .site-header.site-header--icons-light.site-header--transparent_hero_sticky:not(.is-scrolled) .site-header__cart{
  background: rgba(18, 57, 93, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.38) !important;
  box-shadow: 0 0.45rem 1.2rem rgba(18, 57, 93, 0.08) !important;
}
/* Header reveal animation polish */
.site-header__logo,
.site-header__nav-link,
.site-header__actions{
  will-change: transform, opacity, filter;
}
.site-header__nav-link{
  transform-origin: center;
}
/* Keep nav interactions crisp after Anime.js reveal */
.site-header__nav-link:hover{
  transform: translateY(-1px);
}
/* Reduced motion safety */
@media (prefers-reduced-motion: reduce){
  .site-header__logo,
  .site-header__nav-link,
  .site-header__actions {
    transition: none !important;
    animation: none !important;
    transform: none !important;
    filter: none !important;
  }
}
/* Header Anime.js reveal support */
.site-header,
.site-header__logo,
.site-header__nav-link,
.site-header__actions{
  will-change: transform, opacity, filter;
}
/* Do not run duplicate CSS keyframe reveal when Anime.js is controlling it */
body.template-index .site-header.site-header--transparent_hero_sticky.is-scrolled{
  animation: none !important;
}

@media (prefers-reduced-motion: reduce) {
.site-header,
.site-header__logo,
.site-header__nav-link,
.site-header__actions{
    animation: none !important;
    transition: none !important;
    transform: none !important;
    filter: none !important;
  }
}
/* Home product cards: Judge.me rating alignment */
.themeblocks-skincare-product-card__judgeme,
.product-card__judgeme,
[data-themeblocks-skincare-judgeme-card]{
  min-height: 1.6rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.35rem !important;
  color: var(--color-ink) !important;
  line-height: 1 !important;
}
/* Judge.me preview badge normalization inside cards */
[data-themeblocks-skincare-judgeme-card] .jdgm-prev-badge{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  line-height: 1 !important;
}
[data-themeblocks-skincare-judgeme-card] .jdgm-prev-badge__stars{
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
}
[data-themeblocks-skincare-judgeme-card] .jdgm-star,
[data-themeblocks-skincare-judgeme-card] .jdgm-star:before,
[data-themeblocks-skincare-judgeme-card] .jdgm-prev-badge__stars .jdgm-star,
[data-themeblocks-skincare-judgeme-card] .jdgm-prev-badge__stars .jdgm-star:before{
  color: #c9a227 !important;
  font-size: 0.9rem !important;
  line-height: 1 !important;
}
[data-themeblocks-skincare-judgeme-card] .jdgm-prev-badge__text{
  color: rgba(18, 57, 93, 0.72) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
/* Hide ugly "No reviews" text if Judge.me renders it too long */
[data-themeblocks-skincare-judgeme-card] .jdgm-prev-badge[data-number-of-reviews="0"] .jdgm-prev-badge__text{
  font-size: 0.78rem !important;
  opacity: 0.72 !important;
}
/* Fallback if Judge.me metafield is unavailable */
.themeblocks-skincare-product-card__rating-fallback{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  color: rgba(18, 57, 93, 0.72) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
}
.themeblocks-skincare-product-card__rating-star{
  color: #c9a227 !important;
}
/* Bestseller cards: real Judge.me rating data */
.bestseller-card__rating--judgeme{
  min-height: 2.1rem !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.42rem !important;
  color: var(--color-ink) !important;
  font-size: 0.92rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}
.bestseller-card__stars{
  position: relative !important;
  display: inline-block !important;
  width: 4.65rem !important;
  height: 1rem !important;
  line-height: 1 !important;
  letter-spacing: 0.045em !important;
  color: rgba(201, 162, 39, 0.22) !important;
  overflow: hidden !important;
  flex: 0 0 auto !important;
}
.bestseller-card__stars-base,
.bestseller-card__stars-fill{
  display: block !important;
  font-size: 0.88rem !important;
  line-height: 1 !important;
  letter-spacing: 0.045em !important;
  white-space: nowrap !important;
}
.bestseller-card__stars-fill{
  position: absolute !important;
  inset: 0 auto auto 0 !important;
  width: 0;
  color: #c9a227 !important;
  overflow: hidden !important;
}
.bestseller-card__stars--empty{
  color: rgba(201, 162, 39, 0.28) !important;
}
.bestseller-card__review-count{
  color: rgba(18, 57, 93, 0.74) !important;
  font-size: 0.84rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
/* FINAL FIX: ensure cart page section is visible */
.cart-page,
.cart-page__container,
.cart-page__form,
.cart-page__layout,
.cart-page__items,
.cart-summary,
.cart-empty{
  display: block;
  opacity: 1;
  visibility: visible;
}
.cart-page{
  min-height: 42rem;
  padding: clamp(4rem, 7vw, 7rem) 0;
  background:
    radial-gradient(circle at 8% 12%, rgba(142, 205, 224, 0.18), transparent 34rem),
    radial-gradient(circle at 94% 16%, rgba(201, 162, 39, 0.11), transparent 30rem),
    #ffffff;
}
.cart-page__container{
  width: min(calc(100% - (var(--site-gutter) * 2)), var(--page-width));
  margin: 0 auto;
}
.cart-page__header{
  max-width: 46rem;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.cart-page__eyebrow,
.cart-summary__eyebrow{
  margin: 0 0 0.75rem;
  color: var(--color-blue);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.cart-page__heading{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading-family);
  font-size: clamp(3.4rem, 7vw, 6.75rem);
  font-weight: 500;
  letter-spacing: -0.06em;
  line-height: 0.92;
}
.cart-page__subheading{
  max-width: 34rem;
  margin: 1.15rem 0 0;
  color: rgba(18, 57, 93, 0.72);
  font-size: 1.05rem;
  line-height: 1.7;
}
.cart-page__layout{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(20rem, 26rem);
  gap: clamp(1.4rem, 3vw, 2.5rem);
  align-items: start;
}
.cart-page__items,
.cart-summary__card,
.cart-empty{
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 2rem;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 1.8rem 5rem rgba(18, 57, 93, 0.075);
}
.cart-page__items{
  padding: clamp(1rem, 2vw, 1.5rem);
}
.cart-item{
  display: grid !important;
  grid-template-columns: 9.5rem minmax(0, 1fr) auto;
  gap: clamp(1rem, 2vw, 1.45rem);
  align-items: center;
  padding: clamp(1rem, 2vw, 1.35rem) 0;
  border-top: 1px solid rgba(18, 57, 93, 0.08);
}
.cart-item:first-child{
  border-top: 0;
}
.cart-item__media{
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.45rem;
  background: #ffffff;
  overflow: hidden;
}
.cart-item__image{
  width: 82%;
  height: 82%;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.cart-item__vendor{
  margin: 0 0 0.35rem;
  color: var(--color-blue);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.cart-item__title{
  color: var(--color-ink);
  font-size: clamp(1.05rem, 1.45vw, 1.25rem);
  font-weight: 900;
  line-height: 1.2;
  text-decoration: none;
}
.cart-item__variant,
.cart-item__unit-price{
  margin: 0.4rem 0 0;
  color: rgba(18, 57, 93, 0.62);
  font-size: 0.9rem;
}
.cart-item__controls{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 1rem;
}
.cart-item__quantity{
  display: inline-grid !important;
  grid-template-columns: 2.55rem 3rem 2.55rem;
  align-items: center;
  height: 2.75rem;
  border: 1px solid rgba(18, 57, 93, 0.14);
  border-radius: 999px;
  background: #ffffff;
  overflow: hidden;
}
.cart-item__quantity-button{
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  color: var(--color-ink);
  cursor: pointer;
  font-size: 1.25rem;
  font-weight: 900;
}
.cart-item__quantity-input{
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 900;
  text-align: center;
}
.cart-item__remove{
  color: rgba(18, 57, 93, 0.58);
  font-size: 0.82rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-decoration: none;
  text-transform: uppercase;
}
.cart-item__total{
  min-width: 7rem;
  color: var(--color-ink);
  font-size: 1.05rem;
  font-weight: 900;
  text-align: right;
}
.cart-summary{
  position: sticky;
  top: calc(5.05rem + 1.25rem);
}
.cart-summary__card{
  padding: clamp(1.35rem, 2.5vw, 1.85rem);
}
.cart-summary__heading{
  margin: 0 0 1.5rem;
  color: var(--color-ink);
  font-family: var(--font-heading-family);
  font-size: clamp(2.1rem, 3vw, 3rem);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1;
}
.cart-summary__row,
.cart-summary__total{
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.8rem 0;
  border-top: 1px solid rgba(18, 57, 93, 0.08);
  color: rgba(18, 57, 93, 0.72);
}
.cart-summary__row strong,
.cart-summary__total strong{
  color: var(--color-ink);
}
.cart-summary__total{
  align-items: baseline;
  color: var(--color-ink);
  font-size: 1.15rem;
  font-weight: 900;
}
.cart-summary__total strong{
  font-size: 1.65rem;
}
.cart-summary__note{
  margin: 1rem 0 1.25rem;
  color: rgba(18, 57, 93, 0.62);
  font-size: 0.88rem;
  line-height: 1.6;
}
.cart-summary__checkout,
.cart-summary__update,
.cart-empty__button{
  width: 100%;
  min-height: 3.25rem;
  border-radius: 999px;
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 950;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
.cart-summary__checkout,
.cart-empty__button{
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--color-blue);
  background: var(--color-blue);
  color: #ffffff;
  box-shadow: 0 1rem 2rem rgba(31, 111, 174, 0.18);
  text-decoration: none;
}
.cart-summary__update{
  margin-top: 0.75rem;
  border: 1px solid rgba(18, 57, 93, 0.14);
  background: #ffffff;
  color: var(--color-ink);
}
.cart-empty{
  max-width: 46rem;
  margin: 0 auto;
  padding: clamp(2.2rem, 5vw, 4rem);
  text-align: center;
}
.cart-empty h2{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading-family);
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-weight: 500;
  letter-spacing: -0.055em;
  line-height: 1;
}
.cart-empty p{
  max-width: 32rem;
  margin: 1rem auto 1.6rem;
  color: rgba(18, 57, 93, 0.68);
  font-size: 1rem;
  line-height: 1.7;
}
.cart-empty__button{
  width: auto;
  min-width: 13rem;
  padding: 0 1.65rem;
}

@media (max-width: 989px) {
.cart-page__layout{
    grid-template-columns: 1fr !important;
  }
.cart-summary{
    position: static;
  }
}

@media (max-width: 749px) {
.cart-item{
    grid-template-columns: 6.5rem minmax(0, 1fr) !important;
  }
.cart-item__total{
    grid-column: 2;
    text-align: left;
  }
}
/* =========================================================
   Cart page compact premium refinement
   ========================================================= */

.cart-page{
  min-height: auto !important;
  padding: clamp(2.8rem, 4.5vw, 4.8rem) 0 clamp(3.2rem, 5vw, 5rem) !important;
}
.cart-page__container{
  width: min(calc(100% - 3rem), 72rem) !important;
}
.cart-page__header{
  max-width: 38rem !important;
  margin-bottom: clamp(1.6rem, 2.8vw, 2.4rem) !important;
}
.cart-page__eyebrow{
  margin-bottom: 0.55rem !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.2em !important;
}
.cart-page__heading{
  font-size: clamp(3rem, 5.5vw, 5.2rem) !important;
  line-height: 0.94 !important;
}
.cart-page__subheading{
  max-width: 30rem !important;
  margin-top: 0.8rem !important;
  font-size: 0.98rem !important;
  line-height: 1.55 !important;
}
.cart-page__layout{
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem) !important;
  gap: clamp(1.2rem, 2.3vw, 2rem) !important;
}
.cart-page__items{
  padding: clamp(0.9rem, 1.6vw, 1.15rem) !important;
  border-radius: 1.55rem !important;
  background: rgba(255, 255, 255, 0.9) !important;
}
.cart-item{
  grid-template-columns: 6.8rem minmax(0, 1fr) 5.8rem !important;
  gap: clamp(0.9rem, 1.6vw, 1.25rem) !important;
  padding: 1rem 0 !important;
}
.cart-item__media{
  border-radius: 1.1rem !important;
}
.cart-item__image{
  width: 78% !important;
  height: 78% !important;
}
.cart-item__vendor{
  margin-bottom: 0.25rem !important;
  font-size: 0.66rem !important;
  letter-spacing: 0.14em !important;
}
.cart-item__title{
  font-size: clamp(1rem, 1.2vw, 1.12rem) !important;
  line-height: 1.18 !important;
}
.cart-item__variant,
.cart-item__unit-price{
  margin-top: 0.28rem !important;
  font-size: 0.84rem !important;
}
.cart-item__controls{
  margin-top: 0.75rem !important;
  gap: 0.65rem !important;
}
.cart-item__quantity{
  grid-template-columns: 2.15rem 2.45rem 2.15rem !important;
  height: 2.35rem !important;
}
.cart-item__quantity-button{
  font-size: 1.05rem !important;
}
.cart-item__quantity-input{
  font-size: 0.9rem !important;
}
.cart-item__remove{
  font-size: 0.72rem !important;
  letter-spacing: 0.1em !important;
}
.cart-item__total{
  min-width: 5.8rem !important;
  font-size: 1rem !important;
}
.cart-summary{
  top: calc(5.05rem + 1rem) !important;
}
.cart-summary__card{
  padding: 1.35rem !important;
  border-radius: 1.55rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
}
.cart-summary__eyebrow{
  margin-bottom: 0.55rem !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.18em !important;
}
.cart-summary__heading{
  margin-bottom: 1rem !important;
  font-size: clamp(1.65rem, 2.4vw, 2.25rem) !important;
}
.cart-summary__row,
.cart-summary__total{
  padding: 0.68rem 0 !important;
  font-size: 0.92rem !important;
}
.cart-summary__total strong{
  font-size: 1.35rem !important;
}
.cart-summary__note{
  margin: 0.75rem 0 1rem !important;
  font-size: 0.8rem !important;
  line-height: 1.45 !important;
}
.cart-summary__checkout,
.cart-summary__update{
  min-height: 2.85rem !important;
  font-size: 0.76rem !important;
  letter-spacing: 0.13em !important;
}
.cart-summary__update{
  margin-top: 0.6rem !important;
}

@media (max-width: 989px) {
.cart-page__container{
    width: min(calc(100% - 2rem), 42rem) !important;
  }
.cart-page__layout{
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 749px) {
.cart-page{
    padding: 2.3rem 0 3.5rem !important;
  }
.cart-page__container{
    width: min(calc(100% - 1.5rem), 36rem) !important;
  }
.cart-page__heading{
    font-size: clamp(2.65rem, 14vw, 4rem) !important;
  }
.cart-item{
    grid-template-columns: 5.6rem minmax(0, 1fr) !important;
    gap: 0.8rem !important;
    padding: 0.95rem 0 !important;
  }
.cart-item__total{
    grid-column: 2 !important;
    min-width: 0 !important;
    text-align: left !important;
    font-size: 0.95rem !important;
  }
.cart-item__quantity{
    grid-template-columns: 2rem 2.25rem 2rem !important;
    height: 2.25rem !important;
  }
}
/* Cart quantity: custom premium control,
no browser spinner */
.cart-item__actions{
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.9rem !important;
  margin-top: 0.85rem !important;
}
.cart-item__quantity{
  display: inline-grid !important;
  grid-template-columns: 2.35rem 2.65rem 2.35rem !important;
  align-items: center !important;
  height: 2.65rem !important;
  border: 1px solid rgba(18, 57, 93, 0.14) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  overflow: hidden !important;
  box-shadow:
    0 0.45rem 1.1rem rgba(18, 57, 93, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}
.cart-item__quantity-button{
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--color-ink) !important;
  cursor: pointer !important;
  font-size: 1.15rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  transition:
    background 180ms ease,
    color 180ms ease,
    transform 180ms ease !important;
}
.cart-item__quantity-button:hover{
  background: rgba(142, 205, 224, 0.16) !important;
  color: var(--color-blue) !important;
}
.cart-item__quantity-button:active{
  transform: scale(0.94) !important;
}
.cart-item__quantity-input{
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  border: 0 !important;
  border-inline: 1px solid rgba(18, 57, 93, 0.08) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--color-ink) !important;
  font-size: 0.96rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  appearance: textfield !important;
  -moz-appearance: textfield !important;
  box-shadow: none !important;
  outline: none !important;
}
/* Remove Chrome/Safari native number spinners */
.cart-item__quantity-input::-webkit-outer-spin-button,
.cart-item__quantity-input::-webkit-inner-spin-button{
  margin: 0 !important;
  -webkit-appearance: none !important;
}
.cart-item__quantity:focus-within{
  border-color: rgba(31, 111, 174, 0.52) !important;
  box-shadow:
    0 0 0 3px rgba(142, 205, 224, 0.22),
    0 0.45rem 1.1rem rgba(18, 57, 93, 0.045) !important;
}
.cart-item__remove{
  color: var(--color-blue) !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.1em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}
.cart-item__remove:hover{
  color: var(--color-ink) !important;
}

@media (max-width: 749px) {
.cart-item__quantity{
    grid-template-columns: 2.2rem 2.45rem 2.2rem !important;
    height: 2.45rem !important;
  }
.cart-item__actions{
    gap: 0.75rem !important;
  }
}
/* =========================================================
   CART FINAL RESTORE: stable premium 2-column layout
   ========================================================= */

.cart-page{
  min-height: auto !important;
  padding: clamp(3rem, 5vw, 5rem) 0 clamp(4rem, 6vw, 6rem) !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(142, 205, 224, 0.16), transparent 28rem),
    radial-gradient(circle at 92% 14%, rgba(201, 162, 39, 0.09), transparent 28rem),
    #f8fbfd !important;
}
.cart-page__container{
  width: min(calc(100% - 3rem), 76rem) !important;
  margin: 0 auto !important;
}
.cart-page__header{
  max-width: 36rem !important;
  margin: 0 0 clamp(1.8rem, 3vw, 2.5rem) !important;
}
.cart-page__eyebrow{
  margin: 0 0 0.55rem !important;
  color: var(--color-blue) !important;
  font-size: 0.76rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.22em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.cart-page__heading{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading-family) !important;
  font-size: clamp(3.2rem, 5.5vw, 5.35rem) !important;
  font-weight: 500 !important;
  letter-spacing: -0.06em !important;
  line-height: 0.94 !important;
}
.cart-page__layout{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(19rem, 22rem) !important;
  gap: clamp(1.6rem, 3vw, 2.4rem) !important;
  align-items: start !important;
}
.cart-page__items{
  display: block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.cart-item{
  display: grid !important;
  grid-template-columns: 7rem minmax(0, 1fr) 6.5rem !important;
  gap: 1.15rem !important;
  align-items: center !important;
  padding: 1.15rem 0 !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.11) !important;
}
.cart-item:first-child{
  padding-top: 0 !important;
}
.cart-item__media{
  display: grid !important;
  place-items: center !important;
  width: 7rem !important;
  height: 7rem !important;
  min-width: 7rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 1.15rem !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(142, 205, 224, 0.1), transparent 62%),
    #ffffff !important;
  overflow: hidden !important;
  box-shadow: 0 0.8rem 1.8rem rgba(18, 57, 93, 0.035) !important;
}
.cart-item__image{
  width: 78% !important;
  height: 78% !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
}
.cart-item__content{
  min-width: 0 !important;
}
.cart-item__title{
  display: inline-block !important;
  margin: 0 0 0.45rem !important;
  color: var(--color-ink) !important;
  font-size: clamp(1.12rem, 1.6vw, 1.42rem) !important;
  font-weight: 950 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.1 !important;
  text-decoration: none !important;
}
.cart-item__unit-price,
.cart-item__variant{
  margin: 0.28rem 0 0 !important;
  color: rgba(18, 57, 93, 0.78) !important;
  font-size: 0.92rem !important;
  line-height: 1.4 !important;
}
.cart-item__actions{
  display: flex !important;
  align-items: center !important;
  gap: 0.85rem !important;
  margin-top: 0.75rem !important;
}
.cart-item__quantity{
  display: inline-grid !important;
  grid-template-columns: 2.25rem 2.45rem 2.25rem !important;
  align-items: center !important;
  height: 2.45rem !important;
  border: 1px solid rgba(18, 57, 93, 0.14) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  overflow: hidden !important;
  box-shadow: 0 0.45rem 1.1rem rgba(18, 57, 93, 0.04) !important;
}
.cart-item__quantity-button{
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--color-ink) !important;
  cursor: pointer !important;
  font-size: 1.1rem !important;
  font-weight: 950 !important;
}
.cart-item__quantity-input{
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  border-inline: 1px solid rgba(18, 57, 93, 0.08) !important;
  background: transparent !important;
  color: var(--color-ink) !important;
  font-size: 0.95rem !important;
  font-weight: 950 !important;
  text-align: center !important;
  appearance: textfield !important;
  -moz-appearance: textfield !important;
  outline: none !important;
}
.cart-item__quantity-input::-webkit-outer-spin-button,
.cart-item__quantity-input::-webkit-inner-spin-button{
  margin: 0 !important;
  -webkit-appearance: none !important;
}
.cart-item__remove{
  color: var(--color-blue) !important;
  font-size: 0.74rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.12em !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}
.cart-item__total{
  justify-self: end !important;
  min-width: 6.5rem !important;
  color: var(--color-ink) !important;
  font-size: 1.18rem !important;
  font-weight: 950 !important;
  text-align: right !important;
}
.cart-summary{
  position: sticky !important;
  top: calc(5.05rem + 1.15rem) !important;
  align-self: start !important;
}
.cart-summary__card{
  width: 100% !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 1.55rem !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow:
    0 1.35rem 3rem rgba(18, 57, 93, 0.065),
    inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
  padding: 1.45rem !important;
}
.cart-summary__heading{
  margin: 0 0 1.1rem !important;
  color: var(--color-ink) !important;
  font-size: 1.35rem !important;
  font-weight: 950 !important;
  letter-spacing: -0.025em !important;
}
.cart-summary__row,
.cart-summary__total{
  display: flex !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding: 0.75rem 0 !important;
  border-top: 1px solid rgba(18, 57, 93, 0.08) !important;
  color: rgba(18, 57, 93, 0.78) !important;
  font-size: 0.92rem !important;
}
.cart-summary__row strong,
.cart-summary__total strong{
  color: var(--color-ink) !important;
  font-weight: 950 !important;
}
.cart-summary__total{
  color: var(--color-ink) !important;
  font-weight: 950 !important;
}
.cart-summary__total strong{
  font-size: 1.3rem !important;
}
.cart-summary__checkout,
.cart-summary__update{
  width: 100% !important;
  min-height: 2.95rem !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  font-size: 0.76rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}
.cart-summary__update{
  margin-top: 0.9rem !important;
  background: #ffffff !important;
  color: var(--color-ink) !important;
  border: 1px solid rgba(18, 57, 93, 0.18) !important;
}
.cart-summary__checkout{
  margin-top: 0.72rem !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
  border: 1px solid var(--color-blue) !important;
  box-shadow: 0 0.85rem 1.7rem rgba(31, 111, 174, 0.16) !important;
}
.cart-empty{
  max-width: 42rem !important;
  margin: 0 auto !important;
  padding: 2.5rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 1.55rem !important;
  background: #ffffff !important;
  text-align: center !important;
}

@media (max-width: 989px) {
.cart-page__container{
    width: min(calc(100% - 2rem), 44rem) !important;
  }
.cart-page__layout{
    grid-template-columns: 1fr !important;
  }
.cart-summary{
    position: static !important;
  }
}

@media (max-width: 749px) {
.cart-page{
    padding-top: 2.6rem !important;
  }
.cart-item{
    grid-template-columns: 5.75rem minmax(0, 1fr) !important;
    gap: 0.9rem !important;
  }
.cart-item__media{
    width: 5.75rem !important;
    height: 5.75rem !important;
    min-width: 5.75rem !important;
  }
.cart-item__total{
    grid-column: 2 !important;
    justify-self: start !important;
    min-width: 0 !important;
    margin-top: 0.3rem !important;
    text-align: left !important;
  }
}
/* Cart AJAX states */
.cart-item{
  transition:
    opacity 220ms ease,
    transform 220ms ease,
    filter 220ms ease !important;
}
.cart-item.is-loading{
  opacity: 0.68 !important;
  pointer-events: none !important;
}
.cart-item.is-removing{
  opacity: 0 !important;
  transform: translateX(1rem) !important;
  filter: blur(5px) !important;
}
.cart-item__quantity-button[disabled],
.cart-item__quantity-input[disabled]{
  cursor: wait !important;
  opacity: 0.65 !important;
}
.cart-item__remove{
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
}
.cart-item__remove.is-loading::before{
  content: "" !important;
  width: 0.82rem !important;
  height: 0.82rem !important;
  border: 2px solid rgba(31, 111, 174, 0.25) !important;
  border-top-color: var(--color-blue) !important;
  border-radius: 999px !important;
  animation: themeblocks-skincareCartSpin 650ms linear infinite !important;
}

@keyframes themeblocks-skincareCartSpin {
  to {
    transform: rotate(360deg);
  }
}
/* =========================================================
   CART MOBILE FINAL: compact clean layout
   ========================================================= */

@media (max-width: 749px){
  .cart-page {
    padding: 1.8rem 0 2.5rem !important;
    background:
      radial-gradient(circle at 0% 8%, rgba(142, 205, 224, 0.14), transparent 18rem),
      radial-gradient(circle at 100% 10%, rgba(201, 162, 39, 0.07), transparent 18rem),
      #f8fbfd !important;
  }

  .cart-page__container {
    width: min(calc(100% - 1.5rem), 38rem) !important;
  }

  .cart-page__header {
    margin-bottom: 1.35rem !important;
  }

  .cart-page__eyebrow {
    margin-bottom: 0.45rem !important;
    font-size: 0.68rem !important;
    letter-spacing: 0.2em !important;
  }

  .cart-page__heading {
    font-size: clamp(3rem, 15vw, 4.35rem) !important;
    line-height: 0.9 !important;
  }

  .cart-page__layout {
    gap: 1.4rem !important;
  }

  .cart-item {
    grid-template-columns: 5.15rem minmax(0, 1fr) !important;
    grid-template-areas:
      "media content"
      "media total" !important;
    gap: 0.75rem 0.95rem !important;
    align-items: start !important;
    padding: 0.95rem 0 !important;
    border-bottom: 1px solid rgba(18, 57, 93, 0.1) !important;
  }

  .cart-item:first-child {
    padding-top: 0 !important;
  }

  .cart-item__media {
    grid-area: media !important;
    width: 5.15rem !important;
    height: 5.15rem !important;
    min-width: 5.15rem !important;
    border-radius: 1rem !important;
    align-self: start !important;
  }

  .cart-item__image {
    width: 76% !important;
    height: 76% !important;
  }

  .cart-item__content {
    grid-area: content !important;
    min-width: 0 !important;
  }

  .cart-item__title {
    margin-bottom: 0.25rem !important;
    font-size: 1.02rem !important;
    line-height: 1.12 !important;
    letter-spacing: -0.02em !important;
  }

  .cart-item__unit-price,
  .cart-item__variant {
    margin-top: 0.18rem !important;
    font-size: 0.82rem !important;
    line-height: 1.35 !important;
    color: rgba(18, 57, 93, 0.66) !important;
  }

  .cart-item__actions {
    margin-top: 0.55rem !important;
    gap: 0.65rem !important;
    flex-wrap: nowrap !important;
  }

  .cart-item__quantity {
    grid-template-columns: 1.95rem 2.2rem 1.95rem !important;
    height: 2.2rem !important;
    box-shadow: 0 0.35rem 0.9rem rgba(18, 57, 93, 0.035) !important;
  }

  .cart-item__quantity-button {
    font-size: 1rem !important;
  }

  .cart-item__quantity-input {
    font-size: 0.88rem !important;
  }

  .cart-item__remove {
    font-size: 0.68rem !important;
    letter-spacing: 0.11em !important;
    white-space: nowrap !important;
  }

  .cart-item__total {
    grid-area: total !important;
    justify-self: start !important;
    min-width: 0 !important;
    margin-top: -0.25rem !important;
    font-size: 1.05rem !important;
    line-height: 1 !important;
    text-align: left !important;
  }

  .cart-summary {
    margin-top: 0.25rem !important;
  }

  .cart-summary__card {
    padding: 1.25rem !important;
    border-radius: 1.35rem !important;
  }

  .cart-summary__heading {
    margin-bottom: 0.85rem !important;
    font-size: 1.45rem !important;
  }

  .cart-summary__row,
  .cart-summary__total {
    padding: 0.65rem 0 !important;
    font-size: 0.9rem !important;
  }

  .cart-summary__total strong {
    font-size: 1.22rem !important;
  }

  .cart-summary__update,
  .cart-summary__checkout {
    min-height: 2.75rem !important;
    font-size: 0.72rem !important;
    letter-spacing: 0.12em !important;
  }

  .cart-summary__update {
    margin-top: 0.75rem !important;
  }

  .cart-summary__checkout {
    margin-top: 0.6rem !important;
  }

  .site-footer {
    padding-top: 2.6rem !important;
  }
}
/* =========================================================
   Cart drawer
   ========================================================= */

.cart-drawer{
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  visibility: hidden;
}
.cart-drawer.is-open{
  pointer-events: auto;
  visibility: visible;
}
.cart-drawer__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: transparent !important;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  transition:
    opacity 220ms ease,
    visibility 220ms ease;
}
.cart-drawer.is-open .cart-drawer__overlay {
  opacity: 1;
  visibility: visible;
  background: transparent !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.cart-drawer__panel{
  position: absolute;
  top: 0;
  right: 0;
  display: grid;
  grid-template-rows: auto 1fr auto;
  width: min(100%, 30rem);
  height: 100%;
  background:
    radial-gradient(circle at 8% 8%, rgba(142, 205, 224, 0.15), transparent 18rem),
    radial-gradient(circle at 95% 18%, rgba(201, 162, 39, 0.08), transparent 18rem),
    #f8fbfd;
  border-left: 1px solid rgba(18, 57, 93, 0.1);
  box-shadow: -1.8rem 0 4rem rgba(18, 57, 93, 0.14);
  transform: translateX(100%);
  transition: transform 420ms cubic-bezier(0.19, 1, 0.22, 1);
}
.cart-drawer.is-open .cart-drawer__panel{
  transform: translateX(0);
}
.cart-drawer__header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.35rem 1.35rem 1rem;
  border-bottom: 1px solid rgba(18, 57, 93, 0.09);
}
.cart-drawer__eyebrow{
  margin: 0 0 0.35rem;
  color: var(--color-blue);
  font-size: 0.66rem;
  font-weight: 950;
  letter-spacing: 0.2em;
  line-height: 1;
  text-transform: uppercase;
}
.cart-drawer__title{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading-family);
  font-size: 2.35rem;
  font-weight: 500;
  letter-spacing: -0.055em;
  line-height: 0.95;
}
.cart-drawer__close{
  display: grid;
  place-items: center;
  width: 2.65rem;
  height: 2.65rem;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 999px;
  background: #ffffff;
  color: var(--color-ink);
  cursor: pointer;
  font-size: 1.7rem;
  line-height: 1;
  box-shadow: 0 0.65rem 1.4rem rgba(18, 57, 93, 0.06);
}
.cart-drawer__body{
  overflow-y: auto;
  padding: 0.35rem 1.35rem;
}
.cart-drawer__items{
  display: grid;
}
.cart-drawer-item{
  display: grid;
  grid-template-columns: 5.2rem minmax(0, 1fr);
  gap: 0.9rem;
  position: relative;
  padding: 1rem 0;
  border-bottom: 1px solid rgba(18, 57, 93, 0.09);
  transition:
    opacity 220ms ease,
    transform 220ms ease,
    filter 220ms ease;
}
.cart-drawer-item.is-loading{
  opacity: 0.65;
  pointer-events: none;
}
.cart-drawer-item.is-removing{
  opacity: 0;
  transform: translateX(0.8rem);
  filter: blur(4px);
}
.cart-drawer-item__media{
  display: grid;
  place-items: center;
  width: 5.2rem;
  height: 5.2rem;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 1rem;
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 0.65rem 1.35rem rgba(18, 57, 93, 0.04);
}
.cart-drawer-item__image{
  width: 76%;
  height: 76%;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.cart-drawer-item__title{
  display: inline-block;
  color: var(--color-ink);
  font-size: 0.98rem;
  font-weight: 950;
  letter-spacing: -0.02em;
  line-height: 1.14;
  text-decoration: none;
}
.cart-drawer-item__price,
.cart-drawer-item__variant{
  margin: 0.25rem 0 0;
  color: rgba(18, 57, 93, 0.66);
  font-size: 0.82rem;
  line-height: 1.35;
}
.cart-drawer-item__actions{
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin-top: 0.65rem;
}
.cart-drawer-item__quantity{
  display: inline-grid;
  grid-template-columns: 1.9rem 2.15rem 1.9rem;
  align-items: center;
  height: 2.15rem;
  border: 1px solid rgba(18, 57, 93, 0.14);
  border-radius: 999px;
  background: #ffffff;
  overflow: hidden;
}
.cart-drawer-item__quantity-button{
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  color: var(--color-ink);
  cursor: pointer;
  font-size: 1rem;
  font-weight: 950;
}
.cart-drawer-item__quantity-input{
  width: 100%;
  height: 100%;
  border: 0;
  border-inline: 1px solid rgba(18, 57, 93, 0.08);
  background: transparent;
  color: var(--color-ink);
  font-size: 0.86rem;
  font-weight: 950;
  text-align: center;
  appearance: textfield;
  -moz-appearance: textfield;
  outline: none;
}
.cart-drawer-item__quantity-input::-webkit-outer-spin-button,
.cart-drawer-item__quantity-input::-webkit-inner-spin-button{
  margin: 0;
  -webkit-appearance: none;
}
.cart-drawer-item__remove{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 0;
  background: transparent;
  color: var(--color-blue);
  cursor: pointer;
  font-size: 0.66rem;
  font-weight: 950;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.cart-drawer-item__remove.is-loading::before{
  content: "";
  width: 0.76rem;
  height: 0.76rem;
  border: 2px solid rgba(31, 111, 174, 0.25);
  border-top-color: var(--color-blue);
  border-radius: 999px;
  animation: themeblocks-skincareCartSpin 650ms linear infinite;
}
.cart-drawer-item__line-total{
  grid-column: 2;
  color: var(--color-ink);
  font-size: 1rem;
  font-weight: 950;
  line-height: 1;
}
.cart-drawer__footer{
  padding: 1rem 1.35rem 1.35rem;
  border-top: 1px solid rgba(18, 57, 93, 0.09);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 -1rem 2.4rem rgba(18, 57, 93, 0.045);
}
.cart-drawer__subtotal{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  color: rgba(18, 57, 93, 0.72);
  font-size: 0.92rem;
}
.cart-drawer__subtotal strong{
  color: var(--color-ink);
  font-size: 1.25rem;
  font-weight: 950;
}
.cart-drawer__note{
  margin: 0.45rem 0 0.9rem;
  color: rgba(18, 57, 93, 0.58);
  font-size: 0.78rem;
  line-height: 1.45;
}
.cart-drawer__cart-link,
.cart-drawer__checkout,
.cart-drawer__empty-button{
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 2.8rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0.13em;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
}
.cart-drawer__cart-link{
  margin-bottom: 0.65rem;
  border: 1px solid rgba(18, 57, 93, 0.16);
  background: #ffffff;
  color: var(--color-ink);
}
.cart-drawer__checkout,
.cart-drawer__empty-button{
  border: 1px solid var(--color-blue);
  background: var(--color-blue);
  color: #ffffff;
  box-shadow: 0 0.85rem 1.7rem rgba(31, 111, 174, 0.16);
}
.cart-drawer__empty{
  display: grid;
  place-items: center;
  min-height: 22rem;
  padding: 2rem 1rem;
  text-align: center;
}
.cart-drawer__empty-icon{
  display: grid;
  place-items: center;
  width: 3.4rem;
  height: 3.4rem;
  margin-bottom: 1rem;
  border-radius: 999px;
  background: rgba(142, 205, 224, 0.16);
  color: var(--color-blue);
  font-size: 1.35rem;
}
.cart-drawer__empty h3{
  margin: 0;
  color: var(--color-ink);
  font-family: var(--font-heading-family);
  font-size: 2.25rem;
  font-weight: 500;
  letter-spacing: -0.055em;
}
.cart-drawer__empty p{
  max-width: 18rem;
  margin: 0.65rem auto 1.2rem;
  color: rgba(18, 57, 93, 0.66);
  font-size: 0.92rem;
  line-height: 1.55;
}
body.cart-drawer-open{
  overflow: hidden;
}

@media (max-width: 749px) {
.cart-drawer__panel{
    width: min(100%, 26.5rem);
  }
}
/* =========================================================
   CART DRAWER FINAL UI CLEANUP
   ========================================================= */

.cart-drawer{
  z-index: 1000 !important;
}
.cart-drawer__overlay{
  background: transparent !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.cart-drawer__panel{
  width: min(100%, 28.5rem) !important;
  background:
    radial-gradient(circle at 12% 6%, rgba(142, 205, 224, 0.15), transparent 16rem),
    radial-gradient(circle at 100% 14%, rgba(201, 162, 39, 0.07), transparent 16rem),
    #f8fbfd !important;
  box-shadow: -1.6rem 0 4rem rgba(18, 57, 93, 0.18) !important;
}
.cart-drawer__header{
  min-height: 5.8rem !important;
  padding: 1.15rem 1.2rem 1rem !important;
  background: rgba(255, 255, 255, 0.82) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.09) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}
.cart-drawer__eyebrow{
  margin: 0 0 0.32rem !important;
  color: var(--color-blue) !important;
  font-size: 0.62rem !important;
  font-weight: 950 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
}
.cart-drawer__title{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading-family) !important;
  font-size: 2.25rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.055em !important;
  line-height: 0.95 !important;
}
.cart-drawer__close{
  width: 2.55rem !important;
  height: 2.55rem !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: var(--color-ink) !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  box-shadow: 0 0.55rem 1.2rem rgba(18, 57, 93, 0.06) !important;
}
.cart-drawer__body{
  padding: 0.35rem 1rem !important;
}
.cart-drawer-item{
  grid-template-columns: 4.85rem minmax(0, 1fr) !important;
  gap: 0.85rem !important;
  padding: 0.9rem 0 !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.09) !important;
}
.cart-drawer-item__media{
  width: 4.85rem !important;
  height: 4.85rem !important;
  border-radius: 0.95rem !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(142, 205, 224, 0.1), transparent 60%),
    #ffffff !important;
}
.cart-drawer-item__image{
  width: 74% !important;
  height: 74% !important;
}
.cart-drawer-item__content{
  min-width: 0 !important;
}
.cart-drawer-item__title{
  font-size: 0.92rem !important;
  line-height: 1.15 !important;
  letter-spacing: -0.015em !important;
}
.cart-drawer-item__price,
.cart-drawer-item__variant{
  margin-top: 0.22rem !important;
  font-size: 0.78rem !important;
  line-height: 1.3 !important;
  color: rgba(18, 57, 93, 0.64) !important;
}
.cart-drawer-item__actions{
  margin-top: 0.55rem !important;
  gap: 0.55rem !important;
}
.cart-drawer-item__quantity{
  grid-template-columns: 1.75rem 2rem 1.75rem !important;
  height: 2rem !important;
  box-shadow: 0 0.35rem 0.8rem rgba(18, 57, 93, 0.035) !important;
}
.cart-drawer-item__quantity-button{
  font-size: 0.92rem !important;
}
.cart-drawer-item__quantity-input{
  font-size: 0.82rem !important;
}
.cart-drawer-item__remove{
  font-size: 0.62rem !important;
  letter-spacing: 0.1em !important;
  white-space: nowrap !important;
}
.cart-drawer-item__line-total{
  grid-column: 2 !important;
  margin-top: 0.35rem !important;
  font-size: 0.95rem !important;
  line-height: 1 !important;
}
.cart-drawer__footer{
  padding: 0.95rem 1rem 1rem !important;
  background: rgba(255, 255, 255, 0.88) !important;
  border-top: 1px solid rgba(18, 57, 93, 0.09) !important;
}
.cart-drawer__subtotal{
  font-size: 0.88rem !important;
}
.cart-drawer__subtotal strong{
  font-size: 1.15rem !important;
}
.cart-drawer__note{
  margin: 0.35rem 0 0.8rem !important;
  font-size: 0.74rem !important;
}
.cart-drawer__cart-link,
.cart-drawer__checkout{
  min-height: 2.55rem !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
}
.cart-drawer__cart-link{
  margin-bottom: 0.55rem !important;
}

@media (max-width: 749px) {
.cart-drawer__panel{
    width: min(100%, 25.5rem) !important;
  }
.cart-drawer__header{
    min-height: 5.35rem !important;
  }
.cart-drawer__title{
    font-size: 2rem !important;
  }
}
/* =========================================================
   CART DRAWER Z-INDEX FIX
   Drawer must sit above sticky header/nav.
   ========================================================= */

.cart-drawer{
  z-index: 99999 !important;
}
.cart-drawer__overlay{
  z-index: 1 !important;
}
.cart-drawer__panel{
  z-index: 2 !important;
}
/* Prevent header/cart icon from appearing above active drawer */
body.cart-drawer-open .site-header,
body.cart-drawer-open .site-header__cart,
body.cart-drawer-open .site-header__actions{
  z-index: 1 !important;
}
/* Keep drawer interactions always clickable */
body.cart-drawer-open .cart-drawer,
body.cart-drawer-open .cart-drawer__overlay,
body.cart-drawer-open .cart-drawer__panel{
  pointer-events: auto !important;
}
/* Cart drawer should cover the full viewport,
including header area */
.cart-drawer,
.cart-drawer__overlay,
.cart-drawer__panel{
  top: 0 !important;
  height: 100dvh !important;
}
.cart-drawer__panel{
  max-height: 100dvh !important;
}
/* =========================================================
   CART DRAWER CLOSE BUTTON FINAL POLISH
   ========================================================= */

.cart-drawer__close{
  position: relative !important;
  width: 3rem !important;
  height: 3rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 251, 253, 0.94)) !important;
  color: transparent !important;
  cursor: pointer !important;
  box-shadow:
    0 0.9rem 1.8rem rgba(18, 57, 93, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease,
    background 180ms ease !important;
}
.cart-drawer__close::before,
.cart-drawer__close::after{
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 1.05rem !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: var(--color-ink) !important;
  transform-origin: center !important;
}
.cart-drawer__close::before{
  transform: translate(-50%, -50%) rotate(45deg) !important;
}
.cart-drawer__close::after{
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}
.cart-drawer__close:hover{
  transform: translateY(-1px) scale(1.03) !important;
  border-color: rgba(31, 111, 174, 0.22) !important;
  box-shadow:
    0 1.05rem 2.1rem rgba(18, 57, 93, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}
.cart-drawer__close:active{
  transform: scale(0.96) !important;
}
/* Keep drawer visible while close animation is running */
.cart-drawer.is-closing{
  pointer-events: auto !important;
  visibility: visible !important;
}
.cart-drawer.is-closing .cart-drawer__overlay,
.cart-drawer.is-closing .cart-drawer__panel{
  pointer-events: auto !important;
}
/* Cart drawer: keep visible during Anime.js close animation */
.cart-drawer.is-closing{
  visibility: visible !important;
  pointer-events: auto !important;
}
.cart-drawer.is-closing .cart-drawer__overlay,
.cart-drawer.is-closing .cart-drawer__panel{
  pointer-events: auto !important;
}
.cart-drawer.is-closing .cart-drawer__panel{
  transform: translateX(0);
}
/* =========================================================
   CART DRAWER FINAL COMPACT ECOMMERCE SCALE
   Smaller,
lighter,
more Shopify-standard utility UI.
   ========================================================= */

.cart-drawer__panel{
  width: min(100%, 27rem) !important;
}
/* Header */
.cart-drawer__header{
  min-height: 4.65rem !important;
  padding: 0.95rem 1.1rem 0.85rem !important;
}
.cart-drawer__eyebrow{
  margin-bottom: 0.28rem !important;
  font-size: 0.56rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
}
.cart-drawer__title{
  font-family: var(--font-heading-family) !important;
  font-size: 1.85rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.045em !important;
  line-height: 0.95 !important;
}
.cart-drawer__close{
  width: 2.55rem !important;
  height: 2.55rem !important;
}
.cart-drawer__close::before,
.cart-drawer__close::after{
  width: 0.92rem !important;
  height: 2px !important;
}
/* Body spacing */
.cart-drawer__body{
  padding: 0.25rem 0.95rem !important;
}
.cart-drawer-item{
  grid-template-columns: 4.35rem minmax(0, 1fr) !important;
  gap: 0.75rem !important;
  padding: 0.78rem 0 !important;
}
/* Product image */
.cart-drawer-item__media{
  width: 4.35rem !important;
  height: 4.35rem !important;
  border-radius: 0.82rem !important;
}
.cart-drawer-item__image{
  width: 72% !important;
  height: 72% !important;
}
/* Product text */
.cart-drawer-item__title{
  font-size: 0.84rem !important;
  font-weight: 750 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
  text-transform: none !important;
}
.cart-drawer-item__price,
.cart-drawer-item__variant{
  margin-top: 0.18rem !important;
  font-size: 0.76rem !important;
  font-weight: 450 !important;
  line-height: 1.28 !important;
  color: rgba(18, 57, 93, 0.62) !important;
}
/* Quantity + remove */
.cart-drawer-item__actions{
  margin-top: 0.5rem !important;
  gap: 0.55rem !important;
}
.cart-drawer-item__quantity{
  grid-template-columns: 1.68rem 1.9rem 1.68rem !important;
  height: 1.92rem !important;
}
.cart-drawer-item__quantity-button{
  font-size: 0.88rem !important;
  font-weight: 800 !important;
}
.cart-drawer-item__quantity-input{
  font-size: 0.78rem !important;
  font-weight: 750 !important;
}
.cart-drawer-item__remove{
  font-size: 0.58rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
}
/* Line total */
.cart-drawer-item__line-total{
  grid-column: 2 !important;
  margin-top: 0.28rem !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
}
/* Footer */
.cart-drawer__footer{
  padding: 0.85rem 0.95rem 0.95rem !important;
}
.cart-drawer__subtotal{
  font-size: 0.82rem !important;
  font-weight: 450 !important;
}
.cart-drawer__subtotal strong{
  font-size: 1rem !important;
  font-weight: 800 !important;
}
.cart-drawer__note{
  margin: 0.28rem 0 0.68rem !important;
  font-size: 0.7rem !important;
  line-height: 1.4 !important;
}
.cart-drawer__cart-link,
.cart-drawer__checkout{
  min-height: 2.35rem !important;
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.11em !important;
}
.cart-drawer__cart-link{
  margin-bottom: 0.48rem !important;
}
/* Empty state */
.cart-drawer__empty{
  min-height: 18rem !important;
  padding: 1.5rem 0.8rem !important;
}
.cart-drawer__empty-icon{
  width: 3rem !important;
  height: 3rem !important;
  margin-bottom: 0.8rem !important;
}
.cart-drawer__empty h3{
  font-size: 1.85rem !important;
}
.cart-drawer__empty p{
  font-size: 0.84rem !important;
}
/* Mobile drawer should not feel oversized */
@media (max-width: 749px){
  .cart-drawer__panel {
    width: min(100%, 24.5rem) !important;
  }

  .cart-drawer__header {
    min-height: 4.45rem !important;
    padding: 0.85rem 1rem 0.75rem !important;
  }

  .cart-drawer__title {
    font-size: 1.7rem !important;
  }

  .cart-drawer__body {
    padding-inline: 0.85rem !important;
  }

  .cart-drawer-item {
    grid-template-columns: 4rem minmax(0, 1fr) !important;
    gap: 0.7rem !important;
    padding: 0.72rem 0 !important;
  }

  .cart-drawer-item__media {
    width: 4rem !important;
    height: 4rem !important;
  }

  .cart-drawer-item__title {
    font-size: 0.8rem !important;
  }

  .cart-drawer-item__price,
  .cart-drawer-item__variant {
    font-size: 0.72rem !important;
  }

  .cart-drawer-item__line-total {
    font-size: 0.84rem !important;
  }

  .cart-drawer__footer {
    padding-inline: 0.85rem !important;
  }
}
/* =========================================================
   CART PAGE FINAL COMPACT ECOMMERCE SCALE
   Match cart drawer utility sizing,
but keep page layout premium.
   ========================================================= */

.cart-page{
  padding: clamp(2.4rem, 4vw, 4rem) 0 clamp(3.2rem, 5vw, 5rem) !important;
  background:
    radial-gradient(circle at 8% 10%, rgba(142, 205, 224, 0.13), transparent 26rem),
    radial-gradient(circle at 92% 14%, rgba(201, 162, 39, 0.07), transparent 26rem),
    #f8fbfd !important;
}
.cart-page__container{
  width: min(calc(100% - 3rem), 72rem) !important;
}
.cart-page__header{
  max-width: 32rem !important;
  margin-bottom: clamp(1.45rem, 2.5vw, 2rem) !important;
}
.cart-page__eyebrow{
  margin-bottom: 0.45rem !important;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.19em !important;
}
.cart-page__heading{
  font-size: clamp(2.65rem, 4.6vw, 4.45rem) !important;
  font-weight: 500 !important;
  letter-spacing: -0.052em !important;
  line-height: 0.95 !important;
}
.cart-page__layout{
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 21rem) !important;
  gap: clamp(1.35rem, 2.5vw, 2.1rem) !important;
}
/* Product list */
.cart-item{
  grid-template-columns: 5.65rem minmax(0, 1fr) 5.8rem !important;
  gap: 0.95rem !important;
  padding: 0.9rem 0 !important;
  border-bottom-color: rgba(18, 57, 93, 0.095) !important;
}
.cart-item__media{
  width: 5.65rem !important;
  height: 5.65rem !important;
  min-width: 5.65rem !important;
  border-radius: 0.95rem !important;
}
.cart-item__image{
  width: 74% !important;
  height: 74% !important;
}
.cart-item__title{
  margin-bottom: 0.32rem !important;
  font-size: clamp(0.98rem, 1.25vw, 1.12rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.012em !important;
  line-height: 1.18 !important;
  text-transform: none !important;
}
.cart-item__unit-price,
.cart-item__variant{
  margin-top: 0.18rem !important;
  font-size: 0.78rem !important;
  font-weight: 450 !important;
  line-height: 1.32 !important;
  color: rgba(18, 57, 93, 0.62) !important;
}
.cart-item__actions{
  margin-top: 0.55rem !important;
  gap: 0.62rem !important;
}
.cart-item__quantity{
  grid-template-columns: 1.85rem 2.1rem 1.85rem !important;
  height: 2.08rem !important;
}
.cart-item__quantity-button{
  font-size: 0.9rem !important;
  font-weight: 800 !important;
}
.cart-item__quantity-input{
  font-size: 0.8rem !important;
  font-weight: 750 !important;
}
.cart-item__remove{
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
}
.cart-item__total{
  min-width: 5.8rem !important;
  font-size: 0.98rem !important;
  font-weight: 800 !important;
}
/* Summary */
.cart-summary{
  top: calc(4.6rem + 1rem) !important;
}
.cart-summary__card{
  padding: 1.15rem !important;
  border-radius: 1.25rem !important;
  box-shadow:
    0 1.1rem 2.5rem rgba(18, 57, 93, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
}
.cart-summary__heading{
  margin-bottom: 0.85rem !important;
  font-size: 1.18rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.015em !important;
}
.cart-summary__row,
.cart-summary__total{
  padding: 0.62rem 0 !important;
  font-size: 0.82rem !important;
  font-weight: 450 !important;
}
.cart-summary__row strong,
.cart-summary__total strong{
  font-weight: 800 !important;
}
.cart-summary__total{
  font-size: 0.9rem !important;
}
.cart-summary__total strong{
  font-size: 1.12rem !important;
}
.cart-summary__update,
.cart-summary__checkout{
  min-height: 2.48rem !important;
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.11em !important;
}
.cart-summary__update{
  margin-top: 0.72rem !important;
}
.cart-summary__checkout{
  margin-top: 0.55rem !important;
}
/* Empty cart page */
.cart-empty{
  max-width: 36rem !important;
  padding: 2rem !important;
  border-radius: 1.25rem !important;
}
.cart-empty h2{
  font-size: clamp(2.2rem, 4vw, 3.4rem) !important;
}
.cart-empty p{
  font-size: 0.9rem !important;
}
/* Mobile cart page refinement */
@media (max-width: 749px){
  .cart-page {
    padding: 1.6rem 0 2.4rem !important;
  }

  .cart-page__container {
    width: min(calc(100% - 1.35rem), 36rem) !important;
  }

  .cart-page__header {
    margin-bottom: 1.15rem !important;
  }

  .cart-page__eyebrow {
    font-size: 0.62rem !important;
    letter-spacing: 0.18em !important;
  }

  .cart-page__heading {
    font-size: clamp(2.55rem, 13vw, 3.7rem) !important;
  }

  .cart-page__layout {
    gap: 1.2rem !important;
  }

  .cart-item {
    grid-template-columns: 4.5rem minmax(0, 1fr) !important;
    grid-template-areas:
      "media content"
      "media total" !important;
    gap: 0.62rem 0.78rem !important;
    padding: 0.78rem 0 !important;
  }

  .cart-item__media {
    grid-area: media !important;
    width: 4.5rem !important;
    height: 4.5rem !important;
    min-width: 4.5rem !important;
    border-radius: 0.85rem !important;
  }

  .cart-item__content {
    grid-area: content !important;
  }

  .cart-item__title {
    font-size: 0.88rem !important;
    line-height: 1.16 !important;
  }

  .cart-item__unit-price,
  .cart-item__variant {
    font-size: 0.72rem !important;
  }

  .cart-item__actions {
    margin-top: 0.45rem !important;
    gap: 0.52rem !important;
    flex-wrap: nowrap !important;
  }

  .cart-item__quantity {
    grid-template-columns: 1.68rem 1.9rem 1.68rem !important;
    height: 1.95rem !important;
  }

  .cart-item__remove {
    font-size: 0.58rem !important;
    white-space: nowrap !important;
  }

  .cart-item__total {
    grid-area: total !important;
    justify-self: start !important;
    min-width: 0 !important;
    margin-top: -0.18rem !important;
    font-size: 0.86rem !important;
    text-align: left !important;
  }

  .cart-summary__card {
    padding: 0 !important;
  }

  .cart-summary__heading {
    font-size: 1.08rem !important;
  }

  .cart-summary__row,
  .cart-summary__total {
    font-size: 0.78rem !important;
  }

  .cart-summary__total strong {
    font-size: 1rem !important;
  }

  .cart-summary__update,
  .cart-summary__checkout {
    min-height: 2.35rem !important;
    font-size: 0.6rem !important;
  }
}
/* =========================================================
   CART PAGE HARD RESET: fix mobile overlap + reduce heading
   Must stay at END of theme.css.
   ========================================================= */

/* Desktop/tablet heading scale */
.cart-page__heading{
  font-size: clamp(2.55rem, 4.2vw, 4rem) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.045em !important;
}
.cart-page__header{
  margin-bottom: clamp(1.25rem, 2vw, 1.75rem) !important;
}
/* Keep desktop rows clean */
.cart-page__layout{
  align-items: start !important;
}
.cart-summary{
  z-index: 1 !important;
}
/* Mobile: fully reset cart page stacking */
@media (max-width: 749px){
  .cart-page {
    padding: 1.35rem 0 2rem !important;
    overflow: visible !important;
  }

  .cart-page__container {
    width: min(calc(100% - 1.25rem), 34rem) !important;
    margin: 0 auto !important;
  }

  .cart-page__header {
    position: relative !important;
    z-index: 1 !important;
    margin: 0 0 1rem !important;
    max-width: none !important;
  }

  .cart-page__eyebrow {
    margin: 0 0 0.35rem !important;
    font-size: 0.58rem !important;
    line-height: 1 !important;
    letter-spacing: 0.18em !important;
  }

  .cart-page__heading {
    font-size: clamp(2.45rem, 11vw, 3.25rem) !important;
    line-height: 0.95 !important;
    letter-spacing: -0.045em !important;
  }

  .cart-page__form {
    display: block !important;
    position: static !important;
  }

  .cart-page__layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    position: static !important;
    align-items: stretch !important;
  }

  .cart-page__items {
    display: block !important;
    position: static !important;
    z-index: auto !important;
    width: 100% !important;
  }

  .cart-item {
    display: grid !important;
    grid-template-columns: 4.35rem minmax(0, 1fr) !important;
    grid-template-areas:
      "media content"
      "media total" !important;
    gap: 0.6rem 0.75rem !important;
    position: relative !important;
    z-index: auto !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0.72rem 0 !important;
    border-bottom: 1px solid rgba(18, 57, 93, 0.1) !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none;
  }

  .cart-item__media {
    grid-area: media !important;
    width: 4.35rem !important;
    height: 4.35rem !important;
    min-width: 4.35rem !important;
    border-radius: 0.82rem !important;
  }

  .cart-item__content {
    grid-area: content !important;
    min-width: 0 !important;
  }

  .cart-item__title {
    display: block !important;
    margin: 0 0 0.2rem !important;
    font-size: 0.82rem !important;
    line-height: 1.16 !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em !important;
  }

  .cart-item__unit-price,
  .cart-item__variant {
    margin: 0.12rem 0 0 !important;
    font-size: 0.68rem !important;
    line-height: 1.28 !important;
  }

  .cart-item__actions {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 0.48rem !important;
    margin-top: 0.42rem !important;
  }

  .cart-item__quantity {
    grid-template-columns: 1.55rem 1.75rem 1.55rem !important;
    height: 1.82rem !important;
  }

  .cart-item__quantity-button {
    font-size: 0.82rem !important;
  }

  .cart-item__quantity-input {
    font-size: 0.72rem !important;
  }

  .cart-item__remove {
    font-size: 0.54rem !important;
    line-height: 1 !important;
    letter-spacing: 0.1em !important;
    white-space: nowrap !important;
  }

  .cart-item__total {
    grid-area: total !important;
    justify-self: start !important;
    align-self: start !important;
    min-width: 0 !important;
    margin: -0.08rem 0 0 !important;
    font-size: 0.82rem !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    text-align: left !important;
  }

  /* Critical: stop summary from overlaying product list */
  .cart-summary {
    display: block !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: 100% !important;
    margin: 0.4rem 0 0 !important;
    transform: none !important;
  }

  .cart-summary__card {
    width: 100% !important;
    margin: 0 !important;
    padding: 0.95rem !important;
    border-radius: 1.15rem !important;
    position: static !important;
    transform: none !important;
  }

  .cart-summary__heading {
    margin: 0 0 0.65rem !important;
    font-size: 1rem !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
  }

  .cart-summary__row,
  .cart-summary__total {
    padding: 0.52rem 0 !important;
    font-size: 0.74rem !important;
    line-height: 1.35 !important;
  }

  .cart-summary__total strong {
    font-size: 0.95rem !important;
  }

  .cart-summary__update,
  .cart-summary__checkout {
    min-height: 2.22rem !important;
    font-size: 0.56rem !important;
    letter-spacing: 0.1em !important;
  }

  .cart-summary__update {
    margin-top: 0.6rem !important;
  }

  .cart-summary__checkout {
    margin-top: 0.48rem !important;
  }
}
/* =========================================================
   COLLECTION PAGE PREMIUM COMPACT REFINEMENT
   ========================================================= */

.main-collection{
  padding: clamp(3rem, 5vw, 5.4rem) 0 clamp(4rem, 6vw, 6.5rem) !important;
  background:
    radial-gradient(circle at 8% 8%, rgba(142, 205, 224, 0.14), transparent 28rem),
    radial-gradient(circle at 92% 12%, rgba(201, 162, 39, 0.08), transparent 28rem),
    #f8fbfd !important;
}
.main-collection .container,
.main-collection__container{
  width: min(calc(100% - 3rem), 76rem) !important;
  margin-inline: auto !important;
}
.main-collection__header{
  max-width: 34rem !important;
  margin: 0 0 clamp(1.6rem, 3vw, 2.4rem) !important;
}
.main-collection__eyebrow{
  margin: 0 0 0.55rem !important;
  color: #c9a227 !important;
  font-size: 0.66rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.main-collection__heading{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading-family) !important;
  font-size: clamp(2.85rem, 5vw, 4.75rem) !important;
  font-weight: 500 !important;
  letter-spacing: -0.055em !important;
  line-height: 0.94 !important;
}
.main-collection__description{
  max-width: 34rem !important;
  margin: 0.9rem 0 0 !important;
  color: rgba(18, 57, 93, 0.68) !important;
  font-size: 0.98rem !important;
  line-height: 1.65 !important;
}
.main-collection__grid,
.product-grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1rem, 1.8vw, 1.35rem) !important;
}
/* Product card compact premium style */
.product-card{
  min-width: 0 !important;
  position: relative !important;
}
.product-card__media{
  display: grid !important;
  place-items: center !important;
  aspect-ratio: 1 / 1.18 !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  border-radius: 1.25rem !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.9), transparent 36%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(239, 247, 251, 0.64)) !important;
  overflow: hidden !important;
  box-shadow:
    0 1rem 2.5rem rgba(18, 57, 93, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
  transition:
    transform 260ms ease,
    box-shadow 260ms ease,
    border-color 260ms ease !important;
}
.product-card:hover .product-card__media{
  transform: translateY(-0.18rem) !important;
  border-color: rgba(31, 111, 174, 0.18) !important;
  box-shadow:
    0 1.3rem 3rem rgba(18, 57, 93, 0.075),
    inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}
.product-card__image{
  width: 68% !important;
  height: 68% !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
  transition: transform 300ms ease !important;
}
.product-card:hover .product-card__image{
  transform: scale(1.035) !important;
}
.product-card__content{
  padding: 0.72rem 0.18rem 0 !important;
}
.product-card__vendor{
  margin: 0 0 0.26rem !important;
  color: #c9a227 !important;
  font-size: 0.56rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.product-card__title{
  margin: 0 !important;
}
.product-card__title a{
  display: inline-block !important;
  color: var(--color-ink) !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}
.product-card__title a:hover{
  color: var(--color-blue) !important;
}
/* Judge.me/metafield rating */
.product-card__rating{
  display: flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  min-height: 1rem !important;
  margin-top: 0.42rem !important;
  color: rgba(18, 57, 93, 0.64) !important;
  font-size: 0.66rem !important;
  font-weight: 750 !important;
  line-height: 1 !important;
}
.product-card__stars{
  position: relative !important;
  display: inline-block !important;
  color: rgba(201, 162, 39, 0.24) !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.02em !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
.product-card__stars-base{
  color: rgba(201, 162, 39, 0.24) !important;
}
.product-card__stars-fill{
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  display: block !important;
  max-width: 100% !important;
  overflow: hidden !important;
  color: #c9a227 !important;
  white-space: nowrap !important;
}
.product-card__stars--empty{
  color: rgba(201, 162, 39, 0.28) !important;
}
.product-card__review-count{
  color: rgba(18, 57, 93, 0.58) !important;
  font-size: 0.64rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
.product-card__bottom{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.75rem !important;
  margin-top: 0.42rem !important;
}
.product-card__price{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: 0.76rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
}
.product-card__form{
  margin: 0 !important;
}
.product-card__cart{
  display: grid !important;
  place-items: center !important;
  width: 2.15rem !important;
  height: 2.15rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: var(--color-ink) !important;
  cursor: pointer !important;
  box-shadow: 0 0.6rem 1.3rem rgba(18, 57, 93, 0.055) !important;
  transition:
    transform 180ms ease,
    background 180ms ease,
    color 180ms ease,
    border-color 180ms ease !important;
}
.product-card__cart svg{
  width: 1rem !important;
  height: 1rem !important;
}
.product-card__cart:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(31, 111, 174, 0.24) !important;
  background: var(--color-blue) !important;
  color: #ffffff !important;
}
.product-card__cart:disabled{
  cursor: not-allowed !important;
  opacity: 0.45 !important;
}

@media (max-width: 989px) {
.main-collection__grid,
.product-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 749px) {
.main-collection{
    padding: 2.25rem 0 3.25rem !important;
  }
.main-collection .container,
.main-collection__container{
    width: min(calc(100% - 1.4rem), 36rem) !important;
  }
.main-collection__header{
    margin-bottom: 1.3rem !important;
  }
.main-collection__eyebrow{
    font-size: 0.58rem !important;
  }
.main-collection__heading{
    font-size: clamp(2.5rem, 12vw, 3.5rem) !important;
  }
.main-collection__grid,
.product-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem 0.85rem !important;
  }
.product-card__media{
    border-radius: 1rem !important;
    aspect-ratio: 1 / 1.16 !important;
  }
.product-card__content{
    padding-top: 0.58rem !important;
  }
.product-card__vendor{
    font-size: 0.5rem !important;
  }
.product-card__title a{
    font-size: 0.68rem !important;
  }
.product-card__rating{
    margin-top: 0.35rem !important;
    gap: 0.25rem !important;
  }
.product-card__stars{
    font-size: 0.62rem !important;
  }
.product-card__review-count{
    font-size: 0.58rem !important;
  }
.product-card__price{
    font-size: 0.68rem !important;
  }
.product-card__cart{
    width: 1.95rem !important;
    height: 1.95rem !important;
  }
}
/* =========================================================
   COLLECTION GRID HARD FIX
   Fix card overlap + align page width with header/footer.
   Must stay at END of theme.css.
   ========================================================= */

.main-collection{
  padding-top: clamp(3rem, 5vw, 5rem) !important;
  padding-bottom: clamp(4rem, 6vw, 6rem) !important;
}
/* Align collection content with the same premium content rhythm */
.main-collection .container,
.main-collection__container{
  width: min(calc(100% - 3rem), 72rem) !important;
  max-width: 72rem !important;
  margin-inline: auto !important;
}
/* Header should align with product grid left edge */
.main-collection__header{
  width: 100% !important;
  max-width: 36rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: clamp(1.5rem, 2.8vw, 2.25rem) !important;
}
/* Critical grid reset: no overlap */
.main-collection__grid,
.product-grid{
  display: grid !important;
  width: 100% !important;
  max-width: 100% !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1.25rem, 2vw, 1.65rem) !important;
  align-items: start !important;
}
/* Critical card reset */
.product-card{
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
}
/* Media must obey grid column width */
.product-card__media{
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.12 !important;
  border-radius: 1.1rem !important;
  box-sizing: border-box !important;
  transform: none;
}
/* Remove any old absolute/oversized image behavior */
.product-card__image{
  display: block !important;
  width: 68% !important;
  height: 68% !important;
  max-width: 68% !important;
  max-height: 68% !important;
  object-fit: contain !important;
}
/* Tighter card text */
.product-card__content{
  width: 100% !important;
  max-width: 100% !important;
  padding: 0.68rem 0.05rem 0 !important;
  box-sizing: border-box !important;
}
.product-card__vendor{
  margin-bottom: 0.25rem !important;
}
.product-card__title a{
  font-size: 0.76rem !important;
  line-height: 1.15 !important;
}
.product-card__rating{
  margin-top: 0.38rem !important;
}
.product-card__bottom{
  margin-top: 0.4rem !important;
}
/* Prevent cart button from pushing layout weirdly */
.product-card__form{
  flex: 0 0 auto !important;
}
.product-card__cart{
  flex: 0 0 auto !important;
}
/* Tablet */
@media (max-width: 989px){
  .main-collection .container,
  .main-collection__container {
    width: min(calc(100% - 2rem), 48rem) !important;
    max-width: 48rem !important;
  }

  .main-collection__grid,
  .product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
  }
}
/* Mobile */
@media (max-width: 749px){
  .main-collection {
    padding-top: 2.2rem !important;
    padding-bottom: 3.4rem !important;
  }

  .main-collection .container,
  .main-collection__container {
    width: min(calc(100% - 1.35rem), 36rem) !important;
    max-width: 36rem !important;
  }

  .main-collection__header {
    margin-bottom: 1.25rem !important;
  }

  .main-collection__heading {
    font-size: clamp(2.45rem, 11vw, 3.35rem) !important;
  }

  .main-collection__grid,
  .product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem 0.8rem !important;
  }

  .product-card__media {
    aspect-ratio: 1 / 1.1 !important;
    border-radius: 0.95rem !important;
  }

  .product-card__image {
    width: 66% !important;
    height: 66% !important;
    max-width: 66% !important;
    max-height: 66% !important;
  }

  .product-card__content {
    padding-top: 0.55rem !important;
  }

  .product-card__vendor {
    font-size: 0.48rem !important;
  }

  .product-card__title a {
    font-size: 0.66rem !important;
  }

  .product-card__stars {
    font-size: 0.58rem !important;
  }

  .product-card__review-count {
    font-size: 0.54rem !important;
  }

  .product-card__price {
    font-size: 0.66rem !important;
  }

  .product-card__cart {
    width: 1.9rem !important;
    height: 1.9rem !important;
  }
}
/* =========================================================
   COLLECTION PAGE FINAL FIX
   Correct title class + hard grid/card reset.
   ========================================================= */

.main-collection{
  padding: clamp(3rem, 5vw, 5rem) 0 clamp(4rem, 6vw, 6rem) !important;
  background:
    radial-gradient(circle at 8% 8%, rgba(142, 205, 224, 0.14), transparent 28rem),
    radial-gradient(circle at 92% 12%, rgba(201, 162, 39, 0.08), transparent 28rem),
    #f8fbfd !important;
}
.main-collection > .container,
.main-collection .container{
  width: min(calc(100% - 3rem), 72rem) !important;
  max-width: 72rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}
.main-collection__header{
  width: 100% !important;
  max-width: 36rem !important;
  margin: 0 0 clamp(1.5rem, 2.8vw, 2.25rem) !important;
}
.main-collection__eyebrow{
  margin: 0 0 0.55rem !important;
  color: #c9a227 !important;
  font-size: 0.66rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.main-collection__title{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-family: var(--font-heading-family) !important;
  font-size: clamp(2.7rem, 4.8vw, 4.35rem) !important;
  font-weight: 500 !important;
  letter-spacing: -0.052em !important;
  line-height: 0.94 !important;
}
.main-collection__description{
  max-width: 34rem !important;
  margin: 0.9rem 0 0 !important;
  color: rgba(18, 57, 93, 0.68) !important;
  font-size: 0.95rem !important;
  line-height: 1.65 !important;
}
/* Hard grid reset */
.main-collection__grid{
  display: grid !important;
  width: 100% !important;
  max-width: 100% !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1.25rem, 2vw, 1.65rem) !important;
  align-items: start !important;
}
/* Hard card reset */
.main-collection__grid .product-card{
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  overflow: visible !important;
}
.main-collection__grid .product-card__media{
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  aspect-ratio: 1 / 1.1 !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(18, 57, 93, 0.09) !important;
  border-radius: 1.05rem !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.9), transparent 36%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(239, 247, 251, 0.66)) !important;
  overflow: hidden !important;
  box-shadow:
    0 1rem 2.4rem rgba(18, 57, 93, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.88) !important;
}
.main-collection__grid .product-card__image{
  display: block !important;
  width: 66% !important;
  height: 66% !important;
  max-width: 66% !important;
  max-height: 66% !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
}
.main-collection__grid .product-card__content{
  width: 100% !important;
  max-width: 100% !important;
  padding: 0.65rem 0.05rem 0 !important;
  box-sizing: border-box !important;
}
.main-collection__grid .product-card__vendor{
  margin: 0 0 0.25rem !important;
  color: #c9a227 !important;
  font-size: 0.52rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.main-collection__grid .product-card__title{
  margin: 0 !important;
}
.main-collection__grid .product-card__title a{
  color: var(--color-ink) !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}
.main-collection__grid .product-card__rating{
  margin-top: 0.38rem !important;
}
.main-collection__grid .product-card__bottom{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.65rem !important;
  margin-top: 0.4rem !important;
}
.main-collection__grid .product-card__price{
  margin: 0 !important;
  color: var(--color-ink) !important;
  font-size: 0.7rem !important;
  font-weight: 850 !important;
}
.main-collection__grid .product-card__cart{
  width: 2rem !important;
  height: 2rem !important;
  flex: 0 0 auto !important;
}
/* Tablet */
@media (max-width: 989px){
  .main-collection > .container,
  .main-collection .container {
    width: min(calc(100% - 2rem), 48rem) !important;
    max-width: 48rem !important;
  }

  .main-collection__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.2rem !important;
  }
}
/* Mobile */
@media (max-width: 749px){
  .main-collection {
    padding: 2.1rem 0 3.25rem !important;
  }

  .main-collection > .container,
  .main-collection .container {
    width: min(calc(100% - 1.35rem), 36rem) !important;
    max-width: 36rem !important;
  }

  .main-collection__header {
    margin-bottom: 1.2rem !important;
  }

  .main-collection__eyebrow {
    font-size: 0.56rem !important;
  }

  .main-collection__title {
    font-size: clamp(2.35rem, 11vw, 3.25rem) !important;
  }

  .main-collection__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem 0.8rem !important;
  }

  .main-collection__grid .product-card__media {
    aspect-ratio: 1 / 1.08 !important;
    border-radius: 0.9rem !important;
  }

  .main-collection__grid .product-card__image {
    width: 64% !important;
    height: 64% !important;
    max-width: 64% !important;
    max-height: 64% !important;
  }

  .main-collection__grid .product-card__content {
    padding-top: 0.52rem !important;
  }

  .main-collection__grid .product-card__vendor {
    font-size: 0.46rem !important;
  }

  .main-collection__grid .product-card__title a {
    font-size: 0.64rem !important;
  }

  .main-collection__grid .product-card__stars {
    font-size: 0.56rem !important;
  }

  .main-collection__grid .product-card__review-count {
    font-size: 0.52rem !important;
  }

  .main-collection__grid .product-card__price {
    font-size: 0.64rem !important;
  }

  .main-collection__grid .product-card__cart {
    width: 1.85rem !important;
    height: 1.85rem !important;
  }
}
/* =========================================================
   COLLECTION FINAL ALIGNMENT + IMAGE SCALE FIX
   Align collection width with header/footer and enlarge products.
   Must stay at END of theme.css.
   ========================================================= */

/* Wider premium container: closer to header/footer alignment */
.main-collection > .container,
.main-collection .container{
  width: min(calc(100% - 3rem), 88rem) !important;
  max-width: 88rem !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}
/* Keep title aligned to grid left edge */
.main-collection__header{
  max-width: 42rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
/* Better 4-column spacing on wide desktop */
.main-collection__grid{
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1.35rem, 2vw, 1.85rem) !important;
}
/* Product card media should be less empty */
.main-collection__grid .product-card__media{
  aspect-ratio: 1 / 1.03 !important;
  border-radius: 1.15rem !important;
}
/* Product images need more visual weight */
.main-collection__grid .product-card__image{
  width: 78% !important;
  height: 78% !important;
  max-width: 78% !important;
  max-height: 78% !important;
}
/* Give bottles/jars a cleaner center presence */
.main-collection__grid .product-card__media img{
  object-fit: contain !important;
  object-position: center !important;
}
/* Slightly tighter text block so bigger images do not make page feel bulky */
.main-collection__grid .product-card__content{
  padding-top: 0.58rem !important;
}
.main-collection__grid .product-card__vendor{
  font-size: 0.5rem !important;
}
.main-collection__grid .product-card__title a{
  font-size: 0.7rem !important;
}
.main-collection__grid .product-card__rating{
  margin-top: 0.34rem !important;
}
.main-collection__grid .product-card__bottom{
  margin-top: 0.34rem !important;
}
/* Large desktop: avoid huge outer whitespace */
@media (min-width: 1200px){
  .main-collection {
    padding-top: clamp(3rem, 4vw, 4.6rem) !important;
  }

  .main-collection__title {
    font-size: clamp(3rem, 4.3vw, 4.6rem) !important;
  }
}
/* Tablet */
@media (max-width: 989px){
  .main-collection > .container,
  .main-collection .container {
    width: min(calc(100% - 2rem), 52rem) !important;
    max-width: 52rem !important;
  }

  .main-collection__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 1.25rem !important;
  }

  .main-collection__grid .product-card__image {
    width: 76% !important;
    height: 76% !important;
    max-width: 76% !important;
    max-height: 76% !important;
  }
}
/* Mobile */
@media (max-width: 749px){
  .main-collection > .container,
  .main-collection .container {
    width: min(calc(100% - 1.35rem), 36rem) !important;
    max-width: 36rem !important;
  }

  .main-collection__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem 0.85rem !important;
  }

  .main-collection__grid .product-card__media {
    aspect-ratio: 1 / 1.02 !important;
    border-radius: 0.95rem !important;
  }

  .main-collection__grid .product-card__image {
    width: 76% !important;
    height: 76% !important;
    max-width: 76% !important;
    max-height: 76% !important;
  }
}
/* =========================================================
   GLOBAL TYPOGRAPHY SCALE
   Standard heading sizes across the theme.
   Keep at END so old oversized section rules cannot win.
   ========================================================= */

:root{
  --cv-h1-size: clamp(2.25rem, 3.8vw, 3.6rem);
  --cv-h2-size: clamp(1.85rem, 3vw, 2.75rem);
  --cv-h3-size: clamp(1.25rem, 2vw, 1.65rem);

  --cv-h1-line-height: 1;
  --cv-h2-line-height: 1.04;
  --cv-h3-line-height: 1.15;

  --cv-heading-letter-spacing: -0.04em;
  --cv-heading-weight: 500;
}
/* Native heading defaults */
h1,
.h1{
  font-family: var(--font-heading-family) !important;
  font-size: var(--cv-h1-size) !important;
  font-weight: var(--cv-heading-weight) !important;
  line-height: var(--cv-h1-line-height) !important;
  letter-spacing: var(--cv-heading-letter-spacing) !important;
}
h2,
.h2{
  font-family: var(--font-heading-family) !important;
  font-size: var(--cv-h2-size) !important;
  font-weight: var(--cv-heading-weight) !important;
  line-height: var(--cv-h2-line-height) !important;
  letter-spacing: var(--cv-heading-letter-spacing) !important;
}
h3,
.h3{
  font-family: var(--font-heading-family) !important;
  font-size: var(--cv-h3-size) !important;
  font-weight: 650 !important;
  line-height: var(--cv-h3-line-height) !important;
  letter-spacing: -0.025em !important;
}
/* Page/section heading aliases */
.cart-page__heading,
.main-collection__title,
.main-collection__heading,
.product-reviews__heading,
.related-products__heading,
.featured-products__heading,
.bestsellers__heading,
.brand-promise__heading,
.site-footer__heading{
  font-family: var(--font-heading-family) !important;
  font-size: var(--cv-h1-size) !important;
  font-weight: var(--cv-heading-weight) !important;
  line-height: var(--cv-h1-line-height) !important;
  letter-spacing: var(--cv-heading-letter-spacing) !important;
}
/* Secondary section headings */
.product-main__title,
.cart-drawer__title,
.cart-summary__heading,
.cart-drawer__empty h3{
  font-family: var(--font-heading-family) !important;
  font-size: var(--cv-h2-size) !important;
  font-weight: var(--cv-heading-weight) !important;
  line-height: var(--cv-h2-line-height) !important;
  letter-spacing: var(--cv-heading-letter-spacing) !important;
}
/* Product/card utility headings should not inherit huge page heading scale */
.product-card__title,
.product-card__title a,
.related-product-card__title,
.cart-item__title,
.cart-drawer-item__title,
.bestseller-card__title{
  font-family: inherit !important;
  font-size: inherit;
  letter-spacing: inherit;
}
/* Eyebrow standard */
.cart-page__eyebrow,
.main-collection__eyebrow,
.product-reviews__eyebrow,
.bestsellers__eyebrow,
.brand-promise__eyebrow{
  font-size: 0.62rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
/* Mobile typography */
@media (max-width: 749px){
  :root {
    --cv-h1-size: clamp(2rem, 9vw, 2.75rem);
    --cv-h2-size: clamp(1.55rem, 7vw, 2.15rem);
    --cv-h3-size: clamp(1.08rem, 5vw, 1.35rem);
  }

  .cart-page__header,
  .main-collection__header {
    margin-bottom: 1rem !important;
  }
}
/* =========================================================
   GLOBAL HEADING FONT RESTORE
   Use the same premium display font as hero headings.
   Must stay at END of theme.css.
   ========================================================= */

:root{
  /*
    Prefer the theme heading font first.
    If the hero uses a custom variable already, this keeps it aligned.
  */
  --cv-display-font: var(--font-heading-family);
}
/* Restore premium display font for actual headings */
h1,
.h1,
h2,
.h2,
.cart-page__heading,
.main-collection__title,
.main-collection__heading,
.product-reviews__heading,
.related-products__heading,
.featured-products__heading,
.bestsellers__heading,
.brand-promise__heading{
  font-family: var(--cv-display-font) !important;
}
/* Keep h3 slightly more utility/readable unless it is a section title */
h3,
.h3{
  font-family: var(--font-heading-family) !important;
}
/* Protect hero headings from global typography overrides */
.hero-themeblocks-skincare__heading,
.themeblocks-skincare-hero__heading,
.hero__heading,
.hero h1,
.hero h2,
[data-themeblocks-skincare-hero] h1,
[data-themeblocks-skincare-hero] h2{
  font-family: var(--cv-display-font) !important;
}
/* =========================================================
   GLOBAL PREMIUM DISPLAY FONT
   Editorial serif heading style,
matching ThemeBlocks Skincare hero.
   Must stay at END of theme.css.
   ========================================================= */

:root{
  --cv-display-font: "Cormorant Garamond", "Cormorant Infant", "Playfair Display", Georgia, serif;
}
/* Global heading font */
h1,
.h1,
h2,
.h2,
.cart-page__heading,
.main-collection__title,
.main-collection__heading,
.product-reviews__heading,
.related-products__heading,
.featured-products__heading,
.bestsellers__heading,
.brand-promise__heading,
.hero-themeblocks-skincare__heading,
.themeblocks-skincare-hero__heading,
.hero__heading,
[data-themeblocks-skincare-hero] h1,
[data-themeblocks-skincare-hero] h2{
  font-family: var(--cv-display-font) !important;
  font-weight: 600 !important;
  letter-spacing: -0.045em !important;
}
/* Keep product/card utility titles as clean sans */
.product-card__title,
.product-card__title a,
.related-product-card__title,
.cart-item__title,
.cart-drawer-item__title,
.bestseller-card__title,
.product-main__title{
  font-family: inherit !important;
}
/* Optional italic display style for emphasized words */
h1 em,
h2 em,
.cart-page__heading em,
.main-collection__title em,
.hero-themeblocks-skincare__heading em,
.themeblocks-skincare-hero__heading em,
[data-themeblocks-skincare-hero] em{
  font-family: var(--cv-display-font) !important;
  font-style: italic !important;
  font-weight: 500 !important;
  letter-spacing: -0.055em !important;
}
/* =========================================================
   FINAL FONT CONFIG SCOPE
   Heading setting controls section/editorial headings only.
   Body setting controls everything else.
   ========================================================= */

/* Default everything back to body font */
body,
p,
a,
li,
span,
small,
label,
input,
textarea,
select,
option,
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.product-main__title,
.product-main__title *,
.product-card__title,
.product-card__title a,
.related-product-card__title,
.related-product-card__title a,
.bestseller-card__title,
.bestseller-card__title a,
.cart-item__title,
.cart-item__title a,
.cart-drawer-item__title,
.cart-drawer-item__title a,
.cart-summary__heading,
.cart-drawer__title,
.site-footer,
.site-footer *,
.jdgm-widget,
.jdgm-widget *{
  font-family: var(--font-body-family) !important;
  font-style: var(--font-body-style) !important;
}
/* Heading font only for section/editorial headings */
.hero-themeblocks-skincare__heading,
.themeblocks-skincare-hero__heading,
.hero__heading,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading,
.cart-page__heading,
.main-collection__title,
.main-collection__heading,
.product-reviews__heading,
.related-products__heading,
.featured-products__heading,
.bestsellers__heading,
.brand-promise__heading,
.skin-goals__heading,
.skin-goals__title,
.cart-empty h2{
  font-family: var(--cv-display-font, var(--font-heading-family)) !important;
  font-style: var(--font-heading-style) !important;
  font-weight: var(--font-heading-weight) !important;
}
/* Buttons/nav/badges */
button,
.button,
.shopify-payment-button__button,
.site-header__nav-link,
.site-header__cart,
.product-card__cart,
.related-product-card__cart,
.cart-summary__checkout,
.cart-summary__update,
.cart-drawer__checkout,
.cart-drawer__cart-link,
.cart-item__remove,
.cart-drawer-item__remove,
.cart-empty__button,
.product-card__vendor,
.related-product-card__vendor,
.main-collection__eyebrow,
.cart-page__eyebrow,
.product-reviews__eyebrow,
.bestsellers__eyebrow,
.brand-promise__eyebrow{
  font-family: var(--font-button-family) !important;
  font-style: var(--font-button-style) !important;
  font-weight: var(--font-button-weight) !important;
}
/* =========================================================
   SPLIT HEADING FONT FIX
   Heading animation wraps words in spans,
so force those spans
   to inherit the configured section heading font.
   ========================================================= */

.hero-themeblocks-skincare__heading,
.hero-themeblocks-skincare__heading *,
.themeblocks-skincare-hero__heading,
.themeblocks-skincare-hero__heading *,
.hero__heading,
.hero__heading *,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading *,
[data-themeblocks-skincare-hero] .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-space,
.heading-written-word,
.heading-written-space{
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-style: inherit !important;
  font-weight: var(--font-heading-weight, 500) !important;
}
/* Preserve italic styling on emphasized split words */
.hero-themeblocks-skincare__heading em,
.hero-themeblocks-skincare__heading em *,
.themeblocks-skincare-hero__heading em,
.themeblocks-skincare-hero__heading em *,
.hero__heading em,
.hero__heading em *,
[data-themeblocks-skincare-hero] em,
[data-themeblocks-skincare-hero] em *{
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-style: italic !important;
  font-weight: 500 !important;
}
/* =========================================================
   CAREVIELLE DEFAULT EDITORIAL HEADING FALLBACK
   Default section heading font is Georgia unless customizer uses Shopify font mode.
   ========================================================= */

.hero-themeblocks-skincare__heading,
.hero-themeblocks-skincare__heading *,
.themeblocks-skincare-hero__heading,
.themeblocks-skincare-hero__heading *,
.hero__heading,
.hero__heading *,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading *,
[data-themeblocks-skincare-hero] .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-space,
.cart-page__heading,
.main-collection__title,
.main-collection__heading,
.product-reviews__heading,
.related-products__heading,
.featured-products__heading,
.bestsellers__heading,
.brand-promise__heading,
.skin-goals__heading,
.skin-goals__title,
.cart-empty h2{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: inherit !important;
}
/* Italic display words */
.hero-themeblocks-skincare__heading em,
.hero-themeblocks-skincare__heading em *,
.themeblocks-skincare-hero__heading em,
.themeblocks-skincare-hero__heading em *,
.hero__heading em,
.hero__heading em *,
[data-themeblocks-skincare-hero] em,
[data-themeblocks-skincare-hero] em *,
.cart-page__heading em,
.main-collection__title em,
.product-reviews__heading em,
.related-products__heading em,
.featured-products__heading em,
.bestsellers__heading em,
.brand-promise__heading em,
.skin-goals__title em{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: italic !important;
  font-weight: 500 !important;
}
/* =========================================================
   SECTION HEADING WEIGHT + ACCENT ITALIC OPTION
   Uses Theme settings > Typography.
   ========================================================= */

.hero-themeblocks-skincare__heading,
.hero-themeblocks-skincare__heading *,
.themeblocks-skincare-hero__heading,
.themeblocks-skincare-hero__heading *,
.hero__heading,
.hero__heading *,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading *,
[data-themeblocks-skincare-hero] .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-space,
.cart-page__heading,
.main-collection__title,
.main-collection__heading,
.product-reviews__heading,
.related-products__heading,
.featured-products__heading,
.bestsellers__heading,
.brand-promise__heading,
.skin-goals__heading,
.skin-goals__title,
.cart-empty h2{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-weight: var(--font-heading-weight, 700) !important;
}
/* Explicit heading accents */
.hero-themeblocks-skincare__heading em,
.hero-themeblocks-skincare__heading em *,
.themeblocks-skincare-hero__heading em,
.themeblocks-skincare-hero__heading em *,
.hero__heading em,
.hero__heading em *,
[data-themeblocks-skincare-hero] em,
[data-themeblocks-skincare-hero] em *,
.cart-page__heading em,
.main-collection__title em,
.product-reviews__heading em,
.related-products__heading em,
.featured-products__heading em,
.bestsellers__heading em,
.brand-promise__heading em,
.skin-goals__title em{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-weight, 700) !important;
}
/* Split-heading support: add italic only to words inside <em> after JS wrapping */
[data-themeblocks-skincare-hero] em .heading-written-word,
[data-themeblocks-skincare-hero] em .heading-written-space,
.hero-themeblocks-skincare__heading em .heading-written-word,
.hero-themeblocks-skincare__heading em .heading-written-space{
  font-style: var(--cv-heading-accent-style, italic) !important;
}
/* =========================================================
   HEADING ACCENT WEIGHT FIX
   Accent/italic heading words should stay semi bold,
not bold.
   ========================================================= */

.hero-themeblocks-skincare__heading em,
.hero-themeblocks-skincare__heading em *,
.themeblocks-skincare-hero__heading em,
.themeblocks-skincare-hero__heading em *,
.hero__heading em,
.hero__heading em *,
[data-themeblocks-skincare-hero] em,
[data-themeblocks-skincare-hero] em *,
.cart-page__heading em,
.main-collection__title em,
.product-reviews__heading em,
.related-products__heading em,
.featured-products__heading em,
.bestsellers__heading em,
.brand-promise__heading em,
.skin-goals__title em{
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: 600 !important;
}
/* Split-heading support after JS wraps the words */
[data-themeblocks-skincare-hero] em .heading-written-word,
[data-themeblocks-skincare-hero] em .heading-written-space,
.hero-themeblocks-skincare__heading em .heading-written-word,
.hero-themeblocks-skincare__heading em .heading-written-space{
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: 600 !important;
}
/* =========================================================
   HARD FIX: HERO HEADING ACCENT WEIGHT
   Radiant You / italic accent must stay lighter than the main heading.
   This targets split-animation spans even when <em> wrapper is lost/changed.
   ========================================================= */

/* Normal hero heading words can stay bold */
.hero-themeblocks-skincare__heading .heading-written-word,
.themeblocks-skincare-hero__heading .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-word{
  font-weight: var(--font-heading-weight, 700) !important;
}
/* Any italic/accent context must be lighter */
.hero-themeblocks-skincare__heading em,
.hero-themeblocks-skincare__heading em *,
.themeblocks-skincare-hero__heading em,
.themeblocks-skincare-hero__heading em *,
[data-themeblocks-skincare-hero] em,
[data-themeblocks-skincare-hero] em *,
.hero-themeblocks-skincare__heading i,
.hero-themeblocks-skincare__heading i *,
.themeblocks-skincare-hero__heading i,
.themeblocks-skincare-hero__heading i *,
[data-themeblocks-skincare-hero] i,
[data-themeblocks-skincare-hero] i *{
  font-style: italic !important;
  font-weight: 500 !important;
}
/* If JS split creates accent-specific classes */
.heading-written-word.is-accent,
.heading-written-word.is-italic,
.heading-written-word.heading-written-word--accent,
.heading-written-word.heading-written-word--italic,
.hero-themeblocks-skincare__heading .is-accent,
.hero-themeblocks-skincare__heading .is-italic,
.themeblocks-skincare-hero__heading .is-accent,
.themeblocks-skincare-hero__heading .is-italic,
[data-themeblocks-skincare-hero] .is-accent,
[data-themeblocks-skincare-hero] .is-italic{
  font-style: italic !important;
  font-weight: 500 !important;
}
/* ThemeBlocks Skincare hero fallback: second visual line/accent words */
.hero-themeblocks-skincare__heading .heading-written-word:nth-last-of-type(-n+2),
.themeblocks-skincare-hero__heading .heading-written-word:nth-last-of-type(-n+2),
[data-themeblocks-skincare-hero] .heading-written-word:nth-last-of-type(-n+2){
  font-weight: 500 !important;
}
/* Exact hero text fallback for current heading if spans are generated per word */
.hero-themeblocks-skincare__heading .heading-written-word,
.themeblocks-skincare-hero__heading .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-word{
  font-variation-settings: normal !important;
}
/* =========================================================
   FINAL HEADING ACCENT CONTROL
   Accent spans are generated by heading splitter JS.
   ========================================================= */

/* Main split heading words follow section heading weight */
.hero-themeblocks-skincare__heading .heading-written-word,
.themeblocks-skincare-hero__heading .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-word{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-weight: var(--font-heading-weight, 700) !important;
}
/* Accent words follow separate accent weight */
.hero-themeblocks-skincare__heading .heading-written-word.is-heading-accent,
.themeblocks-skincare-hero__heading .heading-written-word.is-heading-accent,
[data-themeblocks-skincare-hero] .heading-written-word.is-heading-accent,
.heading-written-word.is-heading-accent{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 500) !important;
}
/* If original <em> survives anywhere,
enforce same accent setting */
.hero-themeblocks-skincare__heading em,
.hero-themeblocks-skincare__heading em *,
.themeblocks-skincare-hero__heading em,
.themeblocks-skincare-hero__heading em *,
[data-themeblocks-skincare-hero] em,
[data-themeblocks-skincare-hero] em *{
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 500) !important;
}
/* =========================================================
   FINAL HERO SPLIT ACCENT FIX
   Every word generated from <em> receives .is-heading-accent.
   ========================================================= */

[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading .heading-written-word,
.hero-themeblocks-skincare__heading .heading-written-word{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  font-style: normal !important;
}
/* Radiant + You should both be accent weight */
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading .heading-written-word.is-heading-accent,
.hero-themeblocks-skincare__heading .heading-written-word.is-heading-accent,
.heading-written-word.is-heading-accent{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-weight: var(--font-heading-accent-weight, 500) !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
}
/* Spaces inside accent line should not affect visual weight */
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading .heading-written-space,
.hero-themeblocks-skincare__heading .heading-written-space{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
}
/* Kill earlier nth-last fallback that made only the last words inconsistent */
[data-themeblocks-skincare-hero] .heading-written-word:nth-last-of-type(-n+2),
.hero-themeblocks-skincare__heading .heading-written-word:nth-last-of-type(-n+2){
  font-weight: inherit !important;
}
[data-themeblocks-skincare-hero] .heading-written-word.is-heading-accent:nth-last-of-type(-n+2),
.hero-themeblocks-skincare__heading .heading-written-word.is-heading-accent:nth-last-of-type(-n+2){
  font-weight: var(--font-heading-accent-weight, 500) !important;
}
/* =========================================================
   HARDENED HERO ACCENT WEIGHT OVERRIDE
   Must stay at END. Wins over split-heading and global heading rules.
   ========================================================= */

html body [data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading .heading-written-word.is-heading-accent,
html body .hero-themeblocks-skincare__heading .heading-written-word.is-heading-accent,
html body .heading-written-word.is-heading-accent{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 400) !important;
}
/* Ensure non-accent hero words keep main heading weight */
html body [data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading .heading-written-word:not(.is-heading-accent),
html body .hero-themeblocks-skincare__heading .heading-written-word:not(.is-heading-accent){
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: normal !important;
  font-weight: var(--font-heading-weight, 700) !important;
}
/* =========================================================
   CLINICAL / BANNER HEADING ACCENT SUPPORT
   Extends global heading + accent controls beyond homepage hero.
   ========================================================= */

/* Main clinical/banner section heading */
.clinical-banner__heading,
.clinical-banner__heading *,
.clinical__heading,
.clinical__heading *,
.banner__heading,
.banner__heading *,
.image-banner__heading,
.image-banner__heading *,
[data-clinical-banner] .heading-written-word,
[data-clinical-banner] .heading-written-space,
[data-section-type="clinical-banner"] .heading-written-word,
[data-section-type="clinical-banner"] .heading-written-space{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-weight: var(--font-heading-weight, 700) !important;
}
/* Accent words inside clinical/banner headings */
.clinical-banner__heading em,
.clinical-banner__heading em *,
.clinical__heading em,
.clinical__heading em *,
.banner__heading em,
.banner__heading em *,
.image-banner__heading em,
.image-banner__heading em *,
[data-clinical-banner] em,
[data-clinical-banner] em *,
[data-section-type="clinical-banner"] em,
[data-section-type="clinical-banner"] em *,
[data-clinical-banner] .is-heading-accent,
[data-section-type="clinical-banner"] .is-heading-accent{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 400) !important;
}
/* =========================================================
   FOOTER MENU TITLE SIZE FIX
   Footer column titles should be compact utility labels,
not large section headings.
   ========================================================= */

.site-footer__heading,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer__menu-title,
.site-footer__column-title{
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: var(--font-button-weight, 700) !important;
  line-height: 1.1 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--color-blue, #1f6fae) !important;
  margin: 0 0 1rem !important;
}
.site-footer a,
.site-footer__link,
.site-footer__menu a{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.9rem !important;
  font-weight: var(--font-body-weight, 400) !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

@media (max-width: 749px) {
.site-footer__heading,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer__menu-title,
.site-footer__column-title{
    font-size: 0.68rem !important;
    margin-bottom: 0.75rem !important;
  }
.site-footer a,
.site-footer__link,
.site-footer__menu a{
    font-size: 0.86rem !important;
  }
}
/* =========================================================
   FINAL UNIFIED EDITORIAL HEADING SCALE
   One consistent scale for all section/page editorial headings.
   Must stay at the very END of theme.css.
   ========================================================= */

:root{
  --cv-heading-display-size: clamp(3rem, 5vw, 5.15rem);
  --cv-heading-display-size-compact: clamp(2.55rem, 4.2vw, 4.4rem);
  --cv-heading-display-size-hero: clamp(3.2rem, 5.4vw, 5.65rem);
  --cv-heading-display-line: 0.96;
  --cv-heading-display-spacing: -0.045em;
}
/* Hero heading: allowed slightly larger */
.hero-themeblocks-skincare__heading,
.themeblocks-skincare-hero__heading,
.hero__heading,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: var(--cv-heading-display-size-hero) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: 0.94 !important;
  letter-spacing: var(--cv-heading-display-spacing) !important;
}
/* Hero split words inherit exact hero heading sizing */
.hero-themeblocks-skincare__heading .heading-written-word,
.hero-themeblocks-skincare__heading .heading-written-space,
.themeblocks-skincare-hero__heading .heading-written-word,
.themeblocks-skincare-hero__heading .heading-written-space,
[data-themeblocks-skincare-hero] .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-space{
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}
/* Hero accent words */
.hero-themeblocks-skincare__heading .heading-written-word.is-heading-accent,
.themeblocks-skincare-hero__heading .heading-written-word.is-heading-accent,
[data-themeblocks-skincare-hero] .heading-written-word.is-heading-accent,
.heading-written-word.is-heading-accent{
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 400) !important;
}
/* Standard section/page headings */
.main-collection__title,
.main-collection__heading,
.bestsellers__heading,
.featured-products__heading,
.related-products__heading,
.product-reviews__heading,
.brand-promise__heading,
.skin-goals__heading,
.skin-goals__title,
.clinical-banner__heading,
.clinical__heading,
.banner__heading,
.image-banner__heading,
.newsletter__heading,
.newsletter-section__heading,
.community__heading,
.email-signup__heading,
[data-clinical-banner] h1,
[data-clinical-banner] h2,
[data-section-type="clinical-banner"] h1,
[data-section-type="clinical-banner"] h2,
[data-newsletter] h1,
[data-newsletter] h2{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: var(--cv-heading-display-size) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: var(--cv-heading-display-line) !important;
  letter-spacing: var(--cv-heading-display-spacing) !important;
}
/* Cart/page utility headings should be smaller than marketing sections */
.cart-page__heading,
.cart-empty h2{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: var(--cv-heading-display-size-compact) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: 0.98 !important;
  letter-spacing: var(--cv-heading-display-spacing) !important;
}
/* Accent/em words inside all editorial headings */
.hero-themeblocks-skincare__heading em,
.hero-themeblocks-skincare__heading em *,
.themeblocks-skincare-hero__heading em,
.themeblocks-skincare-hero__heading em *,
.hero__heading em,
.hero__heading em *,
[data-themeblocks-skincare-hero] em,
[data-themeblocks-skincare-hero] em *,
.main-collection__title em,
.main-collection__heading em,
.bestsellers__heading em,
.featured-products__heading em,
.related-products__heading em,
.product-reviews__heading em,
.brand-promise__heading em,
.skin-goals__heading em,
.skin-goals__title em,
.clinical-banner__heading em,
.clinical-banner__heading em *,
.clinical__heading em,
.clinical__heading em *,
.banner__heading em,
.banner__heading em *,
.image-banner__heading em,
.image-banner__heading em *,
.newsletter__heading em,
.newsletter__heading em *{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 400) !important;
}
/* Important: utility headings must NOT use editorial scale */
.cart-summary__heading,
.cart-drawer__title,
.site-footer__heading,
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.product-main__title,
.product-card__title,
.product-card__title a,
.related-product-card__title,
.related-product-card__title a,
.bestseller-card__title,
.bestseller-card__title a,
.cart-item__title,
.cart-item__title a,
.cart-drawer-item__title,
.cart-drawer-item__title a{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}
/* Footer titles remain compact */
.site-footer__heading,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer__menu-title,
.site-footer__column-title{
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: var(--font-button-weight, 700) !important;
  line-height: 1.1 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}
/* Mobile unified scale */
@media (max-width: 749px){
  :root {
    --cv-heading-display-size: clamp(2.2rem, 9vw, 3.25rem);
    --cv-heading-display-size-compact: clamp(2rem, 8.5vw, 2.9rem);
    --cv-heading-display-size-hero: clamp(2.35rem, 10vw, 3.45rem);
  }

  .main-collection__title,
  .main-collection__heading,
  .bestsellers__heading,
  .featured-products__heading,
  .related-products__heading,
  .product-reviews__heading,
  .brand-promise__heading,
  .skin-goals__heading,
  .skin-goals__title,
  .clinical-banner__heading,
  .clinical__heading,
  .banner__heading,
  .image-banner__heading,
  .newsletter__heading,
  .newsletter-section__heading,
  .community__heading,
  .email-signup__heading {
    line-height: 0.98 !important;
  }
}
/* =========================================================
   FINAL CARD / COLLECTION TITLE RESET
   Prevent collection/card titles from inheriting large editorial heading styles.
   Must stay at END of theme.css.
   ========================================================= */

/* Collection/card item titles are NOT section headings */
.skin-goals__card-title,
.skin-goals__item-title,
.skin-goals__collection-title,
.collection-card__title,
.collection-list__title,
.featured-collection-card__title,
.featured-collections__card-title,
.featured-collections__title,
.featured-collections h3,
.featured-collections h4,
.collection-card h3,
.collection-card h4,
[class*="collection-card"] h3,
[class*="collection-card"] h4,
[class*="skin-goals"] h3,
[class*="skin-goals"] h4{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1.35rem, 2.4vw, 2.15rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.025em !important;
  text-transform: none !important;
}
/* Keep only the actual section heading as display serif */
.skin-goals__heading,
.skin-goals > .section-heading,
.skin-goals .section-heading,
.featured-collections__heading,
.featured-collections > .section-heading,
.featured-collections .section-heading{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: var(--cv-heading-display-size, clamp(3rem, 5vw, 5.15rem)) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: var(--cv-heading-display-line, 0.96) !important;
  letter-spacing: var(--cv-heading-display-spacing, -0.045em) !important;
}
/* Card descriptions/buttons stay compact */
.skin-goals__card-text,
.skin-goals__item-text,
.skin-goals__collection-text,
.collection-card__text,
.featured-collections__card-text,
[class*="collection-card"] p,
[class*="skin-goals"] p{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.9rem !important;
  font-weight: var(--font-body-weight, 400) !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}
.skin-goals__card-button,
.skin-goals__item-button,
.collection-card__button,
.featured-collections__card-button,
[class*="collection-card"] .button,
[class*="skin-goals"] .button{
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.68rem !important;
  font-weight: var(--font-button-weight, 700) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}
/* Mobile card title reset */
@media (max-width: 749px){
  .skin-goals__card-title,
  .skin-goals__item-title,
  .skin-goals__collection-title,
  .collection-card__title,
  .collection-list__title,
  .featured-collection-card__title,
  .featured-collections__card-title,
  .featured-collections__title,
  .featured-collections h3,
  .featured-collections h4,
  .collection-card h3,
  .collection-card h4,
  [class*="collection-card"] h3,
  [class*="collection-card"] h4,
  [class*="skin-goals"] h3,
  [class*="skin-goals"] h4 {
    font-size: clamp(1.1rem, 5vw, 1.55rem) !important;
    line-height: 1.1 !important;
  }
}
/* =========================================================
   SKIN GOALS SECTION EXACT TYPOGRAPHY FIX
   Main section heading = editorial serif.
   Card titles = compact body/UI font.
   ========================================================= */

/* Top heading: Curated for Your Skin Goals */
.skin-goals__heading{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: var(--cv-heading-display-size, clamp(3rem, 5vw, 5.15rem)) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: var(--cv-heading-display-line, 0.96) !important;
  letter-spacing: var(--cv-heading-display-spacing, -0.045em) !important;
  text-align: center;
}
/* Accent inside top heading */
.skin-goals__heading em,
.skin-goals__heading em *,
.skin-goals__heading .is-heading-accent{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 400) !important;
}
/* Card titles: Hydrate & Glow / Clear & Balance */
.skin-goals__card-title{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1.35rem, 2.4vw, 2.15rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.025em !important;
  text-transform: none !important;
  color: var(--color-ink, #12395d) !important;
  margin: 1.1rem 0 0.45rem !important;
}
/* Card copy/button */
.skin-goals__card-title + p,
.skin-goals__card-text,
.skin-goals__text{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.92rem !important;
  font-weight: var(--font-body-weight, 400) !important;
  line-height: 1.55 !important;
}

@media (max-width: 749px) {
.skin-goals__heading{
    font-size: clamp(2.2rem, 9vw, 3.25rem) !important;
  }
.skin-goals__card-title{
    font-size: clamp(1.15rem, 5vw, 1.55rem) !important;
    line-height: 1.1 !important;
  }
}
/* =========================================================
   FINAL HARD CAP: EDITORIAL SECTION HEADING SIZE
   Prevents section headings from becoming oversized.
   Must stay at absolute END of theme.css.
   ========================================================= */

:root{
  --cv-heading-display-size: clamp(2.45rem, 3.6vw, 3.85rem);
  --cv-heading-display-size-compact: clamp(2.15rem, 3.2vw, 3.35rem);
  --cv-heading-display-size-hero: clamp(2.8rem, 4.4vw, 4.8rem);
}
/* Normal marketing/section headings */
.skin-goals__heading,
.bestsellers__heading,
.featured-products__heading,
.related-products__heading,
.product-reviews__heading,
.brand-promise__heading,
.clinical-banner__heading,
.clinical__heading,
.banner__heading,
.image-banner__heading,
.newsletter__heading,
.newsletter-section__heading,
.community__heading,
.email-signup__heading,
[data-clinical-banner] h1,
[data-clinical-banner] h2,
[data-section-type="clinical-banner"] h1,
[data-section-type="clinical-banner"] h2,
[data-newsletter] h1,
[data-newsletter] h2{
  font-size: var(--cv-heading-display-size) !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}
/* Page headings */
.main-collection__title,
.main-collection__heading,
.cart-page__heading,
.cart-empty h2{
  font-size: var(--cv-heading-display-size-compact) !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}
/* Hero is allowed slightly larger only */
.hero-themeblocks-skincare__heading,
.themeblocks-skincare-hero__heading,
.hero__heading,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading{
  font-size: var(--cv-heading-display-size-hero) !important;
  line-height: 0.95 !important;
  letter-spacing: -0.045em !important;
}
/* Split hero words inherit the capped size */
.hero-themeblocks-skincare__heading .heading-written-word,
.hero-themeblocks-skincare__heading .heading-written-space,
.themeblocks-skincare-hero__heading .heading-written-word,
.themeblocks-skincare-hero__heading .heading-written-space,
[data-themeblocks-skincare-hero] .heading-written-word,
[data-themeblocks-skincare-hero] .heading-written-space{
  font-size: inherit !important;
  line-height: inherit !important;
}
/* Skin goals card titles must stay compact */
.skin-goals__card-title{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1.2rem, 1.8vw, 1.65rem) !important;
  font-weight: 800 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.02em !important;
}
/* Utility headings should never use display sizing */
.cart-summary__heading,
.cart-drawer__title,
.site-footer__heading,
.site-footer h2,
.site-footer h3,
.site-footer h4{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
}
/* Mobile */
@media (max-width: 749px){
  :root {
    --cv-heading-display-size: clamp(2rem, 8vw, 2.8rem);
    --cv-heading-display-size-compact: clamp(1.9rem, 7.5vw, 2.65rem);
    --cv-heading-display-size-hero: clamp(2.25rem, 9vw, 3.15rem);
  }

  .skin-goals__card-title {
    font-size: clamp(1.05rem, 5vw, 1.4rem) !important;
  }
}
/* =========================================================
   SECTION-LEVEL HEADING SIZE CONTROLS
   Controlled per section via heading_size setting.
   Values: small / medium / large.
   ========================================================= */

/* Skin goals */
.skin-goals--heading-small .skin-goals__heading{
  font-size: clamp(2rem, 3vw, 3.2rem) !important;
}
.skin-goals--heading-medium .skin-goals__heading{
  font-size: clamp(2.45rem, 3.6vw, 3.85rem) !important;
}
.skin-goals--heading-large .skin-goals__heading{
  font-size: clamp(3rem, 4.6vw, 4.8rem) !important;
}
/* Bestsellers */
.bestsellers--heading-small .bestsellers__heading{
  font-size: clamp(2rem, 3vw, 3.2rem) !important;
}
.bestsellers--heading-medium .bestsellers__heading{
  font-size: clamp(2.45rem, 3.6vw, 3.85rem) !important;
}
.bestsellers--heading-large .bestsellers__heading{
  font-size: clamp(3rem, 4.6vw, 4.8rem) !important;
}
/* Main collection page */
.main-collection--heading-small .main-collection__title,
.main-collection--heading-small .main-collection__heading{
  font-size: clamp(2rem, 3vw, 3.2rem) !important;
}
.main-collection--heading-medium .main-collection__title,
.main-collection--heading-medium .main-collection__heading{
  font-size: clamp(2.45rem, 3.6vw, 3.85rem) !important;
}
.main-collection--heading-large .main-collection__title,
.main-collection--heading-large .main-collection__heading{
  font-size: clamp(3rem, 4.6vw, 4.8rem) !important;
}
/* Mobile section heading sizing */
@media (max-width: 749px){
  .skin-goals--heading-small .skin-goals__heading,
  .bestsellers--heading-small .bestsellers__heading,
  .main-collection--heading-small .main-collection__title,
  .main-collection--heading-small .main-collection__heading {
    font-size: clamp(1.85rem, 7.5vw, 2.55rem) !important;
  }

  .skin-goals--heading-medium .skin-goals__heading,
  .bestsellers--heading-medium .bestsellers__heading,
  .main-collection--heading-medium .main-collection__title,
  .main-collection--heading-medium .main-collection__heading {
    font-size: clamp(2.1rem, 8.5vw, 2.95rem) !important;
  }

  .skin-goals--heading-large .skin-goals__heading,
  .bestsellers--heading-large .bestsellers__heading,
  .main-collection--heading-large .main-collection__title,
  .main-collection--heading-large .main-collection__heading {
    font-size: clamp(2.4rem, 10vw, 3.35rem) !important;
  }
}
/* =========================================================
   BESTSELLER BADGE POLISH
   Premium compact ecommerce badge.
   ========================================================= */

.bestseller-card__badge,
.product-card__badge,
.related-product-card__badge,
[class*="badge"]{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  min-height: 1.45rem !important;
  padding: 0.34rem 0.62rem 0.3rem !important;
  border: 1px solid rgba(201, 162, 39, 0.28) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(254, 249, 242, 0.86)) !important;
  color: #8a6d13 !important;
  box-shadow:
    0 0.45rem 1rem rgba(201, 162, 39, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.85) !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.56rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
/* If badge sits over product image */
.bestseller-card__media .bestseller-card__badge,
.product-card__media .product-card__badge{
  position: absolute !important;
  top: 0.75rem !important;
  left: 0.75rem !important;
  z-index: 2 !important;
}
/* If badge is inside content,
keep spacing clean */
.bestseller-card__content .bestseller-card__badge,
.product-card__content .product-card__badge{
  margin-bottom: 0.5rem !important;
}

@media (max-width: 749px) {
.bestseller-card__badge,
.product-card__badge,
.related-product-card__badge,
[class*="badge"]{
    min-height: 1.3rem !important;
    padding: 0.28rem 0.5rem 0.24rem !important;
    font-size: 0.5rem !important;
    letter-spacing: 0.11em !important;
  }
}
/* =========================================================
   ADD TO CART BUTTON ROTATING ICON LOADER
   Keep button text/icon stable; rotate cart icon while loading.
   ========================================================= */

@keyframes themeblocks-skincareCartIconRotate{
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}
.product-card__cart,
.related-product-card__cart,
.bestseller-card__cart,
.product-main__add-button,
button[type="submit"][name="add"]{
  position: relative !important;
}
.product-card__cart.is-loading,
.related-product-card__cart.is-loading,
.bestseller-card__cart.is-loading,
.product-main__add-button.is-loading,
button[type="submit"][name="add"].is-loading{
  pointer-events: none !important;
  opacity: 0.82 !important;
}
/* Rotate icon if SVG exists */
.product-card__cart.is-loading svg,
.related-product-card__cart.is-loading svg,
.bestseller-card__cart.is-loading svg,
.product-main__add-button.is-loading svg,
button[type="submit"][name="add"].is-loading svg{
  animation: themeblocks-skincareCartIconRotate 680ms linear infinite !important;
  transform-origin: center !important;
}
/* If product main add button has text but no icon,
add a subtle spinner */
.product-main__add-button.is-loading::after,
button[type="submit"][name="add"].is-loading:not(:has(svg))::after{
  content: "" !important;
  display: inline-block !important;
  width: 0.9rem !important;
  height: 0.9rem !important;
  margin-left: 0.55rem !important;
  border: 2px solid currentColor !important;
  border-top-color: transparent !important;
  border-radius: 999px !important;
  animation: themeblocks-skincareCartIconRotate 680ms linear infinite !important;
}
/* Prevent text jump */
.product-card__cart.is-loading,
.related-product-card__cart.is-loading,
.bestseller-card__cart.is-loading{
  color: var(--color-blue, #1f6fae) !important;
}
/* =========================================================
   PDP + HOMEPAGE POLISH PASS
   1) Better PDP top rhythm
   2) Reviews heading locked
   3) Related heading locked
   4) Newsletter CTA heading uses UI/body font
   5) Product card/badge polish
   6) Footer balance guard
   ========================================================= */

/* 1) PDP top area: reduce the "zoomed out" feel */
.product-main,
.main-product,
.product{
  --cv-pdp-container: min(calc(100% - 3rem), 72rem);
}
.product-main .container,
.main-product .container,
.product-main__container,
.product-main__grid{
  width: var(--cv-pdp-container) !important;
  max-width: 72rem !important;
  margin-inline: auto !important;
}
.product-main__grid{
  gap: clamp(2.25rem, 5vw, 4rem) !important;
  align-items: start !important;
}
.product-main__media,
.product-main__gallery,
.product-main__image-wrapper{
  max-width: 35rem !important;
}
.product-main__info,
.product-main__details{
  max-width: 28rem !important;
}
.product-main__title{
  font-size: clamp(1.45rem, 2.2vw, 2.25rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.03em !important;
}
/* 2) Reviews heading: stable premium section scale */
.product-reviews__heading{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: clamp(2.65rem, 4.4vw, 4.45rem) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.045em !important;
}
/* 3) Related products heading: premium but not oversized */
.related-products__heading{
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: clamp(2.35rem, 3.8vw, 3.8rem) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}
/* 4) Newsletter / community CTA: use UI/body font,
not editorial serif */
.newsletter__heading,
.newsletter-section__heading,
.community__heading,
.email-signup__heading,
.newsletter h2,
.newsletter-section h2,
.community h2,
.email-signup h2,
[data-newsletter] h1,
[data-newsletter] h2,
[class*="newsletter"] h1,
[class*="newsletter"] h2,
[class*="community"] h1,
[class*="community"] h2{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1.75rem, 3vw, 3rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.035em !important;
  color: var(--color-ink, #12395d) !important;
}
.newsletter__eyebrow,
.newsletter-section__eyebrow,
.community__eyebrow,
.email-signup__eyebrow,
[class*="newsletter"] .eyebrow,
[class*="community"] .eyebrow{
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.62rem !important;
  font-weight: var(--font-button-weight, 700) !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}
/* 5) Product cards: premium compact badge + stable card text */
.bestseller-card__badge,
.product-card__badge,
.related-product-card__badge{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  min-height: 1.4rem !important;
  padding: 0.32rem 0.58rem 0.28rem !important;
  border: 1px solid rgba(201, 162, 39, 0.3) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255,255,255,0.94), rgba(254,249,242,0.88)) !important;
  color: #8a6d13 !important;
  box-shadow: 0 0.45rem 1rem rgba(201, 162, 39, 0.08), inset 0 1px 0 rgba(255,255,255,0.9) !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.54rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
.bestseller-card__title,
.bestseller-card__title a,
.product-card__title,
.product-card__title a,
.related-product-card__title,
.related-product-card__title a{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  line-height: 1.16 !important;
  letter-spacing: -0.01em !important;
  text-transform: uppercase !important;
}
.product-card__rating,
.bestseller-card__rating,
.related-product-card__rating{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
}
/* 6) Footer balance guard */
.site-footer__heading,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer__menu-title,
.site-footer__column-title{
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: var(--font-button-weight, 700) !important;
  line-height: 1.1 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--color-blue, #1f6fae) !important;
}
.site-footer a,
.site-footer__link,
.site-footer__menu a,
.site-footer p{
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.88rem !important;
  font-weight: var(--font-body-weight, 400) !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}
/* Add-to-cart loading rotation */
@keyframes themeblocks-skincareCartIconRotate{
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.product-card__cart.is-loading,
.related-product-card__cart.is-loading,
.bestseller-card__cart.is-loading,
.product-main__add-button.is-loading,
button[type="submit"][name="add"].is-loading{
  pointer-events: none !important;
  opacity: 0.82 !important;
}
.product-card__cart.is-loading svg,
.related-product-card__cart.is-loading svg,
.bestseller-card__cart.is-loading svg,
.product-main__add-button.is-loading svg,
button[type="submit"][name="add"].is-loading svg{
  animation: themeblocks-skincareCartIconRotate 680ms linear infinite !important;
  transform-origin: center !important;
}
/* Mobile polish */
@media (max-width: 749px){
  .product-main .container,
  .main-product .container,
  .product-main__container,
  .product-main__grid {
    width: min(calc(100% - 1.25rem), 36rem) !important;
  }

  .product-reviews__heading {
    font-size: clamp(2.05rem, 8.5vw, 3rem) !important;
  }

  .related-products__heading {
    font-size: clamp(1.95rem, 8vw, 2.75rem) !important;
  }

  .newsletter__heading,
  .newsletter-section__heading,
  .community__heading,
  .email-signup__heading,
  .newsletter h2,
  .newsletter-section h2,
  .community h2,
  .email-signup h2,
  [data-newsletter] h1,
  [data-newsletter] h2,
  [class*="newsletter"] h1,
  [class*="newsletter"] h2,
  [class*="community"] h1,
  [class*="community"] h2 {
    font-size: clamp(1.55rem, 7vw, 2.25rem) !important;
  }

  .bestseller-card__badge,
  .product-card__badge,
  .related-product-card__badge {
    min-height: 1.25rem !important;
    padding: 0.26rem 0.48rem 0.22rem !important;
    font-size: 0.48rem !important;
  }

  .site-footer__heading,
  .site-footer h2,
  .site-footer h3,
  .site-footer h4,
  .site-footer__menu-title,
  .site-footer__column-title {
    font-size: 0.68rem !important;
  }

  .site-footer a,
  .site-footer__link,
  .site-footer__menu a,
  .site-footer p {
    font-size: 0.84rem !important;
  }
}
/* =========================================================
   PDP BUY CONTROLS WIDTH ALIGNMENT
   Quantity + Add to cart row matches Shop Pay width.
   ========================================================= */

.product-main__form,
.product-form,
.product-main form[action*="/cart/add"]{
  width: 100% !important;
}
.product-main__buy-row,
.product-main__quantity-row,
.product-main__actions,
.product-form__buttons,
.product-main__form-actions{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1rem !important;
  width: 100% !important;
  align-items: stretch !important;
}
/* Quantity control and add-to-cart should share same row width */
.product-main__quantity,
.product-main__quantity-wrapper,
.product-main__quantity-selector,
.product-form__quantity,
.quantity,
.quantity-selector{
  width: 100% !important;
  max-width: none !important;
  min-height: 4.65rem !important;
}
.product-main__add-button,
.product-form__submit,
button[type="submit"][name="add"]{
  width: 100% !important;
  max-width: none !important;
  min-height: 4.65rem !important;
}
/* Shop Pay / dynamic checkout remains full width underneath */
.shopify-payment-button,
.product-main__payment-button,
.product-form__payment-container{
  width: 100% !important;
  max-width: none !important;
  grid-column: 1 / -1 !important;
}
.shopify-payment-button__button{
  width: 100% !important;
  min-height: 4.65rem !important;
}
/* Keep the direct checkout/payment button full width when inside same button container */
.product-form__buttons .shopify-payment-button{
  grid-column: 1 / -1 !important;
}
/* Mobile: stack controls for cleaner PDP */
@media (max-width: 749px){
  .product-main__buy-row,
  .product-main__quantity-row,
  .product-main__actions,
  .product-form__buttons,
  .product-main__form-actions {
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  .product-main__quantity,
  .product-main__quantity-wrapper,
  .product-main__quantity-selector,
  .product-form__quantity,
  .quantity,
  .quantity-selector,
  .product-main__add-button,
  .product-form__submit,
  button[type="submit"][name="add"],
  .shopify-payment-button__button {
    min-height: 3.65rem !important;
  }
}
/* =========================================================
   PDP BUY CONTROLS COMPACT SIZE FIX
   Keep controls aligned,
but reduce height/font to premium ecommerce scale.
   ========================================================= */

.product-main__buy-row,
.product-main__quantity-row,
.product-main__actions,
.product-form__buttons,
.product-main__form-actions{
  gap: 0.85rem !important;
}
/* Quantity selector compact height */
.product-main__quantity,
.product-main__quantity-wrapper,
.product-main__quantity-selector,
.product-form__quantity,
.quantity,
.quantity-selector{
  min-height: 3.45rem !important;
  height: 3.45rem !important;
  border-radius: 1.35rem !important;
}
/* Quantity inner buttons/input */
.product-main__quantity button,
.product-main__quantity input,
.product-main__quantity-wrapper button,
.product-main__quantity-wrapper input,
.product-main__quantity-selector button,
.product-main__quantity-selector input,
.product-form__quantity button,
.product-form__quantity input,
.quantity button,
.quantity input,
.quantity-selector button,
.quantity-selector input{
  min-height: 3.45rem !important;
  height: 3.45rem !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
/* Add to cart compact height */
.product-main__add-button,
.product-form__submit,
button[type="submit"][name="add"]{
  min-height: 3.45rem !important;
  height: 3.45rem !important;
  border-radius: 1.35rem !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
/* Shop Pay compact height,
still full width */
.shopify-payment-button__button,
.shopify-payment-button__button--unbranded,
.shopify-payment-button__button--branded{
  min-height: 3.45rem !important;
  height: 3.45rem !important;
  border-radius: 1.35rem !important;
  font-size: 1rem !important;
  line-height: 1 !important;
}
/* More payment options should not look oversized */
.shopify-payment-button__more-options,
.shopify-payment-button__more-options button{
  font-size: 0.9rem !important;
  line-height: 1.35 !important;
}
/* Trust row spacing after payment buttons */
.product-main__trust,
.product-main__trust-row,
.product-main__guarantees,
.product-guarantees{
  margin-top: 1.35rem !important;
}
/* Mobile compact */
@media (max-width: 749px){
  .product-main__quantity,
  .product-main__quantity-wrapper,
  .product-main__quantity-selector,
  .product-form__quantity,
  .quantity,
  .quantity-selector,
  .product-main__quantity button,
  .product-main__quantity input,
  .product-main__quantity-wrapper button,
  .product-main__quantity-wrapper input,
  .product-main__quantity-selector button,
  .product-main__quantity-selector input,
  .product-form__quantity button,
  .product-form__quantity input,
  .quantity button,
  .quantity input,
  .quantity-selector button,
  .quantity-selector input,
  .product-main__add-button,
  .product-form__submit,
  button[type="submit"][name="add"],
  .shopify-payment-button__button,
  .shopify-payment-button__button--unbranded,
  .shopify-payment-button__button--branded {
    min-height: 3.15rem !important;
    height: 3.15rem !important;
    border-radius: 1.15rem !important;
  }
}
/* =========================================================
   PDP ALIGNMENT + PAYMENT BUTTON BRAND RESTORE
   Align product details section with other page sections.
   Restore buy button sizing,
make dynamic checkout blue branded.
   ========================================================= */

/* PDP outer alignment should match the rest of the theme sections */
.product-main,
.main-product{
  width: 100% !important;
}
.product-main .container,
.main-product .container,
.product-main__container,
.product-main__grid{
  width: min(calc(100% - 3rem), var(--page-width, 82rem)) !important;
  max-width: var(--page-width, 82rem) !important;
  margin-inline: auto !important;
}
/* Give the product layout more presence again */
.product-main__grid{
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(24rem, 0.95fr) !important;
  gap: clamp(3rem, 6vw, 5.5rem) !important;
  align-items: start !important;
}
.product-main__media,
.product-main__gallery,
.product-main__image-wrapper{
  max-width: 42rem !important;
}
.product-main__info,
.product-main__details{
  max-width: 34rem !important;
}
/* Restore action row to the cleaner previous proportion */
.product-main__buy-row,
.product-main__quantity-row,
.product-main__actions,
.product-form__buttons,
.product-main__form-actions{
  display: grid !important;
  grid-template-columns: minmax(10rem, 0.8fr) minmax(12rem, 1.2fr) !important;
  gap: 0.9rem !important;
  width: 100% !important;
  align-items: stretch !important;
}
/* Quantity + Add to cart: restored button height */
.product-main__quantity,
.product-main__quantity-wrapper,
.product-main__quantity-selector,
.product-form__quantity,
.quantity,
.quantity-selector,
.product-main__add-button,
.product-form__submit,
button[type="submit"][name="add"]{
  height: 3.65rem !important;
  min-height: 3.65rem !important;
  border-radius: 1.2rem !important;
}
.product-main__add-button,
.product-form__submit,
button[type="submit"][name="add"]{
  border-color: rgba(18, 57, 93, 0.72) !important;
  background: #ffffff !important;
  color: var(--color-ink, #12395d) !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
}
/* Dynamic checkout / Shop Pay restored,
but branded blue */
.shopify-payment-button{
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin-top: 0.85rem !important;
}
.shopify-payment-button__button,
.shopify-payment-button__button--branded,
.shopify-payment-button__button--unbranded{
  width: 100% !important;
  height: auto !important;
  min-height: 3.65rem !important;
  max-height: none !important;
  border-radius: 1.2rem !important;
  overflow: hidden !important;
  background: var(--color-blue, #1f6fae) !important;
  color: #ffffff !important;
}
/* Shopify branded inner button/content */
.shopify-payment-button__button > *,
.shopify-payment-button__button--branded > *,
.shopify-payment-button__button--unbranded > *{
  min-height: 3.65rem !important;
  height: 3.65rem !important;
  max-height: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* If Shopify renders a branded iframe/shadow-ish content,
keep the wrapper clean */
.shopify-payment-button__button--branded{
  background: var(--color-blue, #1f6fae) !important;
}
/* More payment options smaller and clean */
.shopify-payment-button__more-options{
  margin-top: 0.7rem !important;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.84rem !important;
  line-height: 1.35 !important;
  color: var(--color-ink, #12395d) !important;
}
/* Trust badges align under the restored button width */
.product-main__trust,
.product-main__trust-row,
.product-main__guarantees,
.product-guarantees{
  margin-top: 1.35rem !important;
  width: 100% !important;
}
/* Tablet/mobile PDP */
@media (max-width: 989px){
  .product-main__grid {
    grid-template-columns: 1fr !important;
    gap: 2.5rem !important;
  }

  .product-main__media,
  .product-main__gallery,
  .product-main__image-wrapper,
  .product-main__info,
  .product-main__details {
    max-width: 100% !important;
  }
}

@media (max-width: 749px) {
.product-main .container,
.main-product .container,
.product-main__container,
.product-main__grid{
    width: min(calc(100% - 1.25rem), 36rem) !important;
  }
.product-main__buy-row,
.product-main__quantity-row,
.product-main__actions,
.product-form__buttons,
.product-main__form-actions{
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }
.product-main__quantity,
.product-main__quantity-wrapper,
.product-main__quantity-selector,
.product-form__quantity,
.quantity,
.quantity-selector,
.product-main__add-button,
.product-form__submit,
button[type="submit"][name="add"],
.shopify-payment-button__button,
.shopify-payment-button__button--branded,
.shopify-payment-button__button--unbranded,
.shopify-payment-button__button > *,
.shopify-payment-button__button--branded > *,
.shopify-payment-button__button--unbranded > *{
    min-height: 3.35rem !important;
    height: 3.35rem !important;
    border-radius: 1rem !important;
  }
}
/* =========================================================
   FINAL SECTION HEADING SIZE REDUCTION
   Reduce editorial section headings to a cleaner premium scale.
   Must stay at absolute END of theme.css.
   ========================================================= */

:root{
  --cv-heading-display-size: clamp(1.85rem, 2.65vw, 3.15rem);
  --cv-heading-display-size-compact: clamp(1.75rem, 2.35vw, 2.8rem);
  --cv-heading-display-size-hero: clamp(2.35rem, 3.8vw, 4.25rem);
  --cv-heading-display-line: 1;
  --cv-heading-display-spacing: -0.035em;
}
/* Standard section headings */
.skin-goals__heading,
.bestsellers__heading,
.featured-products__heading,
.related-products__heading,
.product-reviews__heading,
.brand-promise__heading,
.clinical-banner__heading,
.clinical__heading,
.banner__heading,
.image-banner__heading,
.newsletter__heading,
.newsletter-section__heading,
.community__heading,
.email-signup__heading,
[data-clinical-banner] h1,
[data-clinical-banner] h2,
[data-section-type="clinical-banner"] h1,
[data-section-type="clinical-banner"] h2,
[data-newsletter] h1,
[data-newsletter] h2{
  font-size: var(--cv-heading-display-size) !important;
  line-height: var(--cv-heading-display-line) !important;
  letter-spacing: var(--cv-heading-display-spacing) !important;
}
/* Page headings */
.main-collection__title,
.main-collection__heading,
.cart-page__heading,
.cart-empty h2{
  font-size: var(--cv-heading-display-size-compact) !important;
  line-height: 1 !important;
  letter-spacing: var(--cv-heading-display-spacing) !important;
}
/* Hero heading remains slightly larger */
.hero-themeblocks-skincare__heading,
.themeblocks-skincare-hero__heading,
.hero__heading,
[data-themeblocks-skincare-hero] .hero-themeblocks-skincare__heading{
  font-size: var(--cv-heading-display-size-hero) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.04em !important;
}
/* Section-level size setting overrides still work,
but smaller than before */
.skin-goals--heading-small .skin-goals__heading,
.bestsellers--heading-small .bestsellers__heading,
.main-collection--heading-small .main-collection__title,
.main-collection--heading-small .main-collection__heading{
  font-size: clamp(1.65rem, 2.15vw, 2.55rem) !important;
}
.skin-goals--heading-medium .skin-goals__heading,
.bestsellers--heading-medium .bestsellers__heading,
.main-collection--heading-medium .main-collection__title,
.main-collection--heading-medium .main-collection__heading{
  font-size: clamp(1.85rem, 2.65vw, 3.15rem) !important;
}
.skin-goals--heading-large .skin-goals__heading,
.bestsellers--heading-large .bestsellers__heading,
.main-collection--heading-large .main-collection__title,
.main-collection--heading-large .main-collection__heading{
  font-size: clamp(2.15rem, 3.2vw, 3.75rem) !important;
}
/* Mobile */
@media (max-width: 749px){
  :root {
    --cv-heading-display-size: clamp(1.75rem, 7vw, 2.45rem);
    --cv-heading-display-size-compact: clamp(1.65rem, 6.5vw, 2.25rem);
    --cv-heading-display-size-hero: clamp(2rem, 8.5vw, 2.95rem);
  }

  .skin-goals--heading-small .skin-goals__heading,
  .bestsellers--heading-small .bestsellers__heading,
  .main-collection--heading-small .main-collection__title,
  .main-collection--heading-small .main-collection__heading {
    font-size: clamp(1.55rem, 6vw, 2.05rem) !important;
  }

  .skin-goals--heading-medium .skin-goals__heading,
  .bestsellers--heading-medium .bestsellers__heading,
  .main-collection--heading-medium .main-collection__title,
  .main-collection--heading-medium .main-collection__heading {
    font-size: clamp(1.75rem, 7vw, 2.45rem) !important;
  }

  .skin-goals--heading-large .skin-goals__heading,
  .bestsellers--heading-large .bestsellers__heading,
  .main-collection--heading-large .main-collection__title,
  .main-collection--heading-large .main-collection__heading {
    font-size: clamp(2rem, 8vw, 2.85rem) !important;
  }
}
/* =========================================================
   PDP BUY BUTTON BRAND ALIGNMENT
   Add to cart matches Write a Review button.
   Dynamic checkout matches same height.
   ========================================================= */

:root{
  --cv-action-blue: var(--color-blue, #1f6fae);
  --cv-action-blue-hover: #176399;
  --cv-pdp-action-height: 3.45rem;
  --cv-pdp-action-radius: 1.25rem;
}
/* Add to cart: filled blue,
same feel as Write a Review */
.product-main__add-button,
.product-form__submit,
button[type="submit"][name="add"]{
  height: var(--cv-pdp-action-height) !important;
  min-height: var(--cv-pdp-action-height) !important;
  border: 1px solid var(--cv-action-blue) !important;
  border-radius: var(--cv-pdp-action-radius) !important;
  background: var(--cv-action-blue) !important;
  color: #ffffff !important;
  box-shadow: 0 0.75rem 1.8rem rgba(31, 111, 174, 0.16) !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.76rem !important;
  font-weight: var(--font-button-weight, 700) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}
.product-main__add-button:hover,
.product-form__submit:hover,
button[type="submit"][name="add"]:hover{
  background: var(--cv-action-blue-hover) !important;
  border-color: var(--cv-action-blue-hover) !important;
  color: #ffffff !important;
}
/* Quantity: same height as add-to-cart */
.product-main__quantity,
.product-main__quantity-wrapper,
.product-main__quantity-selector,
.product-form__quantity,
.quantity,
.quantity-selector,
.product-main__quantity button,
.product-main__quantity input,
.product-main__quantity-wrapper button,
.product-main__quantity-wrapper input,
.product-main__quantity-selector button,
.product-main__quantity-selector input,
.product-form__quantity button,
.product-form__quantity input,
.quantity button,
.quantity input,
.quantity-selector button,
.quantity-selector input{
  height: var(--cv-pdp-action-height) !important;
  min-height: var(--cv-pdp-action-height) !important;
  border-radius: var(--cv-pdp-action-radius) !important;
}
/* Dynamic checkout / Shop Pay: same height as add-to-cart */
.shopify-payment-button{
  width: 100% !important;
  margin-top: 0.85rem !important;
}
.shopify-payment-button__button,
.shopify-payment-button__button--branded,
.shopify-payment-button__button--unbranded{
  width: 100% !important;
  height: var(--cv-pdp-action-height) !important;
  min-height: var(--cv-pdp-action-height) !important;
  max-height: none !important;
  border-radius: var(--cv-pdp-action-radius) !important;
  overflow: hidden !important;
}
/* Shopify branded inner content must not collapse */
.shopify-payment-button__button > *,
.shopify-payment-button__button--branded > *,
.shopify-payment-button__button--unbranded > *{
  height: var(--cv-pdp-action-height) !important;
  min-height: var(--cv-pdp-action-height) !important;
  max-height: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* Non-branded dynamic checkout can use ThemeBlocks Skincare blue */
.shopify-payment-button__button--unbranded{
  background: var(--cv-action-blue) !important;
  border-color: var(--cv-action-blue) !important;
  color: #ffffff !important;
}
/* More payment options: less dominant */
.shopify-payment-button__more-options{
  margin-top: 0.65rem !important;
  font-size: 0.84rem !important;
  line-height: 1.35 !important;
}
/* Mobile */
@media (max-width: 749px){
  :root {
    --cv-pdp-action-height: 3.25rem;
    --cv-pdp-action-radius: 1rem;
  }
}
/* =========================================================
   HARDENED SHOP PAY / DYNAMIC CHECKOUT BUTTON
   Shopify branded button often has nested wrappers,
so target all levels.
   ========================================================= */

.shopify-payment-button{
  display: block !important;
  width: 100% !important;
  min-height: var(--cv-primary-button-height) !important;
  margin-top: 0.85rem !important;
  overflow: visible !important;
}
.shopify-payment-button__button,
.shopify-payment-button__button--branded,
.shopify-payment-button__button--unbranded,
.shopify-payment-button button{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 100% !important;
  height: var(--cv-primary-button-height) !important;
  min-height: var(--cv-primary-button-height) !important;
  max-height: var(--cv-primary-button-height) !important;
  padding: 0 !important;
  border-radius: var(--cv-primary-button-radius) !important;
  overflow: hidden !important;
  line-height: 1 !important;
}
/* Shopify branded inner elements */
.shopify-payment-button__button > *,
.shopify-payment-button__button--branded > *,
.shopify-payment-button__button--unbranded > *,
.shopify-payment-button button > *,
.shopify-cleanslate,
.shopify-cleanslate *,
.shopify-payment-button__button div,
.shopify-payment-button__button span{
  min-height: var(--cv-primary-button-height) !important;
  height: var(--cv-primary-button-height) !important;
  max-height: var(--cv-primary-button-height) !important;
  line-height: var(--cv-primary-button-height) !important;
}
/* Try to preserve branding but prevent thin-bar collapse */
.shopify-payment-button__button--branded iframe,
.shopify-payment-button iframe{
  min-height: var(--cv-primary-button-height) !important;
  height: var(--cv-primary-button-height) !important;
  max-height: var(--cv-primary-button-height) !important;
}
/* Non-branded dynamic checkout can use ThemeBlocks Skincare blue */
.shopify-payment-button__button--unbranded{
  background: var(--cv-primary-button-bg) !important;
  border: 1px solid var(--cv-primary-button-bg) !important;
  color: #ffffff !important;
  box-shadow: var(--cv-primary-button-shadow) !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: var(--cv-primary-button-font-size) !important;
  font-weight: var(--font-button-weight, 800) !important;
  letter-spacing: var(--cv-primary-button-letter-spacing) !important;
  text-transform: uppercase !important;
}
/* More payment options should stay secondary */
.shopify-payment-button__more-options{
  display: block !important;
  margin-top: 0.7rem !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.86rem !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
/* Mobile */
@media (max-width: 749px){
  :root {
    --cv-primary-button-height: 3.35rem;
    --cv-primary-button-radius: 0.65rem;
    --cv-primary-button-font-size: 0.74rem;
  }
}
/* =========================================================
   FINAL PDP BUTTONS: HERO CTA STYLE + SAFE SHOP PAY
   Do not force Shopify internal branded button spans/divs.
   ========================================================= */

:root{
  --cv-pdp-button-height: 3.35rem;
  --cv-pdp-button-radius: 0.7rem;
  --cv-pdp-button-blue: var(--color-blue, #1f6fae);
  --cv-pdp-button-blue-hover: #176399;
}
/* Add to cart matches hero CTA */
.product-main__add-button,
.product-form__submit,
button[type="submit"][name="add"]{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: var(--cv-pdp-button-height) !important;
  height: var(--cv-pdp-button-height) !important;
  padding: 0 1.65rem !important;
  border: 1px solid var(--cv-pdp-button-blue) !important;
  border-radius: var(--cv-pdp-button-radius) !important;
  background: var(--cv-pdp-button-blue) !important;
  color: #ffffff !important;
  box-shadow: 0 1rem 2rem rgba(31, 111, 174, 0.18) !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.78rem !important;
  font-weight: var(--font-button-weight, 800) !important;
  line-height: 1 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}
.product-main__add-button:hover,
.product-form__submit:hover,
button[type="submit"][name="add"]:hover{
  background: var(--cv-pdp-button-blue-hover) !important;
  border-color: var(--cv-pdp-button-blue-hover) !important;
}
/* Quantity matches Add to Cart height */
.product-main__quantity,
.product-main__quantity-wrapper,
.product-main__quantity-selector,
.product-form__quantity,
.quantity,
.quantity-selector{
  min-height: var(--cv-pdp-button-height) !important;
  height: var(--cv-pdp-button-height) !important;
  border-radius: var(--cv-pdp-button-radius) !important;
}
.product-main__quantity button,
.product-main__quantity input,
.product-main__quantity-wrapper button,
.product-main__quantity-wrapper input,
.product-main__quantity-selector button,
.product-main__quantity-selector input,
.product-form__quantity button,
.product-form__quantity input,
.quantity button,
.quantity input,
.quantity-selector button,
.quantity-selector input{
  min-height: var(--cv-pdp-button-height) !important;
  height: var(--cv-pdp-button-height) !important;
}
/* Shop Pay: control only outer shell,
do NOT touch Shopify internals */
.shopify-payment-button{
  grid-column: 1 / -1 !important;
  width: 100% !important;
  margin-top: 0.85rem !important;
}
.shopify-payment-button__button,
.shopify-payment-button__button--branded,
.shopify-payment-button__button--unbranded,
.shopify-payment-button button{
  width: 100% !important;
  min-height: var(--cv-pdp-button-height) !important;
  height: auto !important;
  max-height: none !important;
  border-radius: var(--cv-pdp-button-radius) !important;
  overflow: hidden !important;
}
/* More payment options */
.shopify-payment-button__more-options{
  margin-top: 0.65rem !important;
  font-size: 0.84rem !important;
  line-height: 1.35 !important;
}

@media (max-width: 749px) {
:root{
    --cv-pdp-button-height: 3.15rem;
    --cv-pdp-button-radius: 0.65rem;
  }
}
/* =========================================================
   COLLECTION PRODUCT IMAGE SIZE POLISH
   Bigger product images inside collection cards without changing card grid.
   ========================================================= */

/* Collection page product image scale */
.main-collection .product-card__image,
.main-collection__grid .product-card__image{
  width: 78% !important;
  height: 78% !important;
  max-width: 78% !important;
  max-height: 78% !important;
  object-fit: contain !important;
  object-position: center !important;
}
/* Keep bottles from looking too tiny */
.main-collection .product-card__media img,
.main-collection__grid .product-card__media img{
  transform: scale(1.12) !important;
  transform-origin: center !important;
}
/* Wider/jar products should still breathe */
.main-collection .product-card__media{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}
/* Mobile: slightly more restrained */
@media (max-width: 749px){
  .main-collection .product-card__image,
  .main-collection__grid .product-card__image {
    width: 74% !important;
    height: 74% !important;
    max-width: 74% !important;
    max-height: 74% !important;
  }

  .main-collection .product-card__media img,
  .main-collection__grid .product-card__media img {
    transform: scale(1.06) !important;
  }
}
/* =========================================================
   COLLECTION CARD IMAGE + TITLE SIZE BOOST
   Bigger product visuals and stronger product title readability.
   ========================================================= */

/* Bigger product images on collection grid */
.main-collection .product-card__image,
.main-collection__grid .product-card__image{
  width: 88% !important;
  height: 88% !important;
  max-width: 88% !important;
  max-height: 88% !important;
  object-fit: contain !important;
  object-position: center !important;
}
/* Extra visual scale without changing card/grid layout */
.main-collection .product-card__media img,
.main-collection__grid .product-card__media img{
  transform: scale(1.22) !important;
  transform-origin: center !important;
}
/* Keep product media clean */
.main-collection .product-card__media,
.main-collection__grid .product-card__media{
  overflow: hidden !important;
}
/* Bigger product title on collection page */
.main-collection .product-card__title,
.main-collection .product-card__title a,
.main-collection__grid .product-card__title,
.main-collection__grid .product-card__title a{
  font-size: clamp(0.82rem, 0.9vw, 1rem) !important;
  font-weight: 900 !important;
  line-height: 1.16 !important;
  letter-spacing: -0.012em !important;
}
/* Slightly improve vendor and price proportion */
.main-collection .product-card__vendor,
.main-collection__grid .product-card__vendor{
  font-size: 0.58rem !important;
  letter-spacing: 0.13em !important;
}
.main-collection .product-card__price,
.main-collection__grid .product-card__price{
  font-size: 0.78rem !important;
  font-weight: 900 !important;
}
/* Mobile: keep image/title boosted but not cramped */
@media (max-width: 749px){
  .main-collection .product-card__image,
  .main-collection__grid .product-card__image {
    width: 82% !important;
    height: 82% !important;
    max-width: 82% !important;
    max-height: 82% !important;
  }

  .main-collection .product-card__media img,
  .main-collection__grid .product-card__media img {
    transform: scale(1.14) !important;
  }

  .main-collection .product-card__title,
  .main-collection .product-card__title a,
  .main-collection__grid .product-card__title,
  .main-collection__grid .product-card__title a {
    font-size: clamp(0.78rem, 3.6vw, 0.95rem) !important;
  }
}
/* =========================================================
   NEWSLETTER / COMMUNITY HEADING SIZE TUNE
   Make homepage signup heading smaller and cleaner.
   ========================================================= */

.newsletter__heading,
.newsletter-section__heading,
.community__heading,
.email-signup__heading,
.newsletter h2,
.newsletter-section h2,
.community h2,
.email-signup h2,
[data-newsletter] h1,
[data-newsletter] h2,
[class*="newsletter"] h1,
[class*="newsletter"] h2,
[class*="community"] h1,
[class*="community"] h2{
  font-size: clamp(1.65rem, 2.35vw, 2.75rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.035em !important;
}
/* Mobile */
@media (max-width: 749px){
  .newsletter__heading,
  .newsletter-section__heading,
  .community__heading,
  .email-signup__heading,
  .newsletter h2,
  .newsletter-section h2,
  .community h2,
  .email-signup h2,
  [data-newsletter] h1,
  [data-newsletter] h2,
  [class*="newsletter"] h1,
  [class*="newsletter"] h2,
  [class*="community"] h1,
  [class*="community"] h2 {
    font-size: clamp(1.45rem, 6vw, 2.1rem) !important;
    line-height: 1.08 !important;
  }
}
/* =========================================================
   NEWSLETTER / COMMUNITY HEADING ONE-LINE FIX
   Desktop: force one-line compact heading.
   Mobile: allow wrapping.
   ========================================================= */

.newsletter__heading,
.newsletter-section__heading,
.community__heading,
.email-signup__heading,
.newsletter h2,
.newsletter-section h2,
.community h2,
.email-signup h2,
[data-newsletter] h1,
[data-newsletter] h2,
[class*="newsletter"] h1,
[class*="newsletter"] h2,
[class*="community"] h1,
[class*="community"] h2{
  max-width: none !important;
  font-size: clamp(1.35rem, 1.75vw, 2rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.025em !important;
  white-space: nowrap !important;
}
/* Give text column more room if this section uses a grid */
.newsletter__content,
.newsletter-section__content,
.community__content,
.email-signup__content,
[class*="newsletter"]__content,
[class*="community"]__content{
  max-width: none !important;
}
/* Mobile: allow wrapping again */
@media (max-width: 749px){
  .newsletter__heading,
  .newsletter-section__heading,
  .community__heading,
  .email-signup__heading,
  .newsletter h2,
  .newsletter-section h2,
  .community h2,
  .email-signup h2,
  [data-newsletter] h1,
  [data-newsletter] h2,
  [class*="newsletter"] h1,
  [class*="newsletter"] h2,
  [class*="community"] h1,
  [class*="community"] h2 {
    font-size: clamp(1.35rem, 6vw, 1.95rem) !important;
    line-height: 1.1 !important;
    white-space: normal !important;
  }
}
/* =========================================================
   SKINCARE SETS SECTION
   Premium ThemeBlocks Skincare-styled collection/set cards.
   ========================================================= */

.skincare-sets{
  position: relative;
  overflow: hidden;
  padding: clamp(4rem, 7vw, 7rem) 0;
  background:
    radial-gradient(circle at 8% 12%, rgba(142, 205, 224, 0.22), transparent 32rem),
    radial-gradient(circle at 92% 18%, rgba(254, 249, 242, 0.9), transparent 34rem),
    linear-gradient(180deg, #ffffff 0%, rgba(245, 251, 253, 0.92) 100%);
}
.skincare-sets__header{
  max-width: 52rem;
  margin: 0 auto clamp(2.25rem, 4vw, 3.5rem);
  text-align: center;
}
.skincare-sets__eyebrow{
  margin: 0 0 0.75rem;
  color: #c9a227;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.68rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.2em;
  line-height: 1;
  text-transform: uppercase;
}
.skincare-sets__heading{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: clamp(1.85rem, 2.65vw, 3.15rem);
  font-weight: var(--font-heading-weight, 700);
  letter-spacing: -0.035em;
  line-height: 1;
  text-transform: capitalize;
}
.skincare-sets--heading-small .skincare-sets__heading{
  font-size: clamp(1.65rem, 2.15vw, 2.55rem);
}
.skincare-sets--heading-medium .skincare-sets__heading{
  font-size: clamp(1.85rem, 2.65vw, 3.15rem);
}
.skincare-sets--heading-large .skincare-sets__heading{
  font-size: clamp(2.15rem, 3.2vw, 3.75rem);
}
.skincare-sets__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.25rem, 2vw, 2rem);
}
.skincare-sets__card{
  position: relative;
  min-width: 0;
}
.skincare-sets__media{
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1.02;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.45rem;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.96), rgba(242, 250, 253, 0.78) 68%),
    #f7fbfd;
  box-shadow:
    0 1.35rem 3rem rgba(18, 57, 93, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  text-decoration: none;
}
.skincare-sets__image{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    transform 600ms cubic-bezier(0.19, 1, 0.22, 1),
    filter 600ms cubic-bezier(0.19, 1, 0.22, 1);
}
.skincare-sets__card:hover .skincare-sets__image{
  transform: scale(1.045);
  filter: saturate(1.04) contrast(1.02);
}
.skincare-sets__placeholder{
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  padding: 2rem;
  color: rgba(18, 57, 93, 0.42);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: 1.35rem;
  text-align: center;
}
.skincare-sets__content{
  min-height: 11.4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.35rem 1.2rem 1.45rem;
  text-align: center;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent);
  border-radius: 0 0 var(--tb-radius-card, 1.35rem) var(--tb-radius-card, 1.35rem);
}
.skincare-sets__title{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: clamp(1rem, 1.25vw, 1.28rem);
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.1;
  text-transform: uppercase;
}
.skincare-sets__text{
  max-width: 26rem;
  margin: 0.75rem auto 1.25rem;
  color: rgba(18, 57, 93, 0.72);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.94rem;
  font-weight: var(--font-body-weight, 400);
  line-height: 1.65;
}
.skincare-sets__button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 3.1rem;
  margin-top: auto;
  padding: 0 1.55rem;
  border: 1px solid color-mix(in srgb, var(--color-primary, #a9826d) 70%, var(--color-accent, #c8a15a));
  border-radius: var(--tb-radius-button, 999px);
  background: var(--color-primary, #a9826d);
  color: var(--color-button-text, #ffffff);
  box-shadow:
    0 0.85rem 1.8rem color-mix(in srgb, var(--color-primary, #a9826d) 20%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 24%, transparent);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.72rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.14em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}
.skincare-sets__button:hover,
.skincare-sets__button:focus-visible{
  background: color-mix(in srgb, var(--color-primary, #a9826d) 86%, var(--color-accent, #c8a15a));
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 62%, var(--color-primary, #a9826d));
  color: var(--color-button-text, #ffffff);
  transform: translateY(-1px);
  box-shadow:
    0 1rem 2.1rem color-mix(in srgb, var(--color-primary, #a9826d) 26%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 30%, transparent);
}

@media (max-width: 989px) {
.skincare-sets__grid{
    grid-template-columns: 1fr;
    max-width: 34rem;
    margin-inline: auto;
    gap: 2.25rem;
  }
}

@media (max-width: 749px) {
.skincare-sets{
    padding: clamp(3.25rem, 12vw, 4.5rem) 0;
  }
.skincare-sets__header{
    margin-bottom: 2rem;
  }
.skincare-sets__heading,
.skincare-sets--heading-small .skincare-sets__heading,
.skincare-sets--heading-medium .skincare-sets__heading,
.skincare-sets--heading-large .skincare-sets__heading{
    font-size: clamp(1.75rem, 7vw, 2.4rem);
  }
.skincare-sets__media{
    border-radius: 1.1rem;
  }
.skincare-sets__content{
    min-height: 10.75rem;
    padding: 1.15rem 1rem 1.25rem;
  }
.skincare-sets__title{
    font-size: clamp(0.95rem, 4.5vw, 1.2rem);
  }
.skincare-sets__text{
    font-size: 0.88rem;
    line-height: 1.55;
  }
.skincare-sets__button{
    min-height: 2.9rem;
    padding-inline: 1.35rem;
    font-size: 0.66rem;
  }
}
/* =========================================================
   ABOUT CAREVIELLE PAGE
   Premium editorial About Us page.
   ========================================================= */

.about-themeblocks-skincare{
  position: relative;
  overflow: hidden;
  padding: clamp(3.5rem, 6vw, 6.5rem) 0;
  background:
    radial-gradient(circle at 8% 10%, rgba(142, 205, 224, 0.22), transparent 34rem),
    radial-gradient(circle at 94% 18%, rgba(254, 249, 242, 0.95), transparent 36rem),
    linear-gradient(180deg, #ffffff 0%, rgba(245, 251, 253, 0.92) 100%);
}
.about-themeblocks-skincare__hero{
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  gap: clamp(2.5rem, 5vw, 5.5rem);
  align-items: center;
}
.about-themeblocks-skincare--image-right .about-themeblocks-skincare__media{
  order: 2;
}
.about-themeblocks-skincare--image-right .about-themeblocks-skincare__intro{
  order: 1;
}
.about-themeblocks-skincare__media{
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.72);
  box-shadow:
    0 1.6rem 4rem rgba(18, 57, 93, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.about-themeblocks-skincare__media::after{
  content: "";
  position: absolute;
  inset: auto 1.25rem 1.25rem 1.25rem;
  height: 26%;
  border-radius: 999px;
  background: rgba(142, 205, 224, 0.22);
  filter: blur(2rem);
  pointer-events: none;
}
.about-themeblocks-skincare__image{
  display: block;
  width: 100%;
  aspect-ratio: 1 / 0.92;
  object-fit: cover;
  object-position: center;
}
.about-themeblocks-skincare__placeholder{
  display: grid;
  place-items: center;
  min-height: 34rem;
  color: rgba(18, 57, 93, 0.35);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: 2rem;
}
.about-themeblocks-skincare__intro{
  max-width: 40rem;
}
.about-themeblocks-skincare__eyebrow{
  margin: 0 0 0.85rem;
  color: #c9a227;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.66rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.2em;
  line-height: 1;
  text-transform: uppercase;
}
.about-themeblocks-skincare__heading,
.about-themeblocks-skincare__story-heading h2,
.about-themeblocks-skincare__promise h2,
.about-themeblocks-skincare__products h2,
.about-themeblocks-skincare__cta h2{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-weight: var(--font-heading-weight, 700);
  letter-spacing: -0.04em;
  line-height: 0.98;
}
.about-themeblocks-skincare__heading{
  max-width: 11ch;
  font-size: clamp(2.5rem, 4.5vw, 5rem);
}
.about-themeblocks-skincare__intro-text{
  max-width: 36rem;
  margin-top: 1.35rem;
  color: rgba(18, 57, 93, 0.74);
  font-size: clamp(1rem, 1.1vw, 1.12rem);
  line-height: 1.75;
}
.about-themeblocks-skincare__intro-text p,
.about-themeblocks-skincare__story-copy p,
.about-themeblocks-skincare__products-copy p{
  margin: 0 0 1.15rem;
}
.about-themeblocks-skincare__story{
  display: grid;
  grid-template-columns: minmax(14rem, 0.78fr) minmax(0, 1.22fr);
  gap: clamp(2rem, 5vw, 5rem);
  margin-top: clamp(4rem, 7vw, 7rem);
  padding: clamp(2rem, 4vw, 3.5rem);
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.74);
  box-shadow: 0 1.25rem 3rem rgba(18, 57, 93, 0.055);
}
.about-themeblocks-skincare__story-heading h2{
  font-size: clamp(1.9rem, 3vw, 3.2rem);
}
.about-themeblocks-skincare__story-copy{
  color: rgba(18, 57, 93, 0.76);
  font-size: 1rem;
  line-height: 1.78;
}
.about-themeblocks-skincare__promise{
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: start;
  margin-top: clamp(3rem, 6vw, 5.5rem);
}
.about-themeblocks-skincare__promise h2,
.about-themeblocks-skincare__products h2,
.about-themeblocks-skincare__cta h2{
  font-size: clamp(1.85rem, 2.65vw, 3.15rem);
}
.about-themeblocks-skincare__promise-content p:not(.about-themeblocks-skincare__eyebrow),
.about-themeblocks-skincare__cta p{
  margin: 1rem 0 0;
  color: rgba(18, 57, 93, 0.72);
  font-size: 1rem;
  line-height: 1.7;
}
.about-themeblocks-skincare__cards{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.about-themeblocks-skincare__card{
  padding: 1.35rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.25rem;
  background: rgba(255, 255, 255, 0.76);
  box-shadow: 0 0.9rem 2rem rgba(18, 57, 93, 0.045);
}
.about-themeblocks-skincare__card-icon{
  display: grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  margin-bottom: 1rem;
  border-radius: 999px;
  background: rgba(142, 205, 224, 0.18);
  color: var(--color-blue, #1f6fae);
  font-size: 1rem;
}
.about-themeblocks-skincare__card h3{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}
.about-themeblocks-skincare__card p{
  margin: 0.55rem 0 0;
  color: rgba(18, 57, 93, 0.68);
  font-size: 0.88rem;
  line-height: 1.55;
}
.about-themeblocks-skincare__products{
  display: grid;
  grid-template-columns: minmax(14rem, 0.78fr) minmax(0, 1.22fr);
  gap: clamp(2rem, 5vw, 5rem);
  margin-top: clamp(3rem, 6vw, 5.5rem);
  padding-top: clamp(2rem, 4vw, 3.5rem);
  border-top: 1px solid rgba(18, 57, 93, 0.1);
}
.about-themeblocks-skincare__products-copy{
  color: rgba(18, 57, 93, 0.76);
  font-size: 1rem;
  line-height: 1.78;
}
.about-themeblocks-skincare__cta{
  max-width: 52rem;
  margin: clamp(4rem, 7vw, 7rem) auto 0;
  padding: clamp(2.25rem, 5vw, 4rem);
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.8rem;
  background:
    radial-gradient(circle at 12% 18%, rgba(142, 205, 224, 0.22), transparent 20rem),
    linear-gradient(180deg, rgba(255,255,255,0.88), rgba(254,249,242,0.72));
  box-shadow: 0 1.4rem 3.4rem rgba(18, 57, 93, 0.07);
  text-align: center;
}
.about-themeblocks-skincare__button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.35rem;
  margin-top: 1.4rem;
  padding: 0 1.65rem;
  border: 1px solid var(--color-blue, #1f6fae);
  border-radius: 0.7rem;
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  box-shadow: 0 1rem 2rem rgba(31, 111, 174, 0.18);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.76rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.14em;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease;
}
.about-themeblocks-skincare__button:hover{
  background: #176399;
  border-color: #176399;
  color: #ffffff;
  transform: translateY(-1px);
}

@media (max-width: 989px) {
.about-themeblocks-skincare__hero,
.about-themeblocks-skincare__story,
.about-themeblocks-skincare__promise,
.about-themeblocks-skincare__products{
    grid-template-columns: 1fr;
  }
.about-themeblocks-skincare--image-right .about-themeblocks-skincare__media,
.about-themeblocks-skincare--image-right .about-themeblocks-skincare__intro{
    order: initial;
  }
.about-themeblocks-skincare__cards{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 749px) {
.about-themeblocks-skincare{
    padding: 3rem 0;
  }
.about-themeblocks-skincare__heading{
    font-size: clamp(2.25rem, 10vw, 3.25rem);
  }
.about-themeblocks-skincare__story,
.about-themeblocks-skincare__cta{
    padding: 1.35rem;
    border-radius: 1.25rem;
  }
.about-themeblocks-skincare__promise h2,
.about-themeblocks-skincare__products h2,
.about-themeblocks-skincare__story-heading h2,
.about-themeblocks-skincare__cta h2{
    font-size: clamp(1.75rem, 7vw, 2.35rem);
  }
.about-themeblocks-skincare__image{
    aspect-ratio: 1 / 1.05;
  }
}
/* =========================================================
   CONTACT CAREVIELLE PAGE
   Premium contact page section.
   ========================================================= */

.contact-themeblocks-skincare{
  position: relative;
  overflow: hidden;
  padding: clamp(3.5rem, 6vw, 6.5rem) 0;
  background:
    radial-gradient(circle at 8% 8%, rgba(142, 205, 224, 0.24), transparent 34rem),
    radial-gradient(circle at 94% 18%, rgba(254, 249, 242, 0.96), transparent 34rem),
    linear-gradient(180deg, #ffffff 0%, rgba(245, 251, 253, 0.94) 100%);
}
.contact-themeblocks-skincare__header{
  max-width: 54rem;
  margin: 0 auto clamp(2.4rem, 5vw, 4.25rem);
  text-align: center;
}
.contact-themeblocks-skincare__eyebrow{
  margin: 0 0 0.85rem;
  color: #c9a227;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.66rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.2em;
  line-height: 1;
  text-transform: uppercase;
}
.contact-themeblocks-skincare__heading{
  max-width: 12ch;
  margin: 0 auto;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: clamp(2.45rem, 4.5vw, 4.85rem);
  font-weight: var(--font-heading-weight, 700);
  letter-spacing: -0.045em;
  line-height: 0.96;
}
.contact-themeblocks-skincare__subheading{
  max-width: 42rem;
  margin: 1.25rem auto 0;
  color: rgba(18, 57, 93, 0.72);
  font-size: clamp(1rem, 1.15vw, 1.14rem);
  line-height: 1.7;
}
.contact-themeblocks-skincare__layout{
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(20rem, 0.92fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
}
.contact-themeblocks-skincare__panel,
.contact-themeblocks-skincare__side{
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.78);
  box-shadow:
    0 1.4rem 3.5rem rgba(18, 57, 93, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.contact-themeblocks-skincare__panel{
  padding: clamp(1.4rem, 3vw, 2.35rem);
}
.contact-themeblocks-skincare__side{
  padding: clamp(1.35rem, 2.6vw, 2rem);
  position: sticky;
  top: 6rem;
}
.contact-themeblocks-skincare__form-header{
  margin-bottom: 1.45rem;
}
.contact-themeblocks-skincare__form-header h2,
.contact-themeblocks-skincare__note h2{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: clamp(1.7rem, 2.45vw, 2.75rem);
  font-weight: var(--font-heading-weight, 700);
  letter-spacing: -0.04em;
  line-height: 1;
}
.contact-themeblocks-skincare__form-header p,
.contact-themeblocks-skincare__note p{
  margin: 0.8rem 0 0;
  color: rgba(18, 57, 93, 0.7);
  font-size: 0.98rem;
  line-height: 1.65;
}
.contact-themeblocks-skincare__form{
  display: grid;
  gap: 1rem;
}
.contact-themeblocks-skincare__field-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.contact-themeblocks-skincare__field{
  display: grid;
  gap: 0.45rem;
}
.contact-themeblocks-skincare__field label{
  color: var(--color-ink, #12395d);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.62rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.16em;
  line-height: 1;
  text-transform: uppercase;
}
.contact-themeblocks-skincare__field input,
.contact-themeblocks-skincare__field select,
.contact-themeblocks-skincare__field textarea{
  width: 100%;
  border: 1px solid rgba(18, 57, 93, 0.14);
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.9);
  color: var(--color-ink, #12395d);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.95rem;
  line-height: 1.4;
  outline: none;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}
.contact-themeblocks-skincare__field input,
.contact-themeblocks-skincare__field select{
  min-height: 3.3rem;
  padding: 0 1rem;
}
.contact-themeblocks-skincare__field textarea{
  min-height: 10rem;
  padding: 1rem;
  resize: vertical;
}
.contact-themeblocks-skincare__field input:focus,
.contact-themeblocks-skincare__field select:focus,
.contact-themeblocks-skincare__field textarea:focus{
  border-color: rgba(31, 111, 174, 0.65);
  background: #ffffff;
  box-shadow: 0 0 0 0.25rem rgba(142, 205, 224, 0.18);
}
.contact-themeblocks-skincare__button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 3.35rem;
  padding: 0 1.65rem;
  border: 1px solid var(--color-blue, #1f6fae);
  border-radius: 0.7rem;
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  box-shadow: 0 1rem 2rem rgba(31, 111, 174, 0.18);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.76rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease;
}
.contact-themeblocks-skincare__button:hover{
  background: #176399;
  border-color: #176399;
  transform: translateY(-1px);
}
.contact-themeblocks-skincare__success,
.contact-themeblocks-skincare__error{
  padding: 1rem;
  border-radius: 1rem;
  font-size: 0.92rem;
  line-height: 1.5;
}
.contact-themeblocks-skincare__success{
  border: 1px solid rgba(31, 111, 174, 0.18);
  background: rgba(142, 205, 224, 0.16);
  color: var(--color-ink, #12395d);
}
.contact-themeblocks-skincare__error{
  border: 1px solid rgba(150, 45, 45, 0.18);
  background: rgba(255, 235, 235, 0.72);
  color: #7b2525;
}
.contact-themeblocks-skincare__cards{
  display: grid;
  gap: 0.85rem;
  margin-top: 1.35rem;
}
.contact-themeblocks-skincare__card{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.9rem;
  padding: 1rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.15rem;
  background: rgba(245, 251, 253, 0.72);
}
.contact-themeblocks-skincare__card-icon{
  display: grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 999px;
  background: rgba(142, 205, 224, 0.2);
  color: var(--color-blue, #1f6fae);
  font-size: 1rem;
}
.contact-themeblocks-skincare__card h3{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.88rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}
.contact-themeblocks-skincare__card p{
  margin: 0.4rem 0 0;
  color: rgba(18, 57, 93, 0.68);
  font-size: 0.86rem;
  line-height: 1.5;
}
.contact-themeblocks-skincare__card a{
  display: inline-flex;
  margin-top: 0.55rem;
  color: var(--color-blue, #1f6fae);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.68rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.12em;
  text-decoration: none;
  text-transform: uppercase;
}

@media (max-width: 989px) {
.contact-themeblocks-skincare__layout{
    grid-template-columns: 1fr;
  }
.contact-themeblocks-skincare__side{
    position: static;
  }
}

@media (max-width: 749px) {
.contact-themeblocks-skincare{
    padding: 3rem 0;
  }
.contact-themeblocks-skincare__heading{
    font-size: clamp(2.2rem, 10vw, 3.25rem);
  }
.contact-themeblocks-skincare__field-grid{
    grid-template-columns: 1fr;
  }
.contact-themeblocks-skincare__panel,
.contact-themeblocks-skincare__side{
    border-radius: 1.25rem;
  }
.contact-themeblocks-skincare__button{
    width: 100%;
  }
}
/* =========================================================
   CONTACT FORM SEND BUTTON LOADER
   Premium submit loading state.
   ========================================================= */

.contact-themeblocks-skincare__button{
  position: relative !important;
  overflow: hidden !important;
  gap: 0.55rem !important;
}
.contact-themeblocks-skincare__button::after{
  content: "" !important;
  display: none !important;
  width: 0.9rem !important;
  height: 0.9rem !important;
  border: 2px solid rgba(255, 255, 255, 0.55) !important;
  border-top-color: #ffffff !important;
  border-radius: 999px !important;
  animation: themeblocks-skincareContactButtonSpin 680ms linear infinite !important;
}
.contact-themeblocks-skincare__button.is-loading,
.contact-themeblocks-skincare__button[aria-busy="true"]{
  pointer-events: none !important;
  opacity: 0.92 !important;
}
.contact-themeblocks-skincare__button.is-loading::after,
.contact-themeblocks-skincare__button[aria-busy="true"]::after{
  display: inline-block !important;
}

@keyframes themeblocks-skincareContactButtonSpin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}
/* =========================================================
   FAQ CAREVIELLE SECTION
   Premium accordion section.
   ========================================================= */

.faq-themeblocks-skincare{
  position: relative;
  overflow: hidden;
  padding: clamp(3.5rem, 6vw, 6.5rem) 0;
  background:
    radial-gradient(circle at 8% 12%, rgba(142, 205, 224, 0.22), transparent 32rem),
    radial-gradient(circle at 92% 18%, rgba(254, 249, 242, 0.95), transparent 34rem),
    linear-gradient(180deg, #ffffff 0%, rgba(245, 251, 253, 0.94) 100%);
}
.faq-themeblocks-skincare__layout{
  display: grid;
  grid-template-columns: minmax(18rem, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
}
.faq-themeblocks-skincare__header{
  position: sticky;
  top: 6rem;
  max-width: 31rem;
}
.faq-themeblocks-skincare__eyebrow{
  margin: 0 0 0.85rem;
  color: #c9a227;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.66rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.2em;
  line-height: 1;
  text-transform: uppercase;
}
.faq-themeblocks-skincare__heading{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: clamp(1.85rem, 2.65vw, 3.15rem);
  font-weight: var(--font-heading-weight, 700);
  letter-spacing: -0.035em;
  line-height: 1;
}
.faq-themeblocks-skincare--heading-small .faq-themeblocks-skincare__heading{
  font-size: clamp(1.65rem, 2.15vw, 2.55rem);
}
.faq-themeblocks-skincare--heading-medium .faq-themeblocks-skincare__heading{
  font-size: clamp(1.85rem, 2.65vw, 3.15rem);
}
.faq-themeblocks-skincare--heading-large .faq-themeblocks-skincare__heading{
  font-size: clamp(2.15rem, 3.2vw, 3.75rem);
}
.faq-themeblocks-skincare__subheading{
  margin: 1rem 0 0;
  color: rgba(18, 57, 93, 0.72);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.98rem;
  line-height: 1.7;
}
.faq-themeblocks-skincare__button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.1rem;
  margin-top: 1.45rem;
  padding: 0 1.45rem;
  border: 1px solid var(--color-blue, #1f6fae);
  border-radius: 0.7rem;
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  box-shadow: 0 0.85rem 1.8rem rgba(31, 111, 174, 0.16);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.72rem;
  font-weight: var(--font-button-weight, 800);
  letter-spacing: 0.14em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}
.faq-themeblocks-skincare__button:hover{
  background: #176399;
  border-color: #176399;
  color: #ffffff;
  transform: translateY(-1px);
  box-shadow: 0 1rem 2.1rem rgba(31, 111, 174, 0.22);
}
.faq-themeblocks-skincare__accordion{
  display: grid;
  gap: 0.85rem;
}
.faq-themeblocks-skincare__item{
  overflow: hidden;
  border: 1px solid rgba(18, 57, 93, 0.09);
  border-radius: 1.25rem;
  background: rgba(255, 255, 255, 0.82);
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.045),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.faq-themeblocks-skincare__item[open]{
  border-color: rgba(31, 111, 174, 0.2);
  background:
    radial-gradient(circle at 96% 10%, rgba(142, 205, 224, 0.16), transparent 18rem),
    rgba(255, 255, 255, 0.9);
}
.faq-themeblocks-skincare__question{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  min-height: 4.15rem;
  padding: 1.15rem 1.25rem;
  color: var(--color-ink, #12395d);
  cursor: pointer;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.98rem;
  font-weight: 900;
  line-height: 1.25;
  list-style: none;
}
.faq-themeblocks-skincare__question::-webkit-details-marker{
  display: none;
}
.faq-themeblocks-skincare__icon{
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: rgba(142, 205, 224, 0.18);
  color: var(--color-blue, #1f6fae);
  transition:
    transform 220ms ease,
    background 220ms ease,
    color 220ms ease;
}
.faq-themeblocks-skincare__icon svg{
  width: 0.92rem;
  height: 0.92rem;
}
.faq-themeblocks-skincare__icon path{
  fill: none;
  stroke: currentColor;
  stroke-width: 2.15;
  stroke-linecap: round;
}
.faq-themeblocks-skincare__item[open] .faq-themeblocks-skincare__icon{
  transform: rotate(45deg);
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
}
.faq-themeblocks-skincare__answer{
  padding: 0 1.25rem 1.25rem;
  color: rgba(18, 57, 93, 0.72);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.95rem;
  line-height: 1.68;
}
.faq-themeblocks-skincare__answer p{
  margin: 0;
}
.faq-themeblocks-skincare__answer p + p{
  margin-top: 0.85rem;
}

@media (max-width: 989px) {
.faq-themeblocks-skincare__layout{
    grid-template-columns: 1fr;
  }
.faq-themeblocks-skincare__header{
    position: static;
    max-width: 42rem;
    text-align: center;
    margin-inline: auto;
  }
}

@media (max-width: 749px) {
.faq-themeblocks-skincare{
    padding: 3rem 0;
  }
.faq-themeblocks-skincare__heading,
.faq-themeblocks-skincare--heading-small .faq-themeblocks-skincare__heading,
.faq-themeblocks-skincare--heading-medium .faq-themeblocks-skincare__heading,
.faq-themeblocks-skincare--heading-large .faq-themeblocks-skincare__heading{
    font-size: clamp(1.75rem, 7vw, 2.4rem);
  }
.faq-themeblocks-skincare__question{
    min-height: 3.65rem;
    padding: 1rem;
    font-size: 0.9rem;
  }
.faq-themeblocks-skincare__answer{
    padding: 0 1rem 1rem;
    font-size: 0.88rem;
  }
.faq-themeblocks-skincare__button{
    min-height: 2.9rem;
    padding-inline: 1.3rem;
    font-size: 0.66rem;
  }
}
/* =========================================================
   MAIN COLLECTION PRODUCTS PER ROW SETTING
   Options: 3 / 4 / 6 columns.
   ========================================================= */

.main-collection--columns-3 .main-collection__grid{
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.main-collection--columns-4 .main-collection__grid{
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.main-collection--columns-6 .main-collection__grid{
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}
/* Adjust card media proportions by density */
.main-collection--columns-3 .product-card__media{
  aspect-ratio: 1 / 1.08 !important;
}
.main-collection--columns-4 .product-card__media{
  aspect-ratio: 1 / 1.12 !important;
}
.main-collection--columns-6 .product-card__media{
  aspect-ratio: 1 / 1.18 !important;
}
/* 6 columns needs smaller text/buttons so it does not feel cramped */
.main-collection--columns-6 .product-card__title,
.main-collection--columns-6 .product-card__title a{
  font-size: clamp(0.68rem, 0.62vw, 0.78rem) !important;
  line-height: 1.15 !important;
}
.main-collection--columns-6 .product-card__vendor{
  font-size: 0.48rem !important;
}
.main-collection--columns-6 .product-card__price{
  font-size: 0.68rem !important;
}
.main-collection--columns-6 .product-card__cart{
  width: 1.95rem !important;
  height: 1.95rem !important;
}
/* 3 columns can show stronger product presence */
.main-collection--columns-3 .product-card__title,
.main-collection--columns-3 .product-card__title a{
  font-size: clamp(0.88rem, 1vw, 1.08rem) !important;
}
.main-collection--columns-3 .product-card__price{
  font-size: 0.84rem !important;
}
/* Responsive safeguards */
@media (max-width: 1180px){
  .main-collection--columns-6 .main-collection__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 989px) {
.main-collection--columns-3 .main-collection__grid,
.main-collection--columns-4 .main-collection__grid,
.main-collection--columns-6 .main-collection__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 549px) {
.main-collection--columns-3 .main-collection__grid,
.main-collection--columns-4 .main-collection__grid,
.main-collection--columns-6 .main-collection__grid{
    grid-template-columns: 1fr !important;
  }
}
/* =========================================================
   LOCAL WISHLIST SYSTEM
   Header icon,
product hearts,
and drawer.
   ========================================================= */

.site-header__wishlist{
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  color: var(--color-ink, #12395d);
  box-shadow: 0 0.75rem 1.8rem rgba(18, 57, 93, 0.06);
  cursor: pointer;
}
.site-header__wishlist svg,
.product-card__wishlist svg,
.product-main__wishlist svg,
.wishlist-drawer__close svg{
  width: 1.1rem;
  height: 1.1rem;
}
.site-header__wishlist path,
.product-card__wishlist path,
.product-main__wishlist path{
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.site-header__wishlist-count{
  position: absolute;
  top: -0.3rem;
  right: -0.25rem;
  display: grid;
  place-items: center;
  min-width: 1.15rem;
  height: 1.15rem;
  padding: 0 0.28rem;
  border-radius: 999px;
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.62rem;
  font-weight: 900;
  line-height: 1;
}
.product-card__media{
  position: relative;
}
.product-card__wishlist{
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--color-ink, #12395d);
  box-shadow: 0 0.65rem 1.35rem rgba(18, 57, 93, 0.07);
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}
.product-card__wishlist:hover,
.product-card__wishlist.is-active{
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  transform: translateY(-1px);
}
.product-card__wishlist.is-active path,
.product-main__wishlist.is-active path,
.site-header__wishlist.is-active path{
  fill: currentColor;
}
.product-main__wishlist{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  width: fit-content;
  min-height: 2.55rem;
  margin: 0.75rem 0 0;
  padding: 0 0.95rem;
  border: 1px solid rgba(18, 57, 93, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: var(--color-ink, #12395d);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
}
.product-main__wishlist:hover,
.product-main__wishlist.is-active{
  border-color: rgba(31, 111, 174, 0.4);
  background: rgba(142, 205, 224, 0.16);
  color: var(--color-blue, #1f6fae);
}
.wishlist-drawer{
  position: fixed;
  inset: 0;
  z-index: 1200;
  visibility: hidden;
  pointer-events: none;
}
.wishlist-drawer.is-open,
.wishlist-drawer.is-closing{
  visibility: visible;
  pointer-events: auto;
}
.wishlist-drawer__overlay{
  position: absolute;
  inset: 0;
  border: 0;
  background: transparent !important;
  opacity: 0;
  cursor: pointer;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.wishlist-drawer__panel{
  position: absolute;
  top: 0;
  right: 0;
  display: grid;
  grid-template-rows: auto 1fr;
  width: min(100%, 28rem);
  height: 100%;
  background:
    radial-gradient(circle at 0% 0%, rgba(142, 205, 224, 0.16), transparent 18rem),
    #ffffff;
  box-shadow: -1.5rem 0 4rem rgba(18, 57, 93, 0.14);
  transform: translateX(104%);
}
.wishlist-drawer__header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem;
  border-bottom: 1px solid rgba(18, 57, 93, 0.08);
}
.wishlist-drawer__eyebrow{
  margin: 0 0 0.35rem;
  color: #c9a227;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.wishlist-drawer__header h2{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: 2.1rem;
  line-height: 1;
  letter-spacing: -0.04em;
}
.wishlist-drawer__close{
  display: grid;
  place-items: center;
  width: 2.65rem;
  height: 2.65rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 999px;
  background: #ffffff;
  color: var(--color-ink, #12395d);
  cursor: pointer;
}
.wishlist-drawer__close path{
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
}
.wishlist-drawer__body{
  overflow-y: auto;
  padding: 1.1rem;
}
.wishlist-drawer__items{
  display: grid;
  gap: 0.85rem;
}
.wishlist-drawer__item{
  display: grid;
  grid-template-columns: 5rem minmax(0, 1fr) auto;
  gap: 0.85rem;
  align-items: center;
  padding: 0.75rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1rem;
  background: rgba(245, 251, 253, 0.72);
}
.wishlist-drawer__item-image{
  display: block;
  width: 5rem;
  height: 5rem;
  border-radius: 0.85rem;
  object-fit: contain;
  background: #ffffff;
}
.wishlist-drawer__item-title{
  display: block;
  color: var(--color-ink, #12395d);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1.18;
  text-decoration: none;
  text-transform: uppercase;
}
.wishlist-drawer__item-price{
  margin-top: 0.35rem;
  color: rgba(18, 57, 93, 0.72);
  font-size: 0.82rem;
  font-weight: 700;
}
.wishlist-drawer__item-remove{
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 999px;
  background: #ffffff;
  color: var(--color-blue, #1f6fae);
  cursor: pointer;
}
.wishlist-drawer__empty{
  display: grid;
  place-items: center;
  min-height: 24rem;
  padding: 2rem 1rem;
  text-align: center;
}
.wishlist-drawer__empty[hidden],
.wishlist-drawer__items[hidden]{
  display: none !important;
}
.wishlist-drawer__empty-icon{
  display: grid;
  place-items: center;
  width: 3.35rem;
  height: 3.35rem;
  margin-bottom: 1rem;
  border-radius: 999px;
  background: rgba(142, 205, 224, 0.18);
  color: var(--color-blue, #1f6fae);
  font-size: 1.6rem;
}
.wishlist-drawer__empty h3{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: 2rem;
  letter-spacing: -0.04em;
}
.wishlist-drawer__empty p{
  max-width: 20rem;
  margin: 0.75rem auto 1.25rem;
  color: rgba(18, 57, 93, 0.68);
  line-height: 1.6;
}
.wishlist-drawer__empty-button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0 1.35rem;
  border-radius: 0.7rem;
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-decoration: none;
  text-transform: uppercase;
}
body.wishlist-drawer-open{
  overflow: hidden;
}

@media (max-width: 749px) {
.wishlist-drawer__panel{
    width: min(100%, 25rem);
  }
}
/* =========================================================
   HEADER WISHLIST + CART ICON ALIGNMENT FIX
   Keep wishlist/cart order and size consistent across pages.
   ========================================================= */

/* Header icon group should always lay out left-to-right consistently */
.site-header__actions,
.site-header__icons,
.site-header__utils,
.site-header__right,
.header__icons,
.header__actions{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.7rem !important;
  flex-direction: row !important;
}
/* Wishlist should sit before cart. Cart stays farthest right. */
.site-header__wishlist{
  order: 20 !important;
}
.site-header__cart,
.site-header__cart-link,
a[href="/cart"],
button[data-cart-open],
[data-cart-open]{
  order: 30 !important;
}
/* Normalize wishlist icon size so it doesn't become oversized on some templates */
.site-header__wishlist{
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  min-height: 3rem !important;
  max-width: 3rem !important;
  max-height: 3rem !important;
  padding: 0 !important;
  border: 1px solid rgba(18, 57, 93, 0.08) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.86) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow: 0 0.75rem 1.8rem rgba(18, 57, 93, 0.06) !important;
}
/* Normalize SVG size */
.site-header__wishlist svg{
  display: block !important;
  width: 1.15rem !important;
  height: 1.15rem !important;
  min-width: 1.15rem !important;
  min-height: 1.15rem !important;
}
/* Keep heart stroke premium */
.site-header__wishlist path{
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.site-header__wishlist.is-active path{
  fill: currentColor !important;
}
/* Count badges should not show when hidden */
.site-header__wishlist-count[hidden],
[data-wishlist-count][hidden],
.cart-count-bubble[hidden],
[data-cart-count][hidden]{
  display: none !important;
}
/* Count badge position */
.site-header__wishlist-count,
[data-wishlist-count]{
  position: absolute !important;
  top: -0.3rem !important;
  right: -0.25rem !important;
  display: grid !important;
  place-items: center !important;
  min-width: 1.15rem !important;
  height: 1.15rem !important;
  padding: 0 0.28rem !important;
  border-radius: 999px !important;
  background: var(--color-blue, #1f6fae) !important;
  color: #ffffff !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
/* Mobile sizing */
@media (max-width: 749px){
  .header__icons,
.header__actions {
    gap: 0.55rem !important;
  }
}
/* =========================================================
   HERO TRANSPARENT HEADER ICON VISIBILITY FIX
   Make cart/wishlist icons readable on transparent hero header.
   ========================================================= */

/* Lock icon group order: wishlist first,
cart second */
.site-header__actions,
.site-header__icons,
.site-header__utils,
.site-header__right,
.header__icons,
.header__actions{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.72rem !important;
  flex-direction: row !important;
}
.site-header__wishlist{
  order: 20 !important;
}
.site-header__cart,
.site-header__cart-link,
a[href="/cart"],
button[data-cart-open],
[data-cart-open]{
  order: 30 !important;
}
/* Apply same clear pill style to both wishlist and cart icons */
.site-header__wishlist,
.site-header__cart,
.site-header__cart-link,
.header__icon--cart,
a[href="/cart"],
button[data-cart-open],
[data-cart-open]{
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  min-height: 3rem !important;
  max-width: 3rem !important;
  max-height: 3rem !important;
  padding: 0 !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(255, 255, 255, 0.82)) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow:
    0 0.8rem 1.9rem rgba(18, 57, 93, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(14px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.15) !important;
  text-decoration: none !important;
}
/* Stronger hover/focus so icons feel intentional */
.site-header__wishlist:hover,
.site-header__cart:hover,
.site-header__cart-link:hover,
.header__icon--cart:hover,
a[href="/cart"]:hover,
button[data-cart-open]:hover,
[data-cart-open]:hover{
  border-color: rgba(31, 111, 174, 0.24) !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(245, 251, 253, 0.94)) !important;
  color: var(--color-blue, #1f6fae) !important;
  box-shadow:
    0 0.95rem 2.2rem rgba(18, 57, 93, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
}
/* Normalize SVG visibility */
.site-header__wishlist svg,
.site-header__cart svg,
.site-header__cart-link svg,
.header__icon--cart svg,
a[href="/cart"] svg,
button[data-cart-open] svg,
[data-cart-open] svg{
  display: block !important;
  width: 1.12rem !important;
  height: 1.12rem !important;
  min-width: 1.12rem !important;
  min-height: 1.12rem !important;
}
/* Wishlist heart stroke */
.site-header__wishlist path{
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.site-header__wishlist.is-active path{
  fill: currentColor !important;
}
/* Cart icon stroke/fill safety */
.site-header__cart svg path,
.site-header__cart-link svg path,
.header__icon--cart svg path,
a[href="/cart"] svg path,
button[data-cart-open] svg path,
[data-cart-open] svg path{
  stroke: currentColor !important;
}
/* Hide zero wishlist count hard */
.site-header__wishlist-count[hidden],
[data-wishlist-count][hidden]{
  display: none !important;
}
/* Hide visible wishlist zero if JS/theme briefly outputs 0 before hiding */
.site-header__wishlist-count:empty,
[data-wishlist-count]:empty{
  display: none !important;
}
/* Count badge: shared clean position */
.site-header__wishlist-count,
[data-wishlist-count],
.cart-count-bubble,
[data-cart-count]{
  position: absolute !important;
  top: -0.32rem !important;
  right: -0.28rem !important;
  display: grid !important;
  place-items: center !important;
  min-width: 1.15rem !important;
  height: 1.15rem !important;
  padding: 0 0.28rem !important;
  border: 2px solid rgba(255, 255, 255, 0.92) !important;
  border-radius: 999px !important;
  background: var(--color-blue, #1f6fae) !important;
  color: #ffffff !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.6rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  box-shadow: 0 0.35rem 0.8rem rgba(31, 111, 174, 0.22) !important;
}
/* Mobile */
@media (max-width: 749px){
  .header__icons,
.header__actions {
    gap: 0.55rem !important;
  }

  .header__icon--cart,
a[href="/cart"],
button[data-cart-open],
[data-cart-open] {
    width: 2.75rem !important;
    height: 2.75rem !important;
    min-width: 2.75rem !important;
    min-height: 2.75rem !important;
    max-width: 2.75rem !important;
    max-height: 2.75rem !important;
  }

  .header__icon--cart svg,
a[href="/cart"] svg,
button[data-cart-open] svg,
[data-cart-open] svg {
    width: 1.05rem !important;
    height: 1.05rem !important;
  }
}
/* =========================================================
   TRANSPARENT HERO HEADER ACTIONS FIX
   Keep cart/wishlist readable and correctly positioned over homepage hero.
   Scoped to homepage transparent hero header only.
   ========================================================= */

body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner{
  display: grid !important;
  grid-template-columns: minmax(10rem, 1fr) auto minmax(10rem, 1fr) !important;
  align-items: center !important;
  gap: 1rem !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__logo{
  grid-column: 1 !important;
  justify-self: start !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__nav{
  grid-column: 2 !important;
  justify-self: center !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions{
  grid-column: 3 !important;
  justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.72rem !important;
  flex-direction: row !important;
  position: relative !important;
  z-index: 30 !important;
}
/* Keep wishlist/cart order stable over hero */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist{
  order: 20 !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  order: 30 !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__menu-toggle{
  order: 40 !important;
}
/* Stronger glass background only over transparent hero */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  min-height: 3rem !important;
  max-width: 3rem !important;
  max-height: 3rem !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 1px solid rgba(18, 57, 93, 0.12) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.88)) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  backdrop-filter: blur(16px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}
/* SVGs must not inherit transparent/soft color rules */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart .icon-cart{
  width: 1.12rem !important;
  height: 1.12rem !important;
  color: var(--color-ink, #12395d) !important;
  opacity: 1 !important;
}
/* Hide wishlist badge when empty */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist-count[hidden],
body.template-index .site-header--transparent-hero:not(.is-scrolled) [data-wishlist-count][hidden]{
  display: none !important;
}
/* Badge positioning over hero */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist-count,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart-count{
  top: -0.32rem !important;
  right: -0.28rem !important;
  z-index: 2 !important;
}
/* Mobile transparent hero */

/* =========================================================
   TRANSPARENT HERO HEADER RESPONSIVE ACTION POSITION
   Prevent wishlist/cart from cramping on narrower desktop
   and drifting too far on wider screens.
   ========================================================= */

@media (min-width: 990px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner {
    width: min(100% - 3rem, 92rem) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(12rem, 1fr) auto minmax(12rem, 1fr) !important;
    align-items: center !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__nav {
    grid-column: 2 !important;
    justify-self: center !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions {
    grid-column: 3 !important;
    justify-self: end !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(0.45rem, 0.7vw, 0.75rem) !important;
    max-width: max-content !important;
  }
}
/* Medium desktop: pull icons inward and slightly reduce size */
@media (min-width: 990px) and (max-width: 1280px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner {
    width: min(100% - 2.25rem, 78rem) !important;
    grid-template-columns: minmax(8rem, 1fr) auto minmax(8rem, 1fr) !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart {
    width: 2.75rem !important;
    height: 2.75rem !important;
    min-width: 2.75rem !important;
    min-height: 2.75rem !important;
    max-width: 2.75rem !important;
    max-height: 2.75rem !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist svg,
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart svg,
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart .icon-cart {
    width: 1rem !important;
    height: 1rem !important;
  }
}
/* Large desktop: prevent icons from floating too far to the browser edge */
@media (min-width: 1281px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner {
    width: min(100% - 4rem, 88rem) !important;
  }
}
/* Ultra-wide: keep header content visually connected to hero content */
@media (min-width: 1700px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner {
    width: min(100% - 6rem, 82rem) !important;
  }
}
/* =========================================================
   FINAL HOME HERO HEADER ICON ORDER + GAP FIX
   Match inner pages: cart first,
wishlist second.
   Scoped only to homepage transparent hero header.
   ========================================================= */

body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-direction: row !important;
  gap: 0.42rem !important;
}
/* Match inner page order: cart first,
wishlist second */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  order: 20 !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist{
  order: 30 !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__menu-toggle{
  order: 40 !important;
}
/* Pull the action group slightly inward so it does not sit on the model face */
@media (min-width: 990px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner {
    width: min(100% - 4rem, 82rem) !important;
    grid-template-columns: minmax(10rem, 1fr) auto minmax(10rem, 1fr) !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions {
    justify-self: end !important;
    transform: translateX(-0.75rem) !important;
  }
}
/* Narrow desktop: reduce icon size and pull inward more */
@media (min-width: 990px) and (max-width: 1280px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner {
    width: min(100% - 3rem, 72rem) !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions {
    gap: 0.32rem !important;
    transform: translateX(-1.25rem) !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart,
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist {
    width: 2.65rem !important;
    height: 2.65rem !important;
    min-width: 2.65rem !important;
    min-height: 2.65rem !important;
    max-width: 2.65rem !important;
    max-height: 2.65rem !important;
  }
}
/* Wide desktop: keep icons connected to nav,
not too far right */
@media (min-width: 1440px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__inner {
    width: min(100% - 6rem, 78rem) !important;
  }

  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions {
    transform: translateX(-0.5rem) !important;
  }
}
/* =========================================================
   FINAL HOME HERO ICON ORDER CORRECTION
   Match inner pages: wishlist left,
cart right.
   ========================================================= */

body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions{
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.42rem !important;
}
/* Wishlist must be left */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist{
  order: 20 !important;
}
/* Cart must be right */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  order: 30 !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__menu-toggle{
  order: 40 !important;
}
/* =========================================================
   FINAL HOME HERO ACTION CHILD POSITION RESET
   Fix overlapping wishlist/cart caused by older absolute cart rules.
   ========================================================= */

body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-direction: row !important;
  gap: 0.55rem !important;
  position: relative !important;
  right: auto !important;
  left: auto !important;
  top: auto !important;
  transform: translateX(-0.75rem) !important;
}
/* Critical: reset every direct action item so flex can control layout */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions > *{
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 !important;
}
/* Final visual order: wishlist left,
cart right */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist{
  order: 20 !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  order: 30 !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__menu-toggle{
  order: 40 !important;
}
/* Keep only desktop icons visible on desktop */
@media (min-width: 750px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__menu-toggle {
    display: none !important;
  }
}
/* Re-apply clean icon button shape after position reset */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  display: inline-grid !important;
  place-items: center !important;
  width: 2.85rem !important;
  height: 2.85rem !important;
  min-width: 2.85rem !important;
  min-height: 2.85rem !important;
  max-width: 2.85rem !important;
  max-height: 2.85rem !important;
  padding: 0 !important;
  border: 1px solid rgba(18, 57, 93, 0.12) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.88)) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.13),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  backdrop-filter: blur(16px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.2) !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* Count badges stay attached to their own icon */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist-count,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart-count{
  position: absolute !important;
  top: -0.32rem !important;
  right: -0.28rem !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  z-index: 3 !important;
}
/* Hide empty wishlist count */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist-count[hidden],
body.template-index .site-header--transparent-hero:not(.is-scrolled) [data-wishlist-count][hidden]{
  display: none !important;
}
/* =========================================================
   FINAL STICKY HEADER WISHLIST/CART FIX
   Keep sticky/scrolled homepage icons aligned and ordered.
   ========================================================= */

body.template-index .site-header.is-scrolled .site-header__actions,
.site-header.is-scrolled .site-header__actions{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-direction: row !important;
  gap: 0.55rem !important;
  position: relative !important;
  right: auto !important;
  left: auto !important;
  top: auto !important;
  transform: none !important;
}
/* Reset old absolute cart/wishlist rules during sticky state */
body.template-index .site-header.is-scrolled .site-header__actions > *,
.site-header.is-scrolled .site-header__actions > *{
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 !important;
}
/* Sticky order: wishlist left,
cart right */
body.template-index .site-header.is-scrolled .site-header__wishlist,
.site-header.is-scrolled .site-header__wishlist{
  order: 20 !important;
}
body.template-index .site-header.is-scrolled .site-header__cart,
.site-header.is-scrolled .site-header__cart{
  order: 30 !important;
}
body.template-index .site-header.is-scrolled .site-header__menu-toggle,
.site-header.is-scrolled .site-header__menu-toggle{
  order: 40 !important;
}
/* Desktop sticky header should hide hamburger */
@media (min-width: 750px){
body.template-index .site-header.is-scrolled .site-header__menu-toggle,
.site-header.is-scrolled .site-header__menu-toggle{
    display: none !important;
  }
}
/* Sticky icon button polish */
body.template-index .site-header.is-scrolled .site-header__wishlist,
body.template-index .site-header.is-scrolled .site-header__cart,
.site-header.is-scrolled .site-header__wishlist,
.site-header.is-scrolled .site-header__cart{
  display: inline-grid !important;
  place-items: center !important;
  width: 2.85rem !important;
  height: 2.85rem !important;
  min-width: 2.85rem !important;
  min-height: 2.85rem !important;
  max-width: 2.85rem !important;
  max-height: 2.85rem !important;
  padding: 0 !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow: 0 0.75rem 1.8rem rgba(18, 57, 93, 0.08) !important;
}
/* Sticky count badges attached to each icon */
body.template-index .site-header.is-scrolled .site-header__wishlist-count,
body.template-index .site-header.is-scrolled .site-header__cart-count,
.site-header.is-scrolled .site-header__wishlist-count,
.site-header.is-scrolled .site-header__cart-count{
  position: absolute !important;
  top: -0.32rem !important;
  right: -0.28rem !important;
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  z-index: 3 !important;
}
/* Keep wishlist zero hidden */
.site-header.is-scrolled .site-header__wishlist-count[hidden],
.site-header.is-scrolled [data-wishlist-count][hidden]{
  display: none !important;
}
/* =========================================================
   HOME HERO HEADER ICON POSITION NUDGE
   Move wishlist/cart slightly to the right after overlap fix.
   ========================================================= */

@media (min-width: 990px){
  body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions {
    transform: translateX(1.75rem) !important;
  }
}

@media (min-width: 1281px) {
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions{
    transform: translateX(2.25rem) !important;
  }
}

@media (min-width: 1440px) {
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__actions{
    transform: translateX(2.75rem) !important;
  }
}
/* =========================================================
   WISHLIST DRAWER Z-INDEX FIX
   Drawer must sit above sticky/header icons.
   ========================================================= */

.wishlist-drawer{
  z-index: 9999 !important;
}
.wishlist-drawer.is-open,
.wishlist-drawer.is-closing{
  z-index: 9999 !important;
}
.wishlist-drawer__overlay{
  z-index: 1 !important;
}
.wishlist-drawer__panel{
  z-index: 2 !important;
}
/* When wishlist drawer is open,
keep header below the drawer */
body.wishlist-drawer-open .site-header{
  z-index: 100 !important;
}
/* =========================================================
   MOBILE MENU MINIMAL PREMIUM ARROW
   Replace clunky arrow chip with subtle gold arrow.
   ========================================================= */


/* =========================================================
   DESKTOP HEADER NAV FONT SIZE
   Make menu items easier to read.
   ========================================================= */

@media (min-width: 750px){
  .site-header__nav-link {
    font-size: 1rem !important;
    letter-spacing: 0.16em !important;
  }
}
/* =========================================================
   FINAL DESKTOP HEADER NAV FONT SIZE
   Override older homepage-specific nav font rules.
   ========================================================= */

@media (min-width: 750px){
.site-header .site-header__nav-link,
body.template-index .site-header .site-header__nav-link,
body.template-index .site-header--transparent-hero .site-header__nav-link,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link,
body.template-index .site-header.is-scrolled .site-header__nav-link{
    font-size: 1rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.16em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }
}
/* =========================================================
   NEWSLETTER / COMMUNITY SECTION LAYOUT FIX
   Prevent heading clipping and improve form alignment.
   ========================================================= */

.newsletter-themeblocks-skincare,
.community-newsletter,
.themeblocks-skincare-newsletter,
.email-signup,
.newsletter-section{
  overflow: hidden !important;
}
.newsletter-themeblocks-skincare__inner,
.community-newsletter__inner,
.themeblocks-skincare-newsletter__inner,
.email-signup__inner,
.newsletter-section__inner{
  display: grid !important;
  grid-template-columns: minmax(22rem, 0.92fr) minmax(24rem, 1.08fr) !important;
  align-items: center !important;
  gap: clamp(2rem, 4vw, 4rem) !important;
}
.newsletter-themeblocks-skincare__content,
.community-newsletter__content,
.themeblocks-skincare-newsletter__content,
.email-signup__content,
.newsletter-section__content{
  min-width: 0 !important;
  max-width: 34rem !important;
  padding-right: 1rem !important;
}
.newsletter-themeblocks-skincare__heading,
.community-newsletter__heading,
.themeblocks-skincare-newsletter__heading,
.email-signup__heading,
.newsletter-section__heading{
  max-width: 32rem !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  line-height: 1.06 !important;
}
.newsletter-themeblocks-skincare form,
.community-newsletter form,
.themeblocks-skincare-newsletter form,
.email-signup form,
.newsletter-section form{
  position: relative !important;
  z-index: 2 !important;
  width: min(100%, 36rem) !important;
  margin-left: auto !important;
}
.newsletter-themeblocks-skincare input[type="email"],
.community-newsletter input[type="email"],
.themeblocks-skincare-newsletter input[type="email"],
.email-signup input[type="email"],
.newsletter-section input[type="email"]{
  min-width: 0 !important;
}

@media (max-width: 989px) {
.newsletter-themeblocks-skincare__inner,
.community-newsletter__inner,
.themeblocks-skincare-newsletter__inner,
.email-signup__inner,
.newsletter-section__inner{
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }
.newsletter-themeblocks-skincare__content,
.community-newsletter__content,
.themeblocks-skincare-newsletter__content,
.email-signup__content,
.newsletter-section__content{
    max-width: 100% !important;
    padding-right: 0 !important;
    text-align: left !important;
  }
.newsletter-themeblocks-skincare__heading,
.community-newsletter__heading,
.themeblocks-skincare-newsletter__heading,
.email-signup__heading,
.newsletter-section__heading{
    max-width: 100% !important;
  }
.newsletter-themeblocks-skincare form,
.community-newsletter form,
.themeblocks-skincare-newsletter form,
.email-signup form,
.newsletter-section form{
    width: 100% !important;
    margin-left: 0 !important;
  }
}
/* =========================================================
   NEWSLETTER CTA LAYOUT FIX
   Fix desktop heading clipping and form overlap.
   ========================================================= */

.newsletter-cta{
  overflow: hidden !important;
}
.newsletter-cta__inner{
  display: grid !important;
  grid-template-columns: minmax(24rem, 0.95fr) minmax(28rem, 1.05fr) !important;
  align-items: center !important;
  gap: clamp(2rem, 4vw, 4.5rem) !important;
}
.newsletter-cta__content{
  min-width: 0 !important;
  max-width: 36rem !important;
  padding-right: 1rem !important;
  position: relative !important;
  z-index: 2 !important;
}
.newsletter-cta__heading,
.newsletter-cta__text{
  max-width: 34rem !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}
.newsletter-cta__heading{
  line-height: 1.04 !important;
}
.newsletter-cta__form,
.newsletter-cta form{
  width: min(100%, 37rem) !important;
  margin-left: auto !important;
  position: relative !important;
  z-index: 3 !important;
}
.newsletter-cta input[type="email"]{
  min-width: 0 !important;
}

@media (max-width: 989px) {
.newsletter-cta__inner{
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }
.newsletter-cta__content,
.newsletter-cta__heading,
.newsletter-cta__text{
    max-width: 100% !important;
    padding-right: 0 !important;
  }
.newsletter-cta__form,
.newsletter-cta form{
    width: 100% !important;
    margin-left: 0 !important;
  }
}
/* =========================================================
   FINAL NEWSLETTER CTA EXACT LAYOUT FIX
   Uses actual section classes from sections/newsletter-cta.liquid.
   ========================================================= */

.newsletter-cta__main{
  display: grid !important;
  grid-template-columns: minmax(28rem, 0.95fr) minmax(30rem, 1.05fr) !important;
  align-items: center !important;
  gap: clamp(2rem, 4vw, 4.5rem) !important;
  overflow: visible !important;
}
.newsletter-cta__content{
  min-width: 0 !important;
  max-width: 38rem !important;
  position: relative !important;
  z-index: 2 !important;
}
.newsletter-cta__heading,
.newsletter-cta__text{
  max-width: 36rem !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}
.newsletter-cta__text{
  font-size: clamp(1.25rem, 1.65vw, 1.75rem) !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}
.newsletter-cta__form{
  width: min(100%, 39rem) !important;
  margin-left: auto !important;
  position: relative !important;
  z-index: 3 !important;
}
.newsletter-cta__input{
  min-width: 0 !important;
}

@media (max-width: 989px) {
.newsletter-cta__main{
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }
.newsletter-cta__content,
.newsletter-cta__heading,
.newsletter-cta__text,
.newsletter-cta__form{
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
  }
.newsletter-cta__text{
    font-size: clamp(1.15rem, 5vw, 1.55rem) !important;
  }
}
/* =========================================================
   HOMEPAGE PRODUCT NEWSLETTER POLISH
   Premium homepage version of product newsletter.
   ========================================================= */

.template-index .product-newsletter{
  padding-block: clamp(4rem, 7vw, 6rem) !important;
  background: #ffffff !important;
}
.template-index .product-newsletter__inner{
  min-height: clamp(18rem, 28vw, 24rem) !important;
  border-radius: 1.35rem !important;
  overflow: hidden !important;
  box-shadow:
    0 1.5rem 4rem rgba(18, 57, 93, 0.08),
    inset 0 0 0 1px rgba(18, 57, 93, 0.06) !important;
}
.template-index .product-newsletter__copy{
  max-width: 34rem !important;
  position: relative !important;
  z-index: 2 !important;
}
.template-index .product-newsletter__heading{
  max-width: 32rem !important;
  line-height: 1.05 !important;
}
.template-index .product-newsletter__form-wrap{
  position: relative !important;
  z-index: 3 !important;
}
.template-index .product-newsletter__form{
  box-shadow:
    0 1rem 2.5rem rgba(18, 57, 93, 0.12),
    inset 0 0 0 1px rgba(255, 255, 255, 0.72) !important;
}

@media (max-width: 749px) {
.template-index .product-newsletter{
    padding-block: 3rem !important;
  }
.template-index .product-newsletter__inner{
    border-radius: 1rem !important;
  }
.template-index .product-newsletter__heading{
    max-width: 100% !important;
  }
}
/* =========================================================
   FINAL PRODUCT NEWSLETTER HEADING WRAP FIX
   Override broad [class*="newsletter"] h2 nowrap rule.
   ========================================================= */

.product-newsletter .product-newsletter__heading,
.template-index .product-newsletter .product-newsletter__heading,
body .product-newsletter h2.product-newsletter__heading,
body.template-index .product-newsletter h2.product-newsletter__heading{
  max-width: clamp(18rem, 32vw, 34rem) !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  line-height: 1.08 !important;
}

@media (max-width: 989px) {
.product-newsletter .product-newsletter__heading,
.template-index .product-newsletter .product-newsletter__heading,
body .product-newsletter h2.product-newsletter__heading,
body.template-index .product-newsletter h2.product-newsletter__heading{
    max-width: 100% !important;
    white-space: normal !important;
  }
}
/* =========================================================
   FINAL GLOBAL DESKTOP HEADER NAV FONT SIZE
   Applies to home,
collection,
product,
page,
and all desktop headers.
   ========================================================= */

@media (min-width: 750px){
  html body .site-header .site-header__nav .site-header__nav-link,
  html body .site-header__nav .site-header__nav-link,
  html body.template-index .site-header .site-header__nav .site-header__nav-link,
  html body.template-collection .site-header .site-header__nav .site-header__nav-link,
  html body.template-product .site-header .site-header__nav .site-header__nav-link,
  html body.template-page .site-header .site-header__nav .site-header__nav-link {
    font-size: 1rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.16em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }
}
/* =========================================================
   HOMEPAGE NEWSLETTER TYPOGRAPHY REFINEMENT
   Reduce oversized heading/subheading in home newsletter CTA.
   ========================================================= */

.template-index .newsletter-cta__heading,
.template-index .product-newsletter__eyebrow{
  font-size: clamp(1.05rem, 1.45vw, 1.45rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.015em !important;
}
.template-index .newsletter-cta__text,
.template-index .product-newsletter__heading{
  font-size: clamp(1.05rem, 1.55vw, 1.55rem) !important;
  line-height: 1.25 !important;
  font-weight: 750 !important;
  max-width: 28rem !important;
}

@media (max-width: 749px) {
.template-index .newsletter-cta__heading,
.template-index .product-newsletter__eyebrow{
    font-size: clamp(0.95rem, 4.5vw, 1.2rem) !important;
  }
.template-index .newsletter-cta__text,
.template-index .product-newsletter__heading{
    font-size: clamp(1.05rem, 5vw, 1.35rem) !important;
    max-width: 100% !important;
  }
}
/* =========================================================
   HOMEPAGE NEWSLETTER PREMIUM TYPOGRAPHY
   Blue heading,
softer supporting text,
more refined scale.
   ========================================================= */

.template-index .newsletter-cta__heading,
.template-index .product-newsletter__eyebrow{
  color: var(--color-ink, #12395d) !important;
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: clamp(1.35rem, 1.65vw, 1.8rem) !important;
  font-weight: 800 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}
.template-index .newsletter-cta__text,
.template-index .product-newsletter__heading{
  color: rgba(18, 57, 93, 0.78) !important;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1.05rem, 1.35vw, 1.35rem) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.015em !important;
  max-width: 30rem !important;
}
.template-index .newsletter-cta__content,
.template-index .product-newsletter__copy{
  max-width: 34rem !important;
}

@media (max-width: 749px) {
.template-index .newsletter-cta__heading,
.template-index .product-newsletter__eyebrow{
    font-size: clamp(1.15rem, 5vw, 1.45rem) !important;
  }
.template-index .newsletter-cta__text,
.template-index .product-newsletter__heading{
    font-size: clamp(1rem, 4.6vw, 1.22rem) !important;
    line-height: 1.35 !important;
    max-width: 100% !important;
  }
}
/* =========================================================
   FINAL NEWSLETTER CTA PREMIUM TYPOGRAPHY
   Exact homepage newsletter-cta target.
   ========================================================= */

.template-index .newsletter-cta .newsletter-cta__heading{
  color: var(--color-ink, #12395d) !important;
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: clamp(1.25rem, 1.45vw, 1.65rem) !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  text-transform: uppercase !important;
  max-width: 30rem !important;
  white-space: normal !important;
}
.template-index .newsletter-cta .newsletter-cta__text{
  color: rgba(18, 57, 93, 0.78) !important;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1rem, 1.22vw, 1.28rem) !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.01em !important;
  max-width: 31rem !important;
  white-space: normal !important;
}
.template-index .newsletter-cta .newsletter-cta__content{
  max-width: 34rem !important;
}

@media (max-width: 749px) {
.template-index .newsletter-cta .newsletter-cta__heading{
    font-size: clamp(1.1rem, 5vw, 1.35rem) !important;
  }
.template-index .newsletter-cta .newsletter-cta__text{
    font-size: clamp(0.98rem, 4.5vw, 1.15rem) !important;
    max-width: 100% !important;
  }
}
/* =========================================================
   NEWSLETTER CTA LOADER + SNACKBAR
   Premium submit feedback for homepage newsletter.
   ========================================================= */

.newsletter-cta__button{
  position: relative !important;
  overflow: hidden !important;
}
.newsletter-cta__button-label{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition:
    opacity 180ms ease,
    transform 180ms ease !important;
}
.newsletter-cta__button-loader{
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  width: 1rem !important;
  height: 1rem !important;
  margin: -0.5rem 0 0 -0.5rem !important;
  border-radius: 999px !important;
  border: 2px solid rgba(255, 255, 255, 0.42) !important;
  border-top-color: #ffffff !important;
  opacity: 0 !important;
  transform: scale(0.85) !important;
  pointer-events: none !important;
  animation: themeblocks-skincare-newsletter-spin 760ms linear infinite !important;
  transition:
    opacity 180ms ease,
    transform 180ms ease !important;
}
.newsletter-cta__form.is-submitting .newsletter-cta__button{
  cursor: wait !important;
  opacity: 0.92 !important;
}
.newsletter-cta__form.is-submitting .newsletter-cta__button-label{
  opacity: 0 !important;
  transform: translateY(0.25rem) !important;
}
.newsletter-cta__form.is-submitting .newsletter-cta__button-loader{
  opacity: 1 !important;
  transform: scale(1) !important;
}

@keyframes themeblocks-skincare-newsletter-spin {
  to {
    transform: scale(1) rotate(360deg);
  }
}
.themeblocks-skincare-snackbar{
  position: fixed !important;
  right: 1.25rem !important;
  bottom: 1.25rem !important;
  z-index: 10000 !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  align-items: center !important;
  gap: 0.75rem !important;
  width: min(25rem, calc(100vw - 2.5rem)) !important;
  padding: 0.95rem 1rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 1rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow:
    0 1.2rem 3rem rgba(18, 57, 93, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  backdrop-filter: blur(16px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.08) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(0.8rem) scale(0.98) !important;
  transition:
    opacity 180ms ease,
    visibility 180ms ease,
    transform 220ms cubic-bezier(0.19, 1, 0.22, 1) !important;
}
.themeblocks-skincare-snackbar.is-visible{
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) scale(1) !important;
}
.themeblocks-skincare-snackbar__icon{
  display: inline-grid !important;
  place-items: center !important;
  width: 1.8rem !important;
  height: 1.8rem !important;
  border-radius: 999px !important;
  background: rgba(31, 111, 174, 0.1) !important;
  color: var(--color-blue, #1f6fae) !important;
  font-size: 0.95rem !important;
  font-weight: 900 !important;
}
.themeblocks-skincare-snackbar--error .themeblocks-skincare-snackbar__icon{
  background: rgba(180, 55, 55, 0.1) !important;
  color: #b43737 !important;
}
.themeblocks-skincare-snackbar__message{
  margin: 0 !important;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

@media (max-width: 749px) {
.themeblocks-skincare-snackbar{
    right: 1rem !important;
    bottom: 1rem !important;
    width: calc(100vw - 2rem) !important;
    border-radius: 0.9rem !important;
  }
}
/* =========================================================
   FINAL MOBILE FOOTER ACCORDION
   Center brand block and collapse footer menus on mobile.
   ========================================================= */

@media (max-width: 749px){
  .site-footer {
    padding-top: 3rem !important;
    text-align: center !important;
  }

  .site-footer__grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
  }

  .site-footer__brand-column {
    display: grid !important;
    justify-items: center !important;
    text-align: center !important;
    gap: 1rem !important;
  }

  .site-footer__logo {
    display: inline-flex !important;
    justify-content: center !important;
    margin-inline: auto !important;
  }

  .site-footer__logo-image {
    margin-inline: auto !important;
    max-width: 15rem !important;
    height: auto !important;
  }

  .site-footer__text {
    max-width: 21rem !important;
    margin-inline: auto !important;
    text-align: center !important;
    line-height: 1.55 !important;
  }

  .site-footer__socials {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 0.65rem !important;
    margin-inline: auto !important;
  }

  .site-footer__social-link {
    min-height: 2.35rem !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .site-footer__accordion {
    width: 100% !important;
    border-top: 1px solid rgba(18, 57, 93, 0.1) !important;
    text-align: left !important;
  }

  .site-footer__accordion:last-of-type {
    border-bottom: 1px solid rgba(18, 57, 93, 0.1) !important;
  }

  .site-footer__accordion-summary {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1rem !important;
    min-height: 3.45rem !important;
    padding: 0 !important;
    cursor: pointer !important;
    list-style: none !important;
  }

  .site-footer__accordion-summary::-webkit-details-marker {
    display: none !important;
  }

  .site-footer__accordion-summary .site-footer__menu-heading {
    display: block !important;
    margin: 0 !important;
    color: var(--color-blue, #1f6fae) !important;
    font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
    font-size: 0.78rem !important;
    font-weight: 900 !important;
    letter-spacing: 0.18em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  .site-footer__accordion-icon {
    display: inline-grid !important;
    place-items: center !important;
    width: 1.7rem !important;
    height: 1.7rem !important;
    min-width: 1.7rem !important;
    border-radius: 999px !important;
    border: 1px solid rgba(18, 57, 93, 0.1) !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: var(--color-ink, #12395d) !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    transition: transform 180ms ease, background 180ms ease !important;
  }

  .site-footer__accordion[open] .site-footer__accordion-icon {
    transform: rotate(45deg) !important;
    background: rgba(142, 205, 224, 0.16) !important;
  }

  .site-footer__accordion-panel {
    padding-bottom: 1.15rem !important;
  }

  .site-footer__menu-list {
    display: grid !important;
    gap: 0.75rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  .site-footer__menu-list a {
    display: inline-flex !important;
    color: rgba(18, 57, 93, 0.78) !important;
    font-size: 1rem !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
  }

  .site-footer__bottom {
    margin-top: 1.5rem !important;
    text-align: center !important;
  }

  .site-footer__copyright {
    text-align: center !important;
    margin-inline: auto !important;
  }
}
/* Desktop: make details behave like normal footer columns */
@media (min-width: 750px){
  .site-footer__accordion {
    display: block !important;
  }

  .site-footer__accordion-summary {
    display: block !important;
    cursor: default !important;
    list-style: none !important;
  }

  .site-footer__accordion-summary::-webkit-details-marker {
    display: none !important;
  }

  .site-footer__accordion-icon {
    display: none !important;
  }

  .site-footer__accordion-panel {
    display: block !important;
  }
}
/* =========================================================
   HEADER ACCOUNT ICON
   Match profile/account icon with wishlist/cart controls.
   ========================================================= */

.site-header__account{
  display: inline-grid !important;
  place-items: center !important;
  position: relative !important;
  width: 2.85rem !important;
  height: 2.85rem !important;
  min-width: 2.85rem !important;
  min-height: 2.85rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow:
    0 0.75rem 1.8rem rgba(18, 57, 93, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  text-decoration: none !important;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease !important;
}
.site-header__account:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(31, 111, 174, 0.22) !important;
  color: var(--color-blue, #1f6fae) !important;
  box-shadow:
    0 0.95rem 2.15rem rgba(18, 57, 93, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
}
.site-header__account svg{
  width: 1.05rem !important;
  height: 1.05rem !important;
  display: block !important;
}
/* Mobile/header order: account,
wishlist,
cart,
menu */

/* =========================================================
   HOME TRANSPARENT HERO ACCOUNT ICON HARD BACKGROUND
   Match account/profile icon with wishlist/cart glass buttons.
   ========================================================= */

body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account{
  display: inline-grid !important;
  place-items: center !important;
  width: 2.85rem !important;
  height: 2.85rem !important;
  min-width: 2.85rem !important;
  min-height: 2.85rem !important;
  max-width: 2.85rem !important;
  max-height: 2.85rem !important;
  padding: 0 !important;
  border: 1px solid rgba(18, 57, 93, 0.12) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  backdrop-filter: blur(16px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.12) !important;
  opacity: 1 !important;
  visibility: visible !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account svg{
  width: 1rem !important;
  height: 1rem !important;
  display: block !important;
  color: var(--color-ink, #12395d) !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account svg path{
  stroke: currentColor !important;
  stroke-width: 2 !important;
}
/* Keep all hero header action buttons visually consistent */
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)) !important;
  border-color: rgba(18, 57, 93, 0.12) !important;
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
}
/* Mobile transparent hero consistency */

/* =========================================================
   GLOBAL WISHLIST VISIBILITY CONTROL
   Header setting controls product-card wishlist buttons too.
   ========================================================= */

body.themeblocks-skincare-wishlist-disabled [data-wishlist-toggle],
body.themeblocks-skincare-wishlist-disabled [data-wishlist-button],
body.themeblocks-skincare-wishlist-disabled .product-card__wishlist,
body.themeblocks-skincare-wishlist-disabled .product-card__wishlist-button,
body.themeblocks-skincare-wishlist-disabled .bestseller-card__wishlist,
body.themeblocks-skincare-wishlist-disabled .bestseller-card__wishlist-button,
body.themeblocks-skincare-wishlist-disabled .related-product-card__wishlist,
body.themeblocks-skincare-wishlist-disabled .related-product-card__wishlist-button,
body.themeblocks-skincare-wishlist-disabled .collection-card__wishlist,
body.themeblocks-skincare-wishlist-disabled .collection-card__wishlist-button{
  display: none !important;
}
/* =========================================================
   PREMIUM 404 PAGE
   ThemeBlocks Skincare branded not-found experience.
   ========================================================= */

.main-404{
  position: relative;
  min-height: min(76vh, 52rem);
  display: grid;
  align-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 20%, rgba(142, 205, 224, 0.18), transparent 24rem),
    radial-gradient(circle at 88% 16%, rgba(201, 162, 39, 0.12), transparent 22rem),
    linear-gradient(180deg, #ffffff 0%, #f7fbfd 100%);
}
.main-404__shell{
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.72fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  padding: clamp(2.5rem, 6vw, 5rem);
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: clamp(1.25rem, 2vw, 2rem);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(244, 251, 253, 0.88));
  box-shadow:
    0 1.8rem 5rem rgba(18, 57, 93, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 1);
  overflow: hidden;
}
.main-404__orb{
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  filter: blur(2px);
}
.main-404__orb--blue{
  width: 18rem;
  height: 18rem;
  right: 12%;
  top: -7rem;
  background: rgba(142, 205, 224, 0.28);
}
.main-404__orb--gold{
  width: 12rem;
  height: 12rem;
  left: -4rem;
  bottom: -4rem;
  background: rgba(201, 162, 39, 0.14);
}
.main-404__content{
  position: relative;
  z-index: 2;
  max-width: 42rem;
}
.main-404__eyebrow{
  margin: 0 0 0.85rem;
  color: var(--color-blue, #1f6fae);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  line-height: 1;
  text-transform: uppercase;
}
.main-404__heading{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: clamp(3rem, 7vw, 6.5rem);
  font-weight: var(--font-heading-weight, 700);
  letter-spacing: -0.06em;
  line-height: 0.92;
}
.main-404__text{
  max-width: 34rem;
  margin: 1.2rem 0 0;
  color: rgba(18, 57, 93, 0.72);
  font-size: clamp(1rem, 1.35vw, 1.18rem);
  line-height: 1.65;
}
.main-404__actions{
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  margin-top: 1.7rem;
}
.main-404__button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.25rem;
  padding: 0 1.35rem;
  border-radius: 999px;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}
.main-404__button--primary{
  border: 1px solid var(--color-blue, #1f6fae);
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  box-shadow: 0 0.85rem 1.9rem rgba(31, 111, 174, 0.2);
}
.main-404__button--secondary{
  border: 1px solid rgba(18, 57, 93, 0.14);
  background: rgba(255, 255, 255, 0.88);
  color: var(--color-ink, #12395d);
}
.main-404__button:hover{
  transform: translateY(-1px);
}
.main-404__button--primary:hover{
  background: #185f96;
  border-color: #185f96;
  color: #ffffff;
}
.main-404__button--secondary:hover{
  border-color: rgba(31, 111, 174, 0.24);
  color: var(--color-blue, #1f6fae);
}
.main-404__search{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.65rem;
  max-width: 34rem;
  margin-top: 1rem;
  padding: 0.35rem;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}
.main-404__search-input{
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0 0.95rem;
  color: var(--color-ink, #12395d);
  font: inherit;
  outline: none;
}
.main-404__search-button{
  min-height: 2.65rem;
  padding: 0 1rem;
  border: 0;
  border-radius: 999px;
  background: var(--color-ink, #12395d);
  color: #ffffff;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  cursor: pointer;
}
.main-404__visual{
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  min-height: 24rem;
}
.main-404__badge{
  position: absolute;
  inset: auto auto 1rem 50%;
  transform: translateX(-50%);
  color: rgba(18, 57, 93, 0.055);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: clamp(8rem, 18vw, 16rem);
  font-weight: 800;
  letter-spacing: -0.08em;
  line-height: 1;
}
.main-404__bottle{
  position: relative;
  width: clamp(8rem, 16vw, 13rem);
  aspect-ratio: 0.64;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 999px 999px 1.25rem 1.25rem;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(233, 247, 251, 0.9));
  box-shadow:
    0 2rem 4rem rgba(18, 57, 93, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}
.main-404__bottle::before{
  content: "";
  position: absolute;
  left: 50%;
  top: -2.1rem;
  width: 42%;
  height: 2.4rem;
  transform: translateX(-50%);
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 0.5rem 0.5rem 0 0;
  background: rgba(255, 255, 255, 0.92);
}
.main-404__bottle span{
  position: absolute;
  inset: 18% 18% auto;
  height: 0.55rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--color-blue, #1f6fae), rgba(142, 205, 224, 0.95));
}
.main-404__drop{
  position: absolute;
  width: 0.75rem;
  height: 1rem;
  border-radius: 999px 999px 999px 0;
  background: rgba(142, 205, 224, 0.88);
  transform: rotate(-45deg);
  box-shadow: 0 0.65rem 1.5rem rgba(18, 57, 93, 0.12);
}
.main-404__drop--one{
  top: 24%;
  right: 16%;
}
.main-404__drop--two{
  left: 18%;
  top: 42%;
  width: 0.55rem;
  height: 0.75rem;
  opacity: 0.7;
}
.main-404__drop--three{
  right: 28%;
  bottom: 22%;
  width: 0.5rem;
  height: 0.7rem;
  background: rgba(201, 162, 39, 0.6);
}

@media (max-width: 989px) {
.main-404__shell{
    grid-template-columns: 1fr;
  }
.main-404__visual{
    min-height: 17rem;
    order: -1;
  }
}

@media (max-width: 749px) {
.main-404{
    min-height: auto;
    padding-block: 2.5rem;
  }
.main-404__shell{
    padding: 2rem 1.2rem;
    border-radius: 1.25rem;
    text-align: center;
  }
.main-404__content,
.main-404__text{
    max-width: 100%;
    margin-inline: auto;
  }
.main-404__actions{
    justify-content: center;
  }
.main-404__button{
    width: 100%;
  }
.main-404__search{
    grid-template-columns: 1fr;
    border-radius: 1rem;
    padding: 0.6rem;
  }
.main-404__search-input{
    min-height: 2.7rem;
    text-align: center;
  }
.main-404__search-button{
    width: 100%;
  }
}
/* =========================================================
   HEADER SEARCH TOGGLE
   Premium header search panel.
   ========================================================= */

.site-header__search-toggle{
  display: inline-grid !important;
  place-items: center !important;
  position: relative !important;
  width: 2.85rem !important;
  height: 2.85rem !important;
  min-width: 2.85rem !important;
  min-height: 2.85rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  color: var(--color-ink, #12395d) !important;
  box-shadow:
    0 0.75rem 1.8rem rgba(18, 57, 93, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  cursor: pointer !important;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease !important;
}
.site-header__search-toggle:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(31, 111, 174, 0.22) !important;
  color: var(--color-blue, #1f6fae) !important;
}
.site-header__search-toggle svg{
  width: 1.08rem !important;
  height: 1.08rem !important;
  display: block !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle{
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)) !important;
  border-color: rgba(18, 57, 93, 0.12) !important;
  box-shadow:
    0 0.85rem 2rem rgba(18, 57, 93, 0.11),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
}
.site-header__search{
  position: absolute !important;
  left: 50% !important;
  top: calc(100% + 0.75rem) !important;
  z-index: 9997 !important;
  width: min(46rem, calc(100vw - 2rem)) !important;
  transform: translateX(-50%) translateY(-0.5rem) scale(0.98) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition:
    opacity 180ms ease,
    visibility 180ms ease,
    transform 240ms cubic-bezier(0.19, 1, 0.22, 1) !important;
}
.site-header__search.is-open{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) scale(1) !important;
}
.site-header__search[hidden]{
  display: block !important;
}
.site-header__search-form{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto auto !important;
  align-items: center !important;
  gap: 0.55rem !important;
  padding: 0.55rem !important;
  border: 1px solid rgba(18, 57, 93, 0.12) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  box-shadow:
    0 1.25rem 3.4rem rgba(18, 57, 93, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 1) !important;
  backdrop-filter: blur(16px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.08) !important;
}
.site-header__search-input{
  min-width: 0 !important;
  min-height: 3rem !important;
  padding: 0 1rem !important;
  border: 0 !important;
  outline: none !important;
  background: transparent !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 1rem !important;
  line-height: 1 !important;
}
.site-header__search-input::placeholder{
  color: rgba(18, 57, 93, 0.48) !important;
}
.site-header__search-submit{
  min-height: 3rem !important;
  padding: 0 1.2rem !important;
  border: 1px solid var(--color-blue, #1f6fae) !important;
  border-radius: 999px !important;
  background: var(--color-blue, #1f6fae) !important;
  color: #ffffff !important;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: 0.76rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}
.site-header__search-close{
  display: inline-grid !important;
  place-items: center !important;
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  border: 1px solid rgba(18, 57, 93, 0.1) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--color-ink, #12395d) !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
  cursor: pointer !important;
}


/* =========================================================
   PREMIUM SEARCH PAGE
   ThemeBlocks Skincare search results experience.
   ========================================================= */

.main-search{
  min-height: 60vh;
  background:
    radial-gradient(circle at 12% 8%, rgba(142, 205, 224, 0.14), transparent 24rem),
    radial-gradient(circle at 88% 10%, rgba(201, 162, 39, 0.08), transparent 22rem),
    #ffffff;
}
.main-search__header{
  max-width: 58rem;
  margin-inline: auto;
  text-align: center;
}
.main-search__eyebrow{
  margin: 0 0 0.8rem;
  color: var(--color-blue, #1f6fae);
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  line-height: 1;
  text-transform: uppercase;
}
.main-search__heading{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-size: clamp(2.5rem, 5.8vw, 5.5rem);
  font-weight: var(--font-heading-weight, 700);
  letter-spacing: -0.06em;
  line-height: 0.95;
}
.main-search__text{
  max-width: 34rem;
  margin: 1rem auto 0;
  color: rgba(18, 57, 93, 0.72);
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.6;
}
.main-search__form{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.65rem;
  max-width: 44rem;
  margin: 1.6rem auto 0;
  padding: 0.45rem;
  border: 1px solid rgba(18, 57, 93, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow:
    0 1rem 2.8rem rgba(18, 57, 93, 0.09),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}
.main-search__input{
  min-width: 0;
  min-height: 3.15rem;
  padding: 0 1rem;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--color-ink, #12395d);
  font-size: 1rem;
}
.main-search__button{
  min-height: 3.15rem;
  padding: 0 1.35rem;
  border: 1px solid var(--color-blue, #1f6fae);
  border-radius: 999px;
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  font-family: var(--font-button-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor: pointer;
}
.main-search__grid{
  display: grid;
  grid-template-columns: repeat(var(--cv-search-columns, 4), minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
  margin-top: clamp(2.4rem, 5vw, 4rem);
}
.main-search__result-card{
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.1rem;
  background: #ffffff;
  box-shadow: 0 1rem 2.5rem rgba(18, 57, 93, 0.07);
}
.main-search__result-link{
  display: grid;
  gap: 0.65rem;
  padding: 1.2rem;
  color: inherit;
  text-decoration: none;
}
.main-search__result-type{
  color: var(--color-blue, #1f6fae);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.main-search__result-title{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-size: 1.25rem;
  line-height: 1.15;
}
.main-search__result-excerpt{
  margin: 0;
  color: rgba(18, 57, 93, 0.7);
  line-height: 1.55;
}
.main-search__empty{
  max-width: 34rem;
  margin: 3rem auto 0;
  padding: 2rem;
  border: 1px solid rgba(18, 57, 93, 0.08);
  border-radius: 1.25rem;
  background: #ffffff;
  text-align: center;
  box-shadow: 0 1rem 2.8rem rgba(18, 57, 93, 0.08);
}
.main-search__empty-icon{
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: 0.75rem;
  border-radius: 999px;
  background: rgba(142, 205, 224, 0.16);
  color: var(--color-blue, #1f6fae);
}
.main-search__empty h2{
  margin: 0;
  color: var(--color-ink, #12395d);
  font-size: 1.45rem;
}
.main-search__empty p{
  margin: 0.75rem 0 0;
  color: rgba(18, 57, 93, 0.72);
  line-height: 1.55;
}
.main-search__empty-button{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  margin-top: 1.2rem;
  padding: 0 1.2rem;
  border-radius: 999px;
  background: var(--color-blue, #1f6fae);
  color: #ffffff;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-decoration: none;
}
.main-search__pagination{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-top: 2.5rem;
}
.main-search__pagination-link{
  color: var(--color-blue, #1f6fae);
  font-weight: 900;
  text-decoration: none;
}
.main-search__pagination-current{
  color: rgba(18, 57, 93, 0.68);
}

@media (max-width: 1199px) {
.main-search__grid{
    --cv-search-columns: 3;
  }
}

@media (max-width: 899px) {
.main-search__grid{
    --cv-search-columns: 2;
  }
}

@media (max-width: 749px) {
.main-search__form{
    grid-template-columns: 1fr;
    border-radius: 1rem;
    padding: 0.65rem;
  }
.main-search__input{
    border-radius: 0.75rem;
    background: rgba(244, 251, 253, 0.78);
    text-align: center;
  }
.main-search__button{
    width: 100%;
    border-radius: 0.75rem;
  }
.main-search__grid{
    --cv-search-columns: 2;
    gap: 0.85rem;
  }
}
/* =========================================================
   DESKTOP HEADER LAYOUT OPTION: CENTER LOGO
   Menu left,
logo centered,
icons right.
   ========================================================= */

@media (min-width: 750px){
  .site-header--layout-center_logo .site-header__inner {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: clamp(1rem, 2vw, 2rem) !important;
  }

  .site-header--layout-center_logo .site-header__nav {
    grid-column: 1 !important;
    justify-self: start !important;
    margin-inline: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  .site-header--layout-center_logo .site-header__logo,
  .site-header--layout-center_logo .site-header__logo-link {
    grid-column: 2 !important;
    justify-self: center !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 5 !important;
  }

  .site-header--layout-center_logo .site-header__actions {
    grid-column: 3 !important;
    justify-self: end !important;
    margin-left: auto !important;
  }

  .site-header--layout-center_logo .site-header__logo-image {
    width: clamp(7.8rem, 9vw, 10.5rem) !important;
    max-height: 3.25rem !important;
    object-fit: contain !important;
  }

  .site-header--layout-center_logo .site-header__logo-text {
    text-align: center !important;
  }
}
/* Mobile should keep the existing compact mobile header behavior */

/* =========================================================
   FIX: CENTER LOGO LAYOUT MUST NOT BREAK HOME TRANSPARENT HERO
   Center-logo layout applies to normal/sticky headers,
not the initial
   transparent hero state before scroll.
   ========================================================= */

@media (min-width: 750px){
  body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo:not(.is-scrolled)
  .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 4.75rem !important;
    gap: 1.25rem !important;
  }

  /* Keep menu centered in transparent hero state, same as original hero header */
  body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo:not(.is-scrolled)
  .site-header__nav {
    grid-column: 2 !important;
    justify-self: center !important;
    margin-inline: auto !important;
    position: relative !important;
    z-index: 4 !important;
  }

  /* Keep icons on the right in transparent hero state */
  body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo:not(.is-scrolled)
  .site-header__actions {
    grid-column: 3 !important;
    justify-self: end !important;
    align-self: center !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    margin-left: auto !important;
    z-index: 5 !important;
  }
/* Only apply center-logo layout after scroll/sticky reveal */
  body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo.is-scrolled
  .site-header__inner,
body:not(.template-index)
  .site-header--layout-center_logo
  .site-header__inner{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
  }
body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo.is-scrolled
  .site-header__nav,
body:not(.template-index)
  .site-header--layout-center_logo
  .site-header__nav{
    grid-column: 1 !important;
    justify-self: start !important;
    margin-inline: 0 !important;
  }
body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo.is-scrolled
  .site-header__logo,
body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo.is-scrolled
  .site-header__logo-link,
body:not(.template-index)
  .site-header--layout-center_logo
  .site-header__logo,
body:not(.template-index)
  .site-header--layout-center_logo
  .site-header__logo-link{
    grid-column: 2 !important;
    justify-self: center !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
body.template-index
  .site-header--transparent-hero.site-header--layout-center_logo.is-scrolled
  .site-header__actions,
body:not(.template-index)
  .site-header--layout-center_logo
  .site-header__actions{
    grid-column: 3 !important;
    justify-self: end !important;
    margin-left: auto !important;
  }
}
/* =========================================================
   FINAL CENTER LOGO HEADER ROW FIX
   Force menu,
logo,
and icons onto one horizontal row.
   ========================================================= */

@media (min-width: 750px){
  .site-header.site-header--layout-center_logo {
    min-height: 5.25rem !important;
  }

  .site-header.site-header--layout-center_logo .site-header__inner {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 5.25rem !important;
    gap: clamp(1rem, 2vw, 2rem) !important;
  }

  .site-header.site-header--layout-center_logo .site-header__nav {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    margin: 0 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    z-index: 4 !important;
  }

  .site-header.site-header--layout-center_logo .site-header__logo,
  .site-header.site-header--layout-center_logo .site-header__logo-link {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: clamp(7.5rem, 9vw, 10.5rem) !important;
    max-width: 10.5rem !important;
    min-width: 0 !important;
    min-height: 0 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 5 !important;
  }

  .site-header.site-header--layout-center_logo .site-header__logo-image {
    width: 100% !important;
    max-height: 3.2rem !important;
    object-fit: contain !important;
    display: block !important;
  }

  .site-header.site-header--layout-center_logo .site-header__actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin: 0 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    z-index: 6 !important;
  }

  body.template-index
  .site-header.site-header--layout-center_logo.site-header--transparent-hero:not(.is-scrolled)
  .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 5.25rem !important;
  }

  body.template-index
  .site-header.site-header--layout-center_logo.site-header--transparent-hero:not(.is-scrolled)
  .site-header__nav {
    grid-column: 1 !important;
    justify-self: start !important;
  }

  body.template-index
  .site-header.site-header--layout-center_logo.site-header--transparent-hero:not(.is-scrolled)
  .site-header__actions {
    grid-column: 3 !important;
    justify-self: end !important;
  }
}
/* =========================================================
   HOME TRANSPARENT HERO HEADER ALIGNMENT
   When transparent hero is active,
keep menu left and icons right.
   Header logo stays hidden if hero logo is enabled.
   ========================================================= */

@media (min-width: 750px){
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    min-height: 5.25rem !important;
    width: 100% !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__logo,
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__logo-link {
    display: none !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__nav {
    grid-column: 1 !important;
    justify-self: start !important;
    margin: 0 !important;
    padding-left: max(var(--site-gutter, 2rem), calc((100vw - var(--page-width, 1440px)) / 2)) !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__actions {
    grid-column: 2 !important;
    justify-self: end !important;
    margin: 0 !important;
    padding-right: max(var(--site-gutter, 2rem), calc((100vw - var(--page-width, 1440px)) / 2)) !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
  }
}
/* =========================================================
   FINAL HOME TRANSPARENT HERO ROW ALIGNMENT
   Target: menu left,
icons right,
same row,
no header logo.
   Applies only before sticky/scroll on homepage hero.
   ========================================================= */

@media (min-width: 750px){
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled) {
    min-height: 5.25rem !important;
    background: transparent !important;
    box-shadow: none !important;
    border-bottom-color: transparent !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 5.25rem !important;
    padding-left: clamp(4rem, 6vw, 7rem) !important;
    padding-right: clamp(4rem, 6vw, 7rem) !important;
    gap: 2rem !important;
    position: relative !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__logo,
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__logo-link {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__nav {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: clamp(2rem, 3.2vw, 3.8rem) !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 1 auto !important;
    position: static !important;
    transform: none !important;
    justify-self: auto !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__actions {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.75rem !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
    position: static !important;
    transform: none !important;
    justify-self: auto !important;
  }
}

@media (min-width: 1440px) {
body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__inner{
    padding-left: 7rem !important;
    padding-right: 7rem !important;
  }
}
/* =========================================================
   FINAL WIDE SCREEN HOME TRANSPARENT HERO ALIGNMENT
   Use centered max-width row instead of fixed viewport padding.
   Fixes 1400px+ alignment drift.
   ========================================================= */

@media (min-width: 750px){
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: min(calc(100vw - 4rem), var(--page-width, 1440px)) !important;
    max-width: var(--page-width, 1440px) !important;
    min-height: 5.25rem !important;
    margin-inline: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    gap: 2rem !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__logo,
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__logo-link {
    display: none !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__nav {
    grid-column: 1 !important;
    justify-self: start !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: clamp(2rem, 3vw, 3.5rem) !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    transform: none !important;
  }

  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__actions {
    grid-column: 2 !important;
    justify-self: end !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.72rem !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    transform: none !important;
  }
}
/* Wider desktop: use same centered hero/container width,
not extra padding */
@media (min-width: 1440px){
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__inner {
    width: min(88vw, var(--page-width, 1440px)) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
/* Ultra-wide: prevent icons/menu from drifting too far apart */
@media (min-width: 1700px){
  body.template-index
  .site-header.site-header--transparent-hero:not(.is-scrolled)
  .site-header__inner {
    width: min(82vw, var(--page-width, 1440px)) !important;
  }
}
/* ThemeBlocks premium fallback image placeholders */
.themeblocks-placeholder{
  position: relative;
  display: grid;
  min-height: 100%;
  width: 100%;
  place-items: center;
  overflow: hidden;
  border-radius: inherit;
  background:
    radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0) 30%),
    linear-gradient(135deg, #f8efe7 0%, #ead9cc 46%, #d8bfae 100%);
  color: #5e493d;
  isolation: isolate;
}
.themeblocks-placeholder::before,
.themeblocks-placeholder::after{
  content: '';
  position: absolute;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.42);
  filter: blur(1px);
  z-index: -1;
}
.themeblocks-placeholder::before{
  width: 54%;
  height: 54%;
  top: -16%;
  right: -18%;
}
.themeblocks-placeholder::after{
  width: 42%;
  height: 42%;
  bottom: -14%;
  left: -12%;
}
.themeblocks-placeholder__glow{
  position: absolute;
  inset: 12%;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 32px;
}
.themeblocks-placeholder__shelf{
  position: relative;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: clamp(8px, 2vw, 16px);
  min-height: 140px;
  padding-top: 26px;
}
.themeblocks-placeholder__shelf::after{
  content: '';
  position: absolute;
  bottom: -8px;
  width: 150px;
  height: 14px;
  border-radius: 999px;
  background: rgba(102, 74, 59, 0.18);
  filter: blur(4px);
}
.themeblocks-placeholder__bottle,
.themeblocks-placeholder__jar{
  display: block;
  position: relative;
  box-shadow: 0 18px 34px rgba(85, 58, 45, 0.2);
}
.themeblocks-placeholder__bottle{
  width: 40px;
  height: 108px;
  border-radius: 15px 15px 10px 10px;
  background: linear-gradient(180deg, #fffaf6 0%, #e5cfc0 100%);
}
.themeblocks-placeholder__bottle::before{
  content: '';
  position: absolute;
  top: -18px;
  left: 50%;
  width: 20px;
  height: 22px;
  border-radius: 8px 8px 4px 4px;
  background: #8a6b5b;
  transform: translateX(-50%);
}
.themeblocks-placeholder__bottle::after,
.themeblocks-placeholder__jar::after{
  content: '';
  position: absolute;
  left: 50%;
  top: 46%;
  width: 62%;
  height: 20%;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  transform: translate(-50%, -50%);
}
.themeblocks-placeholder__bottle--two{
  height: 92px;
  width: 34px;
  opacity: 0.9;
}
.themeblocks-placeholder__jar{
  width: 74px;
  height: 58px;
  border-radius: 20px 20px 24px 24px;
  background: linear-gradient(180deg, #fef9f3 0%, #d7bca9 100%);
}
.themeblocks-placeholder__jar::before{
  content: '';
  position: absolute;
  top: -15px;
  left: 8px;
  right: 8px;
  height: 18px;
  border-radius: 12px 12px 8px 8px;
  background: #7b5e50;
}
.themeblocks-placeholder__label{
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  display: block;
  color: rgba(72, 53, 45, 0.82);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.35;
  text-align: center;
  text-transform: uppercase;
}
/* Generic page template */
.main-page__container{
  max-width: 900px;
}
.main-page__header{
  margin-bottom: clamp(28px, 5vw, 56px);
  text-align: center;
}
.main-page__eyebrow{
  margin: 0 0 12px;
  color: rgba(80, 58, 48, 0.72);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.main-page__title{
  margin: 0;
  color: #2d211d;
  font-size: clamp(2.4rem, 6vw, 5rem);
  line-height: 0.95;
  letter-spacing: -0.06em;
}
.main-page__content{
  color: rgba(45, 33, 29, 0.78);
  font-size: clamp(1rem, 1.4vw, 1.15rem);
  line-height: 1.8;
}
/* Header logo sizing */
.site-header__logo-image{
  display: block;
  height: auto;
}


/* Final header logo size setting authority */
.site-header .site-header__logo,
.site-header .site-header__logo-link{
  width: var(--tb-logo-width) !important;
  max-width: var(--tb-logo-width) !important;
  flex: 0 0 auto !important;
}
.site-header .site-header__logo-image{
  width: var(--tb-logo-width) !important;
  max-width: var(--tb-logo-width) !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  display: block !important;
}


/* Final footer logo size setting authority */
.site-footer .site-footer__logo{
  width: var(--tb-footer-logo-width) !important;
  max-width: var(--tb-footer-logo-width) !important;
  display: inline-flex !important;
  align-items: center !important;
}
.site-footer .site-footer__logo-image{
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  display: block !important;
}

@media screen and (max-width: 749px) {
.site-footer .site-footer__logo{
    width: var(--tb-footer-mobile-logo-width) !important;
    max-width: var(--tb-footer-mobile-logo-width) !important;
  }
}
/* Final global typography authority */
html,
body{
  font-family: var(--font-body-family, Arial, Helvetica, sans-serif) !important;
  font-style: var(--font-body-style, normal) !important;
  font-weight: var(--font-body-weight, 400) !important;
}
body,
p,
li,
summary,
input,
textarea,
select,
label,
.rte,
.rte p,
.product-card,
.product-card *,
.cart-drawer,
.cart-drawer *,
.main-cart,
.main-cart *,
.main-search,
.main-search *{
  font-family: var(--font-body-family, Arial, Helvetica, sans-serif);
}
h1,
h2,
h3,
h4,
h5,
h6,
[class*="__heading"],
[class*="__title"],
.hero-themeblocks-skincare__heading,
.main-page__title,
.main-product__title,
.main-collection__title,
.main-search__title,
.main-404__heading{
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-style: var(--font-heading-style, normal);
  font-weight: var(--font-heading-weight, 700);
}
h1 em,
h2 em,
h3 em,
[class*="__heading"] em,
[class*="__title"] em,
.hero-themeblocks-skincare__heading em{
  font-family: inherit !important;
  font-style: var(--cv-heading-accent-style, italic) !important;
  font-weight: var(--font-heading-accent-weight, 500) !important;
}
.site-header__nav-link,
.site-header__mobile-link,
.site-footer__menu-heading,
.site-footer__menu-list a,
.site-footer__social-link,
.breadcrumb,
.breadcrumb a,
.product-main__breadcrumb,
.product-main__breadcrumb a,
.main-search__pagination-link{
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-style: var(--font-nav-style, normal) !important;
  font-weight: var(--font-nav-weight, 800) !important;
}
button,
.button,
.shopify-payment-button__button,
.product-form__submit,
.newsletter-cta__button,
.product-newsletter__button,
.main-404__button,
.main-search__button,
.clinical-banner__button,
.skin-goals__link,
.skincare-guide__link,
.why-themeblocks-skincare__link,
.site-header__search-submit,
.cart-drawer__checkout,
.cart-drawer__view-cart{
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-style: var(--font-button-style, normal) !important;
  font-weight: var(--font-button-weight, 700) !important;
}
svg,
svg *,
.icon,
[class*="icon"],
.shopify-payment-button,
.shopify-payment-button *,
.judgeme,
.judgeme *,
.jdgm-widget,
.jdgm-widget *{
  font-family: inherit;
}
/* Final button system */
.button,
.button--primary,
.button--secondary,
.button--tertiary,
.clinical-banner__button,
.why-themeblocks-skincare__link,
.faq-themeblocks-skincare__button,
.newsletter-cta__button,
.product-newsletter__button,
.tb-contact-care__button,
.main-search__button,
.main-search__empty-button,
.main-404__button,
.cart-summary__checkout,
.cart-summary__update,
.cart-empty__button,
.cart-drawer__checkout,
.cart-drawer__empty-button{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 1.55rem !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-style: var(--font-button-style, normal) !important;
  font-weight: var(--font-button-weight, 700) !important;
  font-size: 0.76rem !important;
  line-height: 1 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease !important;
}
.button--primary,
.button:not(.button--secondary):not(.button--tertiary),
.clinical-banner__button:not(.button--secondary):not(.button--tertiary),
.why-themeblocks-skincare__link:not(.button--secondary):not(.button--tertiary),
.faq-themeblocks-skincare__button:not(.button--secondary):not(.button--tertiary),
.newsletter-cta__button,
.product-newsletter__button,
.tb-contact-care__button,
.main-search__button,
.main-404__button--primary,
.cart-summary__checkout,
.cart-drawer__checkout{
  background: var(--color-blue, #1f6fae) !important;
  border-color: var(--color-blue, #1f6fae) !important;
  color: var(--color-white, #ffffff) !important;
  box-shadow: 0 0.9rem 1.8rem rgba(31, 111, 174, 0.18) !important;
}
.button--secondary,
.main-404__button--secondary,
.cart-summary__update,
.cart-empty__button,
.cart-drawer__empty-button,
.main-search__empty-button{
  background: rgba(31, 111, 174, 0.09) !important;
  border-color: rgba(31, 111, 174, 0.14) !important;
  color: var(--color-blue, #1f6fae) !important;
  box-shadow: none !important;
}
.button--tertiary{
  background: transparent !important;
  border-color: currentColor !important;
  color: var(--color-blue, #1f6fae) !important;
  box-shadow: none !important;
}
.button:hover,
.button--primary:hover,
.button--secondary:hover,
.button--tertiary:hover,
.clinical-banner__button:hover,
.why-themeblocks-skincare__link:hover,
.faq-themeblocks-skincare__button:hover,
.newsletter-cta__button:hover,
.product-newsletter__button:hover,
.tb-contact-care__button:hover,
.main-search__button:hover,
.main-search__empty-button:hover,
.main-404__button:hover,
.cart-summary__checkout:hover,
.cart-summary__update:hover,
.cart-empty__button:hover,
.cart-drawer__checkout:hover,
.cart-drawer__empty-button:hover{
  transform: translateY(-1px) !important;
}
.button--primary:hover,
.button:not(.button--secondary):not(.button--tertiary):hover,
.clinical-banner__button:not(.button--secondary):not(.button--tertiary):hover,
.why-themeblocks-skincare__link:not(.button--secondary):not(.button--tertiary):hover,
.faq-themeblocks-skincare__button:not(.button--secondary):not(.button--tertiary):hover,
.newsletter-cta__button:hover,
.product-newsletter__button:hover,
.tb-contact-care__button:hover,
.main-search__button:hover,
.main-404__button--primary:hover,
.cart-summary__checkout:hover,
.cart-drawer__checkout:hover{
  background: var(--color-blue-dark, #185f93) !important;
  border-color: var(--color-blue-dark, #185f93) !important;
  box-shadow: 0 1.1rem 2.2rem rgba(31, 111, 174, 0.24) !important;
}
.button--secondary:hover,
.main-404__button--secondary:hover,
.cart-summary__update:hover,
.cart-empty__button:hover,
.cart-drawer__empty-button:hover,
.main-search__empty-button:hover{
  background: rgba(31, 111, 174, 0.14) !important;
  border-color: rgba(31, 111, 174, 0.2) !important;
}
.button--tertiary:hover{
  background: rgba(31, 111, 174, 0.06) !important;
}

@media screen and (max-width: 749px) {
.button,
.button--primary,
.button--secondary,
.button--tertiary,
.clinical-banner__button,
.why-themeblocks-skincare__link,
.faq-themeblocks-skincare__button,
.newsletter-cta__button,
.product-newsletter__button,
.tb-contact-care__button,
.main-search__button,
.main-search__empty-button,
.main-404__button,
.cart-summary__checkout,
.cart-summary__update,
.cart-empty__button,
.cart-drawer__checkout,
.cart-drawer__empty-button{
    min-height: 50px !important;
    padding-inline: 1.25rem !important;
    font-size: 0.72rem !important;
  }
}
/* Final color scheme foundation */
html,
body{
  background: var(--color-background, #fcf7f2) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.site-header{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 94%, transparent) !important;
  border-bottom-color: color-mix(in srgb, var(--color-border, #e5d4c8) 80%, transparent) !important;
}
.site-footer{
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--color-secondary, #e7d5c8) 30%, transparent), transparent 34%),
    var(--color-ink, #3a2e2a) !important;
}
.hero-themeblocks-skincare,
.clinical-banner,
.brand-promise,
.bestsellers,
.featured-products,
.category-strip,
.skin-goals,
.skincare-guide,
.skincare-sets,
.why-themeblocks-skincare,
.faq-themeblocks-skincare,
.newsletter-cta,
.product-newsletter,
.main-page,
.main-search,
.main-cart,
.main-404{
  color: var(--color-ink, #3a2e2a);
}
.hero-themeblocks-skincare__heading em,
[class*="__eyebrow"],
.product-main__vendor,
.product-main__breadcrumb a,
.main-search__result-type,
.site-footer__social-link,
.site-footer__menu-list a:hover{
  color: var(--color-accent, #c8a15a) !important;
}
[class*="__text"],
[class*="__subheading"],
.rte,
.rte p,
.main-page__content,
.product-main__description,
.site-footer__text{
  color: var(--color-ink-soft, #74635b) !important;
}
.product-card,
.bestseller-card,
.collection-card,
.brand-promise__card,
.skin-goals__card,
.skincare-guide__card,
.skincare-sets__card,
.faq-themeblocks-skincare__item,
.cart-drawer,
.main-search__form,
.main-404__search,
.tb-contact-care__form-card,
.tb-contact-care__support-card{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent) !important;
  border-color: color-mix(in srgb, var(--color-border, #e5d4c8) 80%, transparent) !important;
}
.button--primary,
.button:not(.button--secondary):not(.button--tertiary),
.newsletter-cta__button,
.product-newsletter__button,
.tb-contact-care__button,
.main-search__button,
.main-404__button--primary,
.cart-summary__checkout,
.cart-drawer__checkout,
.product-form__submit{
  background: var(--color-primary, #a9826d) !important;
  border-color: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow: 0 0.9rem 1.8rem color-mix(in srgb, var(--color-primary, #a9826d) 22%, transparent) !important;
}
.button--primary:hover,
.button:not(.button--secondary):not(.button--tertiary):hover,
.newsletter-cta__button:hover,
.product-newsletter__button:hover,
.tb-contact-care__button:hover,
.main-search__button:hover,
.main-404__button--primary:hover,
.cart-summary__checkout:hover,
.cart-drawer__checkout:hover,
.product-form__submit:hover{
  background: var(--color-primary-dark, #876654) !important;
  border-color: var(--color-primary-dark, #876654) !important;
}
.button--secondary,
.main-404__button--secondary,
.cart-summary__update,
.cart-empty__button,
.cart-drawer__empty-button,
.main-search__empty-button{
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 55%, var(--color-surface, #ffffff)) !important;
  border-color: color-mix(in srgb, var(--color-secondary, #e7d5c8) 72%, var(--color-border, #e5d4c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.button--tertiary{
  background: transparent !important;
  border-color: var(--color-primary, #a9826d) !important;
  color: var(--color-primary, #a9826d) !important;
}
input,
textarea,
select{
  background: var(--color-surface, #ffffff) !important;
  border-color: color-mix(in srgb, var(--color-border, #e5d4c8) 92%, var(--color-ink, #3a2e2a)) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
input:focus,
textarea:focus,
select:focus{
  border-color: var(--color-primary, #a9826d) !important;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary, #a9826d) 15%, transparent) !important;
}
/* Final clinical banner color-scheme gradient authority */
.clinical-banner__panel{
  background:
    radial-gradient(
      circle at 78% 18%,
      color-mix(in srgb, var(--color-surface, #ffffff) 42%, transparent),
      transparent 22rem
    ),
    radial-gradient(
      circle at 90% 55%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 58%, transparent),
      transparent 28rem
    ),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--color-primary-dark, #876654) 88%, var(--color-ink, #3a2e2a)) 0%,
      var(--color-primary, #a9826d) 52%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 82%, var(--color-surface, #ffffff)) 100%
    ) !important;
}
.clinical-banner__content{
  color: var(--color-button-text, #ffffff) !important;
}
.clinical-banner__eyebrow{
  color: var(--color-accent, #c8a15a) !important;
}
.clinical-banner__heading,
.clinical-banner__heading *{
  color: var(--color-button-text, #ffffff) !important;
}
.clinical-banner__heading em,
.clinical-banner__heading em *{
  color: color-mix(in srgb, var(--color-button-text, #ffffff) 86%, var(--color-secondary, #e7d5c8)) !important;
}
.clinical-banner__text{
  color: color-mix(in srgb, var(--color-button-text, #ffffff) 78%, var(--color-secondary, #e7d5c8)) !important;
}
.clinical-banner__button.button--primary{
  background: var(--color-surface, #ffffff) !important;
  border-color: var(--color-surface, #ffffff) !important;
  color: var(--color-primary-dark, #876654) !important;
  box-shadow: 0 1rem 2rem color-mix(in srgb, var(--color-ink, #3a2e2a) 18%, transparent) !important;
}
.clinical-banner__button.button--primary:hover{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 88%, var(--color-secondary, #e7d5c8)) !important;
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 88%, var(--color-secondary, #e7d5c8)) !important;
  color: var(--color-primary-dark, #876654) !important;
}
.clinical-banner__button.button--secondary{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 22%, transparent) !important;
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 34%, transparent) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow: none !important;
}
.clinical-banner__button.button--tertiary{
  background: transparent !important;
  border-color: color-mix(in srgb, var(--color-button-text, #ffffff) 72%, transparent) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow: none !important;
}
.clinical-banner__button.button--secondary:hover,
.clinical-banner__button.button--tertiary:hover{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 16%, transparent) !important;
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 58%, transparent) !important;
}
/* Final clinical banner overlay color authority */
.clinical-banner__panel::before{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--color-primary-dark, #876654) 72%, var(--color-ink, #3a2e2a)) 0%,
      color-mix(in srgb, var(--color-primary, #a9826d) 58%, transparent) 36%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 28%, transparent) 62%,
      transparent 84%
    ) !important;
}
.clinical-banner__background-image{
  opacity: 0.72 !important;
  mix-blend-mode: soft-light !important;
  filter: saturate(0.72) contrast(1.02) brightness(1.04) !important;
}
.clinical-banner__panel{
  background:
    radial-gradient(
      circle at 76% 18%,
      color-mix(in srgb, var(--color-surface, #ffffff) 42%, transparent),
      transparent 22rem
    ),
    radial-gradient(
      circle at 88% 58%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 62%, transparent),
      transparent 30rem
    ),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--color-primary-dark, #876654) 82%, var(--color-ink, #3a2e2a)) 0%,
      var(--color-primary, #a9826d) 48%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 86%, var(--color-surface, #ffffff)) 100%
    ) !important;
}
/* Final footer color style options */
.site-footer.site-footer--soft{
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 22%, transparent), transparent 38%),
    radial-gradient(circle at 92% 14%, color-mix(in srgb, var(--color-surface-soft, #f4e7de) 26%, transparent), transparent 42%),
    linear-gradient(180deg, var(--color-surface, #ffffff) 0%, color-mix(in srgb, var(--color-background, #fcf7f2) 72%, var(--color-surface, #ffffff)) 100%) !important;
  color: var(--color-ink, #3a2e2a) !important;
  border-top: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 78%, transparent) !important;
}
.site-footer.site-footer--light{
  background: var(--color-surface, #ffffff) !important;
  color: var(--color-ink, #3a2e2a) !important;
  border-top: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 82%, transparent) !important;
}
.site-footer.site-footer--dark{
  background:
    radial-gradient(circle at top left, color-mix(in srgb, var(--color-secondary, #e7d5c8) 24%, transparent), transparent 34%),
    var(--color-ink, #3a2e2a) !important;
  color: var(--color-surface, #ffffff) !important;
}
.site-footer.site-footer--soft .site-footer__logo-text,
.site-footer.site-footer--light .site-footer__logo-text,
.site-footer.site-footer--soft .site-footer__menu-heading,
.site-footer.site-footer--light .site-footer__menu-heading,
.site-footer.site-footer--soft .site-footer__copyright,
.site-footer.site-footer--light .site-footer__copyright{
  color: var(--color-ink, #3a2e2a) !important;
}
.site-footer.site-footer--soft .site-footer__text,
.site-footer.site-footer--light .site-footer__text,
.site-footer.site-footer--soft .site-footer__menu-list a,
.site-footer.site-footer--light .site-footer__menu-list a,
.site-footer.site-footer--soft .site-footer__social-link,
.site-footer.site-footer--light .site-footer__social-link{
  color: var(--color-ink-soft, #74635b) !important;
}
.site-footer.site-footer--soft .site-footer__social-link:hover,
.site-footer.site-footer--light .site-footer__social-link:hover,
.site-footer.site-footer--soft .site-footer__menu-list a:hover,
.site-footer.site-footer--light .site-footer__menu-list a:hover{
  color: var(--color-primary, #a9826d) !important;
}
.site-footer.site-footer--dark .site-footer__logo-text,
.site-footer.site-footer--dark .site-footer__menu-heading,
.site-footer.site-footer--dark .site-footer__copyright{
  color: var(--color-surface, #ffffff) !important;
}
.site-footer.site-footer--dark .site-footer__text,
.site-footer.site-footer--dark .site-footer__menu-list a,
.site-footer.site-footer--dark .site-footer__social-link{
  color: color-mix(in srgb, var(--color-surface, #ffffff) 78%, transparent) !important;
}
.site-footer.site-footer--dark .site-footer__social-link:hover,
.site-footer.site-footer--dark .site-footer__menu-list a:hover{
  color: var(--color-accent, #c8a15a) !important;
}

@media screen and (max-width: 749px) {
.site-footer.site-footer--soft .site-footer__accordion,
.site-footer.site-footer--light .site-footer__accordion{
    border-color: color-mix(in srgb, var(--color-border, #e5d4c8) 80%, transparent) !important;
  }
.site-footer.site-footer--dark .site-footer__accordion{
    border-color: color-mix(in srgb, var(--color-surface, #ffffff) 16%, transparent) !important;
  }
}
/* =========================================================
   BESTSELLERS CAROUSEL SPACING AUTHORITY
   Prevent product cards/media from touching and give each item
   a premium breathing space across desktop,
tablet,
and mobile.
   ========================================================= */

.bestsellers__panels{
  width: 100% !important;
  overflow: hidden !important;
}
.bestsellers__carousel{
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(15.5rem, 1fr) !important;
  gap: clamp(1rem, 2vw, 1.65rem) !important;
  width: 100% !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding: 0.35rem 0.25rem 0.75rem !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-inline: 0.25rem !important;
  -webkit-overflow-scrolling: touch !important;
}
.bestsellers__carousel > .bestseller-card{
  scroll-snap-align: start !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}
.bestseller-card{
  display: grid !important;
  grid-template-rows: auto 1fr !important;
  gap: 0.85rem !important;
  overflow: visible !important;
  background: transparent !important;
}
.bestseller-card__content{
  display: grid !important;
  gap: 0.55rem !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 0.15rem !important;
  box-sizing: border-box !important;
}
.bestseller-card__title-row{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 0.75rem !important;
}
.bestseller-card__title,
.bestseller-card__title a{
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
.bestseller-card__price{
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}
.bestseller-card__bottom{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.8rem !important;
  width: 100% !important;
}
.bestseller-card__form,
.bestseller-card__cart{
  flex: 0 0 auto !important;
}

@media screen and (min-width: 1200px) {
.bestsellers__carousel{
    grid-auto-columns: calc((100% - (clamp(1rem, 2vw, 1.65rem) * 3)) / 4) !important;
  }
}

@media screen and (min-width: 750px) and (max-width: 1199px) {
.bestsellers__carousel{
    grid-auto-columns: calc((100% - clamp(1rem, 2vw, 1.65rem)) / 2) !important;
  }
}

@media screen and (max-width: 749px) {
.bestsellers__carousel{
    grid-auto-columns: minmax(76vw, 1fr) !important;
    gap: 1rem !important;
    padding-inline: 0.1rem !important;
  }
}
/* =========================================================
   BESTSELLERS + GLOBAL ACCENT COLOR AUTHORITY
   Keep tabs,
badges,
ratings,
carousel controls,
and small UI
   accents aligned with the active color scheme palette.
   ========================================================= */

.bestsellers__tab.is-active,
.bestsellers__tab:hover,
.bestsellers__heading em,
.bestsellers__eyebrow{
  color: var(--color-accent, #c8a15a) !important;
}
.bestsellers__tab.is-active::after{
  background: var(--color-accent, #c8a15a) !important;
}
.bestsellers__dot{
  background: color-mix(in srgb, var(--color-accent, #c8a15a) 26%, var(--color-border, #e5d4c8)) !important;
}
.bestsellers__dot.is-active{
  background: var(--color-accent, #c8a15a) !important;
}
.bestsellers__arrow{
  color: var(--color-ink, #3a2e2a) !important;
}
.bestsellers__arrow:hover{
  color: var(--color-accent, #c8a15a) !important;
}
.bestseller-card__badge{
  background: color-mix(in srgb, var(--color-accent, #c8a15a) 13%, var(--color-surface, #ffffff)) !important;
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 32%, transparent) !important;
  color: var(--color-accent, #c8a15a) !important;
}
.bestseller-card__stars,
.bestseller-card__stars-base,
.bestseller-card__stars-fill,
.bestseller-card__stars--empty,
.bestseller-card__rating::first-letter{
  color: var(--color-accent, #c8a15a) !important;
}
.bestseller-card__stars--empty{
  opacity: 0.34 !important;
}
.bestseller-card__review-count{
  color: var(--color-ink-soft, #74635b) !important;
}
.bestseller-card__cart:hover{
  background: var(--color-primary, #a9826d) !important;
  border-color: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
}
.site-header__nav-link:hover,
.site-header__nav-link[aria-current="page"],
.site-header__nav-link.is-active{
  color: var(--color-accent, #c8a15a) !important;
}
.site-header__cart-count,
.site-header__wishlist-count{
  background: var(--color-accent, #c8a15a) !important;
  color: var(--color-button-text, #ffffff) !important;
}
.site-header__actions a:hover,
.site-header__actions button:hover,
.site-header__cart:hover,
.site-header__wishlist:hover{
  color: var(--color-accent, #c8a15a) !important;
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 28%, transparent) !important;
}
.product-card__stars,
.product-card__stars-base,
.product-card__stars-fill,
.product-card__stars--empty,
.product-card__rating::first-letter{
  color: var(--color-accent, #c8a15a) !important;
}
.product-card__cart:hover,
.product-card__wishlist:hover,
.product-card__wishlist.is-active{
  background: var(--color-primary, #a9826d) !important;
  border-color: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
}
.price__sale,
.product-card__price,
.bestseller-card__price{
  color: var(--color-ink, #3a2e2a) !important;
}
a:not(.button):not([class*="button"]):hover{
  color: var(--color-accent, #c8a15a);
}
/* Final newsletter CTA color scheme + section controls */
.newsletter-cta{
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--color-accent, #c8a15a) 12%, transparent), transparent 24rem),
    radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 38%, transparent), transparent 28rem),
    var(--color-background, #fcf7f2) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.newsletter-cta--bg-light{
  background:
    radial-gradient(circle at 88% 18%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 24%, transparent), transparent 28rem),
    var(--color-surface, #ffffff) !important;
}
.newsletter-cta--bg-soft{
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--color-accent, #c8a15a) 12%, transparent), transparent 24rem),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--color-soft-surface, #f4e7de) 72%, var(--color-surface, #ffffff)) 0%,
      color-mix(in srgb, var(--color-background, #fcf7f2) 86%, var(--color-surface, #ffffff)) 100%
    ) !important;
}
.newsletter-cta--bg-accent{
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--color-accent, #c8a15a) 22%, transparent), transparent 24rem),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 76%, var(--color-surface, #ffffff)) 0%,
      color-mix(in srgb, var(--color-accent, #c8a15a) 12%, var(--color-background, #fcf7f2)) 100%
    ) !important;
}
.newsletter-cta__main{
  border-bottom: 0 !important;
}
.newsletter-cta__content{
  max-width: 36rem !important;
}
.newsletter-cta--align-center .newsletter-cta__main{
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  text-align: center !important;
}
.newsletter-cta--align-center .newsletter-cta__content{
  margin-inline: auto !important;
}
.newsletter-cta--align-center .newsletter-cta__form{
  margin-inline: auto !important;
}
.newsletter-cta__heading{
  max-width: 36rem !important;
  margin: 0 !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: 0.96 !important;
  letter-spacing: -0.055em !important;
  text-transform: none !important;
}
.newsletter-cta--heading-small .newsletter-cta__heading{
  font-size: clamp(2rem, 3.2vw, 3.25rem) !important;
}
.newsletter-cta--heading-medium .newsletter-cta__heading{
  font-size: clamp(2.45rem, 4.2vw, 4.4rem) !important;
}
.newsletter-cta--heading-large .newsletter-cta__heading{
  font-size: clamp(3rem, 5.2vw, 5.6rem) !important;
}
.newsletter-cta__text{
  max-width: 34rem !important;
  margin-top: 1rem !important;
  color: var(--color-ink-soft, #74635b) !important;
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1rem, 1.25vw, 1.22rem) !important;
  font-weight: 600 !important;
  line-height: 1.55 !important;
}
.newsletter-cta__form{
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 82%, transparent) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 96%, transparent) !important;
  box-shadow:
    0 1.2rem 3rem color-mix(in srgb, var(--color-ink, #3a2e2a) 7%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent) !important;
}
.newsletter-cta__input{
  background: transparent !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.newsletter-cta__input::placeholder{
  color: color-mix(in srgb, var(--color-ink-soft, #74635b) 68%, transparent) !important;
}
.newsletter-cta__button.button--primary,
.newsletter-cta__button:not(.button--secondary):not(.button--tertiary){
  background: var(--color-primary, #a9826d) !important;
  border-color: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
}
.newsletter-cta__button.button--secondary{
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 60%, var(--color-surface, #ffffff)) !important;
  border-color: color-mix(in srgb, var(--color-secondary, #e7d5c8) 74%, var(--color-border, #e5d4c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.newsletter-cta__button.button--tertiary{
  background: transparent !important;
  border-color: var(--color-primary, #a9826d) !important;
  color: var(--color-primary, #a9826d) !important;
}
.newsletter-cta__perks{
  border-top-color: color-mix(in srgb, var(--color-border, #e5d4c8) 74%, transparent) !important;
}
.newsletter-cta__perk-icon{
  color: var(--color-primary, #a9826d) !important;
}
.newsletter-cta__perk-title{
  color: var(--color-ink, #3a2e2a) !important;
}
.newsletter-cta__perk-text{
  color: var(--color-ink-soft, #74635b) !important;
}

@media screen and (max-width: 749px) {
.newsletter-cta{
    padding-block: 3rem !important;
  }
.newsletter-cta__main{
    gap: 1.5rem !important;
  }
.newsletter-cta__heading{
    line-height: 1 !important;
  }
.newsletter-cta--heading-small .newsletter-cta__heading,
.newsletter-cta--heading-medium .newsletter-cta__heading,
.newsletter-cta--heading-large .newsletter-cta__heading{
    font-size: clamp(2.2rem, 11vw, 3.35rem) !important;
  }
.newsletter-cta__text{
    font-size: 1rem !important;
  }
.newsletter-cta__form{
    display: grid !important;
    border-radius: 1.35rem !important;
  }
.newsletter-cta__button{
    width: 100% !important;
  }
.newsletter-cta__perks{
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }
}
/* Final placeholder image palette authority */
.themeblocks-placeholder,
[class*="__placeholder"],
.bestseller-card__dummy-product,
.product-card__placeholder,
.bestseller-card--placeholder .bestseller-card__media,
.clinical-banner__placeholder,
.product-newsletter__placeholder,
.hero-themeblocks-skincare__placeholder{
  color: var(--color-ink-soft, #74635b) !important;
  background:
    radial-gradient(circle at 50% 22%, color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent), transparent 34%),
    radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--color-accent, #c8a15a) 14%, transparent), transparent 24rem),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--color-soft-surface, #f4e7de) 74%, var(--color-surface, #ffffff)) 0%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 55%, var(--color-background, #fcf7f2)) 100%
    ) !important;
  border-color: color-mix(in srgb, var(--color-border, #e5d4c8) 80%, transparent) !important;
}
.bestseller-card__dummy-body,
.bestseller-card__dummy-cap,
.bestseller-card__dummy-label,
.themeblocks-placeholder__shape,
.themeblocks-placeholder span{
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-primary, #a9826d) 82%, var(--color-surface, #ffffff)) 0%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 78%, var(--color-primary, #a9826d)) 100%
    ) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 42%, var(--color-border, #e5d4c8)) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 62%, transparent),
    0 1rem 2.2rem color-mix(in srgb, var(--color-primary, #a9826d) 14%, transparent) !important;
}
.bestseller-card__dummy-label::before,
.themeblocks-placeholder::before,
[class*="__placeholder"]::before{
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 70%, transparent),
      color-mix(in srgb, var(--color-accent, #c8a15a) 26%, transparent),
      color-mix(in srgb, var(--color-surface, #ffffff) 70%, transparent)
    ) !important;
}
.bestseller-card__dummy-product--1 .bestseller-card__dummy-body,


.bestseller-card__dummy-product--4 .bestseller-card__dummy-body,

.bestseller-card__dummy-label{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent) !important;
}
.bestseller-card__dummy-label::before{
  opacity: 0.72 !important;
}
.themeblocks-placeholder svg,
[class*="__placeholder"] svg{
  color: var(--color-primary, #a9826d) !important;
  stroke: currentColor !important;
}
.themeblocks-placeholder *,
[class*="__placeholder"] *{
  border-color: color-mix(in srgb, var(--color-border, #e5d4c8) 82%, transparent) !important;
}
/* Final bestsellers palette authority */
.bestsellers.section{
  background:
    radial-gradient(circle at 14% 8%, color-mix(in srgb, var(--color-accent, #c8a15a) 10%, transparent), transparent 24rem),
    radial-gradient(circle at 86% 4%, color-mix(in srgb, var(--color-primary, #a9826d) 8%, transparent), transparent 26rem),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-background, #fcf7f2) 94%, var(--color-surface, #ffffff)) 0%,
      color-mix(in srgb, var(--color-soft-surface, #f4e7de) 42%, var(--color-background, #fcf7f2)) 100%
    ) !important;
}
.bestsellers.section::before,
.bestsellers.section::after,
.bestsellers__panels::before{
  background:
    radial-gradient(circle, color-mix(in srgb, var(--color-primary, #a9826d) 12%, transparent), transparent 62%) !important;
  opacity: 0.42 !important;
}
.bestsellers__heading{
  color: var(--color-ink, #3a2e2a) !important;
}
.bestsellers__eyebrow,
.bestsellers__tab.is-active,
.bestseller-card__badge,
.bestsellers__dot.is-active{
  color: var(--color-accent, #c8a15a) !important;
}
.bestsellers__tab{
  color: var(--color-ink-soft, #74635b) !important;
}
.bestsellers__tab::after,
.bestsellers__tab.is-active::after{
  background: var(--color-accent, #c8a15a) !important;
}
.bestseller-card{
  background: transparent !important;
}
.bestseller-card__badge{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 90%, transparent) !important;
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 24%, var(--color-border, #e5d4c8)) !important;
  box-shadow: 0 0.45rem 1rem color-mix(in srgb, var(--color-accent, #c8a15a) 8%, transparent) !important;
}
.bestseller-card__title,
.bestseller-card__title a,
.bestseller-card__price{
  color: var(--color-ink, #3a2e2a) !important;
}
.bestseller-card__subtitle,
.bestseller-card__review-count{
  color: var(--color-ink-soft, #74635b) !important;
}
.bestseller-card__stars,
.bestseller-card__stars-base,
.bestseller-card__stars-fill,
.bestseller-card__stars--empty,
.bestseller-card__rating::first-letter{
  color: var(--color-accent, #c8a15a) !important;
}
.bestseller-card__cart{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent) !important;
  border-color: color-mix(in srgb, var(--color-border, #e5d4c8) 86%, transparent) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.bestseller-card__cart:hover{
  background: var(--color-primary, #a9826d) !important;
  border-color: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
}
.bestsellers__arrow{
  color: var(--color-ink, #3a2e2a) !important;
  background: transparent !important;
}
.bestsellers__arrow:hover{
  color: var(--color-primary, #a9826d) !important;
}
.bestsellers__dot{
  background: color-mix(in srgb, var(--color-border, #e5d4c8) 78%, var(--color-ink-soft, #74635b)) !important;
}
.bestsellers__dot.is-active{
  background: var(--color-accent, #c8a15a) !important;
}
/* Contact page: palette-aligned premium layout */
.tb-contact-care{
  position: relative;
  overflow: hidden;
  padding: clamp(4.75rem, 8vw, 8.5rem) 0 clamp(5.25rem, 9vw, 9rem);
  background:
    radial-gradient(circle at 14% 8%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 42%, transparent), transparent 30rem),
    radial-gradient(circle at 86% 24%, color-mix(in srgb, var(--color-soft, #f4e7de) 58%, transparent), transparent 34rem),
    linear-gradient(180deg, var(--color-background, #fcf7f2) 0%, color-mix(in srgb, var(--color-background, #fcf7f2) 74%, var(--color-surface, #ffffff)) 100%);
  color: var(--color-ink, #3a2e2a);
}
.tb-contact-care::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--color-surface, #ffffff) 42%, transparent) 50%, transparent 100%);
  opacity: 0.65;
}
.tb-contact-care .tb-container{
  position: relative;
  z-index: 1;
  width: min(calc(100% - 3rem), 78rem);
  margin-inline: auto;
}
.tb-contact-care__intro{
  max-width: 46rem;
  margin: 0 auto clamp(3rem, 6vw, 5.5rem);
  text-align: center;
}
.tb-contact-care__eyebrow,
.tb-contact-care__card-eyebrow{
  margin: 0 0 0.9rem;
  color: var(--color-accent, #c8a15a);
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif));
  font-size: 0.68rem;
  font-weight: var(--font-nav-weight, 800);
  line-height: 1;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}
.tb-contact-care__heading{
  max-width: 42rem;
  margin: 0 auto;
  color: var(--color-ink, #3a2e2a);
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif));
  font-size: clamp(3rem, 6vw, 5.8rem);
  font-weight: var(--font-heading-weight, 700);
  line-height: 0.92;
  letter-spacing: -0.065em;
}
.tb-contact-care__text{
  max-width: 44rem;
  margin: 1.45rem auto 0;
  color: var(--color-ink-soft, #74635b);
  font-size: clamp(1rem, 1.25vw, 1.15rem);
  line-height: 1.8;
}
.tb-contact-care__text p{
  margin: 0;
}
.tb-contact-care__grid{
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(20rem, 0.92fr);
  gap: clamp(1.5rem, 3vw, 2.75rem);
  align-items: start;
}
.tb-contact-care__form-card,
.tb-contact-care__support-card{
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 78%, transparent);
  border-radius: clamp(1.5rem, 2.4vw, 2rem);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface, #ffffff) 94%, transparent), color-mix(in srgb, var(--color-surface, #ffffff) 82%, var(--color-soft, #f4e7de))),
    var(--color-surface, #ffffff);
  box-shadow:
    0 2rem 5rem color-mix(in srgb, var(--color-ink, #3a2e2a) 8%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent);
}
.tb-contact-care__form-card{
  padding: clamp(1.5rem, 3vw, 3rem);
}
.tb-contact-care__support-card{
  position: sticky;
  top: 7rem;
  padding: clamp(1.75rem, 3vw, 3rem);
}
.tb-contact-care__form-heading,
.tb-contact-care__support-heading{
  margin: 0;
  color: var(--color-ink, #3a2e2a);
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif));
  font-size: clamp(2rem, 3.4vw, 3.55rem);
  font-weight: var(--font-heading-weight, 700);
  line-height: 0.98;
  letter-spacing: -0.055em;
}
.tb-contact-care__form-text,
.tb-contact-care__support-text{
  margin: 1rem 0 0;
  color: var(--color-ink-soft, #74635b);
  font-size: 0.96rem;
  line-height: 1.75;
}
.tb-contact-care__support-text p{
  margin: 0;
}
.tb-contact-care__form{
  display: grid;
  gap: 1rem;
  margin-top: 1.6rem;
}
.tb-contact-care__field-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
.tb-contact-care__field{
  display: grid;
  gap: 0.55rem;
}
.tb-contact-care__field label{
  color: var(--color-ink, #3a2e2a);
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif));
  font-size: 0.62rem;
  font-weight: var(--font-nav-weight, 800);
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.tb-contact-care__field input,
.tb-contact-care__field select,
.tb-contact-care__field textarea{
  width: 100%;
  min-height: 3.25rem;
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 88%, var(--color-ink, #3a2e2a));
  border-radius: 1rem;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 96%, transparent);
  color: var(--color-ink, #3a2e2a);
  font: inherit;
  font-size: 0.9rem;
  outline: none;
  padding: 0.95rem 1rem;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}
.tb-contact-care__field select{
  appearance: auto;
}
.tb-contact-care__field textarea{
  min-height: 11rem;
  resize: vertical;
}
.tb-contact-care__field input::placeholder,
.tb-contact-care__field textarea::placeholder{
  color: color-mix(in srgb, var(--color-ink-soft, #74635b) 58%, transparent);
}
.tb-contact-care__field input:focus,
.tb-contact-care__field select:focus,
.tb-contact-care__field textarea:focus{
  border-color: var(--color-primary, #a9826d);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--color-primary, #a9826d) 15%, transparent);
  background: var(--color-surface, #ffffff);
}
.tb-contact-care__button{
  width: fit-content;
  min-height: 3.35rem;
  margin-top: 0.35rem;
  padding: 0 2rem;
  border: 1px solid var(--color-primary, #a9826d);
  border-radius: 999px;
  background: var(--color-primary, #a9826d);
  color: var(--color-button-text, #ffffff);
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif);
  font-size: 0.72rem;
  font-weight: var(--font-button-weight, 700);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 0 0.9rem 1.8rem color-mix(in srgb, var(--color-primary, #a9826d) 22%, transparent);
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease,
    border-color 180ms ease;
}
.tb-contact-care__button:hover{
  transform: translateY(-1px);
  border-color: var(--color-primary-dark, #876654);
  background: var(--color-primary-dark, #876654);
  box-shadow: 0 1.15rem 2.3rem color-mix(in srgb, var(--color-primary, #a9826d) 28%, transparent);
}
.tb-contact-care__success,
.tb-contact-care__error{
  padding: 0.9rem 1rem;
  border-radius: 1rem;
  font-size: 0.9rem;
  line-height: 1.5;
}
.tb-contact-care__success{
  background: color-mix(in srgb, #3d8954 12%, var(--color-surface, #ffffff));
  color: #2f6f43;
}
.tb-contact-care__error{
  background: color-mix(in srgb, #b43c3c 12%, var(--color-surface, #ffffff));
  color: #9f2f2f;
}
.tb-contact-care__support-list{
  display: grid;
  gap: 0.9rem;
  margin-top: 1.8rem;
}
.tb-contact-care__support-item{
  padding: 1.05rem 1.15rem;
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 78%, transparent);
  border-radius: 1rem;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-soft, #f4e7de) 42%, var(--color-surface, #ffffff)), color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent));
}
.tb-contact-care__support-item span{
  display: block;
  margin-bottom: 0.4rem;
  color: var(--color-accent, #c8a15a);
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif));
  font-size: 0.62rem;
  font-weight: var(--font-nav-weight, 800);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.tb-contact-care__support-item a,
.tb-contact-care__support-item strong{
  color: var(--color-ink, #3a2e2a);
  font-size: 0.9rem;
  font-weight: 800;
  text-decoration: none;
}
.tb-contact-care__support-item a:hover{
  color: var(--color-primary, #a9826d);
}

@media screen and (max-width: 989px) {
.tb-contact-care .tb-container{
    width: min(calc(100% - 2rem), 48rem);
  }
.tb-contact-care__grid{
    grid-template-columns: 1fr;
  }
.tb-contact-care__support-card{
    position: static;
  }
}

@media screen and (max-width: 639px) {
.tb-contact-care{
    padding: 3.5rem 0 4.25rem;
  }
.tb-contact-care .tb-container{
    width: min(calc(100% - 1.25rem), 36rem);
  }
.tb-contact-care__intro{
    margin-bottom: 2rem;
    text-align: left;
  }
.tb-contact-care__heading{
    margin-left: 0;
    font-size: clamp(2.55rem, 13vw, 4rem);
  }
.tb-contact-care__text{
    margin-left: 0;
  }
.tb-contact-care__field-grid{
    grid-template-columns: 1fr;
  }
.tb-contact-care__form-card,
.tb-contact-care__support-card{
    border-radius: 1.35rem;
  }
.tb-contact-care__button{
    width: 100%;
  }
}
/* =========================================================
   GLOBAL SHAPE SYSTEM
   Uses Theme settings > Corner style.
   This is an authority layer only for real UI components.
   Decorative placeholder bottle shapes and full-bleed banners
   should not be globally normalized.
   ========================================================= */

:root{
  --tb-radius-control: var(--radius-control, 1rem);
  --tb-radius-button: var(--radius-button, 999px);
  --tb-radius-icon: var(--radius-icon, 999px);
  --tb-radius-card: var(--radius-card, 1.35rem);
  --tb-radius-media: var(--radius-media, 1.25rem);
  --tb-radius-panel: var(--radius-panel, 1.7rem);
}
/* Buttons / CTAs */
.button,
.button--primary,
.button--secondary,
.button--tertiary,
.clinical-banner__button,
.why-themeblocks-skincare__link,
.faq-themeblocks-skincare__button,
.newsletter-cta__button,
.product-newsletter__button,
.tb-contact-care__button,
.main-search__button,
.main-search__empty-button,
.main-404__button,
.main-404__search-button,
.cart-summary__checkout,
.cart-summary__update,
.cart-empty__button,
.cart-drawer__checkout,
.cart-drawer__cart-link,
.cart-drawer__empty-button,
.wishlist-drawer__empty-button,
.product-form__submit,
.shopify-payment-button__button,
.shopify-payment-button__button--branded,
.shopify-payment-button__button--unbranded{
  border-radius: var(--tb-radius-button) !important;
}
/* Form shells and fields */
.newsletter-cta__form,
.product-newsletter__form,
.main-search__form,
.main-404__search,
.tb-contact-care__field input,
.tb-contact-care__field select,
.tb-contact-care__field textarea,
.newsletter-cta__input,
.product-newsletter__input,
.main-search__input,
.main-404__search-input,
input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select{
  border-radius: var(--tb-radius-control) !important;
}
/* Keep split newsletter forms coherent when button is inside the field row */
.newsletter-cta__form,
.product-newsletter__form{
  overflow: hidden !important;
}
.newsletter-cta__form .newsletter-cta__input,
.product-newsletter__form .product-newsletter__input{
  border-radius: var(--tb-radius-control) !important;
}
.newsletter-cta__form .newsletter-cta__button,
.product-newsletter__form .product-newsletter__button{
  border-radius: var(--tb-radius-button) !important;
}
/* Icon buttons */
.site-header__search-toggle,
.site-header__search-close,
.site-header__account,
.site-header__wishlist,
.site-header__cart,
.site-header__cart-link,
.site-header__menu-toggle,
button[data-cart-open],
.product-card__cart,
.product-card__wishlist,
.product-card__wishlist-button,
.product-main__wishlist,
.bestseller-card__cart,
.related-product-card__cart,
.related-products__arrow,
.bestsellers__arrow,
.shoppable-videos__arrow,
.shoppable-video-modal__close,
.cart-item__quantity-button,
.cart-drawer-item__quantity-button,
.wishlist-drawer__close,
.cart-drawer__close{
  border-radius: var(--tb-radius-icon) !important;
}
/* Cards */
.product-card,
.bestseller-card,
.related-product-card,
.collection-card,
.brand-promise__card,
.skin-goals__card,
.skincare-guide__card,
.skincare-sets__card,
.faq-themeblocks-skincare__item,
.newsletter-cta__perk,
.tb-contact-care__form-card,
.tb-contact-care__support-card,
.tb-contact-care__support-item,
.main-collection__empty,
.main-search__result,
.cart-item,
.cart-drawer-item{
  border-radius: var(--tb-radius-card) !important;
}
/* Product/media surfaces */
.product-card__media,
.bestseller-card__media,
.related-product-card__media,
.collection-card__media,
.skin-goals__image-wrap,
.skincare-guide__image-wrap,
.skincare-sets__media,
.main-404__visual,
.product-main__media,
.product-main__media-frame{
  border-radius: var(--tb-radius-media) !important;
}
/* Major panels / drawers */
.cart-drawer__panel,
.wishlist-drawer__panel,
.product-newsletter__inner,
.newsletter-cta__main,
.contact-themeblocks-skincare__panel,
.contact-themeblocks-skincare__side,
.tb-contact-care__form-card,
.tb-contact-care__support-card{
  border-radius: var(--tb-radius-panel) !important;
}
/* Preserve intentional full-bleed banners */
.clinical-banner__panel,
.hero-themeblocks-skincare,
.hero-themeblocks-skincare__media{
  border-radius: 0 !important;
}
/* Minimal square mode should still keep circular counters readable */
.site-header__cart-count,
.site-header__wishlist-count{
  border-radius: 999px !important;
}
/* =========================================================
   PLACEHOLDER LABEL CLEANUP
   Remove boxed text labels inside dummy placeholder artwork.
   Keep the real card titles below the images.
   ========================================================= */

.themeblocks-placeholder [class*="label"],
.themeblocks-placeholder__label,
.themeblocks-placeholder__text,
.product-card__placeholder [class*="label"],
.bestseller-card__placeholder [class*="label"],
.collection-card__placeholder [class*="label"],
.skin-goals__placeholder [class*="label"],
.skincare-guide__placeholder [class*="label"],
.skincare-sets__placeholder [class*="label"],
.category-strip__placeholder [class*="label"]{
  display: none !important;
}
/* Remove the small horizontal label strip inside dummy product illustrations */
.bestseller-card__dummy-label,
.bestseller-card__dummy-label::before,
.product-card__dummy-label,
.product-card__dummy-label::before,
.collection-card__dummy-label,
.collection-card__dummy-label::before,
.skin-goals__dummy-label,
.skin-goals__dummy-label::before,
.skincare-guide__dummy-label,
.skincare-guide__dummy-label::before,
.skincare-sets__dummy-label,
.skincare-sets__dummy-label::before,
.category-strip__dummy-label,
.category-strip__dummy-label::before{
  display: none !important;
}
/* =========================================================
   BESTSELLERS TABS REGRESSION FIX
   Only the active tab should use the accent underline.
   ========================================================= */

.bestsellers__tab{
  color: var(--color-ink-soft, #74635b) !important;
}
.bestsellers__tab::after{
  background: color-mix(in srgb, var(--color-border, #e5d4c8) 78%, transparent) !important;
  transform: scaleX(0) !important;
  opacity: 0 !important;
}
.bestsellers__tab:hover{
  color: var(--color-accent, #c8a15a) !important;
}
.bestsellers__tab:hover::after{
  background: color-mix(in srgb, var(--color-accent, #c8a15a) 55%, transparent) !important;
  transform: scaleX(0.72) !important;
  opacity: 1 !important;
}
.bestsellers__tab.is-active{
  color: var(--color-accent, #c8a15a) !important;
}
.bestsellers__tab.is-active::after{
  background: var(--color-accent, #c8a15a) !important;
  transform: scaleX(1) !important;
  opacity: 1 !important;
}
/* =========================================================
   COLLECTION PRODUCT CARD MEDIA FIX
   Prevent palette background bleed and excessive rounded corners
   around real product images on collection pages.
   ========================================================= */

.template-collection .product-card__media,
.main-collection .product-card__media{
  overflow: hidden !important;
  padding: 0 !important;
  border-radius: var(--tb-radius-card, 1rem) !important;
  background: var(--color-surface, #ffffff) !important;
  border-color: color-mix(in srgb, var(--color-border, #e5d4c8) 78%, transparent) !important;
  box-shadow:
    0 1rem 2.8rem color-mix(in srgb, var(--color-ink, #3a2e2a) 7%, transparent) !important;
}
.template-collection .product-card__media::before,
.template-collection .product-card__media::after,
.main-collection .product-card__media::before,
.main-collection .product-card__media::after{
  display: none !important;
}
.template-collection .product-card__image,
.main-collection .product-card__image{
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
  transform: none !important;
  mix-blend-mode: normal !important;
}
.template-collection .product-card:hover .product-card__image,
.main-collection .product-card:hover .product-card__image{
  transform: scale(1.025) !important;
}
.template-collection .product-card__wishlist,
.main-collection .product-card__wishlist{
  top: 0.85rem !important;
  right: 0.85rem !important;
}
/* =========================================================
   COLLECTION PRODUCT CARD CONTENT SEPARATION
   Make image/media and product info feel separated with real spacing.
   Prevent product info background from visually merging with media.
   ========================================================= */

.template-collection .product-card,
.main-collection .product-card{
  display: grid !important;
  gap: clamp(0.85rem, 1.25vw, 1.15rem) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.template-collection .product-card__content,
.main-collection .product-card__content{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 0.15rem !important;
  margin: 0 !important;
}
.template-collection .product-card__vendor,
.main-collection .product-card__vendor{
  margin-bottom: 0.42rem !important;
}
.template-collection .product-card__title,
.template-collection .product-card__title a,
.main-collection .product-card__title,
.main-collection .product-card__title a{
  display: block !important;
  margin: 0 !important;
}
.template-collection .product-card__rating,
.main-collection .product-card__rating{
  margin-top: 0.65rem !important;
}
.template-collection .product-card__bottom,
.main-collection .product-card__bottom{
  margin-top: 0.75rem !important;
  padding: 0 !important;
  background: transparent !important;
}
.template-collection .product-card__cart,
.main-collection .product-card__cart{
  background: var(--color-surface, #ffffff) !important;
}
/* =========================================================
   COLLECTION PRODUCT IMAGE SIZE OPTIONS
   Controlled by main collection section setting:
   Square / Medium / Tall.
   ========================================================= */

/* =========================================================
   COLLECTION CARD IMAGE AREA SIZE - FINAL AUTHORITY
   Theme editor option controls the image card/wrapper shape,
not the actual product image scale.
   ========================================================= */

.main-collection.main-collection--image-square .product-card__media{
  aspect-ratio: 1 / 1 !important;
}
.main-collection.main-collection--image-medium .product-card__media{
  aspect-ratio: 1 / 1.12 !important;
}
.main-collection.main-collection--image-tall .product-card__media{
  aspect-ratio: 1 / 1.32 !important;
}
/* Keep actual product image scale stable across all image-area options */
.main-collection.main-collection--image-square .product-card__image,
.main-collection.main-collection--image-medium .product-card__image,
.main-collection.main-collection--image-tall .product-card__image{
  width: 72% !important;
  height: 72% !important;
  max-width: 72% !important;
  max-height: 72% !important;
  object-fit: contain !important;
}
/* Dense 6-column layouts should not become too tall */
.main-collection.main-collection--columns-6.main-collection--image-tall .product-card__media{
  aspect-ratio: 1 / 1.22 !important;
}
/* Mobile keeps cards compact regardless of selected desktop image area */
@media screen and (max-width: 749px){
  .main-collection.main-collection--image-square .product-card__media,
  .main-collection.main-collection--image-medium .product-card__media,
  .main-collection.main-collection--image-tall .product-card__media {
    aspect-ratio: 1 / 1.14 !important;
  }
}
/* =========================================================
   COLLECTION CARD IMAGE AREA SIZE - TRUE WRAPPER CONTROL
   Fixes old min-height rules overriding the image-size setting.
   The setting now changes the media/card image area,
not only img scale.
   ========================================================= */

.main-collection.main-collection--image-square .product-card__media,
.main-collection.main-collection--image-medium .product-card__media,
.main-collection.main-collection--image-tall .product-card__media{
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  display: grid !important;
  place-items: center !important;
}
/* Square = compact card image area */
.main-collection.main-collection--image-square .product-card__media{
  aspect-ratio: 1 / 1 !important;
}
/* Medium = current balanced default */
.main-collection.main-collection--image-medium .product-card__media{
  aspect-ratio: 1 / 1.14 !important;
}
/* Tall = taller product image stage */
.main-collection.main-collection--image-tall .product-card__media{
  aspect-ratio: 1 / 1.34 !important;
}
/* Keep actual product image stable so only the card/wrapper changes */
.main-collection.main-collection--image-square .product-card__image,
.main-collection.main-collection--image-medium .product-card__image,
.main-collection.main-collection--image-tall .product-card__image,
.main-collection.main-collection--image-square .product-card__media img,
.main-collection.main-collection--image-medium .product-card__media img,
.main-collection.main-collection--image-tall .product-card__media img{
  width: 72% !important;
  height: 72% !important;
  max-width: 72% !important;
  max-height: 72% !important;
  object-fit: contain !important;
}
/* Prevent 6-column tall mode from getting too stretched */
.main-collection.main-collection--columns-6.main-collection--image-tall .product-card__media{
  aspect-ratio: 1 / 1.22 !important;
}
/* Mobile keeps cards compact */
@media screen and (max-width: 749px){
  .main-collection.main-collection--image-square .product-card__media,
  .main-collection.main-collection--image-medium .product-card__media,
  .main-collection.main-collection--image-tall .product-card__media {
    aspect-ratio: 1 / 1.14 !important;
    min-height: 0 !important;
  }
}
/* =========================================================
   COLLECTION PAGINATION - FINAL AUTHORITY
   Premium,
quiet pagination for Shopify default_pagination.
   ========================================================= */

.main-collection__pagination{
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-top: clamp(3rem, 5vw, 4.5rem) !important;
}
.main-collection__pagination .pagination{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.28rem !important;
  margin: 0 !important;
  padding: 0.34rem !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 68%, transparent) !important;
  border-radius: var(--tb-radius-control, 999px) !important;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 96%, transparent),
      color-mix(in srgb, var(--color-surface-soft, #f4e7de) 22%, var(--color-surface, #ffffff))
    ) !important;
  box-shadow:
    0 0.55rem 1.7rem color-mix(in srgb, var(--color-ink, #3a2e2a) 4%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 90%, transparent) !important;
}
.main-collection__pagination .page,
.main-collection__pagination .next,
.main-collection__pagination .prev,
.main-collection__pagination .deco{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.main-collection__pagination .page a,
.main-collection__pagination .page.current,
.main-collection__pagination .page span,
.main-collection__pagination .next a,
.main-collection__pagination .prev a,
.main-collection__pagination > a,
.main-collection__pagination > span{
  min-width: 2.45rem !important;
  height: 2.45rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 0.82rem !important;
  border: 1px solid transparent !important;
  border-radius: var(--tb-radius-control, 999px) !important;
  background: transparent !important;
  color: var(--color-ink-soft, #74635b) !important;
  font-size: 0.68rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.08em !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease !important;
}
.main-collection__pagination .next a,
.main-collection__pagination .prev a,
.main-collection__pagination > a.prev,
.main-collection__pagination > a.next{
  min-width: 5.65rem !important;
  padding-inline: 1.05rem !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-weight: 900 !important;
}
.main-collection__pagination a:hover{
  transform: translateY(-1px) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 20%, transparent) !important;
  background: color-mix(in srgb, var(--color-primary, #a9826d) 8%, var(--color-surface, #ffffff)) !important;
  color: var(--color-primary, #a9826d) !important;
  box-shadow: 0 0.55rem 1.15rem color-mix(in srgb, var(--color-primary, #a9826d) 8%, transparent) !important;
}
.main-collection__pagination .page.current,
.main-collection__pagination .current,
.main-collection__pagination [aria-current="page"]{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 18%, transparent) !important;
  background: color-mix(in srgb, var(--color-primary, #a9826d) 88%, var(--color-surface, #ffffff)) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 0.65rem 1.35rem color-mix(in srgb, var(--color-primary, #a9826d) 13%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 22%, transparent) !important;
}
.main-collection__pagination .deco,
.main-collection__pagination .ellipsis{
  min-width: 1.35rem !important;
  color: var(--color-ink-soft, #74635b) !important;
  font-weight: 800 !important;
}

@media screen and (max-width: 749px) {
.main-collection__pagination{
    margin-top: 2.65rem !important;
  }
.main-collection__pagination .pagination{
    max-width: 100% !important;
    gap: 0.22rem !important;
    padding: 0.3rem !important;
    overflow-x: auto !important;
  }
.main-collection__pagination .page a,
.main-collection__pagination .page.current,
.main-collection__pagination .page span,
.main-collection__pagination .next a,
.main-collection__pagination .prev a,
.main-collection__pagination > a,
.main-collection__pagination > span{
    min-width: 2.25rem !important;
    height: 2.25rem !important;
    padding-inline: 0.68rem !important;
    font-size: 0.62rem !important;
  }
.main-collection__pagination .next a,
.main-collection__pagination .prev a,
.main-collection__pagination > a.prev,
.main-collection__pagination > a.next{
    min-width: 4.85rem !important;
  }
}
/* =========================================================
   ABOUT PAGE - PREMIUM SKINCARE SECTIONS
   Palette-aware editorial sections for page.about.json.
   ========================================================= */

.tb-about-hero,
.tb-about-philosophy,
.tb-about-story{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 12%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 26%, transparent), transparent 32rem),
    linear-gradient(180deg, var(--color-background, #fcf7f2) 0%, color-mix(in srgb, var(--color-surface, #ffffff) 82%, var(--color-background, #fcf7f2)) 100%);
  color: var(--color-ink, #3a2e2a);
}
.tb-about-hero__shell,
.tb-about-story__shell{
  display: grid;
  grid-template-columns: minmax(0, 0.96fr) minmax(18rem, 0.86fr);
  gap: clamp(2rem, 6vw, 5.5rem);
  align-items: center;
}
.tb-about-hero__copy,
.tb-about-story__content{
  max-width: 44rem;
}
.tb-about-hero__eyebrow,
.tb-about-philosophy__eyebrow,
.tb-about-story__eyebrow{
  margin: 0 0 1rem;
  color: var(--color-accent, #c8a15a);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.24em;
  line-height: 1;
  text-transform: uppercase;
}
.tb-about-hero__heading,
.tb-about-philosophy__heading,
.tb-about-story__heading{
  margin: 0;
  color: var(--color-ink, #3a2e2a);
  font-family: var(--font-heading);
  font-weight: 500;
  letter-spacing: -0.065em;
  line-height: 0.94;
}
.tb-about-hero__heading{
  max-width: 52rem;
  font-size: clamp(3.4rem, 7vw, 7.5rem);
}
.tb-about-hero__text,
.tb-about-story__text{
  max-width: 38rem;
  margin-top: clamp(1.25rem, 2vw, 1.75rem);
  color: var(--color-ink-soft, #74635b);
  font-size: clamp(1rem, 1.3vw, 1.2rem);
  line-height: 1.8;
}
.tb-about-hero__copy .button{
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
}
.tb-about-hero__visual,
.tb-about-story__media{
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(26rem, 42vw, 42rem);
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 78%, transparent);
  border-radius: var(--tb-radius-panel, 1.5rem);
  background:
    radial-gradient(circle at 50% 20%, color-mix(in srgb, var(--color-surface, #ffffff) 78%, transparent), transparent 18rem),
    linear-gradient(145deg, color-mix(in srgb, var(--color-secondary, #e7d5c8) 48%, var(--color-surface, #ffffff)), var(--color-surface-soft, #f4e7de));
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent),
    0 2rem 5rem color-mix(in srgb, var(--color-ink, #3a2e2a) 9%, transparent);
}
.tb-about-hero__visual::before,
.tb-about-story__media::before{
  content: "";
  position: absolute;
  width: 72%;
  aspect-ratio: 1;
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-accent, #c8a15a) 16%, transparent);
  filter: blur(3.5rem);
  opacity: 0.9;
}
.tb-about-hero__image,
.tb-about-story__image{
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tb-about-hero__placeholder,
.tb-about-story__placeholder{
  position: relative;
  z-index: 1;
  width: min(82%, 30rem);
  min-height: 24rem;
}
.tb-about-philosophy{
  background:
    radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--color-accent, #c8a15a) 12%, transparent), transparent 28rem),
    var(--color-surface, #ffffff);
}
.tb-about-philosophy__top{
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(18rem, 0.62fr);
  gap: clamp(1.5rem, 5vw, 5rem);
  align-items: end;
  margin-bottom: clamp(2rem, 5vw, 4rem);
}
.tb-about-philosophy__heading{
  max-width: 48rem;
  font-size: clamp(2.75rem, 5.4vw, 5.8rem);
}
.tb-about-philosophy__text{
  margin: 0;
  color: var(--color-ink-soft, #74635b);
  font-size: clamp(0.98rem, 1.25vw, 1.12rem);
  line-height: 1.75;
}
.tb-about-philosophy__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
}
.tb-about-philosophy__card{
  min-height: 22rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(1.4rem, 2.6vw, 2.25rem);
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 82%, transparent);
  border-radius: var(--tb-radius-panel, 1.5rem);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface, #ffffff) 94%, transparent), color-mix(in srgb, var(--color-surface-soft, #f4e7de) 64%, var(--color-surface, #ffffff))),
    var(--color-surface, #ffffff);
  box-shadow: 0 1.5rem 4rem color-mix(in srgb, var(--color-ink, #3a2e2a) 6%, transparent);
}
.tb-about-philosophy__number{
  margin-bottom: auto;
  color: color-mix(in srgb, var(--color-accent, #c8a15a) 82%, var(--color-ink, #3a2e2a));
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.18em;
}
.tb-about-philosophy__card-title{
  max-width: 16rem;
  margin: 0;
  color: var(--color-ink, #3a2e2a);
  font-family: var(--font-heading);
  font-size: clamp(1.75rem, 2.5vw, 2.6rem);
  font-weight: 500;
  letter-spacing: -0.05em;
  line-height: 1;
}
.tb-about-philosophy__card-text{
  margin: 1rem 0 0;
  color: var(--color-ink-soft, #74635b);
  font-size: 0.98rem;
  line-height: 1.65;
}
.tb-about-story{
  background:
    linear-gradient(115deg, color-mix(in srgb, var(--color-secondary, #e7d5c8) 26%, transparent), transparent 42%),
    var(--color-background, #fcf7f2);
}
.tb-about-story__heading{
  max-width: 40rem;
  font-size: clamp(2.8rem, 5.3vw, 5.9rem);
}
.tb-about-story__notes{
  display: grid;
  gap: 0.85rem;
  margin-top: clamp(1.5rem, 3vw, 2.25rem);
}
.tb-about-story__note{
  display: grid;
  gap: 0.28rem;
  padding: 1rem 1.15rem;
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 78%, transparent);
  border-radius: var(--tb-radius-control, 1rem);
  background: color-mix(in srgb, var(--color-surface, #ffffff) 82%, transparent);
}
.tb-about-story__note strong{
  color: var(--color-ink, #3a2e2a);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
}
.tb-about-story__note span{
  color: var(--color-ink-soft, #74635b);
  font-size: 0.95rem;
  line-height: 1.5;
}

@media screen and (max-width: 989px) {
.tb-about-hero__shell,
.tb-about-story__shell,
.tb-about-philosophy__top{
    grid-template-columns: 1fr;
  }
.tb-about-hero__visual,
.tb-about-story__media{
    min-height: 30rem;
  }
.tb-about-philosophy__grid{
    grid-template-columns: 1fr;
  }
.tb-about-philosophy__card{
    min-height: 17rem;
  }
}

@media screen and (max-width: 749px) {
.tb-about-hero__heading,
.tb-about-philosophy__heading,
.tb-about-story__heading{
    letter-spacing: -0.055em;
  }
.tb-about-hero__heading{
    font-size: clamp(3rem, 14vw, 4.5rem);
  }
.tb-about-hero__visual,
.tb-about-story__media{
    min-height: 24rem;
  }
.tb-about-philosophy__card{
    min-height: 15rem;
  }
}
/* =========================================================
   MOBILE CATEGORY STRIP - FINAL AUTHORITY
   Mobile carousel rhythm only. Header geometry lives elsewhere.
   ========================================================= */

@media screen and (max-width: 749px) {
.category-strip {
    overflow: hidden !important;
  }

  .category-strip__grid {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(10.75rem, 11.75rem) !important;
    grid-template-columns: none !important;
    gap: 1.2rem !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: thin !important;
    padding-inline: 1.6rem !important;
    padding-bottom: 1.35rem !important;
  }

  .category-strip__item {
    scroll-snap-align: start !important;
    min-width: 0 !important;
  }

  .category-strip__media {
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
  }

  .category-strip__title {
    font-size: 1rem !important;
    letter-spacing: 0.16em !important;
    white-space: nowrap !important;
  }

  .category-strip__text {
    font-size: 0.82rem !important;
    white-space: nowrap !important;
  }
}


@media screen and (max-width: 749px) {
.main-collection.main-collection--mobile-columns-2 .main-collection__grid{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem 0.75rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card{
    min-width: 0 !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__media{
    aspect-ratio: 1 / 1.18 !important;
    border-radius: calc(var(--tb-radius-card, 1.35rem) * 0.78) !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__image,
.main-collection.main-collection--mobile-columns-2 .product-card__media img{
    width: 78% !important;
    height: 78% !important;
    max-width: 78% !important;
    max-height: 78% !important;
    object-fit: contain !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__content{
    padding-top: 0.85rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__vendor{
    font-size: 0.55rem !important;
    letter-spacing: 0.16em !important;
    line-height: 1.15 !important;
    margin-bottom: 0.42rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__title,
.main-collection.main-collection--mobile-columns-2 .product-card__title a{
    font-size: clamp(0.72rem, 3.2vw, 0.86rem) !important;
    line-height: 1.18 !important;
    letter-spacing: -0.02em !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__rating{
    gap: 0.28rem !important;
    margin-top: 0.55rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__stars,
.main-collection.main-collection--mobile-columns-2 .product-card__stars-base,
.main-collection.main-collection--mobile-columns-2 .product-card__stars-fill{
    font-size: 0.68rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__review-count{
    font-size: 0.58rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__price,
.main-collection.main-collection--mobile-columns-2 .price{
    font-size: 0.76rem !important;
    margin-top: 0.72rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__cart,
.main-collection.main-collection--mobile-columns-2 .product-card__wishlist{
    width: 2.05rem !important;
    height: 2.05rem !important;
    min-width: 2.05rem !important;
    min-height: 2.05rem !important;
  }
.main-collection.main-collection--mobile-columns-2 .product-card__cart svg,
.main-collection.main-collection--mobile-columns-2 .product-card__wishlist svg{
    width: 0.9rem !important;
    height: 0.9rem !important;
  }
}

@media (pointer: fine) {
.water-cursor,
.cursor-water,
.themeblocks-water-cursor,
[data-water-cursor]{
    --tb-water-ripple-color: color-mix(in srgb, var(--color-primary, #a9826d) 58%, var(--color-surface, #ffffff));
    --tb-water-ripple-edge: color-mix(in srgb, var(--color-accent, #c8a15a) 46%, transparent);
    --tb-water-ripple-glow: color-mix(in srgb, var(--color-secondary, #e7d5c8) 48%, transparent);
  }
.water-cursor__ripple,
.cursor-water__ripple,
.themeblocks-water-cursor__ripple,
[data-water-cursor-ripple]{
    border-color: var(--tb-water-ripple-edge) !important;
    background:
      radial-gradient(circle, var(--tb-water-ripple-glow) 0%, transparent 62%),
      color-mix(in srgb, var(--tb-water-ripple-color) 18%, transparent) !important;
    box-shadow:
      0 0 1.35rem color-mix(in srgb, var(--color-primary, #a9826d) 20%, transparent),
      inset 0 0 1.1rem color-mix(in srgb, var(--color-surface, #ffffff) 34%, transparent) !important;
  }
.water-cursor__drop,
.cursor-water__drop,
.themeblocks-water-cursor__drop,
[data-water-cursor-drop]{
    background: color-mix(in srgb, var(--color-primary, #a9826d) 36%, transparent) !important;
    border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 34%, transparent) !important;
    box-shadow: 0 0 1rem color-mix(in srgb, var(--color-secondary, #e7d5c8) 38%, transparent) !important;
  }
}
/* =========================================================
   PDP LUXURY LAYOUT AUTHORITY
   ========================================================= */

.product-main{
  --tb-pdp-ink: var(--color-ink, #3a2e2a);
  --tb-pdp-soft: var(--color-ink-soft, #74635b);
  --tb-pdp-primary: var(--color-primary, #a9826d);
  --tb-pdp-accent: var(--color-accent, #c8a15a);
  --tb-pdp-surface: var(--color-surface, #ffffff);
  --tb-pdp-bg: var(--color-background, #fbf4ec);
  --tb-pdp-border: var(--color-border, #ead8cc);
  background:
    radial-gradient(circle at 14% 12%, color-mix(in srgb, var(--tb-pdp-accent) 12%, transparent), transparent 30rem),
    radial-gradient(circle at 86% 18%, color-mix(in srgb, var(--tb-pdp-primary) 9%, transparent), transparent 28rem),
    linear-gradient(180deg, color-mix(in srgb, var(--tb-pdp-bg) 88%, #ffffff), var(--tb-pdp-bg)) !important;
  padding-block: clamp(3rem, 6vw, 5.75rem) clamp(4rem, 7vw, 6.5rem) !important;
}
.product-main .container{
  max-width: 1440px !important;
}
.product-main__breadcrumb{
  margin: 0 0 clamp(1.5rem, 3vw, 2.25rem) !important;
  color: color-mix(in srgb, var(--tb-pdp-soft) 82%, transparent) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
}
.product-main__breadcrumb a{
  color: color-mix(in srgb, var(--tb-pdp-primary) 72%, var(--tb-pdp-ink)) !important;
  text-decoration: none !important;
}
.product-main__grid{
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(25rem, 0.82fr) !important;
  align-items: start !important;
  gap: clamp(3rem, 5.5vw, 5.5rem) !important;
}
.product-main__gallery{
  position: sticky !important;
  top: 7rem !important;
  align-self: start !important;
}
.product-main__media-frame{
  aspect-ratio: 0.96 / 1 !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 78%, transparent) !important;
  border-radius: var(--tb-radius-panel, 1.75rem) !important;
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--tb-pdp-surface) 96%, transparent), color-mix(in srgb, var(--tb-pdp-bg) 70%, var(--tb-pdp-surface))),
    var(--tb-pdp-surface) !important;
  box-shadow:
    0 2.2rem 5rem color-mix(in srgb, var(--tb-pdp-ink) 8%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 70%, transparent) !important;
  overflow: hidden !important;
}
.product-main__image,
.product-main__video,
.product-main__placeholder{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.product-main__thumb-carousel{
  margin-top: 1.45rem !important;
}
.product-main__thumbs{
  gap: 0.85rem !important;
  padding: 0.15rem 0.25rem 0.45rem !important;
}
.product-main__thumb{
  width: 5.75rem !important;
  height: 5.75rem !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 82%, transparent) !important;
  border-radius: 1rem !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 92%, transparent) !important;
  box-shadow: 0 0.65rem 1.4rem color-mix(in srgb, var(--tb-pdp-ink) 5%, transparent) !important;
  overflow: hidden !important;
}
.product-main__thumb.is-active{
  border-color: var(--tb-pdp-primary) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--tb-pdp-primary) 46%, transparent),
    0 0.9rem 1.8rem color-mix(in srgb, var(--tb-pdp-primary) 14%, transparent) !important;
}
.product-main__thumb-image{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.product-main__thumb-arrow{
  width: 2.75rem !important;
  height: 2.75rem !important;
  border-color: color-mix(in srgb, var(--tb-pdp-border) 78%, transparent) !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 92%, transparent) !important;
  color: var(--tb-pdp-primary) !important;
  box-shadow: 0 0.85rem 1.8rem color-mix(in srgb, var(--tb-pdp-ink) 8%, transparent) !important;
}
.product-main__info{
  position: sticky !important;
  top: 7rem !important;
  padding: clamp(2.1rem, 3.2vw, 3rem) !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 78%, transparent) !important;
  border-radius: var(--tb-radius-panel, 1.75rem) !important;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--tb-pdp-surface) 97%, transparent), color-mix(in srgb, var(--tb-pdp-bg) 28%, var(--tb-pdp-surface))),
    var(--tb-pdp-surface) !important;
  box-shadow:
    0 2rem 5rem color-mix(in srgb, var(--tb-pdp-ink) 8%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent) !important;
}
.product-main__eyebrow{
  margin-bottom: 0.75rem !important;
  color: var(--tb-pdp-accent) !important;
  font-size: 0.68rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.24em !important;
  text-transform: uppercase !important;
}
.product-main__title{
  max-width: 11.5em !important;
  margin: 0 0 1rem !important;
  color: var(--tb-pdp-ink) !important;
  font-size: clamp(2.15rem, 3vw, 3.15rem) !important;
  line-height: 0.94 !important;
  letter-spacing: -0.055em !important;
}
.product-main__wishlist{
  position: static !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  width: auto !important;
  min-height: 2.15rem !important;
  margin: 0 0 1rem !important;
  padding: 0.35rem 0.75rem !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 84%, transparent) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 92%, transparent) !important;
  color: var(--tb-pdp-primary) !important;
  box-shadow: 0 0.55rem 1.2rem color-mix(in srgb, var(--tb-pdp-ink) 4%, transparent) !important;
  transform: none !important;
}
.product-main__wishlist svg{
  width: 0.95rem !important;
  height: 0.95rem !important;
}
.product-main__wishlist span{
  display: inline !important;
  color: inherit !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
}
.product-main__rating,
.product-main__rating--judgeme,
.product-main__rating--judgeme .jdgm-preview-badge{
  margin: 0 0 1.35rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.65rem !important;
  color: color-mix(in srgb, var(--tb-pdp-soft) 78%, transparent) !important;
}
.product-main__stars,
.product-main__rating--judgeme .jdgm-star{
  color: var(--tb-pdp-accent) !important;
}
.product-main__price{
  margin: 0 0 1.35rem !important;
  color: var(--tb-pdp-ink) !important;
  font-size: clamp(1.15rem, 1.5vw, 1.45rem) !important;
  font-weight: 900 !important;
}
.product-main__description{
  margin: 0 0 1.65rem !important;
  max-width: 42rem !important;
  color: color-mix(in srgb, var(--tb-pdp-soft) 88%, transparent) !important;
  font-size: 0.96rem !important;
  line-height: 1.85 !important;
}
.product-main__benefits{
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.7rem !important;
  margin: 0 0 1.75rem !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.product-main__benefit{
  display: grid !important;
  grid-template-columns: 2.35rem minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 0.85rem !important;
  min-height: 4rem !important;
  padding: 0.85rem 1rem !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 72%, transparent) !important;
  border-radius: 1.05rem !important;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--tb-pdp-surface) 96%, transparent), color-mix(in srgb, var(--tb-pdp-primary) 5%, var(--tb-pdp-surface))) !important;
  box-shadow: 0 0.55rem 1.25rem color-mix(in srgb, var(--tb-pdp-ink) 3.5%, transparent) !important;
}
.product-main__benefit-icon{
  width: 2.35rem !important;
  height: 2.35rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--tb-pdp-primary) 9%, var(--tb-pdp-surface)) !important;
  color: var(--tb-pdp-primary) !important;
  font-size: 1rem !important;
}
.product-main__benefit strong{
  display: block !important;
  margin-bottom: 0.18rem !important;
  color: var(--tb-pdp-ink) !important;
  font-size: 0.8rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.01em !important;
}
.product-main__benefit small{
  display: block !important;
  color: color-mix(in srgb, var(--tb-pdp-soft) 82%, transparent) !important;
  font-size: 0.74rem !important;
  line-height: 1.35 !important;
}
.product-main__form{
  margin-top: 1.3rem !important;
}
.product-main__quantity-label,
.product-main__option legend,
.product-main__quantity label{
  margin-bottom: 0.55rem !important;
  color: color-mix(in srgb, var(--tb-pdp-ink) 84%, transparent) !important;
  font-size: 0.66rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}
.product-main__purchase-row{
  display: grid !important;
  grid-template-columns: minmax(8.5rem, 10.75rem) minmax(0, 1fr) !important;
  align-items: end !important;
  gap: 1rem !important;
  margin-top: 0 !important;
}
.product-main__quantity{
  height: 3.35rem !important;
  display: grid !important;
  grid-template-columns: 3rem 1fr 3rem !important;
  align-items: center !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 86%, transparent) !important;
  border-radius: 0.85rem !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 95%, transparent) !important;
  box-shadow: 0 0.6rem 1.4rem color-mix(in srgb, var(--tb-pdp-ink) 4%, transparent) !important;
  overflow: hidden !important;
}
.product-main__quantity button,
.product-main__quantity input{
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--tb-pdp-ink) !important;
  font-weight: 900 !important;
}
.product-main__quantity button{
  cursor: pointer !important;
  color: var(--tb-pdp-primary) !important;
}
.product-main__quantity input{
  text-align: center !important;
}
.product-main__submit{
  min-height: 3.35rem !important;
  width: 100% !important;
  border: 1px solid var(--tb-pdp-primary) !important;
  border-radius: 0.85rem !important;
  background:
    linear-gradient(135deg, var(--tb-pdp-primary), color-mix(in srgb, var(--tb-pdp-primary) 78%, var(--tb-pdp-accent))) !important;
  color: #ffffff !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  box-shadow: 0 1rem 2.1rem color-mix(in srgb, var(--tb-pdp-primary) 18%, transparent) !important;
}
.product-main__submit:disabled{
  border-color: color-mix(in srgb, var(--tb-pdp-primary) 70%, var(--tb-pdp-soft)) !important;
  background: color-mix(in srgb, var(--tb-pdp-primary) 78%, var(--tb-pdp-surface)) !important;
  color: #ffffff !important;
  opacity: 0.88 !important;
}
.product-main__dynamic-checkout{
  margin-top: 1rem !important;
}
.product-main__dynamic-checkout .shopify-payment-button__button,
.product-main__dynamic-checkout .shopify-payment-button__button--unbranded{
  min-height: 3.6rem !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 92%, transparent) !important;
  border-radius: 1rem !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 96%, transparent) !important;
  color: color-mix(in srgb, var(--tb-pdp-primary) 78%, var(--tb-pdp-ink)) !important;
  font-size: 0.76rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  box-shadow: 0 0.75rem 1.6rem color-mix(in srgb, var(--tb-pdp-ink) 4%, transparent) !important;
}
.product-main__trust-row{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
  margin-top: 1.05rem !important;
  padding: 0 !important;
  border: 0 !important;
}
.product-main__trust-row div{
  min-height: 4.1rem !important;
  padding: 0.85rem 0.75rem !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border) 74%, transparent) !important;
  border-radius: 0.95rem !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 82%, transparent) !important;
  text-align: left !important;
}
.product-main__trust-row span{
  color: var(--tb-pdp-primary) !important;
}
.product-main__trust-row strong{
  display: block !important;
  margin-bottom: 0.12rem !important;
  color: var(--tb-pdp-ink) !important;
  font-size: 0.7rem !important;
  font-weight: 900 !important;
}
.product-main__trust-row small{
  color: color-mix(in srgb, var(--tb-pdp-soft) 78%, transparent) !important;
  font-size: 0.65rem !important;
  line-height: 1.25 !important;
}
.related-products{
  background:
    linear-gradient(180deg, var(--tb-pdp-bg), color-mix(in srgb, var(--tb-pdp-surface) 72%, var(--tb-pdp-bg))) !important;
}
.related-products__eyebrow{
  color: var(--tb-pdp-accent) !important;
}
.related-products__heading{
  color: var(--tb-pdp-ink) !important;
}
.related-product-card{
  border-color: color-mix(in srgb, var(--tb-pdp-border) 82%, transparent) !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 94%, transparent) !important;
  box-shadow: 0 1.25rem 3rem color-mix(in srgb, var(--tb-pdp-ink) 7%, transparent) !important;
}
.related-product-card__media{
  border-color: color-mix(in srgb, var(--tb-pdp-border) 80%, transparent) !important;
  background: color-mix(in srgb, var(--tb-pdp-bg) 72%, var(--tb-pdp-surface)) !important;
}
.related-product-card__title,
.related-product-card__price{
  color: var(--tb-pdp-ink) !important;
}
.related-product-card__vendor,
.related-product-card__review-count{
  color: color-mix(in srgb, var(--tb-pdp-soft) 78%, transparent) !important;
}
.related-product-card__stars,
.related-product-card__rating--judgeme .jdgm-star{
  color: var(--tb-pdp-accent) !important;
}
.related-product-card__cart{
  border-color: var(--tb-pdp-primary) !important;
  background: var(--tb-pdp-primary) !important;
  color: #ffffff !important;
}
.product-main__judgeme-reviews .jdgm-rev-widg,
.product-reviews__widget .jdgm-rev-widg{
  border-color: color-mix(in srgb, var(--tb-pdp-border) 88%, transparent) !important;
  background: color-mix(in srgb, var(--tb-pdp-surface) 96%, transparent) !important;
  color: var(--tb-pdp-ink) !important;
}
.product-main__judgeme-reviews .jdgm-rev-widg__title,
.product-reviews__widget .jdgm-rev-widg__title{
  color: var(--tb-pdp-ink) !important;
}

@media screen and (max-width: 989px) {
.product-main__grid{
    grid-template-columns: 1fr !important;
    gap: 2.25rem !important;
  }
.product-main__gallery,
.product-main__info{
    position: static !important;
  }
.product-main__info{
    padding: 1.65rem !important;
  }
.product-main__title{
    max-width: none !important;
  }
}

@media screen and (max-width: 749px) {
.product-main{
    padding-block: 2rem 3.5rem !important;
  }
.product-main__media-frame{
    aspect-ratio: 1 / 1.08 !important;
    border-radius: 1.35rem !important;
  }
.product-main__thumb{
    width: 4.5rem !important;
    height: 4.5rem !important;
    border-radius: 0.85rem !important;
  }
.product-main__info{
    padding: 1.35rem !important;
    border-radius: 1.35rem !important;
  }
.product-main__title{
    font-size: clamp(2rem, 10vw, 2.7rem) !important;
  }
.product-main__purchase-row{
    grid-template-columns: 1fr !important;
  }
.product-main__trust-row{
    grid-template-columns: 1fr !important;
  }
}
/* =========================================================
   PDP VISUAL REFINEMENT
   Tighten PDP image/info spacing and soften YMAL card borders.
   ========================================================= */

.product-main__grid{
  grid-template-columns: minmax(0, 1fr) minmax(24rem, 0.78fr) !important;
  gap: clamp(2rem, 4vw, 3.75rem) !important;
  max-width: 1260px !important;
  margin-inline: auto !important;
}
.product-main .container{
  max-width: 1320px !important;
}
.product-main__gallery{
  justify-self: end !important;
  width: min(100%, 42rem) !important;
}
.product-main__info{
  justify-self: start !important;
  width: min(100%, 32rem) !important;
}
.product-main__media-frame{
  box-shadow:
    0 1.8rem 4.25rem color-mix(in srgb, var(--tb-pdp-ink, #3a2e2a) 6%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent) !important;
}
.related-product-card{
  border-color: color-mix(in srgb, var(--tb-pdp-border, #ead8cc) 42%, transparent) !important;
  background:
    linear-gradient(180deg,
      color-mix(in srgb, var(--tb-pdp-surface, #ffffff) 96%, transparent),
      color-mix(in srgb, var(--tb-pdp-bg, #fbf4ec) 22%, var(--tb-pdp-surface, #ffffff))
    ) !important;
  box-shadow:
    0 1rem 2.75rem color-mix(in srgb, var(--tb-pdp-ink, #3a2e2a) 4.5%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 76%, transparent) !important;
}
.related-product-card:hover{
  border-color: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 34%, var(--tb-pdp-border, #ead8cc)) !important;
  box-shadow:
    0 1.25rem 3.25rem color-mix(in srgb, var(--tb-pdp-ink, #3a2e2a) 6.5%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 80%, transparent) !important;
}
.related-product-card__media{
  border-color: color-mix(in srgb, var(--tb-pdp-border, #ead8cc) 34%, transparent) !important;
  background:
    linear-gradient(145deg,
      color-mix(in srgb, var(--tb-pdp-bg, #fbf4ec) 44%, #ffffff),
      color-mix(in srgb, var(--tb-pdp-surface, #ffffff) 92%, transparent)
    ) !important;
}
.related-product-card__cart{
  box-shadow: 0 0.7rem 1.45rem color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 13%, transparent) !important;
}

@media screen and (max-width: 989px) {
.product-main__grid{
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
    max-width: 44rem !important;
  }
.product-main__gallery,
.product-main__info{
    justify-self: center !important;
    width: 100% !important;
  }
}

@media screen and (max-width: 749px) {
.product-main__grid{
    gap: 1.4rem !important;
  }
.related-product-card{
    border-color: color-mix(in srgb, var(--tb-pdp-border, #ead8cc) 36%, transparent) !important;
  }
}

@media screen {
.product-main__thumb-carousel{
    display: grid !important;
    grid-template-columns: 1.65rem minmax(0, 1fr) 1.65rem !important;
    gap: 0.65rem !important;
    align-items: center !important;
    margin-top: 1.05rem !important;
  }
.product-main__thumbs{
    gap: 0.72rem !important;
    padding: 0.1rem 0.15rem 0.35rem !important;
  }
.product-main__thumb{
    width: clamp(4.8rem, 5.8vw, 5.75rem) !important;
    height: clamp(4.8rem, 5.8vw, 5.75rem) !important;
    border-width: 1px !important;
    border-color: color-mix(in srgb, var(--tb-pdp-border, #ead8cc) 62%, transparent) !important;
    border-radius: 0.95rem !important;
    background: color-mix(in srgb, var(--tb-pdp-surface, #ffffff) 86%, transparent) !important;
    box-shadow: 0 0.55rem 1.15rem color-mix(in srgb, var(--tb-pdp-ink, #3a2e2a) 4%, transparent) !important;
  }
.product-main__thumb.is-active{
    border-color: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 70%, var(--tb-pdp-border, #ead8cc)) !important;
    box-shadow:
      0 0 0 1px color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 28%, transparent),
      0 0.75rem 1.45rem color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 10%, transparent) !important;
  }
.product-main__thumb:hover{
    transform: translateY(-1px) !important;
    border-color: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 52%, transparent) !important;
    box-shadow: 0 0.75rem 1.45rem color-mix(in srgb, var(--tb-pdp-ink, #3a2e2a) 6%, transparent) !important;
  }
.product-main__thumb-arrow,
.product-main__thumb-arrow:hover:not(:disabled),
.product-main__thumb-arrow:disabled{
    width: 1.65rem !important;
    height: 3.25rem !important;
    min-width: 1.65rem !important;
    min-height: 3.25rem !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 78%, var(--tb-pdp-ink, #3a2e2a)) !important;
    font-size: 0 !important;
    line-height: 1 !important;
    padding: 0 !important;
  }
.product-main__thumb-arrow::before{
    width: 0.78rem !important;
    height: 0.78rem !important;
    border-top: 2px solid currentColor !important;
    border-left: 2px solid currentColor !important;
  }
.product-main__thumb-arrow:hover:not(:disabled){
    transform: translateY(-1px) scale(1.08) !important;
    opacity: 1 !important;
  }
.product-main__thumb-arrow:disabled{
    opacity: 0.18 !important;
    transform: none !important;
  }
}

@media screen and (max-width: 749px) {
.product-main__thumb-carousel{
    grid-template-columns: 1.35rem minmax(0, 1fr) 1.35rem !important;
    gap: 0.45rem !important;
    margin-top: 0.85rem !important;
  }
.product-main__thumb{
    width: 4.35rem !important;
    height: 4.35rem !important;
    border-radius: 0.8rem !important;
  }
.product-main__thumb-arrow,
.product-main__thumb-arrow:hover:not(:disabled),
.product-main__thumb-arrow:disabled{
    width: 1.35rem !important;
    height: 2.8rem !important;
    min-width: 1.35rem !important;
    min-height: 2.8rem !important;
  }
}
.product-main{
  --tb-product-page-width: var(--page-width, 82rem);
  --tb-product-page-gutter: var(--site-gutter, clamp(1.25rem, 4vw, 3rem));
}
.product-main .container,
.product-main__container{
  width: min(calc(100% - (var(--tb-product-page-gutter) * 2)), var(--tb-product-page-width)) !important;
  max-width: var(--tb-product-page-width) !important;
  margin-inline: auto !important;
  padding-inline: 0 !important;
}
.product-main__grid{
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}
.product-main .container{
  max-width: var(--tb-product-page-width) !important;
}
.product-main__breadcrumb{
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}
.product-main__grid{
  grid-template-columns: minmax(0, 1.03fr) minmax(25rem, 0.86fr) !important;
  gap: clamp(2.25rem, 4.6vw, 4.35rem) !important;
}
.product-main__gallery{
  justify-self: start !important;
  width: 100% !important;
  max-width: 42rem !important;
}
.product-main__info{
  justify-self: end !important;
  width: 100% !important;
  max-width: 32rem !important;
}

@media screen and (max-width: 989px) {
.product-main .container,
.product-main__container{
    width: min(calc(100% - 2rem), 44rem) !important;
    max-width: 44rem !important;
  }
.product-main__grid{
    grid-template-columns: 1fr !important;
    gap: 1.75rem !important;
  }
.product-main__gallery,
.product-main__info{
    justify-self: center !important;
    max-width: 100% !important;
  }
}

@media screen and (max-width: 749px) {
.product-main .container,
.product-main__container{
    width: min(calc(100% - 1.25rem), 36rem) !important;
    max-width: 36rem !important;
  }
}

@media screen and (min-width: 990px) {
.product-main .container{
    max-width: min(var(--tb-product-page-width, var(--page-width, 82rem)), 76rem) !important;
  }
.product-main__grid{
    grid-template-columns: minmax(0, 1fr) minmax(27rem, 0.92fr) !important;
    gap: clamp(1.75rem, 3.2vw, 3rem) !important;
    align-items: start !important;
  }
.product-main__gallery{
    justify-self: end !important;
    width: min(100%, 39.5rem) !important;
    max-width: 39.5rem !important;
  }
.product-main__info{
    justify-self: start !important;
    width: min(100%, 35rem) !important;
    max-width: 35rem !important;
  }
.product-main__media-frame{
    aspect-ratio: 1 / 0.96 !important;
  }
}

@media screen and (min-width: 1200px) {
.product-main__grid{
    gap: clamp(2rem, 3vw, 3.35rem) !important;
  }
.product-main__gallery{
    width: min(100%, 40.5rem) !important;
    max-width: 40.5rem !important;
  }
.product-main__info{
    width: min(100%, 35.5rem) !important;
    max-width: 35.5rem !important;
  }
}

@media screen and (min-width: 1440px) {
.product-main .container{
    max-width: 78rem !important;
  }
.product-main__grid{
    gap: 3.25rem !important;
  }
}
.related-products .related-product-card__cart{
  display: grid !important;
  place-items: center !important;
  width: 2.65rem !important;
  height: 2.65rem !important;
  min-width: 2.65rem !important;
  min-height: 2.65rem !important;
  border: 1px solid color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 58%, var(--tb-pdp-border, #ead8cc)) !important;
  border-radius: 0.85rem !important;
  background: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 92%, var(--tb-pdp-ink, #3a2e2a)) !important;
  color: #ffffff !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow:
    0 0.75rem 1.65rem color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 18%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 22%, transparent) !important;
}
.related-products .related-product-card__cart svg,
.related-products .related-product-card__cart svg *{
  width: 1.05rem !important;
  height: 1.05rem !important;
  color: currentColor !important;
  stroke: currentColor !important;
}
.related-products .related-product-card__cart:hover:not(:disabled){
  border-color: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 72%, var(--tb-pdp-accent, #c8a15a)) !important;
  background: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 82%, var(--tb-pdp-accent, #c8a15a)) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
  box-shadow:
    0 0.95rem 1.9rem color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 24%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 26%, transparent) !important;
}
.related-products .related-product-card__cart:disabled{
  opacity: 0.42 !important;
  cursor: not-allowed !important;
}
.product-main__details-panel{
  display: grid !important;
  gap: 0.65rem !important;
  margin: 0 0 1.65rem !important;
}
.product-main__detail{
  border: 1px solid color-mix(in srgb, var(--tb-pdp-border, #ead8cc) 72%, transparent) !important;
  border-radius: 1rem !important;
  background:
    linear-gradient(135deg,
      color-mix(in srgb, var(--tb-pdp-surface, #ffffff) 97%, transparent),
      color-mix(in srgb, var(--tb-pdp-bg, #fbf4ec) 18%, var(--tb-pdp-surface, #ffffff))
    ) !important;
  box-shadow: 0 0.55rem 1.35rem color-mix(in srgb, var(--tb-pdp-ink, #3a2e2a) 3.5%, transparent) !important;
  overflow: hidden !important;
}
.product-main__detail summary{
  min-height: 3.15rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding: 0.85rem 1rem !important;
  color: var(--tb-pdp-ink, #3a2e2a) !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  list-style: none !important;
}
.product-main__detail summary::-webkit-details-marker{
  display: none !important;
}
.product-main__detail summary span:last-child{
  width: 1.65rem !important;
  height: 1.65rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--tb-pdp-primary, #a9826d) 8%, var(--tb-pdp-surface, #ffffff)) !important;
  color: var(--tb-pdp-primary, #a9826d) !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  transition: transform 180ms ease !important;
}
.product-main__detail[open] summary span:last-child{
  transform: rotate(45deg) !important;
}
.product-main__detail-content{
  padding: 0 1rem 1rem !important;
  color: color-mix(in srgb, var(--tb-pdp-soft, #74635b) 88%, transparent) !important;
  font-size: 0.86rem !important;
  line-height: 1.65 !important;
}

.product-main__detail-content > :first-child{
  margin-top: 0 !important;
}

.product-main__detail-content > :last-child{
  margin-bottom: 0 !important;
}

.product-main__detail-content p{
  margin: 0 0 0.85rem !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
}

.product-main__detail-content ul,
.product-main__detail-content ol{
  margin: 0.65rem 0 0.95rem !important;
  padding-inline-start: 1.4rem !important;
}

.product-main__detail-content ul{
  list-style: disc outside !important;
}

.product-main__detail-content ol{
  list-style: decimal outside !important;
}

.product-main__detail-content li{
  display: list-item !important;
  margin: 0.38rem 0 !important;
  padding-left: 0.18rem !important;
  color: inherit !important;
  line-height: 1.55 !important;
}

.product-main__detail-content li::marker{
  color: var(--color-primary, #a9826d) !important;
}

.product-main__detail-content strong,
.product-main__detail-content b{
  color: var(--tb-pdp-ink, #12395d) !important;
  font-weight: 800 !important;
}

.product-main__detail-content em,
.product-main__detail-content i{
  font-style: italic !important;
}

.product-main__detail-content a{
  color: var(--color-primary-dark, #876654) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 0.16em !important;
}

.product-main__detail-content a:hover{
  color: var(--color-primary, #a9826d) !important;
}

@media screen and (max-width: 749px) {
.product-main__details-panel{
    gap: 0.55rem !important;
    margin-bottom: 1.35rem !important;
  }
.product-main__detail summary{
    min-height: 3rem !important;
    padding: 0.78rem 0.9rem !important;
    font-size: 0.68rem !important;
  }
.product-main__detail-content{
    padding: 0 0.9rem 0.9rem !important;
    font-size: 0.82rem !important;
  }
}
.site-header__actions .site-header__icon,
.site-header__actions .site-header__search-toggle,
.site-header__actions .site-header__account,
.site-header__actions .site-header__wishlist,
.site-header__actions .site-header__cart{
  width: 3.2rem !important;
  height: 3.2rem !important;
  min-width: 3.2rem !important;
  min-height: 3.2rem !important;
  max-width: 3.2rem !important;
  max-height: 3.2rem !important;
  display: inline-grid !important;
  place-items: center !important;
  position: relative !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 68%, transparent) !important;
  border-radius: var(--tb-radius-icon, 1rem) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 94%, transparent) !important;
  color: var(--color-ink, #3a2e2a) !important;
  box-shadow:
    0 0.75rem 1.65rem color-mix(in srgb, var(--color-ink, #3a2e2a) 5%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent) !important;
  padding: 0 !important;
  text-decoration: none !important;
  transform: none !important;
}
.site-header__actions .site-header__icon:hover,
.site-header__actions .site-header__search-toggle:hover,
.site-header__actions .site-header__account:hover,
.site-header__actions .site-header__wishlist:hover,
.site-header__actions .site-header__cart:hover{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 38%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 98%, transparent) !important;
  color: var(--color-primary, #a9826d) !important;
  box-shadow:
    0 0.9rem 1.9rem color-mix(in srgb, var(--color-primary, #a9826d) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 76%, transparent) !important;
  transform: translateY(-1px) !important;
}
.site-header__actions .site-header__icon svg,
.site-header__actions .site-header__search-toggle svg,
.site-header__actions .site-header__account svg,
.site-header__actions .site-header__wishlist svg,
.site-header__actions .site-header__cart svg,
.site-header__actions .site-header__cart > svg,
.site-header__actions .site-header__cart .icon-cart{
  width: 1.2rem !important;
  height: 1.2rem !important;
  display: block !important;
  color: currentColor !important;
  stroke: currentColor !important;
  fill: none !important;
}
.site-header__actions .site-header__wishlist svg path,
.site-header__actions .site-header__cart svg path,
.site-header__actions .site-header__cart > svg path{
  stroke: currentColor !important;
  fill: none !important;
}


/* =========================================================
   FINAL HEADER ICON SHAPE AUTHORITY
   Keep header action icons using the global shape system across
   normal,
inner,
sticky,
and transparent hero states.
   ========================================================= */

.site-header__actions .site-header__icon,
.site-header__actions .site-header__search-toggle,
.site-header__actions .site-header__account,
.site-header__actions .site-header__wishlist,
.site-header__actions .site-header__cart,
.site-header__actions .site-header__cart-link,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__icon,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart,
body.template-index .site-header.is-scrolled .site-header__icon,
body.template-index .site-header.is-scrolled .site-header__search-toggle,
body.template-index .site-header.is-scrolled .site-header__account,
body.template-index .site-header.is-scrolled .site-header__wishlist,
body.template-index .site-header.is-scrolled .site-header__cart,
body:not(.template-index) .site-header .site-header__icon,
body:not(.template-index) .site-header .site-header__search-toggle,
body:not(.template-index) .site-header .site-header__account,
body:not(.template-index) .site-header .site-header__wishlist,
body:not(.template-index) .site-header .site-header__cart{
  border-radius: var(--tb-radius-icon, 1rem) !important;
}
/* =========================================================
   FINAL HEADER SEARCH ICON SIZE AUTHORITY
   Keep search button shape consistent,
but reduce magnifier SVG
   so it visually matches account,
wishlist,
and cart icons.
   ========================================================= */

.site-header__actions .site-header__search-toggle svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle svg,
body.template-index .site-header.is-scrolled .site-header__search-toggle svg,
body:not(.template-index) .site-header .site-header__search-toggle svg{
  width: 1.05rem !important;
  height: 1.05rem !important;
  min-width: 1.05rem !important;
  min-height: 1.05rem !important;
}


/* =========================================================
   FINAL HOMEPAGE HEADER ACTION SIZE AUTHORITY
   Account,
wishlist,
and cart must match search icon size
   on homepage transparent and sticky header states.
   ========================================================= */

body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart,
body.template-index .site-header.is-scrolled .site-header__account,
body.template-index .site-header.is-scrolled .site-header__wishlist,
body.template-index .site-header.is-scrolled .site-header__cart{
  width: 3.2rem !important;
  height: 3.2rem !important;
  min-width: 3.2rem !important;
  min-height: 3.2rem !important;
  max-width: 3.2rem !important;
  max-height: 3.2rem !important;
  border-radius: var(--tb-radius-icon, 1rem) !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart > svg,
body.template-index .site-header.is-scrolled .site-header__account svg,
body.template-index .site-header.is-scrolled .site-header__wishlist svg,
body.template-index .site-header.is-scrolled .site-header__cart svg,
body.template-index .site-header.is-scrolled .site-header__cart > svg{
  width: 1.2rem !important;
  height: 1.2rem !important;
  min-width: 1.2rem !important;
  min-height: 1.2rem !important;
}


body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link{
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 82%, #ffffff 18%) !important;
  opacity: 1 !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.42) !important;
}
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link:hover,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link[aria-current="page"],
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link.is-active{
  color: var(--color-accent, #c8a15a) !important;
  opacity: 1 !important;
}
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__actions,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__actions svg,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__actions svg *,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__account,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 86%, #ffffff 14%) !important;
  stroke: currentColor !important;
}
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__account,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__cart{
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent),
      color-mix(in srgb, var(--color-surface, #ffffff) 74%, transparent)
    ) !important;
  border-color: color-mix(in srgb, var(--color-border, #ead8cc) 72%, transparent) !important;
  box-shadow:
    0 0.7rem 1.55rem color-mix(in srgb, var(--color-ink, #3a2e2a) 6%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 76%, transparent) !important;
}
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle:hover,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__account:hover,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist:hover,
body.template-index .site-header.site-header--icons-light.site-header--transparent-hero:not(.is-scrolled) .site-header__cart:hover{
  color: var(--color-accent, #c8a15a) !important;
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 32%, transparent) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 96%, transparent) !important;
}
body.template-index .site-header.is-scrolled .site-header__nav-link,
body.template-index .site-header.is-scrolled .site-header__actions,
body.template-index .site-header.is-scrolled .site-header__actions svg,
body.template-index .site-header.is-scrolled .site-header__actions svg *{
  color: var(--color-ink, #3a2e2a) !important;
  stroke: currentColor !important;
  text-shadow: none !important;
}


@media (prefers-reduced-motion: no-preference) {
.site-header__actions > .site-header__search-toggle,
.site-header__actions > .site-header__account,
.site-header__actions > .site-header__wishlist,
.site-header__actions > .site-header__cart{
    animation: tb-header-action-reveal 720ms cubic-bezier(0.19, 1, 0.22, 1) both !important;
    will-change: opacity, transform, filter !important;
  }
.site-header__actions > .site-header__search-toggle{
    animation-delay: 160ms !important;
  }
.site-header__actions > .site-header__account{
    animation-delay: 320ms !important;
  }
.site-header__actions > .site-header__wishlist{
    animation-delay: 480ms !important;
  }
.site-header__actions > .site-header__cart{
    animation-delay: 640ms !important;
  }

  @keyframes tb-header-action-reveal {
    0% {
      opacity: 0;
      transform: translateY(-0.55rem) scale(0.88);
      filter: blur(0.45rem);
    }

    55% {
      opacity: 1;
      transform: translateY(0.08rem) scale(1.035);
      filter: blur(0);
    }

    100% {
      opacity: 1;
      transform: translateY(0) scale(1);
      filter: blur(0);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
.site-header__actions > .site-header__search-toggle,
.site-header__actions > .site-header__account,
.site-header__actions > .site-header__wishlist,
.site-header__actions > .site-header__cart{
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}
/* =========================================================
   HOMEPAGE STICKY HEADER ACTION REVEAL ANIMATION
   Replays icon stagger when transparent hero header becomes sticky.
   ========================================================= */

@media (prefers-reduced-motion: no-preference){
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__search-toggle,
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__account,
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__wishlist,
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__cart{
    animation: tb-header-action-sticky-reveal 680ms cubic-bezier(0.19, 1, 0.22, 1) both !important;
    will-change: opacity, transform, filter !important;
  }
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__search-toggle{
    animation-delay: 80ms !important;
  }
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__account{
    animation-delay: 180ms !important;
  }
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__wishlist{
    animation-delay: 280ms !important;
  }
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__cart{
    animation-delay: 380ms !important;
  }

  @keyframes tb-header-action-sticky-reveal {
    0% {
      opacity: 0;
      transform: translateY(-0.45rem) scale(0.92);
      filter: blur(0.35rem);
    }

    60% {
      opacity: 1;
      transform: translateY(0.04rem) scale(1.02);
      filter: blur(0);
    }

    100% {
      opacity: 1;
      transform: translateY(0) scale(1);
      filter: blur(0);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__search-toggle,
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__account,
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__wishlist,
body.template-index .site-header.is-scrolled .site-header__actions > .site-header__cart{
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}
.wishlist-drawer__item-atc{
  width: fit-content !important;
  min-height: 2.35rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 0.75rem !important;
  padding: 0 1rem !important;
  border: 1px solid color-mix(in srgb, var(--color-primary, #a9826d) 58%, transparent) !important;
  border-radius: var(--tb-radius-button, 999px) !important;
  background: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 0.65rem 1.35rem color-mix(in srgb, var(--color-primary, #a9826d) 18%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 24%, transparent) !important;
  font-family: var(--font-button-family, Arial, sans-serif) !important;
  font-size: 0.66rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    opacity 180ms ease !important;
}
.wishlist-drawer__item-atc:hover{
  transform: translateY(-1px) !important;
  background: color-mix(in srgb, var(--color-primary, #a9826d) 86%, var(--color-accent, #c8a15a)) !important;
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 52%, var(--color-primary, #a9826d)) !important;
  box-shadow:
    0 0.8rem 1.55rem color-mix(in srgb, var(--color-primary, #a9826d) 24%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 28%, transparent) !important;
}
.wishlist-drawer__item-atc:disabled,
.wishlist-drawer__item-atc.is-loading{
  opacity: 0.72 !important;
  cursor: wait !important;
  transform: none !important;
}
.wishlist-drawer__item-atc.is-added{
  background: color-mix(in srgb, var(--color-accent, #c8a15a) 82%, var(--color-primary, #a9826d)) !important;
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 64%, transparent) !important;
}
.wishlist-drawer__item-atc.is-error{
  background: color-mix(in srgb, #8b2f2f 86%, var(--color-primary, #a9826d)) !important;
  border-color: color-mix(in srgb, #8b2f2f 64%, transparent) !important;
}
.wishlist-drawer__item-atc--link{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent) !important;
  color: var(--color-primary, #a9826d) !important;
}

@media screen and (max-width: 749px) {
.wishlist-drawer__item-atc{
    width: 100% !important;
  }
}
/* =========================================================
   FINAL WISHLIST CHOOSE OPTIONS BUTTON FIX
   Keep PDP fallback button readable in normal and hover states.
   ========================================================= */

.wishlist-drawer__item-atc.wishlist-drawer__item-atc--link{
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent) !important;
  color: var(--color-primary, #a9826d) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 42%, var(--color-border, #ead8cc)) !important;
  box-shadow:
    0 0.55rem 1.2rem color-mix(in srgb, var(--color-ink, #3a2e2a) 5%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent) !important;
}
.wishlist-drawer__item-atc.wishlist-drawer__item-atc--link:hover,
.wishlist-drawer__item-atc.wishlist-drawer__item-atc--link:focus-visible{
  background: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
  border-color: var(--color-primary, #a9826d) !important;
  box-shadow:
    0 0.8rem 1.55rem color-mix(in srgb, var(--color-primary, #a9826d) 22%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 28%, transparent) !important;
}
.wishlist-drawer__item-atc.wishlist-drawer__item-atc--link:hover *,
.wishlist-drawer__item-atc.wishlist-drawer__item-atc--link:focus-visible *{
  color: currentColor !important;
}
/* =========================================================
   FINAL PDP PURCHASE BUTTON PALETTE AUTHORITY
   Align PDP ATC,
sold-out,
and dynamic checkout buttons with
   the Carevielle/ThemeBlocks skincare palette instead of legacy blue.
   ========================================================= */

.product-main{
  --cv-pdp-action-primary: var(--color-primary, #a9826d);
  --cv-pdp-action-primary-hover: color-mix(in srgb, var(--color-primary, #a9826d) 86%, var(--color-accent, #c8a15a));
  --cv-pdp-action-muted: color-mix(in srgb, var(--color-primary, #a9826d) 34%, var(--color-surface, #ffffff));
  --cv-pdp-action-muted-border: color-mix(in srgb, var(--color-primary, #a9826d) 42%, var(--color-border, #ead8cc));
  --cv-pdp-action-text: var(--color-button-text, #ffffff);
}
.product-main__submit,
.product-main__add-button,
.product-form__submit,
.product-main button[type="submit"][name="add"],
.product-main form[action*="/cart/add"] button[type="submit"][name="add"]{
  border-color: var(--cv-pdp-action-primary) !important;
  background: var(--cv-pdp-action-primary) !important;
  color: var(--cv-pdp-action-text) !important;
  box-shadow:
    0 0.85rem 1.8rem color-mix(in srgb, var(--color-primary, #a9826d) 22%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 24%, transparent) !important;
}
.product-main__submit:hover,
.product-main__submit:focus-visible,
.product-main__add-button:hover,
.product-main__add-button:focus-visible,
.product-form__submit:hover,
.product-form__submit:focus-visible,
.product-main button[type="submit"][name="add"]:hover,
.product-main button[type="submit"][name="add"]:focus-visible,
.product-main form[action*="/cart/add"] button[type="submit"][name="add"]:hover,
.product-main form[action*="/cart/add"] button[type="submit"][name="add"]:focus-visible{
  border-color: var(--cv-pdp-action-primary-hover) !important;
  background: var(--cv-pdp-action-primary-hover) !important;
  color: var(--cv-pdp-action-text) !important;
  box-shadow:
    0 1rem 2.1rem color-mix(in srgb, var(--color-primary, #a9826d) 28%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 30%, transparent) !important;
  transform: translateY(-1px) !important;
}
.product-main__submit:disabled,
.product-main__submit[disabled],
.product-main__add-button:disabled,
.product-main__add-button[disabled],
.product-form__submit:disabled,
.product-form__submit[disabled],
.product-main button[type="submit"][name="add"]:disabled,
.product-main button[type="submit"][name="add"][disabled],
.product-main form[action*="/cart/add"] button[type="submit"][name="add"]:disabled,
.product-main form[action*="/cart/add"] button[type="submit"][name="add"][disabled]{
  border-color: var(--cv-pdp-action-muted-border) !important;
  background: var(--cv-pdp-action-muted) !important;
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 58%, #ffffff) !important;
  box-shadow:
    0 0.65rem 1.35rem color-mix(in srgb, var(--color-ink, #3a2e2a) 5%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 42%, transparent) !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
  transform: none !important;
}
.product-main__submit *,
.product-main__add-button *,
.product-form__submit *,
.product-main button[type="submit"][name="add"] *{
  color: currentColor !important;
}
.product-main .shopify-payment-button__button,
.product-main .shopify-payment-button__button--branded,
.product-main .shopify-payment-button__button--unbranded{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 38%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 94%, transparent) !important;
  color: var(--color-primary, #a9826d) !important;
  box-shadow:
    0 0.65rem 1.4rem color-mix(in srgb, var(--color-ink, #3a2e2a) 5%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent) !important;
}
.product-main .shopify-payment-button__button:hover,
.product-main .shopify-payment-button__button:focus-visible,
.product-main .shopify-payment-button__button--unbranded:hover,
.product-main .shopify-payment-button__button--unbranded:focus-visible{
  border-color: var(--cv-pdp-action-primary) !important;
  background: var(--cv-pdp-action-primary) !important;
  color: var(--cv-pdp-action-text) !important;
}
.product-main .shopify-payment-button__button *,
.product-main .shopify-payment-button__button--branded *,
.product-main .shopify-payment-button__button--unbranded *{
  color: currentColor !important;
}
.product-main__quantity button:hover,
.product-main__quantity button:focus-visible,
.product-main__quantity-wrapper button:hover,
.product-main__quantity-wrapper button:focus-visible,
.product-main__quantity-selector button:hover,
.product-main__quantity-selector button:focus-visible{
  color: var(--color-primary, #a9826d) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 36%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-primary, #a9826d) 8%, var(--color-surface, #ffffff)) !important;
}
/* =========================================================
   FINAL HEADER NAV + BADGE PALETTE AUTHORITY
   Align nav hover underline,
active state,
and count bubbles
   with the ThemeBlocks Skincare palette instead of legacy blue/gold.
   ========================================================= */

.site-header .site-header__nav-link::after,
body.template-index .site-header .site-header__nav-link::after,
body:not(.template-index) .site-header .site-header__nav-link::after{
  height: 1px !important;
  background:
    linear-gradient(
      90deg,
      transparent,
      color-mix(in srgb, var(--color-primary, #a9826d) 80%, var(--color-accent, #c8a15a)),
      transparent
    ) !important;
  box-shadow: 0 0.35rem 0.85rem color-mix(in srgb, var(--color-primary, #a9826d) 26%, transparent) !important;
}
.site-header .site-header__nav-link:hover,
.site-header .site-header__nav-link:focus-visible,
.site-header .site-header__nav-link[aria-current="page"],
.site-header .site-header__nav-link.is-active,
body.template-index .site-header .site-header__nav-link:hover,
body.template-index .site-header .site-header__nav-link:focus-visible,
body.template-index .site-header .site-header__nav-link[aria-current="page"],
body.template-index .site-header .site-header__nav-link.is-active,
body:not(.template-index) .site-header .site-header__nav-link:hover,
body:not(.template-index) .site-header .site-header__nav-link:focus-visible,
body:not(.template-index) .site-header .site-header__nav-link[aria-current="page"],
body:not(.template-index) .site-header .site-header__nav-link.is-active{
  color: var(--color-primary, #a9826d) !important;
  opacity: 1 !important;
}
.site-header .site-header__nav-link:hover::after,
.site-header .site-header__nav-link:focus-visible::after,
.site-header .site-header__nav-link[aria-current="page"]::after,
.site-header .site-header__nav-link.is-active::after,
body.template-index .site-header .site-header__nav-link:hover::after,
body.template-index .site-header .site-header__nav-link:focus-visible::after,
body.template-index .site-header .site-header__nav-link[aria-current="page"]::after,
body.template-index .site-header .site-header__nav-link.is-active::after,
body:not(.template-index) .site-header .site-header__nav-link:hover::after,
body:not(.template-index) .site-header .site-header__nav-link:focus-visible::after,
body:not(.template-index) .site-header .site-header__nav-link[aria-current="page"]::after,
body:not(.template-index) .site-header .site-header__nav-link.is-active::after{
  width: 100% !important;
}
/* =========================================================
   FINAL MOBILE HOME HEADER SEARCH SIZE AUTHORITY
   Search icon must match account,
wishlist,
and cart on
   homepage transparent/sticky mobile header states.
   ========================================================= */

body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart,
body.template-index .site-header.is-scrolled .site-header__search-toggle,
body.template-index .site-header.is-scrolled .site-header__account,
body.template-index .site-header.is-scrolled .site-header__wishlist,
body.template-index .site-header.is-scrolled .site-header__cart{
  width: 3.2rem !important;
  height: 3.2rem !important;
  min-width: 3.2rem !important;
  min-height: 3.2rem !important;
  max-width: 3.2rem !important;
  max-height: 3.2rem !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 !important;
  border-radius: var(--tb-radius-icon, 1rem) !important;
}
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__search-toggle svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__account svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__wishlist svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart svg,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__cart > svg,
body.template-index .site-header.is-scrolled .site-header__search-toggle svg,
body.template-index .site-header.is-scrolled .site-header__account svg,
body.template-index .site-header.is-scrolled .site-header__wishlist svg,
body.template-index .site-header.is-scrolled .site-header__cart svg,
body.template-index .site-header.is-scrolled .site-header__cart > svg{
  width: 1.2rem !important;
  height: 1.2rem !important;
  min-width: 1.2rem !important;
  min-height: 1.2rem !important;
}


.site-header__actions .site-header__cart-count,
.site-header__actions .site-header__wishlist-count,
.site-header__cart-count,
.site-header__wishlist-count,
[data-wishlist-count]{
  position: absolute !important;
  top: -0.48rem !important;
  right: -0.42rem !important;
  width: 1.28rem !important;
  height: 1.28rem !important;
  min-width: 1.28rem !important;
  max-width: 1.28rem !important;
  min-height: 1.28rem !important;
  max-height: 1.28rem !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  border: 2px solid var(--color-surface, #ffffff) !important;
  border-radius: 999px !important;
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--color-accent, #c8a15a) 92%, #ffffff),
    color-mix(in srgb, var(--color-primary, #a9826d) 78%, var(--color-accent, #c8a15a))
  ) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 0.35rem 0.85rem color-mix(in srgb, var(--color-primary, #a9826d) 24%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 34%, transparent) !important;
  font-size: 0.66rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  transform: none !important;
  z-index: 5 !important;
}
.site-header__actions .site-header__cart-count:empty,
.site-header__actions .site-header__wishlist-count:empty,
.site-header__actions .site-header__wishlist-count[hidden],
.site-header__actions [data-wishlist-count][hidden],
.site-header__cart-count:empty,
.site-header__wishlist-count:empty,
[data-wishlist-count]:empty,
[data-wishlist-count][hidden]{
  display: none !important;
}


/* =========================================================
   FINAL CLINICAL BANNER CTA STYLE-AWARE PALETTE FIX
   Respect primary,
secondary,
and tertiary button styles.
   ========================================================= */

.clinical-banner .clinical-banner__button{
  opacity: 1 !important;
}
.clinical-banner .clinical-banner__button.button--primary{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 52%, var(--color-surface, #ffffff)) !important;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-primary, #a9826d) 76%, var(--color-accent, #c8a15a)),
      color-mix(in srgb, var(--color-primary-dark, #876654) 88%, var(--color-primary, #a9826d))
    ) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 1rem 2.2rem color-mix(in srgb, var(--color-primary, #a9826d) 30%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 28%, transparent) !important;
}
.clinical-banner .clinical-banner__button.button--primary:hover,
.clinical-banner .clinical-banner__button.button--primary:focus-visible{
  border-color: color-mix(in srgb, var(--color-accent, #c8a15a) 62%, var(--color-primary, #a9826d)) !important;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-primary, #a9826d) 86%, var(--color-accent, #c8a15a)),
      color-mix(in srgb, var(--color-primary-dark, #876654) 92%, var(--color-primary, #a9826d))
    ) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 1.15rem 2.45rem color-mix(in srgb, var(--color-primary, #a9826d) 36%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 32%, transparent) !important;
  transform: translateY(-1px) !important;
}
.clinical-banner .clinical-banner__button.button--secondary{
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 70%, var(--color-secondary, #e7d5c8)) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 28%, transparent) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 0.8rem 1.8rem color-mix(in srgb, var(--color-ink, #3a2e2a) 12%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 34%, transparent) !important;
}
.clinical-banner .clinical-banner__button.button--secondary:hover,
.clinical-banner .clinical-banner__button.button--secondary:focus-visible{
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 86%, var(--color-secondary, #e7d5c8)) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 38%, transparent) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 1rem 2.2rem color-mix(in srgb, var(--color-ink, #3a2e2a) 16%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 42%, transparent) !important;
  transform: translateY(-1px) !important;
}
.clinical-banner .clinical-banner__button.button--tertiary{
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 56%, transparent) !important;
  background: transparent !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow: none !important;
}
.clinical-banner .clinical-banner__button.button--tertiary:hover,
.clinical-banner .clinical-banner__button.button--tertiary:focus-visible{
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 82%, var(--color-secondary, #e7d5c8)) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 16%, transparent) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow:
    0 0.85rem 1.8rem color-mix(in srgb, var(--color-ink, #3a2e2a) 12%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 26%, transparent) !important;
  transform: translateY(-1px) !important;
}
.clinical-banner .clinical-banner__button *,
.clinical-banner .clinical-banner__button:hover *,
.clinical-banner .clinical-banner__button:focus-visible *{
  color: currentColor !important;
}
/* =========================================================
   FINAL NAV FONT WEIGHT SETTING AUTHORITY
   Header nav and menu links must respect Theme settings.
   ========================================================= */

.site-header .site-header__nav-link,
.site-header__nav .site-header__nav-link,
body.template-index .site-header .site-header__nav-link,
body.template-index .site-header--transparent-hero .site-header__nav-link,
body.template-index .site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link,
body.template-index .site-header.is-scrolled .site-header__nav-link,
body.template-collection .site-header .site-header__nav-link,
body.template-product .site-header .site-header__nav-link,
body.template-page .site-header .site-header__nav-link,
body:not(.template-index) .site-header .site-header__nav-link{
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-style: var(--font-nav-style, normal) !important;
  font-weight: var(--font-nav-weight, 800) !important;
}
.site-header__mobile-nav a,
.site-header__drawer a,
.site-header__mobile-menu a,
.mobile-menu a,
.drawer-menu a{
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-style: var(--font-nav-style, normal) !important;
  font-weight: var(--font-nav-weight, 800) !important;
}
.site-header .site-header__nav-link,
.site-header__nav .site-header__nav-link,
html body .site-header .site-header__nav .site-header__nav-link,
html body.template-index .site-header .site-header__nav .site-header__nav-link,
html body.template-collection .site-header .site-header__nav .site-header__nav-link,
html body.template-product .site-header .site-header__nav .site-header__nav-link,
html body.template-page .site-header .site-header__nav .site-header__nav-link{
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-style: var(--font-nav-style, normal) !important;
  font-size: var(--font-nav-size, 0.9rem) !important;
  font-weight: var(--font-nav-weight, 800) !important;
  letter-spacing: var(--font-nav-letter-spacing, 0.16em) !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: geometricPrecision !important;
  font-synthesis-weight: none !important;
}
/* =========================================================
   TRUE FINAL NAV TYPOGRAPHY SETTING AUTHORITY
   Desktop nav must obey Navigation and menu font/weight.
   ========================================================= */

.site-header .site-header__nav-link,
.site-header__nav .site-header__nav-link,
html body .site-header .site-header__nav .site-header__nav-link,
html body.template-index .site-header .site-header__nav .site-header__nav-link,
html body.template-collection .site-header .site-header__nav .site-header__nav-link,
html body.template-product .site-header .site-header__nav .site-header__nav-link,
html body.template-page .site-header .site-header__nav .site-header__nav-link,
html body:not(.template-index) .site-header .site-header__nav .site-header__nav-link{
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-style: var(--font-nav-style, normal) !important;
  font-size: var(--font-nav-size, 0.9rem) !important;
  font-weight: var(--font-nav-weight, 800) !important;
  letter-spacing: var(--font-nav-letter-spacing, 0.16em) !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: geometricPrecision !important;
  font-synthesis: none !important;
  font-synthesis-weight: none !important;
}

@media screen and (min-width: 750px) {
.site-header .site-header__nav-link,
.site-header__nav .site-header__nav-link,
html body .site-header .site-header__nav .site-header__nav-link,
html body.template-index .site-header .site-header__nav .site-header__nav-link,
html body.template-collection .site-header .site-header__nav .site-header__nav-link,
html body.template-product .site-header .site-header__nav .site-header__nav-link,
html body.template-page .site-header .site-header__nav .site-header__nav-link,
html body:not(.template-index) .site-header .site-header__nav .site-header__nav-link{
    font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
    font-style: var(--font-nav-style, normal) !important;
    font-size: var(--font-nav-size, 0.9rem) !important;
    font-weight: var(--font-nav-weight, 800) !important;
    letter-spacing: var(--font-nav-letter-spacing, 0.16em) !important;
    text-transform: uppercase !important;
  }
}
/* =========================================================
   FINAL HERO WATER RIPPLE PALETTE AUTHORITY
   Force hero touch/mouse ripple to use the active palette system.
   ========================================================= */

.hero-themeblocks-skincare{
  --tb-hero-ripple-core: color-mix(in srgb, var(--color-primary, #a9826d) 62%, var(--color-surface, #ffffff));
  --tb-hero-ripple-edge: color-mix(in srgb, var(--color-accent, #c8a15a) 46%, transparent);
  --tb-hero-ripple-glow: color-mix(in srgb, var(--color-primary, #a9826d) 20%, transparent);
  --tb-hero-ripple-sheen: color-mix(in srgb, var(--color-surface, #ffffff) 58%, transparent);
}
.hero-themeblocks-skincare .hero-themeblocks-skincare__water-ripple{
  border-color: var(--tb-hero-ripple-core) !important;
  box-shadow:
    0 0 0 2px var(--tb-hero-ripple-sheen),
    inset 0 0 1.25rem color-mix(in srgb, var(--color-surface, #ffffff) 38%, transparent),
    0 0 2rem var(--tb-hero-ripple-glow) !important;
}
.hero-themeblocks-skincare .hero-themeblocks-skincare__water-ripple::before{
  border-color: color-mix(in srgb, var(--color-surface, #ffffff) 52%, var(--color-secondary, #e7d5c8)) !important;
}
.hero-themeblocks-skincare .hero-themeblocks-skincare__water-ripple::after{
  border-color: var(--tb-hero-ripple-edge) !important;
}
/* =========================================================
   AJAX COLLECTION + SEARCH PAGINATION LOADER
   Premium no-reload pagination state for collection/search pages.
   ========================================================= */

.main-collection[data-ajax-pagination],
.main-search[data-ajax-pagination]{
  position: relative;
}
.main-collection[data-ajax-pagination] .main-collection__grid,
.main-search[data-ajax-pagination] .main-search__grid{
  transition:
    opacity 180ms ease,
    filter 180ms ease,
    transform 180ms ease;
}
.main-collection[data-ajax-pagination].is-ajax-loading .main-collection__grid,
.main-search[data-ajax-pagination].is-ajax-loading .main-search__grid{
  opacity: 0.28;
  filter: blur(1px);
  transform: translateY(0.35rem);
  pointer-events: none;
}
.main-collection[data-ajax-pagination]::after,
.main-search[data-ajax-pagination]::after{
  content: "";
  position: absolute;
  z-index: 8;
  left: 50%;
  top: min(34rem, 50%);
  width: min(18rem, calc(100% - 3rem));
  height: 0.72rem;
  border-radius: 999px;
  background:
    linear-gradient(
      90deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 18%, transparent),
      color-mix(in srgb, var(--color-primary, #a9826d) 24%, var(--color-surface, #ffffff)),
      color-mix(in srgb, var(--color-surface, #ffffff) 18%, transparent)
    );
  box-shadow:
    0 0.85rem 2rem color-mix(in srgb, var(--color-primary, #a9826d) 16%, transparent),
    0 0 0 1px color-mix(in srgb, var(--color-border, #ead8cc) 54%, transparent);
  opacity: 0;
  transform: translate(-50%, -50%) scaleX(0.76);
  pointer-events: none;
  transition:
    opacity 180ms ease,
    transform 180ms ease;
}
.main-collection[data-ajax-pagination].is-ajax-loading::after,
.main-search[data-ajax-pagination].is-ajax-loading::after{
  opacity: 1;
  transform: translate(-50%, -50%) scaleX(1);
  animation: themeblocksAjaxPaginationPulse 900ms ease-in-out infinite alternate;
}
.main-collection__pagination a.is-loading,
.main-search__pagination-link.is-loading{
  pointer-events: none;
  opacity: 0.68;
}

@keyframes themeblocksAjaxPaginationPulse {
  from {
    filter: saturate(0.95) brightness(1);
  }

  to {
    filter: saturate(1.12) brightness(1.04);
  }
}

@media (max-width: 749px) {
.main-collection[data-ajax-pagination]::after,
.main-search[data-ajax-pagination]::after{
    top: min(28rem, 46%);
    width: min(14rem, calc(100% - 2rem));
  }
}
/* =========================================================
   FINAL HEADER SEARCH FIELD BORDER CLEANUP
   Remove native-looking input border; use thin custom shell only.
   ========================================================= */

.site-header__search-form,
.header-search__form,
[data-header-search] form{
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 68%, transparent) !important;
  box-shadow:
    0 1.4rem 3.2rem color-mix(in srgb, var(--color-ink, #3a2e2a) 7%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 82%, transparent) !important;
}
.site-header__search-input,
.header-search__input,
[data-header-search] input[type="search"],
[data-header-search] input[type="text"]{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.site-header__search-input:focus,
.site-header__search-input:focus-visible,
.header-search__input:focus,
.header-search__input:focus-visible,
[data-header-search] input[type="search"]:focus,
[data-header-search] input[type="search"]:focus-visible,
[data-header-search] input[type="text"]:focus,
[data-header-search] input[type="text"]:focus-visible{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.site-header__search-form:focus-within,
.header-search__form:focus-within,
[data-header-search] form:focus-within{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 42%, var(--color-border, #ead8cc)) !important;
  box-shadow:
    0 1.5rem 3.4rem color-mix(in srgb, var(--color-primary, #a9826d) 10%, transparent),
    0 0 0 3px color-mix(in srgb, var(--color-primary, #a9826d) 9%, transparent),
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 86%, transparent) !important;
}
/* =========================================================
   FINAL BASIC PAGE + FLEXIBLE CONTENT SECTIONS
   ========================================================= */

.main-page{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 10%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 36%, transparent), transparent 30rem),
    linear-gradient(180deg, var(--color-background, #f8f1ec) 0%, color-mix(in srgb, var(--color-surface, #ffffff) 88%, var(--color-background, #f8f1ec)) 100%);
}
.main-page__container{
  max-width: 58rem;
}
.main-page--width-narrow .main-page__container{
  max-width: 46rem;
}
.main-page--width-wide .main-page__container{
  max-width: 78rem;
}
.main-page--align-center .main-page__container{
  text-align: center;
}
.main-page__header{
  margin: 0 auto clamp(1.75rem, 4vw, 3rem);
}
.main-page__eyebrow,
.basic-multicolumn__eyebrow,
.content-blocks__eyebrow{
  margin: 0 0 0.75rem;
  color: var(--color-primary, #a9826d);
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif));
  font-size: 0.72rem;
  font-weight: var(--font-nav-weight, 800);
  letter-spacing: 0.16em;
  line-height: 1.2;
  text-transform: uppercase;
}
.main-page__title,
.basic-multicolumn__heading,
.content-blocks__heading{
  margin: 0;
  color: var(--color-ink, #3a2e2a);
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif);
  font-weight: var(--font-heading-weight, 500);
  letter-spacing: -0.045em;
  line-height: 0.98;
}
.main-page--heading-small .main-page__title,
.basic-multicolumn--heading-small .basic-multicolumn__heading,
.content-blocks--heading-small .content-blocks__heading{
  font-size: clamp(2rem, 5vw, 3.3rem);
}
.main-page--heading-medium .main-page__title,
.basic-multicolumn--heading-medium .basic-multicolumn__heading,
.content-blocks--heading-medium .content-blocks__heading{
  font-size: clamp(2.5rem, 6vw, 4.5rem);
}
.main-page--heading-large .main-page__title,
.basic-multicolumn--heading-large .basic-multicolumn__heading,
.content-blocks--heading-large .content-blocks__heading{
  font-size: clamp(3rem, 7.4vw, 6rem);
}
.main-page__content{
  padding: clamp(1.35rem, 3vw, 2.5rem);
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 78%, transparent);
  border-radius: var(--tb-radius-panel, 2rem);
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent);
  box-shadow:
    0 1.25rem 3rem color-mix(in srgb, var(--color-ink, #3a2e2a) 7%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent);
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 82%, #ffffff 18%);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: clamp(1rem, 1.2vw, 1.08rem);
  line-height: 1.75;
}
.main-page__content > *:first-child,
.basic-multicolumn__intro > *:first-child,
.basic-multicolumn__text > *:first-child,
.content-blocks__intro > *:first-child,
.content-blocks__text > *:first-child{
  margin-top: 0;
}
.main-page__content > *:last-child,
.basic-multicolumn__intro > *:last-child,
.basic-multicolumn__text > *:last-child,
.content-blocks__intro > *:last-child,
.content-blocks__text > *:last-child{
  margin-bottom: 0;
}
.basic-multicolumn,
.content-blocks{
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--color-accent, #c8a15a) 16%, transparent), transparent 24rem),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface, #ffffff) 88%, var(--color-background, #f8f1ec)) 0%, var(--color-background, #f8f1ec) 100%);
}
.basic-multicolumn__header{
  max-width: 54rem;
  margin: 0 auto clamp(2rem, 5vw, 3.75rem);
  text-align: center;
}
.basic-multicolumn__intro,
.content-blocks__intro{
  max-width: 42rem;
  margin: 1rem auto 0;
  color: color-mix(in srgb, var(--color-ink-soft, #74635b) 84%, transparent);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: clamp(0.98rem, 1.2vw, 1.08rem);
  line-height: 1.7;
}
.basic-multicolumn__grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.5rem);
}
.basic-multicolumn--columns-2 .basic-multicolumn__grid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.basic-multicolumn--columns-4 .basic-multicolumn__grid{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.basic-multicolumn__card{
  min-width: 0;
  padding: clamp(1.25rem, 2.2vw, 1.8rem);
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 78%, transparent);
  border-radius: var(--tb-radius-card, 1.5rem);
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent);
  box-shadow:
    0 1rem 2.5rem color-mix(in srgb, var(--color-ink, #3a2e2a) 6%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent);
  text-align: center;
}
.basic-multicolumn--align-left .basic-multicolumn__card{
  text-align: left;
}
.basic-multicolumn__media{
  overflow: hidden;
  margin: 0 0 1.25rem;
  border-radius: var(--tb-radius-media, 1.25rem);
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 48%, var(--color-surface, #ffffff));
}
.basic-multicolumn__image{
  display: block;
  width: 100%;
  aspect-ratio: 1 / 0.78;
  object-fit: cover;
  transition: transform 550ms cubic-bezier(0.19, 1, 0.22, 1);
}
.basic-multicolumn__card:hover .basic-multicolumn__image{
  transform: scale(1.045);
}
.basic-multicolumn__icon{
  display: inline-grid;
  place-items: center;
  width: 3.1rem;
  height: 3.1rem;
  margin: 0 0 1.1rem;
  border: 1px solid color-mix(in srgb, var(--color-primary, #a9826d) 28%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--color-primary, #a9826d) 8%, var(--color-surface, #ffffff));
  color: var(--color-primary, #a9826d);
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif));
  font-size: 0.82rem;
  font-weight: var(--font-nav-weight, 800);
  letter-spacing: 0.08em;
}
.basic-multicolumn__title,
.content-blocks__title{
  margin: 0;
  color: var(--color-ink, #3a2e2a);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: clamp(1rem, 1.35vw, 1.22rem);
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.15;
}
.basic-multicolumn__text,
.content-blocks__text{
  margin: 0.85rem 0 0;
  color: color-mix(in srgb, var(--color-ink-soft, #74635b) 86%, transparent);
  font-family: var(--font-body-family, Assistant, Arial, Helvetica, sans-serif);
  font-size: 0.95rem;
  line-height: 1.65;
}
.basic-multicolumn__link{
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 1.15rem;
  color: var(--color-primary, #a9826d);
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif));
  font-size: 0.72rem;
  font-weight: var(--font-nav-weight, 800);
  letter-spacing: 0.14em;
  text-decoration: none;
  text-transform: uppercase;
}
.basic-multicolumn__link::after{
  content: "→";
  transition: transform 180ms ease;
}
.basic-multicolumn__link:hover::after{
  transform: translateX(0.18rem);
}
.content-blocks__shell{
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: start;
}
.content-blocks--layout-stacked .content-blocks__shell{
  display: block;
}
.content-blocks--layout-stacked .content-blocks__header{
  max-width: 58rem;
  margin: 0 auto clamp(2rem, 5vw, 3.5rem);
  text-align: center;
}
.content-blocks--layout-stacked .content-blocks__intro{
  margin-inline: auto;
}
.content-blocks__button{
  margin-top: 1.4rem;
}
.content-blocks__items{
  display: grid;
  gap: 1rem;
}
.content-blocks__item{
  padding: clamp(1.15rem, 2vw, 1.65rem);
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 80%, transparent);
  border-radius: var(--tb-radius-card, 1.5rem);
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent);
  box-shadow:
    0 0.85rem 2rem color-mix(in srgb, var(--color-ink, #3a2e2a) 5%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 72%, transparent);
}
.content-blocks__kicker{
  margin: 0 0 0.65rem;
  color: var(--color-primary, #a9826d);
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif));
  font-size: 0.68rem;
  font-weight: var(--font-nav-weight, 800);
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

@media (max-width: 989px) {
.basic-multicolumn__grid,
.basic-multicolumn--columns-2 .basic-multicolumn__grid,
.basic-multicolumn--columns-4 .basic-multicolumn__grid,
.content-blocks__shell{
    grid-template-columns: 1fr;
  }
.content-blocks__header{
    max-width: 54rem;
  }
}

@media (max-width: 749px) {
.main-page__content,
.basic-multicolumn__card,
.content-blocks__item{
    border-radius: 1.25rem;
  }
.basic-multicolumn__header,
.content-blocks__header{
    text-align: left;
  }
.basic-multicolumn--align-center .basic-multicolumn__card{
    text-align: left;
  }
.basic-multicolumn__intro,
.content-blocks__intro{
    margin-inline: 0;
  }
}
body.themeblocks-mobile-menu-open{
  overflow: hidden !important;
}
body.themeblocks-mobile-menu-open::before{
  content: "";
  position: fixed;
  inset: 0;
  z-index: 88;
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--color-surface, #ffffff) 72%, transparent), transparent 26rem),
    color-mix(in srgb, var(--color-ink, #3a2e2a) 20%, transparent);
  backdrop-filter: blur(10px) saturate(1.05);
  -webkit-backdrop-filter: blur(10px) saturate(1.05);
  opacity: 1;
  pointer-events: none;
}




/* =========================================================
   FINAL HEADER SECOND-LEVEL MENU SUPPORT
   Desktop dropdown + mobile accordion submenu.
   ========================================================= */

.site-header__nav-item{
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
}
.site-header__nav-item .site-header__nav-link{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.42rem !important;
}
.site-header__nav-caret{
  width: 0.58rem !important;
  height: 0.42rem !important;
  opacity: 0.68 !important;
  transform: translateY(-0.02rem) !important;
  transition:
    transform 180ms ease,
    opacity 180ms ease !important;
}
.site-header__nav-item:hover .site-header__nav-caret,
.site-header__nav-item:focus-within .site-header__nav-caret{
  opacity: 1 !important;
  transform: translateY(-0.02rem) rotate(180deg) !important;
}
.site-header__dropdown{
  position: absolute !important;
  top: calc(100% + 1rem) !important;
  left: 50% !important;
  z-index: 120 !important;
  min-width: 14.25rem !important;
  padding: 0.7rem !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 72%, transparent) !important;
  border-radius: 1.35rem !important;
  background:
    radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 24%, transparent), transparent 14rem),
    linear-gradient(180deg, color-mix(in srgb, var(--color-surface, #ffffff) 96%, transparent), color-mix(in srgb, var(--color-secondary, #e7d5c8) 18%, var(--color-surface, #ffffff))) !important;
  box-shadow:
    0 1.4rem 3rem color-mix(in srgb, var(--color-ink, #3a2e2a) 12%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 84%, transparent) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateX(-50%) translateY(0.35rem) scale(0.98) !important;
  transform-origin: top center !important;
  transition:
    opacity 180ms ease,
    visibility 180ms ease,
    transform 180ms ease !important;
}
.site-header__nav-item:hover .site-header__dropdown,
.site-header__nav-item:focus-within .site-header__dropdown{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) scale(1) !important;
}
.site-header__dropdown::before{
  content: "" !important;
  position: absolute !important;
  top: -0.65rem !important;
  left: 0 !important;
  right: 0 !important;
  height: 0.8rem !important;
}
.site-header__dropdown-link{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 2.75rem !important;
  padding: 0.72rem 0.9rem !important;
  border-radius: 0.95rem !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-size: 0.78rem !important;
  font-weight: var(--font-nav-weight, 700) !important;
  letter-spacing: 0.09em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition:
    background 180ms ease,
    color 180ms ease,
    transform 180ms ease !important;
}
.site-header__dropdown-link:hover,
.site-header__dropdown-link:focus-visible{
  background: color-mix(in srgb, var(--color-primary, #a9826d) 12%, var(--color-surface, #ffffff)) !important;
  color: var(--color-primary-dark, #876654) !important;
  transform: translateX(0.12rem) !important;
}

@media screen and (min-width: 900px) {
.site-header__mobile-eyebrow,
.site-header__mobile-item,
.site-header__mobile-submenu{
    display: none !important;
  }
}


/* =========================================================
   FINAL DESKTOP DROPDOWN HOVER BRIDGE FIX
   Prevent second-level menu from closing when cursor moves
   from the parent nav item into the dropdown panel.
   ========================================================= */

@media screen and (min-width: 900px){
  .site-header__nav-item--has-children {
    position: relative !important;
  }

  .site-header__nav-item--has-children::after {
    content: "" !important;
    position: absolute !important;
    left: -1.25rem !important;
    right: -1.25rem !important;
    top: 100% !important;
    height: 1.25rem !important;
    z-index: 119 !important;
    display: block !important;
    background: transparent !important;
    pointer-events: auto !important;
  }

  .site-header__dropdown {
    top: calc(100% + 0.65rem) !important;
  }

  .site-header__dropdown::before {
    top: -0.85rem !important;
    height: 0.95rem !important;
  }

  .site-header__nav-item--has-children:hover .site-header__dropdown,
  .site-header__nav-item--has-children:focus-within .site-header__dropdown {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) scale(1) !important;
  }
}



/* =========================================================
   FINAL MOBILE MENU ACCORDION GAP FIX
   Collapse submenu space when closed; keep open state compact.
   ========================================================= */


/* =========================================================
   TRUE FINAL MOBILE MENU SUBMENU COLLAPSE FIX
   Target the real mobile menu markup,
not details-based markup.
   ========================================================= */


/* =========================================================
   FINAL MOBILE MENU PARENT CARET ALIGNMENT
   Keep submenu parent label left and caret/action indicator right.
   ========================================================= */




@media screen and (max-width: 899px) {
body.themeblocks-mobile-menu-open #MainContent,
body.themeblocks-mobile-menu-open main {
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
body.themeblocks-mobile-menu-open::before,
body.themeblocks-mobile-menu-open::after{
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}
/* =========================================================
   FINAL MOBILE MENU CLOSE ICON FIX
   Replace warped hamburger-to-X transform with a clean centered X.
   ========================================================= */


/* =========================================================
   TRUE FINAL COLLECTION PRODUCT IMAGE FULL-BLEED AUTHORITY
   Make collection product images fill the media card instead
   of sitting as a smaller square inside the card.
   ========================================================= */

.template-collection .main-collection .product-card__media,
.template-collection .main-collection__grid .product-card__media,
.main-collection .product-card__media,
.main-collection__grid .product-card__media{
  display: block !important;
  position: relative !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--color-surface, #ffffff) !important;
}
.template-collection .main-collection .product-card__image,
.template-collection .main-collection__grid .product-card__image,
.template-collection .main-collection .product-card__media img,
.template-collection .main-collection__grid .product-card__media img,
.main-collection .product-card__image,
.main-collection__grid .product-card__image,
.main-collection .product-card__media img,
.main-collection__grid .product-card__media img{
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
  transform: scale(1) !important;
  mix-blend-mode: normal !important;
  background: transparent !important;
  transition:
    transform 420ms cubic-bezier(0.19, 1, 0.22, 1),
    filter 420ms ease !important;
}
.template-collection .main-collection .product-card:hover .product-card__media,
.template-collection .main-collection__grid .product-card:hover .product-card__media,
.main-collection .product-card:hover .product-card__media,
.main-collection__grid .product-card:hover .product-card__media{
  transform: translateY(-0.18rem) !important;
}
.template-collection .main-collection .product-card:hover .product-card__image,
.template-collection .main-collection__grid .product-card:hover .product-card__image,
.template-collection .main-collection .product-card:hover .product-card__media img,
.template-collection .main-collection__grid .product-card:hover .product-card__media img,
.main-collection .product-card:hover .product-card__image,
.main-collection__grid .product-card:hover .product-card__image,
.main-collection .product-card:hover .product-card__media img,
.main-collection__grid .product-card:hover .product-card__media img{
  transform: scale(1.035) !important;
  filter: saturate(1.03) contrast(1.01) !important;
}

@media screen and (max-width: 749px) {
.template-collection .main-collection .product-card:hover .product-card__media,
.template-collection .main-collection__grid .product-card:hover .product-card__media,
.main-collection .product-card:hover .product-card__media,
.main-collection__grid .product-card:hover .product-card__media{
    transform: none !important;
  }
.template-collection .main-collection .product-card:hover .product-card__image,
.template-collection .main-collection__grid .product-card:hover .product-card__image,
.template-collection .main-collection .product-card:hover .product-card__media img,
.template-collection .main-collection__grid .product-card:hover .product-card__media img,
.main-collection .product-card:hover .product-card__image,
.main-collection__grid .product-card:hover .product-card__image,
.main-collection .product-card:hover .product-card__media img,
.main-collection__grid .product-card:hover .product-card__media img{
    transform: scale(1) !important;
  }
}
/* =========================================================
   PREMIUM COLLECTION FILTERS
   Native Shopify filters,
ThemeBlocks ritual drawer UI.
   ========================================================= */

.main-collection__header{
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: clamp(1.5rem, 3vw, 2.5rem) !important;
}
.main-collection__header-copy{
  max-width: 48rem !important;
}
.main-collection__filter-toggle{
  position: relative !important;
  display: inline-grid !important;
  grid-template-columns: auto auto !important;
  align-items: center !important;
  gap: 0.28rem 0.75rem !important;
  min-width: 11.5rem !important;
  min-height: 3.65rem !important;
  padding: 0.68rem 1rem 0.68rem 1.15rem !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 76%, transparent) !important;
  border-radius: var(--tb-radius-control, 999px) !important;
  background:
    radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 28%, transparent), transparent 9rem),
    color-mix(in srgb, var(--color-surface, #ffffff) 92%, var(--color-secondary, #e7d5c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
  box-shadow:
    0 1rem 2.4rem color-mix(in srgb, var(--color-ink, #3a2e2a) 7%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 86%, transparent) !important;
  cursor: pointer !important;
  text-align: left !important;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease !important;
}
.main-collection__filter-toggle:hover,
.main-collection__filter-toggle[aria-expanded="true"]{
  transform: translateY(-0.12rem) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 42%, var(--color-border, #ead8cc)) !important;
  box-shadow:
    0 1.2rem 2.8rem color-mix(in srgb, var(--color-ink, #3a2e2a) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 92%, transparent) !important;
}
.main-collection__filter-toggle-kicker{
  grid-column: 1 / -1 !important;
  color: color-mix(in srgb, var(--color-primary, #a9826d) 72%, var(--color-ink, #3a2e2a)) !important;
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-size: 0.58rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.main-collection__filter-toggle-label{
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-size: 0.82rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.13em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}
.main-collection__filter-toggle-count{
  display: inline-grid !important;
  place-items: center !important;
  width: 1.45rem !important;
  height: 1.45rem !important;
  border-radius: 999px !important;
  background: var(--color-primary, #a9826d) !important;
  color: #ffffff !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}
.main-collection__filter-shell{
  position: fixed !important;
  inset: 0 !important;
  z-index: 120 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition:
    opacity 240ms ease,
    visibility 240ms ease !important;
}
.main-collection__filter-shell.is-open{
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.main-collection__filter-backdrop{
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 70% 0%, color-mix(in srgb, var(--color-surface, #ffffff) 64%, transparent), transparent 30rem),
    color-mix(in srgb, var(--color-ink, #3a2e2a) 24%, transparent) !important;
  backdrop-filter: blur(8px) saturate(1.04) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.04) !important;
}
.main-collection__filter-panel{
  position: absolute !important;
  top: clamp(1rem, 3vw, 2rem) !important;
  right: clamp(1rem, 3vw, 2rem) !important;
  bottom: clamp(1rem, 3vw, 2rem) !important;
  width: min(28rem, calc(100vw - 2rem)) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 78%, transparent) !important;
  border-radius: 1.65rem !important;
  background:
    radial-gradient(circle at 14% 0%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 22%, transparent), transparent 20rem),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 98%, var(--color-secondary, #e7d5c8)),
      color-mix(in srgb, var(--color-surface, #ffffff) 94%, var(--color-secondary, #e7d5c8))
    ) !important;
  box-shadow:
    0 2rem 5rem color-mix(in srgb, var(--color-ink, #3a2e2a) 22%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 92%, transparent) !important;
  transform: translateX(1.5rem) scale(0.985) !important;
  transition: transform 420ms cubic-bezier(0.19, 1, 0.22, 1) !important;
}
.main-collection__filter-shell.is-open .main-collection__filter-panel{
  transform: translateX(0) scale(1) !important;
}
.main-collection__filter-head{
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  padding: 1.35rem 1.35rem 1rem !important;
  border-bottom: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 62%, transparent) !important;
}
.main-collection__filter-eyebrow{
  margin: 0 0 0.35rem !important;
  color: color-mix(in srgb, var(--color-primary, #a9826d) 72%, var(--color-ink, #3a2e2a)) !important;
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-size: 0.62rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}
.main-collection__filter-title{
  margin: 0 !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-size: clamp(1.55rem, 2.2vw, 2rem) !important;
  line-height: 1 !important;
}
.main-collection__filter-close{
  display: inline-grid !important;
  place-items: center !important;
  width: 2.8rem !important;
  height: 2.8rem !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 72%, transparent) !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent) !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-size: 1.7rem !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.main-collection__active-filters{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.45rem !important;
  padding: 1rem 1.35rem 0 !important;
}
.main-collection__active-filter,
.main-collection__clear-filters{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.42rem !important;
  min-height: 2.15rem !important;
  padding: 0 0.72rem !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-size: 0.64rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}
.main-collection__active-filter{
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 38%, var(--color-surface, #ffffff)) !important;
  color: var(--color-primary-dark, #876654) !important;
}
.main-collection__clear-filters{
  background: var(--color-ink, #3a2e2a) !important;
  color: #ffffff !important;
}
.main-collection__filter-form{
  flex: 1 1 auto !important;
  overflow-y: auto !important;
  padding: 1rem 1.35rem 1.35rem !important;
}
.main-collection__filter-group{
  border-bottom: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 64%, transparent) !important;
}
.main-collection__filter-summary{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  min-height: 3.6rem !important;
  cursor: pointer !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-family: var(--font-nav-family, var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-size: 0.82rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  list-style: none !important;
}
.main-collection__filter-summary::-webkit-details-marker{
  display: none !important;
}
.main-collection__filter-summary-icon{
  color: var(--color-primary, #a9826d) !important;
  transition: transform 180ms ease !important;
}
.main-collection__filter-group[open] .main-collection__filter-summary-icon{
  transform: rotate(180deg) !important;
}
.main-collection__filter-options{
  display: grid !important;
  gap: 0.55rem !important;
  padding: 0 0 1rem !important;
}
.main-collection__filter-choice{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 0.72rem !important;
  min-height: 2.9rem !important;
  padding: 0 0.78rem !important;
  border: 1px solid transparent !important;
  border-radius: 1rem !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 76%, var(--color-secondary, #e7d5c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
  cursor: pointer !important;
}
.main-collection__filter-choice input{
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.main-collection__filter-choice-mark{
  width: 1.05rem !important;
  height: 1.05rem !important;
  border: 1px solid color-mix(in srgb, var(--color-primary, #a9826d) 38%, var(--color-border, #ead8cc)) !important;
  border-radius: 999px !important;
  background: var(--color-surface, #ffffff) !important;
  box-shadow: inset 0 0 0 0.28rem var(--color-surface, #ffffff) !important;
}
.main-collection__filter-choice.is-active{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 38%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 44%, var(--color-surface, #ffffff)) !important;
}
.main-collection__filter-choice.is-active .main-collection__filter-choice-mark{
  background: var(--color-primary, #a9826d) !important;
}
.main-collection__filter-choice.is-disabled{
  opacity: 0.42 !important;
  cursor: not-allowed !important;
}
.main-collection__filter-choice-label{
  min-width: 0 !important;
  font-size: 0.86rem !important;
  font-weight: 650 !important;
  line-height: 1.25 !important;
}
.main-collection__filter-choice-count{
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 52%, transparent) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
}
.main-collection__price-range{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.7rem !important;
}
.main-collection__price-field{
  display: grid !important;
  gap: 0.4rem !important;
}
.main-collection__price-field span{
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 64%, transparent) !important;
  font-size: 0.72rem !important;
  font-weight: 750 !important;
}
.main-collection__price-field input{
  width: 100% !important;
  min-height: 3rem !important;
  padding: 0 0.85rem !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 76%, transparent) !important;
  border-radius: 0.95rem !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 84%, transparent) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.main-collection__filter-actions{
  position: sticky !important;
  bottom: -1.35rem !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 0.75rem !important;
  margin: 1.25rem -1.35rem -1.35rem !important;
  padding: 1rem 1.35rem 1.35rem !important;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 0%, transparent),
      color-mix(in srgb, var(--color-surface, #ffffff) 96%, var(--color-secondary, #e7d5c8)) 28%
    ) !important;
}
.main-collection__filter-apply,
.main-collection__filter-reset,
.main-collection__empty-button{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 3.1rem !important;
  padding: 0 1.25rem !important;
  border-radius: var(--tb-radius-control, 999px) !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
.main-collection__filter-apply{
  border: 1px solid var(--color-primary, #a9826d) !important;
  background: var(--color-primary, #a9826d) !important;
  color: #ffffff !important;
  cursor: pointer !important;
}
.main-collection__filter-reset,
.main-collection__empty-button{
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 76%, transparent) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent) !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.main-collection__results-bar{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  margin: 0 0 clamp(1.25rem, 2vw, 1.75rem) !important;
  padding: 0.8rem 1rem !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 58%, transparent) !important;
  border-radius: var(--tb-radius-control, 999px) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 72%, transparent) !important;
}
.main-collection__results-bar p,
.main-collection__results-bar span{
  margin: 0 !important;
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 68%, transparent) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
}
body.themeblocks-collection-filter-open{
  overflow: hidden !important;
}

@media screen and (max-width: 749px) {
.main-collection__header{
    display: grid !important;
    align-items: start !important;
  }
.main-collection__filter-toggle{
    width: 100% !important;
    min-width: 0 !important;
  }
.main-collection__filter-panel{
    top: auto !important;
    left: 0.75rem !important;
    right: 0.75rem !important;
    bottom: 0.75rem !important;
    width: auto !important;
    max-height: min(82vh, 42rem) !important;
    border-radius: 1.45rem !important;
    transform: translateY(1.5rem) scale(0.985) !important;
  }
.main-collection__filter-shell.is-open .main-collection__filter-panel{
    transform: translateY(0) scale(1) !important;
  }
.main-collection__results-bar{
    align-items: flex-start !important;
    flex-direction: column !important;
    border-radius: 1.15rem !important;
  }
.main-collection__price-range{
    grid-template-columns: 1fr !important;
  }
}
/* =========================================================
   FINAL COLLECTION FILTER TRIGGER REFINEMENT
   Cleaner premium utility button for collection filtering.
   ========================================================= */

.main-collection__filter-toggle{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.85rem !important;
  min-width: 15.5rem !important;
  min-height: 3.7rem !important;
  padding: 0.68rem 0.95rem !important;
  border-radius: 1.15rem !important;
  text-align: left !important;
}
.main-collection__filter-toggle-icon{
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 2.25rem !important;
  height: 2.25rem !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--color-primary, #a9826d) 10%, var(--color-surface, #ffffff)) !important;
  color: var(--color-primary-dark, #876654) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, #ffffff 86%, transparent),
    0 0.55rem 1.2rem color-mix(in srgb, var(--color-ink, #3a2e2a) 5%, transparent) !important;
}
.main-collection__filter-toggle-icon svg{
  width: 1.12rem !important;
  height: 1.12rem !important;
}
.main-collection__filter-toggle-copy{
  display: grid !important;
  gap: 0.28rem !important;
  min-width: 0 !important;
}
.main-collection__filter-toggle-label{
  display: block !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.11em !important;
  line-height: 1 !important;
}
.main-collection__filter-toggle-kicker{
  display: block !important;
  grid-column: auto !important;
  color: color-mix(in srgb, var(--color-ink, #3a2e2a) 58%, transparent) !important;
  font-family: var(--font-body-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.2 !important;
  text-transform: none !important;
}
.main-collection__filter-toggle-count{
  margin-left: auto !important;
  flex: 0 0 auto !important;
}
.main-collection__filter-toggle:hover .main-collection__filter-toggle-icon,
.main-collection__filter-toggle[aria-expanded="true"] .main-collection__filter-toggle-icon{
  background: var(--color-primary, #a9826d) !important;
  color: #ffffff !important;
}

@media screen and (max-width: 749px) {
.main-collection__filter-toggle{
    width: 100% !important;
    min-width: 0 !important;
    border-radius: 1.1rem !important;
  }
.main-collection__filter-toggle-kicker{
    font-size: 0.68rem !important;
  }
}
/* =========================================================
   TRUE FINAL COLLECTION HEADER + FILTER ALIGNMENT
   Make title left and filter trigger right align to full grid width.
   ========================================================= */

.main-collection__header{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: clamp(1.25rem, 3vw, 2.5rem) !important;
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: clamp(1.6rem, 2.8vw, 2.35rem) !important;
}
.main-collection__header-copy{
  max-width: 42rem !important;
  min-width: 0 !important;
}
.main-collection__filter-toggle{
  justify-self: end !important;
  align-self: end !important;
}

@media screen and (max-width: 749px) {
.main-collection__header{
    grid-template-columns: 1fr !important;
    align-items: start !important;
    gap: 1rem !important;
    margin-bottom: 1.25rem !important;
  }
.main-collection__header-copy{
    max-width: 100% !important;
  }
.main-collection__filter-toggle{
    justify-self: stretch !important;
    width: 100% !important;
  }
}


@media screen {
.main-collection__filter-shell{
    z-index: 9999 !important;
  }
.main-collection__filter-shell.is-open,
.main-collection__filter-shell.is-closing{
    z-index: 9999 !important;
  }
.main-collection__filter-backdrop{
    z-index: 1 !important;
    background:
      radial-gradient(circle at 70% 0%, color-mix(in srgb, var(--color-surface, #ffffff) 52%, transparent), transparent 32rem),
      color-mix(in srgb, var(--color-ink, #3a2e2a) 34%, transparent) !important;
    backdrop-filter: blur(10px) saturate(1.06) !important;
    -webkit-backdrop-filter: blur(10px) saturate(1.06) !important;
  }
.main-collection__filter-panel{
    z-index: 2 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: min(31rem, 100vw) !important;
    max-width: 100vw !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-top-left-radius: var(--tb-radius-panel, 1.65rem) !important;
    border-bottom-left-radius: var(--tb-radius-panel, 1.65rem) !important;
    border-right: 0 !important;
    background:
      radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 24%, transparent), transparent 22rem),
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--color-surface, #ffffff) 99%, var(--color-secondary, #e7d5c8)),
        color-mix(in srgb, var(--color-surface, #ffffff) 95%, var(--color-secondary, #e7d5c8))
      ) !important;
    box-shadow:
      -1.4rem 0 4.5rem color-mix(in srgb, var(--color-ink, #3a2e2a) 18%, transparent),
      inset 1px 0 0 color-mix(in srgb, #ffffff 72%, transparent) !important;
    transform: translateX(104%) !important;
  }
.main-collection__filter-shell.is-open .main-collection__filter-panel{
    transform: translateX(0) !important;
  }
.main-collection__filter-head{
    min-height: 5.5rem !important;
    padding: 1.35rem 1.45rem 1rem !important;
    border-bottom-color: color-mix(in srgb, var(--color-border, #ead8cc) 62%, transparent) !important;
  }
.main-collection__filter-eyebrow{
    color: color-mix(in srgb, var(--color-primary, #a9826d) 76%, var(--color-ink, #3a2e2a)) !important;
  }
.main-collection__filter-title{
    font-size: clamp(1.75rem, 2.4vw, 2.25rem) !important;
    letter-spacing: -0.035em !important;
  }
.main-collection__filter-close{
    width: 3.15rem !important;
    height: 3.15rem !important;
    min-width: 3.15rem !important;
    border-color: color-mix(in srgb, var(--color-border, #ead8cc) 72%, transparent) !important;
    background: color-mix(in srgb, var(--color-surface, #ffffff) 94%, transparent) !important;
    color: var(--color-ink, #3a2e2a) !important;
    box-shadow:
      0 0.75rem 1.6rem color-mix(in srgb, var(--color-ink, #3a2e2a) 6%, transparent),
      inset 0 1px 0 color-mix(in srgb, #ffffff 86%, transparent) !important;
    font-size: 0 !important;
    line-height: 1 !important;
  }
.main-collection__filter-close::before,
.main-collection__filter-close::after{
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 1.35rem !important;
    height: 0.13rem !important;
    border-radius: 999px !important;
    background: currentColor !important;
    transform-origin: center !important;
  }
.main-collection__filter-close::before{
    transform: translate(-50%, -50%) rotate(45deg) !important;
  }
.main-collection__filter-close::after{
    transform: translate(-50%, -50%) rotate(-45deg) !important;
  }
.main-collection__filter-form{
    padding: 0.25rem 1.45rem 1.45rem !important;
  }
.main-collection__filter-group{
    border-bottom-color: color-mix(in srgb, var(--color-border, #ead8cc) 62%, transparent) !important;
  }
.main-collection__filter-actions{
    position: sticky !important;
    bottom: 0 !important;
    margin-top: auto !important;
    padding-top: 1rem !important;
    background:
      linear-gradient(
        180deg,
        transparent,
        color-mix(in srgb, var(--color-surface, #ffffff) 96%, var(--color-secondary, #e7d5c8)) 28%
      ) !important;
  }
body.themeblocks-collection-filter-open .site-header{
    z-index: 100 !important;
  }
}

@media screen and (max-width: 749px) {
.main-collection__filter-panel{
    top: auto !important;
    left: 0.75rem !important;
    right: 0.75rem !important;
    bottom: 0.75rem !important;
    width: auto !important;
    max-height: min(84vh, 44rem) !important;
    border-radius: var(--tb-radius-panel, 1.45rem) !important;
    border-right: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 78%, transparent) !important;
    transform: translateY(104%) !important;
  }
.main-collection__filter-shell.is-open .main-collection__filter-panel{
    transform: translateY(0) !important;
  }
.main-collection__filter-head{
    min-height: 5rem !important;
    padding: 1.15rem 1.15rem 0.9rem !important;
  }
.main-collection__filter-form{
    padding: 0.15rem 1.15rem 1.15rem !important;
  }
.main-collection__filter-close{
    width: 2.9rem !important;
    height: 2.9rem !important;
    min-width: 2.9rem !important;
  }
}
/* =========================================================
   FINAL COLLECTION FILTER CLOSE ICON FIX
   Keep the filter drawer close X centered inside its button.
   ========================================================= */

.main-collection__filter-close{
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  padding: 0 !important;
  overflow: hidden !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-size: 0 !important;
  line-height: 1 !important;
  text-indent: 0 !important;
}
.main-collection__filter-close::before,
.main-collection__filter-close::after{
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 1.25rem !important;
  height: 0.12rem !important;
  border-radius: 999px !important;
  background: currentColor !important;
  transform-origin: center !important;
}
.main-collection__filter-close::before{
  transform: translate(-50%, -50%) rotate(45deg) !important;
}
.main-collection__filter-close::after{
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}
.main-collection__filter-close:hover,
.main-collection__filter-close:focus-visible{
  color: var(--color-primary-dark, #876654) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 42%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 34%, var(--color-surface, #ffffff)) !important;
}
/* =========================================================
   FINAL FILTER DRAWER CLOSE + HEADER ICON REGRESSION FIX
   Keep close icon inside the button and restore header SVG icons.
   ========================================================= */

.main-collection__filter-close{
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  min-height: 3rem !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0 !important;
}
.main-collection__filter-close::before,
.main-collection__filter-close::after{
  display: none !important;
  content: none !important;
}
.main-collection__filter-close svg{
  display: block !important;
  width: 1.2rem !important;
  height: 1.2rem !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: currentColor !important;
  pointer-events: none !important;
}
.main-collection__filter-close svg path{
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.site-header__actions .site-header__search-toggle,
.site-header__actions .site-header__account,
.site-header__actions .site-header__wishlist,
.site-header__actions .site-header__cart{
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  color: var(--color-ink, #3a2e2a) !important;
}
.site-header__actions .site-header__search-toggle svg,
.site-header__actions .site-header__account svg,
.site-header__actions .site-header__wishlist svg,
.site-header__actions .site-header__cart svg{
  display: block !important;
  width: 1.2rem !important;
  height: 1.2rem !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: currentColor !important;
  overflow: visible !important;
}
.site-header__actions .site-header__search-toggle svg *,
.site-header__actions .site-header__account svg *,
.site-header__actions .site-header__wishlist svg *,
.site-header__actions .site-header__cart svg *{
  opacity: 1 !important;
  visibility: visible !important;
  stroke: currentColor !important;
}
.main-collection__filter-choice{
  cursor: pointer !important;
}
.main-collection__filter-choice input{
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.main-collection__filter-choice.is-active,
.main-collection__filter-choice:has(input:checked){
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 36%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 34%, var(--color-surface, #ffffff)) !important;
}
.main-collection__filter-choice.is-active .main-collection__filter-choice-mark,
.main-collection__filter-choice:has(input:checked) .main-collection__filter-choice-mark{
  border-color: var(--color-primary, #a9826d) !important;
  background: var(--color-primary, #a9826d) !important;
  box-shadow: inset 0 0 0 0.28rem var(--color-surface, #ffffff) !important;
}

@media screen and (max-width: 749px) {
.main-collection__filter-close{
    width: 2.9rem !important;
    height: 2.9rem !important;
    min-width: 2.9rem !important;
    min-height: 2.9rem !important;
  }
}
/* =========================================================
   TRUE FINAL FILTER CLOSE + HEADER ICON RESTORE
   Do not force filled SVG icons into outline mode.
   ========================================================= */

.main-collection__filter-close{
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  min-height: 3rem !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0 !important;
}
.main-collection__filter-close::before,
.main-collection__filter-close::after{
  display: none !important;
  content: none !important;
}
.main-collection__filter-close svg{
  position: absolute !important;
  inset: 50% auto auto 50% !important;
  display: block !important;
  width: 1.15rem !important;
  height: 1.15rem !important;
  transform: translate(-50%, -50%) !important;
  color: currentColor !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
}
.main-collection__filter-close svg path{
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.site-header__actions .site-header__search-toggle,
.site-header__actions .site-header__account,
.site-header__actions .site-header__wishlist,
.site-header__actions .site-header__cart{
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
}
.site-header__actions .site-header__search-toggle svg,
.site-header__actions .site-header__account svg,
.site-header__actions .site-header__wishlist svg,
.site-header__actions .site-header__cart svg{
  display: block !important;
  width: 1.2rem !important;
  height: 1.2rem !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: currentColor !important;
  overflow: visible !important;
}
.site-header__actions .site-header__search-toggle svg circle,
.site-header__actions .site-header__search-toggle svg path,
.site-header__actions .site-header__account svg path{
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.site-header__actions .site-header__wishlist svg path{
  fill: currentColor !important;
  stroke: none !important;
}
.site-header__actions .site-header__cart svg path,
.site-header__actions .site-header__cart svg circle,
.site-header__actions .site-header__cart svg rect{
  stroke: currentColor !important;
}
.main-collection__filter-choice{
  cursor: pointer !important;
}
.main-collection__filter-choice input[data-filter-url]{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.main-collection__filter-choice.is-active,
.main-collection__filter-choice:has(input:checked){
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 36%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 34%, var(--color-surface, #ffffff)) !important;
}
.main-collection__filter-choice.is-active .main-collection__filter-choice-mark,
.main-collection__filter-choice:has(input:checked) .main-collection__filter-choice-mark{
  border-color: var(--color-primary, #a9826d) !important;
  background: var(--color-primary, #a9826d) !important;
  box-shadow: inset 0 0 0 0.28rem var(--color-surface, #ffffff) !important;
}

@media screen and (max-width: 749px) {
.main-collection__filter-close{
    width: 2.9rem !important;
    height: 2.9rem !important;
    min-width: 2.9rem !important;
    min-height: 2.9rem !important;
  }
}
/* =========================================================
   CANONICAL HEADER ICON + COLLECTION FILTER AUTHORITY
   Final override after legacy stacked rules.
   ========================================================= */

.site-header__actions .site-header__icon,
.site-header__actions .site-header__search-toggle,
.site-header__actions .site-header__account,
.site-header__actions .site-header__wishlist,
.site-header__actions .site-header__cart{
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 3.2rem !important;
  height: 3.2rem !important;
  min-width: 3.2rem !important;
  min-height: 3.2rem !important;
  max-width: 3.2rem !important;
  max-height: 3.2rem !important;
  padding: 0 !important;
  border: 1px solid color-mix(in srgb, var(--color-blue, #0b5d8f) 36%, var(--color-border, #ead8cc)) !important;
  border-radius: var(--tb-radius-icon, 1rem) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 96%, transparent) !important;
  color: var(--color-blue, #0b5d8f) !important;
  box-shadow:
    0 0.7rem 1.6rem color-mix(in srgb, var(--color-blue, #0b5d8f) 8%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 82%, transparent) !important;
  text-decoration: none !important;
  transform: none !important;
}
.site-header__actions .site-header__search-toggle svg,
.site-header__actions .site-header__account svg,
.site-header__actions .site-header__wishlist svg,
.site-header__actions .site-header__cart svg{
  display: block !important;
  width: 1.2rem !important;
  height: 1.2rem !important;
  min-width: 1.2rem !important;
  min-height: 1.2rem !important;
  overflow: visible !important;
  color: currentColor !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.site-header__actions .site-header__search-toggle svg circle,
.site-header__actions .site-header__search-toggle svg path,
.site-header__actions .site-header__account svg path{
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.site-header__actions .site-header__wishlist svg path{
  fill: currentColor !important;
  stroke: none !important;
}
.site-header__actions .site-header__cart svg path,
.site-header__actions .site-header__cart svg circle,
.site-header__actions .site-header__cart svg rect{
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.main-collection__filter-choice{
  text-decoration: none !important;
  cursor: pointer !important;
}
.main-collection__filter-choice.is-disabled{
  pointer-events: none !important;
}
.main-collection__filter-choice.is-active,
.main-collection__filter-choice[aria-current="true"]{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 36%, var(--color-border, #ead8cc)) !important;
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 34%, var(--color-surface, #ffffff)) !important;
}
.main-collection__filter-choice.is-active .main-collection__filter-choice-mark,
.main-collection__filter-choice[aria-current="true"] .main-collection__filter-choice-mark{
  border-color: var(--color-primary, #a9826d) !important;
  background: var(--color-primary, #a9826d) !important;
  box-shadow: inset 0 0 0 0.28rem var(--color-surface, #ffffff) !important;
}


/* =========================================================
   TRUE FINAL HEADER ICON COLOR AUTHORITY
   Keep light icons only on transparent homepage hero.
   Restore dark icons on normal/sticky headers.
   ========================================================= */

body:not(.template-index) .site-header.site-header--icons-light .site-header__actions,
body:not(.template-index) .site-header.site-header--icons-light .site-header__actions svg,
body:not(.template-index) .site-header.site-header--icons-light .site-header__actions svg *,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__actions,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__actions svg,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__actions svg *{
  color: var(--color-ink, #3a2e2a) !important;
  stroke: currentColor !important;
}
body:not(.template-index) .site-header.site-header--icons-light .site-header__wishlist svg path,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__wishlist svg path{
  fill: currentColor !important;
  stroke: none !important;
}
body:not(.template-index) .site-header.site-header--icons-light .site-header__search-toggle svg circle,
body:not(.template-index) .site-header.site-header--icons-light .site-header__search-toggle svg path,
body:not(.template-index) .site-header.site-header--icons-light .site-header__account svg path,
body:not(.template-index) .site-header.site-header--icons-light .site-header__cart svg path,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__search-toggle svg circle,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__search-toggle svg path,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__account svg path,
body.template-index .site-header.site-header--icons-light.is-scrolled .site-header__cart svg path{
  fill: none !important;
  stroke: currentColor !important;
}


@media screen and (min-width: 750px) {
html body .site-header.site-header--layout-center_logo .site-header__inner,
html body.template-index .site-header.site-header--layout-center_logo .site-header__inner,
html body:not(.template-index) .site-header.site-header--layout-center_logo .site-header__inner{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--tb-logo-width, 150px) minmax(0, 1fr) !important;
    align-items: center !important;
    width: min(calc(100vw - 4rem), var(--page-width, 1440px)) !important;
    max-width: var(--page-width, 1440px) !important;
    min-height: 5.05rem !important;
    margin-inline: auto !important;
    padding: 0 !important;
    gap: clamp(1rem, 2vw, 2rem) !important;
  }
html body .site-header.site-header--layout-center_logo .site-header__nav,
html body.template-index .site-header.site-header--layout-center_logo .site-header__nav,
html body:not(.template-index) .site-header.site-header--layout-center_logo .site-header__nav{
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    z-index: 4 !important;
  }
html body .site-header.site-header--layout-center_logo .site-header__logo,
html body .site-header.site-header--layout-center_logo .site-header__logo-link,
html body.template-index .site-header.site-header--layout-center_logo .site-header__logo,
html body.template-index .site-header.site-header--layout-center_logo .site-header__logo-link,
html body:not(.template-index) .site-header.site-header--layout-center_logo .site-header__logo,
html body:not(.template-index) .site-header.site-header--layout-center_logo .site-header__logo-link{
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--tb-logo-width, 150px) !important;
    max-width: var(--tb-logo-width, 150px) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    position: static !important;
    inset: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 5 !important;
  }
html body .site-header.site-header--layout-center_logo .site-header__logo-image,
html body.template-index .site-header.site-header--layout-center_logo .site-header__logo-image,
html body:not(.template-index) .site-header.site-header--layout-center_logo .site-header__logo-image{
    display: block !important;
    width: var(--tb-logo-width, 150px) !important;
    max-width: var(--tb-logo-width, 150px) !important;
    height: auto !important;
    max-height: 3.25rem !important;
    object-fit: contain !important;
  }
html body .site-header.site-header--layout-center_logo .site-header__actions,
html body.template-index .site-header.site-header--layout-center_logo .site-header__actions,
html body:not(.template-index) .site-header.site-header--layout-center_logo .site-header__actions{
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    gap: 0.65rem !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    z-index: 6 !important;
  }
html body .site-header.site-header--layout-center_logo.site-header--icons-light:not(.site-header--transparent-hero) .site-header__actions,
html body .site-header.site-header--layout-center_logo.site-header--icons-light:not(.site-header--transparent-hero) .site-header__actions svg,
html body .site-header.site-header--layout-center_logo.site-header--icons-light:not(.site-header--transparent-hero) .site-header__actions svg *,
html body.template-index .site-header.site-header--layout-center_logo.site-header--icons-light.is-scrolled .site-header__actions,
html body.template-index .site-header.site-header--layout-center_logo.site-header--icons-light.is-scrolled .site-header__actions svg,
html body.template-index .site-header.site-header--layout-center_logo.site-header--icons-light.is-scrolled .site-header__actions svg *{
    color: var(--color-ink, #3a2e2a) !important;
    stroke: currentColor !important;
  }
}

@media screen and (min-width: 750px) {
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    justify-self: end !important;
    gap: 0.9rem !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
    isolation: isolate !important;
  }
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__icon,
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__search-toggle,
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__account,
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__wishlist,
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__cart{
    position: relative !important;
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 3.2rem !important;
    width: 3.2rem !important;
    height: 3.2rem !important;
    min-width: 3.2rem !important;
    min-height: 3.2rem !important;
    max-width: 3.2rem !important;
    max-height: 3.2rem !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    transform: none !important;
    z-index: 1 !important;
  }
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__cart{
    z-index: 3 !important;
  }
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions svg,
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__cart > svg,
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions .icon-cart{
    display: block !important;
    width: 1.14rem !important;
    height: 1.14rem !important;
    min-width: 1.14rem !important;
    min-height: 1.14rem !important;
    max-width: 1.14rem !important;
    max-height: 1.14rem !important;
    margin: 0 !important;
    overflow: visible !important;
    color: currentColor !important;
    transform: none !important;
  }
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__cart-count,
html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__wishlist-count,
html body.template-index .site-header:not(.site-header--transparent-hero) [data-wishlist-count]{
    top: -0.36rem !important;
    right: -0.28rem !important;
    width: 1.2rem !important;
    height: 1.2rem !important;
    min-width: 1.2rem !important;
    min-height: 1.2rem !important;
    max-width: 1.2rem !important;
    max-height: 1.2rem !important;
    transform: none !important;
    z-index: 8 !important;
  }
}
/* =========================================================
   TRUE FINAL HOME STATIC/STICKY HEADER ACTION ORDER + SPACING
   Fix icon overlap for Default static and Sticky header styles only.
   Transparent hero header remains untouched.
   ========================================================= */

@media screen and (min-width: 750px){
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    justify-self: end !important;
    gap: 1.15rem !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
  }

  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__search-toggle {
    order: 1 !important;
  }

  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__account {
    order: 2 !important;
  }

  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__wishlist {
    order: 3 !important;
  }

  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__cart {
    order: 4 !important;
  }

  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__icon,
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__search-toggle,
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__account,
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__wishlist,
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__cart {
    position: relative !important;
    inset: auto !important;
    display: grid !important;
    place-items: center !important;
    flex: 0 0 3.15rem !important;
    width: 3.15rem !important;
    height: 3.15rem !important;
    min-width: 3.15rem !important;
    min-height: 3.15rem !important;
    max-width: 3.15rem !important;
    max-height: 3.15rem !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    transform: none !important;
  }

  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions svg,
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions > .site-header__cart > svg,
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__actions .icon-cart {
    width: 1.08rem !important;
    height: 1.08rem !important;
    min-width: 1.08rem !important;
    min-height: 1.08rem !important;
    max-width: 1.08rem !important;
    max-height: 1.08rem !important;
    margin: 0 !important;
    transform: none !important;
  }

  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__cart-count,
  html body.template-index .site-header:not(.site-header--transparent-hero) .site-header__wishlist-count,
  html body.template-index .site-header:not(.site-header--transparent-hero) [data-wishlist-count] {
    top: -0.34rem !important;
    right: -0.2rem !important;
    width: 1.12rem !important;
    height: 1.12rem !important;
    min-width: 1.12rem !important;
    min-height: 1.12rem !important;
    max-width: 1.12rem !important;
    max-height: 1.12rem !important;
    border-width: 2px !important;
    font-size: 0.58rem !important;
    line-height: 1 !important;
    transform: none !important;
    z-index: 10 !important;
  }
}


/* =========================================================
   FINAL HEADER AUTHORITY: static center-logo menu visibility
   Ensures static header center-logo layout shows:
   menu left, logo center, icons right.
   ========================================================= */
@media screen and (min-width: 750px) {
  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__inner,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--tb-logo-width, 150px) minmax(0, 1fr) !important;
    align-items: center !important;
    width: min(calc(100vw - 4rem), var(--page-width, 1440px)) !important;
    max-width: var(--page-width, 1440px) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    gap: clamp(1rem, 2vw, 2rem) !important;
  }

  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__nav,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__nav {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: clamp(1rem, 2vw, 1.65rem) !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 10 !important;
  }

  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__nav-item,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__nav-item,
  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__nav-link,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__nav-link,
  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__nav-link span,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__nav-link span {
    display: inline-flex !important;
    align-items: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    color: var(--color-ink, #3b2a2d) !important;
  }

  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__logo,
  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__logo-link,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__logo,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__logo-link {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 9 !important;
  }

  html body .site-header.site-header--static.site-header--layout-center_logo .site-header__actions,
  html body.template-index .site-header.site-header--static.site-header--layout-center_logo .site-header__actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    z-index: 10 !important;
  }
}

/* =========================================================
   FINAL HEADER AUTHORITY: static default layout
   Logo left, menu center, icons right.
   ========================================================= */
@media screen and (min-width: 750px) {
  html body .site-header.site-header--static.site-header--layout-default .site-header__inner,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__inner {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: min(calc(100vw - 4rem), var(--page-width, 1440px)) !important;
    max-width: var(--page-width, 1440px) !important;
    min-height: 5.125rem !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    gap: clamp(1.25rem, 3vw, 3rem) !important;
  }

  html body .site-header.site-header--static.site-header--layout-default .site-header__logo,
  html body .site-header.site-header--static.site-header--layout-default .site-header__logo-link,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__logo,
  html body.template-index .site-header.site-header--layout-default .site-header__logo-link {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    transform: none !important;
    z-index: 10 !important;
  }

  html body .site-header.site-header--static.site-header--layout-default .site-header__nav,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__nav {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(1rem, 2vw, 1.65rem) !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    transform: none !important;
    z-index: 10 !important;
  }

  html body .site-header.site-header--static.site-header--layout-default .site-header__actions,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.85rem !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    transform: none !important;
    z-index: 11 !important;
  }

  html body .site-header.site-header--static.site-header--layout-default .site-header__icon,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__icon,
  html body .site-header.site-header--static.site-header--layout-default .site-header__cart,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__cart,
  html body .site-header.site-header--static.site-header--layout-default .site-header__wishlist,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__wishlist {
    color: var(--color-ink, #3b2a2d) !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body .site-header.site-header--static.site-header--layout-default .site-header__icon svg,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__icon svg,
  html body .site-header.site-header--static.site-header--layout-default .site-header__icon svg *,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__icon svg *,
  html body .site-header.site-header--static.site-header--layout-default .site-header__cart svg,
  html body.template-index .site-header.site-header--layout-default .site-header__cart svg,
  html body .site-header.site-header--static.site-header--layout-default .site-header__cart svg *,
  html body.template-index .site-header.site-header--layout-default .site-header__cart svg * {
    color: currentColor !important;
    stroke: currentColor !important;
    opacity: 1 !important;
  }

  html body .site-header.site-header--static.site-header--layout-default .site-header__wishlist svg path,
  html body.template-index .site-header.site-header--static.site-header--layout-default .site-header__wishlist svg path {
    fill: currentColor !important;
    stroke: currentColor !important;
  }
}

/* =========================================================
   CANONICAL HEADER REFACTOR AUTHORITY
   Final simplified contract:
   - Sticky header
   - Transparent hero header
   - Desktop: logo left, menu center, icons right
   - Mobile: logo left, icons/menu right
   ========================================================= */

:root {
  --tb-header-height: 82px;
  --tb-header-mobile-height: 72px;
}

html body .site-header {
  --tb-active-logo-width: var(--tb-logo-width, 150px);
  position: fixed !important;
  inset-block-start: 0 !important;
  inset-inline: 0 !important;
  z-index: 80 !important;
  width: 100% !important;
  min-height: var(--tb-header-height) !important;
  color: var(--color-ink, #3b2a2d) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 14px 34px rgba(62, 40, 45, 0.06) !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) {
  color: var(--color-ink, #3b2a2d) !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
}

html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled,
html body .site-header.site-header--sticky,
html body:not(.template-index) .site-header.site-header--transparent_hero {
  color: var(--color-ink, #3b2a2d) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
  box-shadow: 0 14px 34px rgba(62, 40, 45, 0.06) !important;
}

html body .site-header ~ #MainContent {
  padding-top: var(--tb-header-height) !important;
}

html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero ~ #MainContent {
  padding-top: 0 !important;
}

@media screen and (min-width: 750px) {
  html body .site-header .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(120px, auto) minmax(0, 1fr) minmax(120px, auto) !important;
    align-items: center !important;
    width: min(calc(100vw - 4rem), var(--page-width, 1440px)) !important;
    max-width: var(--page-width, 1440px) !important;
    min-height: var(--tb-header-height) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    gap: clamp(1.25rem, 3vw, 3rem) !important;
    position: relative !important;
  }

  html body .site-header .site-header__logo,
  html body .site-header .site-header__logo-link {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: var(--tb-logo-width, 150px) !important;
    max-width: var(--tb-logo-width, 150px) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 10 !important;
  }

  html body .site-header .site-header__logo-image {
    display: block !important;
    width: var(--tb-logo-width, 150px) !important;
    max-width: var(--tb-logo-width, 150px) !important;
    height: auto !important;
    max-height: 3.25rem !important;
    object-fit: contain !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body .site-header .site-header__nav {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(1rem, 2vw, 1.65rem) !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 10 !important;
  }

  html body .site-header .site-header__nav-item,
  html body .site-header .site-header__nav-link,
  html body .site-header .site-header__nav-link span {
    display: inline-flex !important;
    align-items: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: currentColor !important;
    pointer-events: auto !important;
  }

  html body .site-header .site-header__actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 0.85rem !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 11 !important;
  }

  html body .site-header .site-header__icon,
  html body .site-header .site-header__cart,
  html body .site-header .site-header__wishlist,
  html body .site-header .site-header__account,
  html body .site-header .site-header__search-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: currentColor !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html body .site-header .site-header__icon svg,
  html body .site-header .site-header__cart svg,
  html body .site-header .site-header__wishlist svg,
  html body .site-header .site-header__account svg,
  html body .site-header .site-header__search-toggle svg,
  html body .site-header .site-header__icon svg *,
  html body .site-header .site-header__cart svg *,
  html body .site-header .site-header__account svg *,
  html body .site-header .site-header__search-toggle svg * {
    color: currentColor !important;
    stroke: currentColor !important;
    opacity: 1 !important;
  }

  html body .site-header .site-header__wishlist svg path {
    fill: currentColor !important;
    stroke: currentColor !important;
  }
}

@media screen and (max-width: 749px) {
  :root {
    --tb-header-height: var(--tb-header-mobile-height);
  }
}

/* =========================================================
   TRUE FINAL HEADER: transparent hero layout restore
   Logo left, menu center, icons right in both top and scrolled states.
   ========================================================= */
@media screen and (min-width: 750px) {
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero .site-header__inner,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__inner,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(120px, auto) minmax(0, 1fr) minmax(120px, auto) !important;
    align-items: center !important;
    width: min(calc(100vw - 4rem), var(--page-width, 1440px)) !important;
    max-width: var(--page-width, 1440px) !important;
    min-height: var(--tb-header-height, 82px) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    gap: clamp(1.25rem, 3vw, 3rem) !important;
  }

  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero .site-header__logo,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero .site-header__logo-link,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero .site-header__logo-image,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__logo,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__logo-link,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__logo-image,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__logo,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__logo-link,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__logo-image {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    display: inline-flex !important;
    width: var(--tb-logo-width, 150px) !important;
    max-width: var(--tb-logo-width, 150px) !important;
    height: auto !important;
    max-height: 3.25rem !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 12 !important;
  }

  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero .site-header__nav,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__nav {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 11 !important;
  }

  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero .site-header__actions,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__actions,
  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 12 !important;
  }

  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) {
    background: transparent !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
  }

  html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero.is-scrolled {
    background: rgba(255, 255, 255, 0.96) !important;
    border-bottom: 1px solid rgba(18, 57, 93, 0.075) !important;
    box-shadow: 0 14px 34px rgba(62, 40, 45, 0.06) !important;
  }
}

/* =========================================================
   TRUE FINAL HEADER: logo position option
   Left: logo left, menu center, icons right.
   Center: menu left, logo center, icons right.
   Applies to sticky and transparent hero headers.
   ========================================================= */
@media screen and (min-width: 750px) {
  html body .site-header.site-header--logo-left .site-header__inner,
  html body.template-index .site-header.site-header--logo-left.site-header--transparent_hero.site-header--transparent-hero .site-header__inner,
  html body.template-index .site-header.site-header--logo-left.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__inner,
  html body.template-index .site-header.site-header--logo-left.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(120px, auto) minmax(0, 1fr) minmax(120px, auto) !important;
    align-items: center !important;
  }

  html body .site-header.site-header--logo-left .site-header__logo,
  html body .site-header.site-header--logo-left .site-header__logo-link,
  html body.template-index .site-header.site-header--logo-left.site-header--transparent_hero.site-header--transparent-hero .site-header__logo,
  html body.template-index .site-header.site-header--logo-left.site-header--transparent_hero.site-header--transparent-hero .site-header__logo-link {
    grid-column: 1 !important;
    justify-self: start !important;
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body .site-header.site-header--logo-left .site-header__nav,
  html body.template-index .site-header.site-header--logo-left.site-header--transparent_hero.site-header--transparent-hero .site-header__nav {
    grid-column: 2 !important;
    justify-self: center !important;
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body .site-header.site-header--logo-left .site-header__actions,
  html body.template-index .site-header.site-header--logo-left.site-header--transparent_hero.site-header--transparent-hero .site-header__actions {
    grid-column: 3 !important;
    justify-self: end !important;
    display: inline-flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body .site-header.site-header--logo-center .site-header__inner,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero .site-header__inner,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__inner,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--tb-logo-width, 150px) minmax(0, 1fr) !important;
    align-items: center !important;
    width: min(calc(100vw - 4rem), var(--page-width, 1440px)) !important;
    max-width: var(--page-width, 1440px) !important;
    margin-inline: auto !important;
    padding-inline: 0 !important;
    gap: clamp(1rem, 2vw, 2rem) !important;
  }

  html body .site-header.site-header--logo-center .site-header__nav,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero .site-header__nav,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__nav {
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: start !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 12 !important;
  }

  html body .site-header.site-header--logo-center .site-header__logo,
  html body .site-header.site-header--logo-center .site-header__logo-link,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero .site-header__logo,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero .site-header__logo-link,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__logo,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__logo-link,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__logo,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__logo-link {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--tb-logo-width, 150px) !important;
    max-width: var(--tb-logo-width, 150px) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 13 !important;
  }

  html body .site-header.site-header--logo-center .site-header__logo-image,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero .site-header__logo-image {
    display: block !important;
    width: var(--tb-logo-width, 150px) !important;
    max-width: var(--tb-logo-width, 150px) !important;
    height: auto !important;
    max-height: 3.25rem !important;
    object-fit: contain !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html body .site-header.site-header--logo-center .site-header__actions,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero .site-header__actions,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__actions,
  html body.template-index .site-header.site-header--logo-center.site-header--transparent_hero.site-header--transparent-hero.is-scrolled .site-header__actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    z-index: 14 !important;
  }
}

/* =========================================================
   TRUE FINAL COLLECTION FILTER CHEVRON
   Replace cheap text arrow with premium SVG control.
   ========================================================= */
.main-collection__filter-summary {
  cursor: pointer !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

.main-collection__filter-summary-icon {
  width: 2.35rem !important;
  height: 2.35rem !important;
  min-width: 2.35rem !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #c78b9a !important;
  background: rgba(255, 246, 247, 0.92) !important;
  border: 1px solid rgba(211, 147, 160, 0.28) !important;
  box-shadow: 0 10px 24px rgba(118, 71, 81, 0.08) !important;
  transition:
    transform 220ms cubic-bezier(0.19, 1, 0.22, 1),
    background-color 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

.main-collection__filter-summary-icon svg {
  width: 1rem !important;
  height: 1rem !important;
  display: block !important;
  color: currentColor !important;
  pointer-events: none !important;
}

.main-collection__filter-summary-icon svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.85 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.main-collection__filter-group[open] .main-collection__filter-summary-icon {
  transform: rotate(180deg) !important;
  background: rgba(255, 239, 242, 0.98) !important;
  border-color: rgba(199, 139, 154, 0.42) !important;
  box-shadow: 0 12px 28px rgba(118, 71, 81, 0.12) !important;
}

.main-collection__filter-summary:hover .main-collection__filter-summary-icon,
.main-collection__filter-summary:focus-visible .main-collection__filter-summary-icon {
  background: rgba(255, 239, 242, 1) !important;
  border-color: rgba(199, 139, 154, 0.5) !important;
  box-shadow: 0 14px 30px rgba(118, 71, 81, 0.14) !important;
}

.main-collection__filter-summary:focus,
.main-collection__filter-summary:focus-visible,
.main-collection__filter-summary-icon:focus,
.main-collection__filter-summary-icon:focus-visible {
  outline: none !important;
}

.main-collection__filter-summary:focus-visible .main-collection__filter-summary-icon {
  outline: 2px solid rgba(199, 139, 154, 0.38) !important;
  outline-offset: 3px !important;
}

/* =========================================================
   TRUE FINAL HEADER: transparent menu color authority
   Premium readable nav colors for transparent hero mode.
   ========================================================= */
:root {
  --tb-transparent-header-nav-color: #3b2a2d;
  --tb-transparent-header-nav-hover-color: #b98c64;
  --tb-solid-header-nav-color: #3b2a2d;
  --tb-solid-header-nav-hover-color: #b98c64;
}

html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link,
html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link span,
html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-caret {
  color: var(--tb-transparent-header-nav-color) !important;
  stroke: var(--tb-transparent-header-nav-color) !important;
  opacity: 1 !important;
}

html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link:hover,
html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link:focus-visible,
html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link:hover span,
html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link:focus-visible span {
  color: var(--tb-transparent-header-nav-hover-color) !important;
}

html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link:hover .site-header__nav-caret,
html body.template-index .site-header.site-header--transparent_hero.site-header--transparent-hero:not(.is-scrolled) .site-header__nav-link:focus-visible .site-header__nav-caret {
  color: var(--tb-transparent-header-nav-hover-color) !important;
  stroke: var(--tb-transparent-header-nav-hover-color) !important;
}

html body .site-header.is-scrolled .site-header__nav-link,
html body .site-header.is-scrolled .site-header__nav-link span,
html body:not(.template-index) .site-header .site-header__nav-link,
html body:not(.template-index) .site-header .site-header__nav-link span {
  color: var(--tb-solid-header-nav-color) !important;
}

html body .site-header.is-scrolled .site-header__nav-link:hover,
html body .site-header.is-scrolled .site-header__nav-link:focus-visible,
html body .site-header.is-scrolled .site-header__nav-link:hover span,
html body .site-header.is-scrolled .site-header__nav-link:focus-visible span,
html body:not(.template-index) .site-header .site-header__nav-link:hover,
html body:not(.template-index) .site-header .site-header__nav-link:focus-visible,
html body:not(.template-index) .site-header .site-header__nav-link:hover span,
html body:not(.template-index) .site-header .site-header__nav-link:focus-visible span {
  color: var(--tb-solid-header-nav-hover-color) !important;
}


/* =========================================================
   TRUE FINAL EDITORIAL IMAGE RADIUS AUTHORITY
   Applies global rounded/square theme logic to skincare guide
   and skin goals media cards.
   ========================================================= */

.skincare-guide__media,
.skin-goals__media {
  display: block !important;
  overflow: hidden !important;
  border-radius: var(--tb-radius-media, var(--radius-media, 1.25rem)) !important;
  isolation: isolate !important;
}

.skincare-guide__image,
.skin-goals__image {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: inherit !important;
  transform: translateZ(0) !important;
}

.skincare-guide__card,
.skin-goals__card {
  overflow: visible !important;
}



/* =========================================================
   TRUE FINAL SKINCARE SETS MEDIA AUTHORITY
   Keep card rounded, keep image/content seam straight,
   and show the full set image without cropping.
   ========================================================= */

.skincare-sets__card {
  overflow: hidden !important;
  border-radius: var(--tb-radius-card, var(--radius-card, 1.35rem)) !important;
}

.skincare-sets__media {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  aspect-ratio: 1.55 / 1 !important;
  border-radius: var(--tb-radius-card, var(--radius-card, 1.35rem)) var(--tb-radius-card, var(--radius-card, 1.35rem)) 0 0 !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 88%, var(--color-bg, #fbf4ec)) !important;
}

.skincare-sets__image,
.skincare-sets__placeholder {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 0 !important;
}

.skincare-sets__content {
  border-radius: 0 !important;
}

/* =========================================================
   CAREVIELLE HEADER GLASS BLUR TOGGLE
   Controlled by Header setting: Enable glass blur header.
   Scoped visual layer only. Does not alter layout/icon order.
   ========================================================= */

html body .site-header.site-header--glass-blur {
  background: rgba(255, 255, 255, 0.72) !important;
  border-bottom-color: rgba(255, 255, 255, 0.36) !important;
  box-shadow:
    0 18px 46px rgba(62, 40, 45, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.62) !important;
  backdrop-filter: blur(22px) saturate(1.24) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.24) !important;
}

html body.template-index .site-header.site-header--glass-blur.site-header--transparent-hero:not(.is-scrolled) {
  background: rgba(255, 255, 255, 0.18) !important;
  border-bottom-color: rgba(255, 255, 255, 0.18) !important;
  box-shadow:
    0 18px 46px rgba(62, 40, 45, 0.055),
    inset 0 1px 0 rgba(255, 255, 255, 0.32) !important;
  backdrop-filter: blur(18px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.18) !important;
}

html body.template-index .site-header.site-header--glass-blur.site-header--transparent-hero.is-scrolled,
html body:not(.template-index) .site-header.site-header--glass-blur,
html body .site-header.site-header--glass-blur.site-header--sticky {
  background: rgba(255, 255, 255, 0.76) !important;
  border-bottom-color: rgba(255, 255, 255, 0.42) !important;
  box-shadow:
    0 18px 46px rgba(62, 40, 45, 0.085),
    inset 0 1px 0 rgba(255, 255, 255, 0.68) !important;
  backdrop-filter: blur(22px) saturate(1.24) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.24) !important;
}

/* Fallback: browsers without backdrop-filter get a clean translucent header. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html body .site-header.site-header--glass-blur {
    background: rgba(255, 255, 255, 0.94) !important;
  }

  html body.template-index .site-header.site-header--glass-blur.site-header--transparent-hero:not(.is-scrolled) {
    background: rgba(255, 255, 255, 0.82) !important;
  }
}

/* =========================================================
   CAREVIELLE HEADER OPACITY + HERO CONTENT PLACEMENT
   Safe final override.
   ========================================================= */

/* Header glass opacity control */
html body .site-header.site-header--glass-blur {
  background: rgba(255, 255, 255, var(--tb-header-glass-opacity, 0.72)) !important;
}

html body.template-index .site-header.site-header--glass-blur.site-header--transparent-hero:not(.is-scrolled) {
  background: rgba(255, 255, 255, calc(var(--tb-header-glass-opacity, 0.72) * 0.34)) !important;
}

html body.template-index .site-header.site-header--glass-blur.site-header--transparent-hero.is-scrolled,
html body:not(.template-index) .site-header.site-header--glass-blur,
html body .site-header.site-header--glass-blur.site-header--sticky {
  background: rgba(255, 255, 255, var(--tb-header-glass-opacity, 0.72)) !important;
}

/* Hero content placement controls */
[class*="hero"].content-left {
  --tb-hero-content-justify: flex-start;
  --tb-hero-content-margin-left: 0;
  --tb-hero-content-margin-right: auto;
}

[class*="hero"].content-center {
  --tb-hero-content-justify: center;
  --tb-hero-content-margin-left: auto;
  --tb-hero-content-margin-right: auto;
}

[class*="hero"].content-right {
  --tb-hero-content-justify: flex-end;
  --tb-hero-content-margin-left: auto;
  --tb-hero-content-margin-right: 0;
}

[class*="hero"].content-top {
  --tb-hero-content-align: flex-start;
}

[class*="hero"].content-middle {
  --tb-hero-content-align: center;
}

[class*="hero"].content-bottom {
  --tb-hero-content-align: flex-end;
}

[class*="hero"].text-left {
  --tb-hero-content-text-align: left;
}

[class*="hero"].text-center {
  --tb-hero-content-text-align: center;
}

[class*="hero"].text-right {
  --tb-hero-content-text-align: right;
}

/* Apply placement to common hero layout/content wrappers without changing section structure */
[class*="hero"].content-left,
[class*="hero"].content-center,
[class*="hero"].content-right {
  display: flex !important;
  justify-content: var(--tb-hero-content-justify, flex-start) !important;
  align-items: var(--tb-hero-content-align, center) !important;
}

[class*="hero"].content-left [class*="content"],
[class*="hero"].content-center [class*="content"],
[class*="hero"].content-right [class*="content"] {
  margin-left: var(--tb-hero-content-margin-left, 0) !important;
  margin-right: var(--tb-hero-content-margin-right, auto) !important;
  text-align: var(--tb-hero-content-text-align, left) !important;
}

[class*="hero"].text-left [class*="content"],
[class*="hero"].text-center [class*="content"],
[class*="hero"].text-right [class*="content"],
[class*="hero"].text-left h1,
[class*="hero"].text-center h1,
[class*="hero"].text-right h1,
[class*="hero"].text-left h2,
[class*="hero"].text-center h2,
[class*="hero"].text-right h2,
[class*="hero"].text-left p,
[class*="hero"].text-center p,
[class*="hero"].text-right p {
  text-align: var(--tb-hero-content-text-align, left) !important;
}

[class*="hero"].text-center a,
[class*="hero"].text-center button {
  margin-left: auto !important;
  margin-right: auto !important;
}

[class*="hero"].text-right a,
[class*="hero"].text-right button {
  margin-left: auto !important;
  margin-right: 0 !important;
}

@media screen and (max-width: 749px) {
  [class*="hero"].content-left,
  [class*="hero"].content-center,
  [class*="hero"].content-right {
    justify-content: center !important;
  }
}


/* =========================================================
   CAREVIELLE SKINCARE SETS IMAGE FILL
   Make set card images fill the media frame with no inner whitespace.
   ========================================================= */

.skincare-sets__media {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1.42 / 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 1.15rem !important;
  background: transparent !important;
}

.skincare-sets__image,
.skincare-sets__placeholder {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: inherit !important;
}


/* =========================================================
   CAREVIELLE SKINCARE SETS IMAGE CROP REFINEMENT
   Crop source-image whitespace by zooming image inside media frame.
   ========================================================= */

.skincare-sets__media {
  overflow: hidden !important;
  background: transparent !important;
}

.skincare-sets__image,
.skincare-sets__placeholder {
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1.14) !important;
  transform-origin: center center !important;
  transition: transform 320ms ease !important;
}

.skincare-sets__card:hover .skincare-sets__image {
  transform: scale(1.18) !important;
}
/* =========================================================
   CAREVIELLE SKINCARE SETS IMAGE SQUARE BOTTOM
   Make only the image/media bottom corners square.
   ========================================================= */

.skincare-sets__media {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.skincare-sets__image,
.skincare-sets__placeholder {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* =========================================================
   CAREVIELLE BESTSELLERS MEDIA AUTHORITY
   Single source of truth after removing competing media/image rules.
   ========================================================= */

.bestsellers .bestseller-card__media {
  width: 100% !important;
  aspect-ratio: 1 / 1.08 !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 1.35rem !important;
}

.bestsellers .bestseller-card__media > img.bestseller-card__image {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: scale(1.6) !important;
  transform-origin: center center !important;
}

.bestsellers .bestseller-card:hover .bestseller-card__media > img.bestseller-card__image {
  transform: scale(1.65) !important;
}

@media screen and (max-width: 749px) {
  .bestsellers .bestseller-card__media {
    aspect-ratio: 1 / 1.05 !important;
  }

  .bestsellers .bestseller-card__media > img.bestseller-card__image {
    transform: scale(1.45) !important;
  }
}

/* =========================================================
   CAREVIELLE BESTSELLERS FRESH MEDIA TARGET
   Uses cb-* classes added directly in snippets/bestseller-card.liquid.
   ========================================================= */

.bestsellers .cb-bestseller-media {
  width: 100% !important;
  aspect-ratio: 1 / 1.08 !important;
  display: grid !important;
  place-items: center !important;
  padding: clamp(0.75rem, 1.15vw, 1.1rem) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  border-radius: 1.35rem !important;
  background:
    radial-gradient(circle at 50% 18%, color-mix(in srgb, var(--color-surface, #ffffff) 94%, transparent), transparent 58%),
    linear-gradient(180deg, var(--color-surface, #ffffff), var(--color-soft-surface, #f4e7de)) !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #e5d4c8) 76%, transparent) !important;
  box-shadow:
    inset 0 1px 0 color-mix(in srgb, var(--color-surface, #ffffff) 90%, transparent),
    0 1rem 2.4rem color-mix(in srgb, var(--color-ink, #3a2e2a) 7%, transparent) !important;
}

.bestsellers .cb-bestseller-media {
  position: relative !important;
}

.bestsellers .cb-bestseller-media::before {
  content: "" !important;
  grid-area: 1 / 1 !important;
  width: clamp(3rem, 18%, 4.75rem) !important;
  aspect-ratio: 1 !important;
  border-radius: 999px !important;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--color-accent, #c8a15a) 18%, transparent) 0 34%, transparent 36%),
    conic-gradient(
      from 0deg,
      transparent 0deg,
      color-mix(in srgb, var(--color-primary, #a9826d) 36%, transparent) 92deg,
      transparent 188deg,
      color-mix(in srgb, var(--color-accent, #c8a15a) 28%, transparent) 262deg,
      transparent 360deg
    ) !important;
  opacity: 0 !important;
  transform: scale(0.86) !important;
  transition:
    opacity 180ms ease,
    transform 180ms ease !important;
  animation: cbBestsellerImageLoader 900ms linear infinite !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.bestsellers .cb-bestseller-image {
  grid-area: 1 / 1 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1.03) !important;
  transform-origin: center center !important;
  transition:
    opacity 260ms ease,
    transform 260ms ease !important;
  position: relative !important;
  z-index: 1 !important;
}

.bestsellers .cb-bestseller-image--secondary {
  opacity: 0 !important;
  pointer-events: none !important;
}

.bestsellers .bestseller-card:hover .cb-bestseller-media--has-secondary::before {
  opacity: 1 !important;
  transform: scale(1) !important;
}

.bestsellers .bestseller-card:hover .cb-bestseller-media--has-secondary .cb-bestseller-image--primary {
  opacity: 0 !important;
  transform: scale(1.06) !important;
}

.bestsellers .bestseller-card:hover .cb-bestseller-media--has-secondary .cb-bestseller-image--secondary {
  opacity: 1 !important;
  transform: scale(1.06) !important;
}

@keyframes cbBestsellerImageLoader {
  to {
    rotate: 360deg;
  }
}

@media screen and (max-width: 749px) {
  .bestsellers .cb-bestseller-media {
    aspect-ratio: 1 / 1.05 !important;
    padding: 0.75rem !important;
  }

  .bestsellers .cb-bestseller-image {
    transform: scale(1.02) !important;
  }
}

/* =========================================================
   CAREVIELLE BLOG + ARTICLE TEMPLATES
   Premium compact editorial layout.
   ========================================================= */

.cv-blog,
.cv-article{
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 10%, transparent), transparent 22rem),
    linear-gradient(180deg, var(--color-surface, #ffffff) 0%, color-mix(in srgb, var(--color-background, #fcf7f2) 55%, var(--color-surface, #ffffff)) 100%) !important;
  color: var(--color-ink, #12395d) !important;
}

.cv-blog{
  padding-block: clamp(3rem, 5vw, 5rem) clamp(4rem, 7vw, 6rem) !important;
}

.cv-article{
  padding-block: clamp(2.25rem, 4vw, 4rem) clamp(3.5rem, 6vw, 5.25rem) !important;
}

.cv-blog__container,
.cv-article__container{
  width: min(100% - 3rem, 70rem) !important;
  margin-inline: auto !important;
}

.cv-blog__header,
.cv-article__header{
  max-width: 46rem !important;
  margin: 0 0 clamp(1.75rem, 3.5vw, 2.75rem) !important;
  text-align: left !important;
}

.cv-blog__eyebrow,
.cv-article__meta,
.cv-article-card__meta,
.cv-article__tags-label,
.cv-article__back{
  color: color-mix(in srgb, var(--color-primary, #a9826d) 82%, var(--color-ink, #12395d)) !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.68rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.11em !important;
  line-height: 1.35 !important;
  text-transform: uppercase !important;
}

.cv-blog__eyebrow{
  margin: 0 0 0.75rem !important;
}

.cv-article__back{
  display: inline-flex !important;
  margin: 0 0 0.9rem !important;
  text-decoration: none !important;
}

.cv-article__meta,
.cv-article-card__meta{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.45rem 0.85rem !important;
  margin: 0 0 0.85rem !important;
}

.cv-blog__title,
.cv-article__title{
  margin: 0 !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-size: clamp(2.25rem, 4.6vw, 4.6rem) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.055em !important;
}

.cv-blog__intro,
.cv-article__excerpt{
  max-width: 38rem !important;
  margin: 1rem 0 0 !important;
  color: color-mix(in srgb, var(--color-ink, #12395d) 72%, transparent) !important;
  font-size: clamp(1rem, 1.15vw, 1.12rem) !important;
  font-weight: 500 !important;
  line-height: 1.65 !important;
}

.cv-blog__grid{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(1.1rem, 2vw, 1.5rem) !important;
}

.cv-article-card{
  display: grid !important;
  align-content: start !important;
  gap: 1rem !important;
}

.cv-article-card__media{
  position: relative !important;
  display: block !important;
  aspect-ratio: 1 / 0.72 !important;
  overflow: hidden !important;
  border-radius: 1.15rem !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, var(--color-secondary, #e7d5c8)) !important;
  box-shadow:
    0 0.9rem 2rem color-mix(in srgb, var(--color-ink, #12395d) 6%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--color-border, #ead8cc) 64%, transparent) !important;
}

.cv-article-card__image{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  transition: transform 360ms ease !important;
}

.cv-article-card:hover .cv-article-card__image{
  transform: scale(1.035) !important;
}

.cv-article-card__placeholder{
  width: 100% !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  color: color-mix(in srgb, var(--color-primary, #a9826d) 72%, var(--color-ink, #12395d)) !important;
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: clamp(1.5rem, 2.5vw, 2.6rem) !important;
  letter-spacing: -0.055em !important;
}

.cv-article-card__content{
  display: grid !important;
  gap: 0.65rem !important;
}

.cv-article-card__title{
  margin: 0 !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--font-heading-family, var(--font-body-family, Arial, sans-serif)) !important;
  font-size: clamp(1.18rem, 1.55vw, 1.55rem) !important;
  font-weight: 850 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
}

.cv-article-card__title a{
  color: inherit !important;
  text-decoration: none !important;
}

.cv-article-card__excerpt{
  margin: 0 !important;
  color: color-mix(in srgb, var(--color-ink, #12395d) 68%, transparent) !important;
  font-size: 0.94rem !important;
  line-height: 1.55 !important;
}

.cv-article-card__link{
  width: fit-content !important;
  color: var(--color-primary, #a9826d) !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

.cv-article__hero{
  width: min(100%, 64rem) !important;
  margin: 0 0 clamp(1.75rem, 3.5vw, 2.75rem) !important;
  aspect-ratio: 1.42 / 1 !important;
  overflow: hidden !important;
  border-radius: 1.35rem !important;
  background: var(--color-surface, #ffffff) !important;
  box-shadow:
    0 1.1rem 2.8rem color-mix(in srgb, var(--color-ink, #12395d) 7%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--color-border, #ead8cc) 60%, transparent) !important;
}

.cv-article__image{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

.cv-article__body{
  width: min(100%, 48rem) !important;
  color: color-mix(in srgb, var(--color-ink, #12395d) 78%, transparent) !important;
  font-size: clamp(0.98rem, 1.1vw, 1.08rem) !important;
  line-height: 1.72 !important;
}

.cv-article__body > *:first-child{
  margin-top: 0 !important;
}

.cv-article__body h2,
.cv-article__body h3{
  margin: 2rem 0 0.8rem !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--font-heading-family, var(--font-body-family, Arial, sans-serif)) !important;
  font-weight: 850 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.035em !important;
}

.cv-article__body h2{
  font-size: clamp(1.55rem, 2.2vw, 2.35rem) !important;
}

.cv-article__body h3{
  font-size: clamp(1.25rem, 1.7vw, 1.7rem) !important;
}

.cv-article__body p,
.cv-article__body ul,
.cv-article__body ol{
  margin: 0 0 1rem !important;
}

.cv-article__body ul,
.cv-article__body ol{
  padding-left: 1.25rem !important;
}

.cv-article__body blockquote{
  margin: 1.6rem 0 !important;
  padding: 1.1rem 1.3rem !important;
  border-left: 3px solid var(--color-primary, #a9826d) !important;
  border-radius: 0.9rem !important;
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 22%, var(--color-surface, #ffffff)) !important;
  color: var(--color-ink, #12395d) !important;
  font-weight: 750 !important;
}

.cv-article__footer{
  width: min(100%, 48rem) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  gap: 1.2rem !important;
  margin-top: clamp(2rem, 4vw, 3rem) !important;
  padding-top: 1.25rem !important;
  border-top: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 70%, transparent) !important;
}

.cv-article__tags,
.cv-article__share{
  display: grid !important;
  gap: 0.55rem !important;
}

.cv-article__tag-list,
.cv-article__share{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.55rem !important;
}

.cv-article__tag,
.cv-article__share a{
  color: color-mix(in srgb, var(--color-ink, #12395d) 72%, transparent) !important;
  font-size: 0.82rem !important;
  text-decoration: none !important;
}

.cv-blog__pagination{
  margin-top: 2.5rem !important;
}

.cv-blog__empty{
  max-width: 40rem !important;
  padding: 2rem !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 68%, transparent) !important;
  border-radius: 1.25rem !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 86%, transparent) !important;
}

@media screen and (max-width: 989px){
  .cv-blog__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .cv-blog__container,
  .cv-article__container{
    width: min(100% - 2rem, 70rem) !important;
  }
}

@media screen and (max-width: 649px){
  .cv-blog,
  .cv-article{
    padding-block: 2rem 3.5rem !important;
  }

  .cv-blog__container,
  .cv-article__container{
    width: min(100% - 1.5rem, 70rem) !important;
  }

  .cv-blog__title,
  .cv-article__title{
    font-size: clamp(2.1rem, 10vw, 3.1rem) !important;
    line-height: 1 !important;
  }

  .cv-blog__grid{
    grid-template-columns: 1fr !important;
  }

  .cv-article__hero{
    aspect-ratio: 1.08 / 1 !important;
    border-radius: 1rem !important;
  }

  .cv-article__footer{
    display: grid !important;
  }
}

/* =========================================================
   CAREVIELLE CART DRAWER VIEW CART BUTTON FIX
   Keep View Cart as a full-width secondary drawer action.
   ========================================================= */

.cart-drawer__cart-link,
.cart-drawer__view-cart {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  min-height: 2.8rem !important;
  margin: 0 0 0.6rem !important;
  padding: 0 1rem !important;
  border: 1px solid color-mix(in srgb, var(--color-primary, #a9826d) 34%, var(--color-border, #e5d4c8)) !important;
  border-radius: var(--tb-radius-button, 999px) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 92%, var(--color-secondary, #e7d5c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
  box-shadow: none !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.cart-drawer__cart-link:hover,
.cart-drawer__view-cart:hover {
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 70%, var(--color-surface, #ffffff)) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 44%, var(--color-border, #e5d4c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
  box-shadow: none !important;
}


/* =========================================================
   CAREVIELLE SHARED DRAWER BACKDROP AUTHORITY
   One shared, minimal blur click-catcher for cart and wishlist.
   ========================================================= */

.cart-drawer__overlay,
.wishlist-drawer__overlay {
  background: rgba(255, 255, 255, 0.04) !important;
  opacity: 0 !important;
  filter: none !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
}

.cart-drawer.is-open .cart-drawer__overlay,
.cart-drawer.is-closing .cart-drawer__overlay,
.wishlist-drawer.is-open .wishlist-drawer__overlay,
.wishlist-drawer.is-closing .wishlist-drawer__overlay {
  visibility: visible !important;
  opacity: 1 !important;
  background: rgba(255, 255, 255, 0.04) !important;
  filter: none !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
}

.cart-drawer__overlay::before,
.cart-drawer__overlay::after,
.wishlist-drawer__overlay::before,
.wishlist-drawer__overlay::after {
  content: none !important;
  display: none !important;
}


/* =========================================================
   CAREVIELLE HEADER ICON BORDERLESS AUTHORITY
   Make all header action icons visually uniform without box borders.
   ========================================================= */

html body .site-header .site-header__actions > .site-header__icon,
html body .site-header .site-header__actions > .site-header__search-toggle,
html body .site-header .site-header__actions > .site-header__account,
html body .site-header .site-header__actions > .site-header__wishlist,
html body .site-header .site-header__actions > .site-header__cart {
  border: 0 !important;
  outline: 0 !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 96%, transparent) !important;
  box-shadow: 0 0.7rem 1.6rem color-mix(in srgb, var(--color-ink, #3a2e2a) 7%, transparent) !important;
}

html body .site-header .site-header__actions > .site-header__icon:hover,
html body .site-header .site-header__actions > .site-header__search-toggle:hover,
html body .site-header .site-header__actions > .site-header__account:hover,
html body .site-header .site-header__actions > .site-header__wishlist:hover,
html body .site-header .site-header__actions > .site-header__cart:hover {
  border: 0 !important;
  outline: 0 !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 98%, transparent) !important;
  box-shadow: 0 0.85rem 1.8rem color-mix(in srgb, var(--color-ink, #3a2e2a) 9%, transparent) !important;
}

html body .site-header .site-header__actions > .site-header__icon:focus,
html body .site-header .site-header__actions > .site-header__search-toggle:focus,
html body .site-header .site-header__actions > .site-header__account:focus,
html body .site-header .site-header__actions > .site-header__wishlist:focus,
html body .site-header .site-header__actions > .site-header__cart:focus,
html body .site-header .site-header__actions > .site-header__icon:focus-visible,
html body .site-header .site-header__actions > .site-header__search-toggle:focus-visible,
html body .site-header .site-header__actions > .site-header__account:focus-visible,
html body .site-header .site-header__actions > .site-header__wishlist:focus-visible,
html body .site-header .site-header__actions > .site-header__cart:focus-visible {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: 0 0.85rem 1.8rem color-mix(in srgb, var(--color-ink, #3a2e2a) 9%, transparent) !important;
}






/* =========================================================
   CAREVIELLE DRAWER ROOT BACKDROP REMOVAL
   Drawer roots are full-viewport click/shell layers only.
   Visual background belongs only to the drawer panel.
   ========================================================= */

html body .cart-drawer,
html body .wishlist-drawer {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html body .cart-drawer.is-open,
html body .cart-drawer.is-closing,
html body .wishlist-drawer.is-open,
html body .wishlist-drawer.is-closing {
  background: transparent !important;
  background-color: transparent !important;
}

html body .cart-drawer__overlay,
html body .wishlist-drawer__overlay {
  background: transparent !important;
  background-color: transparent !important;
  filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html body .cart-drawer__overlay::before,
html body .cart-drawer__overlay::after,
html body .wishlist-drawer__overlay::before,
html body .wishlist-drawer__overlay::after {
  content: none !important;
  display: none !important;
}

/* =========================================================
   CAREVIELLE CART DRAWER VIEW CART TAIL AUTHORITY
   Final footer-scoped override for the cart drawer secondary link.
   ========================================================= */

html body .cart-drawer__footer {
  display: block !important;
}

html body .cart-drawer__footer > a.cart-drawer__cart-link,
html body .cart-drawer__footer > a.cart-drawer__cart-link[href="/cart"] {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  inline-size: 100% !important;
  width: 100% !important;
  min-inline-size: 0 !important;
  min-width: 0 !important;
  max-inline-size: none !important;
  max-width: none !important;
  min-height: 3rem !important;
  height: auto !important;
  margin: 0 0 0.75rem !important;
  padding: 0 1.25rem !important;
  border: 1px solid color-mix(in srgb, var(--color-primary, #a9826d) 34%, var(--color-border, #e5d4c8)) !important;
  border-radius: var(--tb-radius-button, 999px) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 94%, var(--color-secondary, #e7d5c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
  box-shadow: none !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  writing-mode: horizontal-tb !important;
  transform: none !important;
}

html body .cart-drawer__footer > a.cart-drawer__cart-link:hover,
html body .cart-drawer__footer > a.cart-drawer__cart-link[href="/cart"]:hover {
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 68%, var(--color-surface, #ffffff)) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 46%, var(--color-border, #e5d4c8)) !important;
  color: var(--color-ink, #3a2e2a) !important;
  box-shadow: none !important;
  transform: none !important;
}

/* =========================================================
   CAREVIELLE CART DRAWER HEADING MATCH WISHLIST
   Make "Your Cart" use the same visual scale as Wishlist.
   ========================================================= */

html body .cart-drawer__header .cart-drawer__title {
  margin: 0 !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--cv-display-font, Georgia, 'Times New Roman', Times, serif) !important;
  font-size: 2.1rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}

@media screen and (max-width: 749px) {
  html body .cart-drawer__header .cart-drawer__title {
    font-size: 2.1rem !important;
  }
}

/* =========================================================
   CAREVIELLE CART DRAWER TITLE FORCE 42PX BOLD
   Final section-scoped override for cart drawer title.
   ========================================================= */

#shopify-section-cart-drawer .cart-drawer .cart-drawer__header {
  min-height: 6.9rem !important;
  padding-top: 1.25rem !important;
  padding-bottom: 1.1rem !important;
}

#shopify-section-cart-drawer .cart-drawer .cart-drawer__header > div {
  display: block !important;
  min-width: 0 !important;
}

#shopify-section-cart-drawer .cart-drawer h2.cart-drawer__title,
#shopify-section-cart-drawer .cart-drawer .cart-drawer__header h2.cart-drawer__title,
html body #shopify-section-cart-drawer .cart-drawer h2.cart-drawer__title {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--font-body-family, Arial, Helvetica, sans-serif) !important;
  font-size: 42px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
  text-transform: none !important;
}

/* =========================================================
   COLLECTION PRODUCT CARD SECOND IMAGE HOVER
   Uses product.images[1] when available; keeps primary image as fallback.
   ========================================================= */
.product-card__media{
  position: relative !important;
}

.product-card__media--has-secondary .product-card__image{
  transition:
    opacity 260ms ease,
    transform 320ms ease !important;
}

.product-card__image--secondary{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.product-card__media--has-secondary:hover .product-card__image--primary,
.product-card__media--has-secondary:focus-visible .product-card__image--primary{
  opacity: 0 !important;
  transform: scale(1.015) !important;
}

.product-card__media--has-secondary:hover .product-card__image--secondary,
.product-card__media--has-secondary:focus-visible .product-card__image--secondary{
  opacity: 1 !important;
  transform: scale(1.015) !important;
}

@media (hover: none) {
  .product-card__image--secondary{
    display: none !important;
  }

  .product-card__media--has-secondary:hover .product-card__image--primary{
    opacity: 1 !important;
    transform: none !important;
  }
}

/* =========================================================
   CAREVIELLE ESSENTIALS PRODUCT STRIP
   Category strip refactor into CRO product card rail.
   ========================================================= */

.essential-strip{
  position: relative !important;
  isolation: isolate !important;
  padding-block: clamp(3.25rem, 5.5vw, 5.5rem) !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 9% 0%, color-mix(in srgb, var(--color-secondary, #e7d5c8) 18%, transparent), transparent 26rem),
    radial-gradient(circle at 90% 8%, color-mix(in srgb, var(--color-primary, #a9826d) 8%, transparent), transparent 24rem),
    linear-gradient(
      180deg,
      var(--color-surface, #ffffff) 0%,
      color-mix(in srgb, var(--color-background, #fcf7f2) 72%, var(--color-surface, #ffffff)) 100%
    ) !important;
  border-block: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 56%, transparent) !important;
}

.essential-strip__container{
  display: grid !important;
  gap: clamp(1.8rem, 3vw, 2.6rem) !important;
}

.essential-strip__header{
  max-width: 46rem !important;
}

.essential-strip__eyebrow{
  margin: 0 0 0.55rem !important;
  color: color-mix(in srgb, var(--color-primary, #a9826d) 86%, var(--color-ink, #12395d)) !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.7rem !important;
  font-weight: 850 !important;
  letter-spacing: 0.15em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

.essential-strip__heading{
  margin: 0 !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--cv-display-font, var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-size: clamp(2.15rem, 4.1vw, 4.25rem) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.055em !important;
}

.essential-strip__text{
  max-width: 38rem !important;
  margin: 0.85rem 0 0 !important;
  color: color-mix(in srgb, var(--color-ink, #12395d) 68%, transparent) !important;
  font-size: clamp(0.98rem, 1.2vw, 1.12rem) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

.essential-strip__grid{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1rem, 2vw, 1.35rem) !important;
  align-items: stretch !important;
}

.essential-strip__card{
  position: relative !important;
  display: grid !important;
  grid-template-rows: auto 1fr !important;
  min-width: 0 !important;
  overflow: hidden !important;
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 72%, transparent) !important;
  border-radius: 1.45rem !important;
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 98%, transparent) 0%,
      color-mix(in srgb, var(--color-background, #fcf7f2) 74%, var(--color-surface, #ffffff)) 100%
    ) !important;
  box-shadow:
    0 1rem 2.4rem color-mix(in srgb, var(--color-ink, #12395d) 7%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 82%, transparent) !important;
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease !important;
}

.essential-strip__card:hover{
  transform: translateY(-3px) !important;
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 38%, var(--color-border, #ead8cc)) !important;
  box-shadow:
    0 1.35rem 3rem color-mix(in srgb, var(--color-ink, #12395d) 10%, transparent),
    inset 0 1px 0 color-mix(in srgb, #ffffff 88%, transparent) !important;
}

.essential-strip__badge{
  position: absolute !important;
  z-index: 3 !important;
  top: 0.9rem !important;
  left: 0.9rem !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 1.85rem !important;
  max-width: calc(100% - 1.8rem) !important;
  padding: 0 0.72rem !important;
  border: 1px solid color-mix(in srgb, var(--color-accent, #c8a15a) 48%, transparent) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--color-accent, #c8a15a) 18%, var(--color-surface, #ffffff)),
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 32%, var(--color-surface, #ffffff))
    ) !important;
  color: color-mix(in srgb, var(--color-primary-dark, #876654) 84%, var(--color-ink, #12395d)) !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.11em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
  box-shadow: 0 0.65rem 1.45rem color-mix(in srgb, var(--color-ink, #12395d) 6%, transparent) !important;
}

.essential-strip__media{
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  min-height: clamp(16rem, 20vw, 21rem) !important;
  padding: clamp(2rem, 3vw, 2.75rem) 1.25rem 1.25rem !important;
  text-decoration: none !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 50% 46%, color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent), transparent 32%),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent) 0%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 18%, var(--color-surface, #ffffff)) 100%
    ) !important;
}

.essential-strip__media::after{
  content: "" !important;
  position: absolute !important;
  left: 18% !important;
  right: 18% !important;
  bottom: 1.65rem !important;
  height: 1.2rem !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--color-ink, #12395d) 11%, transparent) !important;
  filter: blur(12px) !important;
  opacity: 0.42 !important;
  pointer-events: none !important;
}

.essential-strip__image{
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: auto !important;
  max-width: min(88%, 13.5rem) !important;
  max-height: clamp(13rem, 17vw, 18rem) !important;
  height: auto !important;
  object-fit: contain !important;
  mix-blend-mode: multiply !important;
  transform: scale(1.22) !important;
  transform-origin: center center !important;
  transition: transform 260ms ease !important;
}

.essential-strip__card:hover .essential-strip__image{
  transform: scale(1.29) translateY(-0.15rem) !important;
}

.essential-strip__fallback{
  position: relative !important;
  z-index: 2 !important;
  width: 8rem !important;
  height: 8rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--color-secondary, #e7d5c8) 34%, var(--color-surface, #ffffff)) !important;
  color: var(--color-ink, #12395d) !important;
  font-weight: 850 !important;
  text-align: center !important;
}

.essential-strip__body{
  display: grid !important;
  align-content: start !important;
  gap: 0.95rem !important;
  padding: 1.15rem 1.15rem 1.2rem !important;
}

.essential-strip__copy{
  display: grid !important;
  gap: 0.4rem !important;
}

.essential-strip__title{
  margin: 0 !important;
  color: var(--color-ink, #12395d) !important;
  font-family: var(--font-body-family, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1rem, 1.2vw, 1.16rem) !important;
  font-weight: 850 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
  text-transform: none !important;
}

.essential-strip__title a{
  color: inherit !important;
  text-decoration: none !important;
}

.essential-strip__benefit{
  margin: 0 !important;
  color: color-mix(in srgb, var(--color-ink, #12395d) 64%, transparent) !important;
  font-size: 0.88rem !important;
  line-height: 1.35 !important;
}

.essential-strip__meta{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0.75rem !important;
  min-height: 1.35rem !important;
}

.essential-strip__rating{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.32rem !important;
  min-width: 0 !important;
  color: var(--color-accent, #c8a15a) !important;
  font-size: 0.78rem !important;
  font-weight: 850 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.essential-strip__rating small{
  color: color-mix(in srgb, var(--color-ink, #12395d) 50%, transparent) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
}

.essential-strip__price{
  color: var(--color-ink, #12395d) !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.essential-strip__actions{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 0.6rem !important;
  margin-top: 0.15rem !important;
}

.essential-strip__form{
  display: contents !important;
}

.essential-strip__quick-add,
.essential-strip__view{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.85rem !important;
  padding: 0 0.8rem !important;
  border-radius: 999px !important;
  font-family: var(--font-button-family, Arial, Helvetica, sans-serif) !important;
  font-size: 0.67rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.1em !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease !important;
}

.essential-strip__quick-add{
  border: 1px solid var(--color-primary, #a9826d) !important;
  background: var(--color-primary, #a9826d) !important;
  color: var(--color-button-text, #ffffff) !important;
  box-shadow: 0 0.75rem 1.45rem color-mix(in srgb, var(--color-primary, #a9826d) 18%, transparent) !important;
}

.essential-strip__view{
  border: 1px solid color-mix(in srgb, var(--color-border, #ead8cc) 82%, transparent) !important;
  background: color-mix(in srgb, var(--color-surface, #ffffff) 88%, transparent) !important;
  color: var(--color-ink, #12395d) !important;
}

.essential-strip__quick-add:hover,
.essential-strip__view:hover{
  transform: translateY(-1px) !important;
}

.essential-strip__quick-add:hover{
  background: var(--color-primary-dark, #876654) !important;
  border-color: var(--color-primary-dark, #876654) !important;
}

.essential-strip__view:hover{
  border-color: color-mix(in srgb, var(--color-primary, #a9826d) 38%, var(--color-border, #ead8cc)) !important;
  color: var(--color-primary-dark, #876654) !important;
}

@media screen and (max-width: 1099px){
  .essential-strip__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 749px){
  .essential-strip{
    padding-block: 2.5rem 3rem !important;
  }

  .essential-strip__container{
    width: 100% !important;
  }

  .essential-strip__header{
    width: min(100% - 2rem, 40rem) !important;
    margin-inline: auto !important;
  }

  .essential-strip__heading{
    font-size: clamp(2rem, 10vw, 3.15rem) !important;
  }

  .essential-strip__grid{
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(17.5rem, 82vw) !important;
    grid-template-columns: none !important;
    gap: 0.9rem !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    scroll-snap-type: x mandatory !important;
    padding: 0 1.5rem 1rem !important;
    scroll-padding-inline: 1.5rem !important;
    scrollbar-width: thin !important;
  }

  .essential-strip__card{
    scroll-snap-align: start !important;
  }

  .essential-strip__media{
    min-height: 16rem !important;
  }

  .essential-strip__image{
    max-height: 13.75rem !important;
    transform: scale(1.18) !important;
  }

  .essential-strip__actions{
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================
   CLINICAL BANNER PROOF BULLETS
   Adds grounded trust points beside the CTA.
   ========================================================= */

.clinical-banner__proof-list{
  display: grid !important;
  gap: 0.72rem !important;
  max-width: 34rem !important;
  margin: clamp(1.15rem, 2vw, 1.55rem) 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.clinical-banner__proof-item{
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 0.72rem !important;
  color: color-mix(in srgb, var(--color-surface, #ffffff) 92%, transparent) !important;
  font-family: var(--font-body-family, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(0.9rem, 1.05vw, 1rem) !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

.clinical-banner__proof-icon{
  display: inline-grid !important;
  place-items: center !important;
  width: 1.45rem !important;
  height: 1.45rem !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--color-accent, #c8a15a) 22%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--color-accent, #c8a15a) 42%, transparent) !important;
  color: var(--color-accent, #c8a15a) !important;
  font-size: 0.78rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 28%, transparent) !important;
}

@media screen and (max-width: 749px){
  .clinical-banner__proof-list{
    max-width: none !important;
    margin-top: 1rem !important;
  }

  .clinical-banner__proof-item{
    font-size: 0.9rem !important;
  }
}

/* =========================================================
   PRODUCT BENEFIT RICH TEXT SUPPORT
   Preserve editor formatting inside compact benefit content.
   ========================================================= */

.product-main__benefit-text{
  display: grid !important;
  gap: 0.42rem !important;
  margin-top: 0.22rem !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: 1.45 !important;
}

.product-main__benefit-text > :first-child{
  margin-top: 0 !important;
}

.product-main__benefit-text > :last-child{
  margin-bottom: 0 !important;
}

.product-main__benefit-text p{
  margin: 0 !important;
  color: inherit !important;
  font: inherit !important;
  line-height: inherit !important;
}

.product-main__benefit-text ul,
.product-main__benefit-text ol{
  margin: 0.35rem 0 0 !important;
  padding-inline-start: 1.2rem !important;
}

.product-main__benefit-text ul{
  list-style: disc outside !important;
}

.product-main__benefit-text ol{
  list-style: decimal outside !important;
}

.product-main__benefit-text li{
  display: list-item !important;
  margin: 0.2rem 0 !important;
  color: inherit !important;
  line-height: 1.4 !important;
}

.product-main__benefit-text li::marker{
  color: var(--color-primary, #a9826d) !important;
}

.product-main__benefit-text strong,
.product-main__benefit-text b{
  color: var(--tb-pdp-ink, #12395d) !important;
  font-weight: 800 !important;
}

.product-main__benefit-text a{
  color: var(--color-primary-dark, #876654) !important;
  text-decoration: underline !important;
  text-underline-offset: 0.14em !important;
}

/* =========================================================
   CAREVIELLE PREMIUM POLICY PAGES
   Editorial treatment for Shopify native policy templates.
   ========================================================= */

body.template-policy #MainContent{
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(
      circle at 7% 4%,
      color-mix(in srgb, var(--color-secondary, #e7d5c8) 40%, transparent),
      transparent 32rem
    ),
    radial-gradient(
      circle at 96% 16%,
      color-mix(in srgb, var(--color-accent, #c8a15a) 10%, transparent),
      transparent 28rem
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-background, #fcf7f2) 92%, var(--color-surface, #ffffff)) 0%,
      var(--color-background, #fcf7f2) 48%,
      color-mix(in srgb, var(--color-surface, #ffffff) 76%, var(--color-background, #fcf7f2)) 100%
    ) !important;
}

body.template-policy .shopify-policy__container{
  width: min(100%, 78rem) !important;
  max-width: 78rem !important;
  margin-inline: auto !important;
  padding:
    clamp(3.75rem, 7vw, 7rem)
    clamp(1.25rem, 4vw, 3rem)
    clamp(4.5rem, 8vw, 8rem) !important;
}

body.template-policy .shopify-policy__title{
  position: relative !important;
  max-width: 62rem !important;
  margin: 0 auto clamp(2rem, 4vw, 3.25rem) !important;
  padding: 0 0 clamp(1.6rem, 3vw, 2.4rem) !important;
  text-align: left !important;
}

body.template-policy .shopify-policy__title::before{
  content: "Legal & store information" !important;
  display: block !important;
  margin: 0 0 0.8rem !important;
  color: var(--color-primary, #a9826d) !important;
  font-family:
    var(--font-nav-family,
    var(--font-button-family, Arial, Helvetica, sans-serif)) !important;
  font-size: 0.72rem !important;
  font-style: normal !important;
  font-weight: var(--font-nav-weight, 800) !important;
  letter-spacing: 0.17em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

body.template-policy .shopify-policy__title::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: 0 !important;
  width: min(7rem, 30%) !important;
  height: 2px !important;
  border-radius: 999px !important;
  background:
    linear-gradient(
      90deg,
      var(--color-primary, #a9826d),
      var(--color-accent, #c8a15a)
    ) !important;
}

body.template-policy .shopify-policy__title h1{
  max-width: 52rem !important;
  margin: 0 !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-family:
    var(--cv-display-font,
    var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-size: clamp(2.75rem, 6vw, 5.75rem) !important;
  font-style: var(--font-heading-style, normal) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  letter-spacing: -0.055em !important;
  line-height: 0.96 !important;
  text-wrap: balance !important;
}

body.template-policy .shopify-policy__body{
  width: 100% !important;
  max-width: 62rem !important;
  margin: 0 auto !important;
  padding:
    clamp(1.75rem, 4vw, 3.5rem)
    clamp(1.35rem, 4.2vw, 4rem) !important;
  border:
    1px solid
    color-mix(
      in srgb,
      var(--color-border, #e5d4c8) 78%,
      transparent
    ) !important;
  border-radius: clamp(1.25rem, 2vw, 2rem) !important;
  background:
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        var(--color-surface, #ffffff) 98%,
        transparent
      ) 0%,
      color-mix(
        in srgb,
        var(--color-surface, #ffffff) 91%,
        var(--color-background, #fcf7f2)
      ) 100%
    ) !important;
  box-shadow:
    0 1.5rem 4rem
      color-mix(
        in srgb,
        var(--color-ink, #3a2e2a) 7%,
        transparent
      ),
    inset 0 1px 0
      color-mix(in srgb, #ffffff 90%, transparent) !important;
  color:
    color-mix(
      in srgb,
      var(--color-ink, #3a2e2a) 82%,
      transparent
    ) !important;
  font-family:
    var(--font-body-family, Arial, Helvetica, sans-serif) !important;
  font-size: clamp(1rem, 1vw, 1.08rem) !important;
  line-height: 1.76 !important;
}

body.template-policy .shopify-policy__body > :first-child,
body.template-policy .shopify-policy__body .rte > :first-child{
  margin-top: 0 !important;
}

body.template-policy .shopify-policy__body > :last-child,
body.template-policy .shopify-policy__body .rte > :last-child{
  margin-bottom: 0 !important;
}

body.template-policy .shopify-policy__body p{
  max-width: 54rem !important;
  margin: 0 0 1.15rem !important;
  color:
    color-mix(
      in srgb,
      var(--color-ink, #3a2e2a) 76%,
      transparent
    ) !important;
  font: inherit !important;
  line-height: 1.76 !important;
}

body.template-policy .shopify-policy__body h1,
body.template-policy .shopify-policy__body h2,
body.template-policy .shopify-policy__body h3,
body.template-policy .shopify-policy__body h4{
  max-width: 54rem !important;
  color: var(--color-ink, #3a2e2a) !important;
  font-family:
    var(--cv-display-font,
    var(--font-heading-family, Georgia, 'Times New Roman', Times, serif)) !important;
  font-style: normal !important;
  text-wrap: balance !important;
}

body.template-policy .shopify-policy__body h1{
  margin: 3.25rem 0 1rem !important;
  font-size: clamp(2rem, 3.5vw, 3.15rem) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  letter-spacing: -0.045em !important;
  line-height: 1.02 !important;
}

body.template-policy .shopify-policy__body h2{
  position: relative !important;
  margin: clamp(2.75rem, 5vw, 4.25rem) 0 1.05rem !important;
  padding-top: 1.35rem !important;
  border-top:
    1px solid
    color-mix(
      in srgb,
      var(--color-border, #e5d4c8) 72%,
      transparent
    ) !important;
  font-size: clamp(1.65rem, 2.6vw, 2.35rem) !important;
  font-weight: var(--font-heading-weight, 700) !important;
  letter-spacing: -0.035em !important;
  line-height: 1.08 !important;
}

body.template-policy .shopify-policy__body h3{
  margin: 2.2rem 0 0.8rem !important;
  font-size: clamp(1.25rem, 1.8vw, 1.6rem) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.18 !important;
}

body.template-policy .shopify-policy__body h4{
  margin: 1.8rem 0 0.65rem !important;
  font-family:
    var(--font-body-family, Arial, Helvetica, sans-serif) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.01em !important;
  line-height: 1.35 !important;
}

body.template-policy .shopify-policy__body ul,
body.template-policy .shopify-policy__body ol{
  max-width: 52rem !important;
  margin: 0.9rem 0 1.5rem !important;
  padding-inline-start: 1.45rem !important;
}

body.template-policy .shopify-policy__body ul{
  list-style: disc outside !important;
}

body.template-policy .shopify-policy__body ol{
  list-style: decimal outside !important;
}

body.template-policy .shopify-policy__body li{
  display: list-item !important;
  margin: 0.52rem 0 !important;
  padding-left: 0.25rem !important;
  color:
    color-mix(
      in srgb,
      var(--color-ink, #3a2e2a) 76%,
      transparent
    ) !important;
  font: inherit !important;
  line-height: 1.65 !important;
}

body.template-policy .shopify-policy__body li::marker{
  color: var(--color-primary, #a9826d) !important;
  font-weight: 800 !important;
}

body.template-policy .shopify-policy__body strong,
body.template-policy .shopify-policy__body b{
  color: var(--color-ink, #3a2e2a) !important;
  font-weight: 750 !important;
}

body.template-policy .shopify-policy__body a{
  color: var(--color-primary-dark, #876654) !important;
  font-weight: 650 !important;
  text-decoration-line: underline !important;
  text-decoration-color:
    color-mix(
      in srgb,
      var(--color-primary, #a9826d) 55%,
      transparent
    ) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 0.18em !important;
  transition:
    color 180ms ease,
    text-decoration-color 180ms ease !important;
}

body.template-policy .shopify-policy__body a:hover{
  color: var(--color-primary, #a9826d) !important;
  text-decoration-color: currentColor !important;
}

body.template-policy .shopify-policy__body hr{
  height: 1px !important;
  margin: clamp(2.5rem, 5vw, 4rem) 0 !important;
  border: 0 !important;
  background:
    color-mix(
      in srgb,
      var(--color-border, #e5d4c8) 80%,
      transparent
    ) !important;
}

body.template-policy .shopify-policy__body blockquote{
  margin: 1.75rem 0 !important;
  padding: 1.15rem 1.35rem !important;
  border-left: 3px solid var(--color-primary, #a9826d) !important;
  border-radius: 0 1rem 1rem 0 !important;
  background:
    color-mix(
      in srgb,
      var(--color-secondary, #e7d5c8) 28%,
      var(--color-surface, #ffffff)
    ) !important;
  color: var(--color-ink, #3a2e2a) !important;
}

@media screen and (max-width: 749px){
  body.template-policy .shopify-policy__container{
    padding:
      2.75rem
      1rem
      4.5rem !important;
  }

  body.template-policy .shopify-policy__title{
    margin-bottom: 1.5rem !important;
    padding-bottom: 1.35rem !important;
  }

  body.template-policy .shopify-policy__title::before{
    margin-bottom: 0.65rem !important;
    font-size: 0.66rem !important;
    letter-spacing: 0.15em !important;
  }

  body.template-policy .shopify-policy__title h1{
    font-size: clamp(2.35rem, 13vw, 3.75rem) !important;
    line-height: 0.98 !important;
  }

  body.template-policy .shopify-policy__body{
    padding: 1.5rem 1.2rem 1.75rem !important;
    border-radius: 1.25rem !important;
    font-size: 0.98rem !important;
    line-height: 1.7 !important;
  }

  body.template-policy .shopify-policy__body p{
    margin-bottom: 1rem !important;
    line-height: 1.7 !important;
  }

  body.template-policy .shopify-policy__body h2{
    margin-top: 2.6rem !important;
    padding-top: 1.15rem !important;
    font-size: clamp(1.5rem, 8vw, 2rem) !important;
  }

  body.template-policy .shopify-policy__body h3{
    margin-top: 1.9rem !important;
    font-size: 1.25rem !important;
  }

  body.template-policy .shopify-policy__body ul,
  body.template-policy .shopify-policy__body ol{
    padding-inline-start: 1.25rem !important;
  }

  body.template-policy .shopify-policy__body li{
    margin-block: 0.48rem !important;
    padding-left: 0.1rem !important;
  }
}

@media print{
  body.template-policy #MainContent{
    background: #ffffff !important;
  }

  body.template-policy .shopify-policy__container{
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
  }

  body.template-policy .shopify-policy__title::before,
  body.template-policy .shopify-policy__title::after{
    display: none !important;
  }

  body.template-policy .shopify-policy__body{
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }
}

/* =========================================================
   CAREVIELLE CUSTOMER STORIES GALLERY
   Homepage discovery CTA + dedicated UGC grid mode.
   ========================================================= */

.shoppable-videos__text{
  max-width: 42rem !important;
  margin: 1rem auto 0 !important;
  color: color-mix(
    in srgb,
    var(--color-ink-soft, #74635b) 88%,
    transparent
  ) !important;
  font-size: clamp(0.98rem, 1.15vw, 1.1rem) !important;
  line-height: 1.7 !important;
}

.shoppable-videos__text > :first-child{
  margin-top: 0 !important;
}

.shoppable-videos__text > :last-child{
  margin-bottom: 0 !important;
}

.shoppable-videos__footer{
  display: flex !important;
  justify-content: center !important;
  margin-top: clamp(1.75rem, 3vw, 2.75rem) !important;
}

.shoppable-videos__view-all{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.7rem !important;
  min-width: min(100%, 16rem) !important;
}

.shoppable-videos__view-all span:last-child{
  font-size: 1.05em !important;
  transition: transform 180ms ease !important;
}

.shoppable-videos__view-all:hover span:last-child{
  transform: translateX(0.2rem) !important;
}

/* Dedicated customer stories gallery */
.shoppable-videos--grid{
  padding-block:
    clamp(3.5rem, 6vw, 6rem)
    clamp(4.5rem, 8vw, 8rem) !important;
}

.shoppable-videos--grid .shoppable-videos__top{
  max-width: 48rem !important;
  margin-bottom: clamp(2.25rem, 5vw, 4rem) !important;
}

.shoppable-videos--grid .shoppable-videos__viewport{
  overflow: visible !important;
}

.shoppable-videos--grid .shoppable-videos__track{
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(1rem, 2vw, 1.5rem) !important;
  overflow: visible !important;
  padding: 0 !important;
  scroll-snap-type: none !important;
}

.shoppable-videos--grid .shoppable-video-card{
  width: auto !important;
  min-width: 0 !important;
  flex: none !important;
  scroll-snap-align: none !important;
}

.shoppable-videos--grid .shoppable-video-card__media{
  border-radius: clamp(1rem, 1.5vw, 1.35rem) !important;
  box-shadow:
    0 1.25rem 3rem
      color-mix(
        in srgb,
        var(--color-ink, #3a2e2a) 9%,
        transparent
      ),
    inset 0 0 0 1px
      color-mix(in srgb, #ffffff 58%, transparent) !important;
  transition:
    transform 260ms ease,
    box-shadow 260ms ease !important;
}

.shoppable-videos--grid .shoppable-video-card:hover .shoppable-video-card__media{
  transform: translateY(-4px) !important;
  box-shadow:
    0 1.6rem 3.8rem
      color-mix(
        in srgb,
        var(--color-ink, #3a2e2a) 13%,
        transparent
      ),
    inset 0 0 0 1px
      color-mix(in srgb, #ffffff 68%, transparent) !important;
}

.shoppable-video-card--image .shoppable-video-card__scrim{
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-ink, #3a2e2a) 2%, transparent),
      transparent 40%
    ),
    linear-gradient(
      0deg,
      color-mix(in srgb, var(--color-ink, #3a2e2a) 72%, transparent),
      transparent 50%
    ) !important;
}

@media screen and (max-width: 1199px){
  .shoppable-videos--grid .shoppable-videos__track{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 899px){
  .shoppable-videos--grid .shoppable-videos__track{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media screen and (max-width: 549px){
  .shoppable-videos__footer{
    margin-top: 1.5rem !important;
  }

  .shoppable-videos__view-all{
    width: 100% !important;
  }

  .shoppable-videos--grid{
    padding-block: 3rem 4.5rem !important;
  }

  .shoppable-videos--grid .shoppable-videos__top{
    margin-bottom: 2rem !important;
  }

  .shoppable-videos--grid .shoppable-videos__track{
    gap: 0.75rem !important;
  }

  .shoppable-videos--grid .shoppable-video-card__copy{
    left: 0.75rem !important;
    right: 0.75rem !important;
    bottom: 0.75rem !important;
  }

  .shoppable-videos--grid .shoppable-video-card__title{
    font-size: 0.78rem !important;
    line-height: 1.18 !important;
  }

  .shoppable-videos--grid .shoppable-video-card__handle{
    font-size: 0.66rem !important;
  }
}

/* =========================================================
   CAREVIELLE FOOTER STORE LOCATION
   Reusable location block using the existing footer accordion.
   ========================================================= */

.site-footer__location-content{
  display: grid !important;
  gap: 0.85rem !important;
}

.site-footer__location-address{
  margin: 0 !important;
  color: var(--color-ink-soft, #74635b) !important;
  font-family: inherit !important;
  font-size: 0.92rem !important;
  font-style: normal !important;
  line-height: 1.55 !important;
}

.site-footer__location-contact{
  display: grid !important;
  gap: 0.4rem !important;
}

.site-footer__location-contact a{
  width: fit-content !important;
  color: var(--color-ink-soft, #74635b) !important;
  font-size: 0.88rem !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  transition: color 180ms ease !important;
}

.site-footer__location-contact a:hover{
  color: var(--color-primary, #a9826d) !important;
}

.site-footer__location-directions{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  width: fit-content !important;
  margin-top: 0.15rem !important;
  color: var(--color-primary, #a9826d) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
}

.site-footer__location-directions span{
  transition: transform 180ms ease !important;
}

.site-footer__location-directions:hover span{
  transform: translateX(0.2rem) !important;
}

/* Expand only when a fourth footer block is actually present. */
@media (min-width: 1100px){
  .site-footer--blocks-4 .site-footer__grid{
    grid-template-columns:
      minmax(15rem, 1.35fr)
      repeat(4, minmax(0, 0.72fr)) !important;
    gap: clamp(1.75rem, 3vw, 3rem) !important;
  }
}

.site-footer.site-footer--dark .site-footer__location-address,
.site-footer.site-footer--dark .site-footer__location-contact a{
  color: color-mix(
    in srgb,
    var(--color-surface, #ffffff) 78%,
    transparent
  ) !important;
}

.site-footer.site-footer--dark .site-footer__location-contact a:hover,
.site-footer.site-footer--dark .site-footer__location-directions{
  color: var(--color-accent, #c8a15a) !important;
}

@media (max-width: 749px){
  .site-footer__location-content{
    gap: 0.9rem !important;
    padding-top: 0.15rem !important;
  }

  .site-footer__location-address,
  .site-footer__location-contact a{
    font-size: 1rem !important;
  }
}

/* =========================================================
   CAREVIELLE FRESH MOBILE HEADER FOUNDATION
   Single mobile header and menu system for all templates.
   No homepage, PDP, collection, or scrolled layout variants.
   ========================================================= */

@media screen and (max-width: 899px) {
  html body .site-header[data-site-header][data-header-style] {
    --tb-active-logo-width: min(var(--tb-mobile-logo-width, 120px), 6rem);
    --cv-mobile-header-height: 4.25rem;
    --cv-mobile-control-size: 2.25rem;
    --cv-mobile-icon-size: 1rem;

    min-height: var(--cv-mobile-header-height) !important;
    height: var(--cv-mobile-header-height) !important;
    overflow: visible !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    min-width: 0 !important;

    min-height: var(--cv-mobile-header-height) !important;
    height: var(--cv-mobile-header-height) !important;

    margin: 0 !important;
    padding: 0 0.8rem !important;

    gap: 0.5rem !important;

    overflow: visible !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__nav {
    display: none !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__logo,
  html body .site-header[data-site-header][data-header-style] .site-header__logo-link {
    position: static !important;
    inset: auto !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    flex: 0 1 var(--tb-active-logo-width) !important;

    min-width: 0 !important;

    height: auto !important;
    max-height: 2.5rem !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    transform: none !important;
    overflow: hidden !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__logo-image,
  html body .site-header[data-site-header][data-header-style] .site-header__logo-text {
    height: auto !important;
    max-height: 2.5rem !important;

    margin: 0 !important;

    object-fit: contain !important;
    object-position: left center !important;

    overflow: hidden !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__actions {
    position: static !important;
    inset: auto !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;

    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    height: auto !important;

    margin: 0 0 0 auto !important;
    padding: 0 !important;

    gap: 0.2rem !important;

    transform: none !important;
    overflow: visible !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__search-toggle,

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__account,

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__wishlist,

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__cart,

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__menu-toggle {
    position: relative !important;
    inset: auto !important;

    display: inline-grid !important;
    place-items: center !important;

    flex: 0 0 var(--cv-mobile-control-size) !important;

    width: var(--cv-mobile-control-size) !important;
    height: var(--cv-mobile-control-size) !important;

    min-width: var(--cv-mobile-control-size) !important;
    min-height: var(--cv-mobile-control-size) !important;

    max-width: var(--cv-mobile-control-size) !important;
    max-height: var(--cv-mobile-control-size) !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__search-toggle svg,

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__account svg,

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__wishlist svg,

  html body .site-header[data-site-header][data-header-style]
  .site-header__actions > .site-header__cart svg {
    display: block !important;

    width: var(--cv-mobile-icon-size) !important;
    height: var(--cv-mobile-icon-size) !important;

    min-width: var(--cv-mobile-icon-size) !important;
    min-height: var(--cv-mobile-icon-size) !important;

    max-width: var(--cv-mobile-icon-size) !important;
    max-height: var(--cv-mobile-icon-size) !important;

    margin: 0 !important;

    transform: none !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__menu-toggle {
    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    overflow: visible !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__menu-toggle span {
    position: absolute !important;
    left: 50% !important;

    display: block !important;

    width: 1.2rem !important;
    height: 2px !important;

    margin: 0 !important;

    border-radius: 999px !important;
    background: currentColor !important;

    transform: translateX(-50%) !important;

    transition:
      top 180ms ease,
      transform 180ms ease !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__menu-toggle span:first-child {
    top: 0.76rem !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__menu-toggle span:last-child {
    top: 1.35rem !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__menu-toggle.is-open span:first-child {
    top: 1.05rem !important;
    transform: translateX(-50%) rotate(45deg) !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__menu-toggle.is-open span:last-child {
    top: 1.05rem !important;
    transform: translateX(-50%) rotate(-45deg) !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__cart-count,
  html body .site-header[data-site-header][data-header-style] .site-header__wishlist-count,
  html body .site-header[data-site-header][data-header-style] [data-wishlist-count] {
    position: absolute !important;

    top: -0.18rem !important;
    right: -0.12rem !important;

    display: grid !important;
    place-items: center !important;

    width: 1rem !important;
    height: 1rem !important;

    min-width: 1rem !important;
    min-height: 1rem !important;

    max-width: 1rem !important;
    max-height: 1rem !important;

    padding: 0 !important;

    font-size: 0.52rem !important;
    line-height: 1 !important;

    border-radius: 999px !important;

    z-index: 4 !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__wishlist-count[hidden],

  html body .site-header[data-site-header][data-header-style]
  [data-wishlist-count][hidden] {
    display: none !important;
  }

  html body .site-header[data-site-header][data-header-style] .site-header__mobile {
    position: fixed !important;

    top: calc(var(--cv-mobile-header-height) + 0.35rem) !important;
    right: 0.8rem !important;
    left: auto !important;

    display: block !important;

    width: min(19rem, calc(100vw - 1.6rem)) !important;
    max-width: 19rem !important;
    max-height: calc(100dvh - var(--cv-mobile-header-height) - 1.2rem) !important;

    padding: 0.8rem !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;

    border: 1px solid color-mix(
      in srgb,
      var(--color-border, #ead8cc) 72%,
      transparent
    ) !important;

    border-radius: 1.15rem !important;

    background: color-mix(
      in srgb,
      var(--color-surface, #ffffff) 98%,
      transparent
    ) !important;

    box-shadow:
      0 1.1rem 3rem color-mix(
        in srgb,
        var(--color-ink, #3a2e2a) 16%,
        transparent
      ) !important;

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

    transform: translateY(-0.45rem) scale(0.985) !important;
    transform-origin: top right !important;

    transition:
      opacity 180ms ease,
      visibility 180ms ease,
      transform 220ms cubic-bezier(0.19, 1, 0.22, 1) !important;

    z-index: 9998 !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;

    transform: translateY(0) scale(1) !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-eyebrow {
    margin: 0 0 0.55rem !important;
    padding: 0 0.35rem 0.55rem !important;

    border-bottom: 1px solid var(--color-border, #ead8cc) !important;

    color: var(--color-ink-soft, #786b65) !important;

    font-size: 0.68rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.14em !important;
    line-height: 1 !important;

    text-transform: uppercase !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-item {
    margin: 0 !important;
    padding: 0 !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-link {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: 100% !important;
    min-height: 2.8rem !important;

    margin: 0 !important;
    padding: 0 0.65rem !important;

    border: 0 !important;
    border-radius: 0.7rem !important;

    background: transparent !important;

    color: var(--color-ink, #3a2e2a) !important;

    font-family: var(
      --font-button-family,
      Assistant,
      Arial,
      Helvetica,
      sans-serif
    ) !important;

    font-size: 0.78rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
    line-height: 1.2 !important;

    text-align: left !important;
    text-decoration: none !important;
    text-transform: uppercase !important;

    cursor: pointer !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-link:hover,

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-link:focus-visible {
    background: var(--color-surface-soft, #f7f0eb) !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-caret {
    flex: 0 0 auto !important;

    width: 0.75rem !important;
    height: 0.5rem !important;

    margin-left: 0.8rem !important;

    transition: transform 180ms ease !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-item.is-open .site-header__mobile-caret {
    transform: rotate(180deg) !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-submenu {
    display: grid !important;

    grid-template-rows: 0fr !important;

    opacity: 0 !important;

    transition:
      grid-template-rows 220ms ease,
      opacity 180ms ease !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-submenu > * {
    overflow: hidden !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-item.is-open .site-header__mobile-submenu {
    grid-template-rows: 1fr !important;

    opacity: 1 !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-sublink {
    display: block !important;

    min-height: 2.35rem !important;

    padding: 0.7rem 0.8rem 0.7rem 1rem !important;

    color: var(--color-ink-soft, #786b65) !important;

    font-size: 0.82rem !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;

    text-decoration: none !important;
  }

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-sublink:hover,

  html body .site-header[data-site-header][data-header-style]
  .site-header__mobile-sublink:focus-visible {
    color: var(--color-primary-dark, #805f50) !important;
  }

  body.themeblocks-mobile-menu-open {
    overflow: hidden !important;
  }
}

/* =========================================================
   CAREVIELLE PDP EXPANDABLE PRODUCT DESCRIPTION
   Full product content with four-line collapsed preview.
   ========================================================= */

.product-main__description{
  position: relative !important;
}

.product-main__description-content{
  --cv-description-line-height: 1.65em;
  --cv-description-collapsed-lines: 4;

  position: relative !important;
  max-height: calc(
    var(--cv-description-line-height) *
    var(--cv-description-collapsed-lines)
  ) !important;
  overflow: hidden !important;
  transition: max-height 280ms ease !important;
}

.product-main__description-content > :first-child{
  margin-top: 0 !important;
}

.product-main__description-content > :last-child{
  margin-bottom: 0 !important;
}

.product-main__description:not(.is-expanded)
.product-main__description-content::after{
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  height: 2.4rem !important;
  pointer-events: none !important;
  background:
    linear-gradient(
      180deg,
      transparent 0%,
      color-mix(
        in srgb,
        var(--tb-pdp-surface, #ffffff) 96%,
        transparent
      ) 100%
    ) !important;
}

.product-main__description.is-expanded
.product-main__description-content{
  max-height: none !important;
}

.product-main__description.is-expanded
.product-main__description-content::after{
  display: none !important;
}

.product-main__description-toggle{
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.42rem !important;

  margin: 0.7rem 0 0 !important;
  padding: 0 !important;

  border: 0 !important;
  background: transparent !important;

  color: var(--tb-pdp-primary, var(--color-primary, #a9826d)) !important;

  font-family:
    var(
      --font-button-family,
      Arial,
      Helvetica,
      sans-serif
    ) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;

  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 0.22em !important;

  cursor: pointer !important;
}

.product-main__description-toggle[hidden]{
  display: none !important;
}

.product-main__description-toggle svg{
  width: 0.62rem !important;
  height: 0.42rem !important;
  flex: 0 0 auto !important;
  transition: transform 180ms ease !important;
}

.product-main__description.is-expanded
.product-main__description-toggle svg{
  transform: rotate(180deg) !important;
}

.product-main__description-toggle:hover{
  color:
    var(
      --color-primary-dark,
      #876654
    ) !important;
}

.product-main__description-toggle:focus-visible{
  outline:
    2px solid
    color-mix(
      in srgb,
      var(--tb-pdp-primary, var(--color-primary, #a9826d)) 64%,
      transparent
    ) !important;
  outline-offset: 0.3rem !important;
}