/* Clean premium experience layer: motion and interaction, not a visual rebrand. */
html {
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

/* Final separation for the light usa-sourced-tested panel. */
.home-page .usa-sourced-tested-panel {
  border: 1px solid rgba(49, 49, 49, .16) !important;
  box-shadow: 0 16px 38px rgba(49, 49, 49, .14) !important;
}

/* Keep the quality-card numbers black in their resting and hover states. */
.home-page .why-clean-card .why-clean-icon,
.home-page .why-clean-card:hover .why-clean-icon {
  color: #313131 !important;
}

/* Center the usa-sourced-tested composition and lock its two-line title. */
.home-page .usa-sourced-tested-panel {
  align-items: center !important;
  text-align: center !important;
}

.home-page .usa-sourced-tested-panel h2 {
  width: 100% !important;
  max-width: 1000px !important;
  margin-inline: auto !important;
  font-size: clamp(48px, 6vw, 88px) !important;
  line-height: 1.02 !important;
  letter-spacing: 0 !important;
  transform: none !important;
}

.home-page .usa-sourced-tested-panel p {
  max-width: 900px !important;
  margin-inline: auto !important;
}

.home-page .usa-sourced-tested-panel .button {
  align-self: center !important;
}

/* Keep the home purity image static and round the complete two-column block. */
.home-page .home-hero {
  border-radius: var(--radius-xl) !important;
  overflow: hidden !important;
}

.home-page .home-hero .hero-product-card,
.home-page .home-hero .hero-content {
  border-radius: 0 !important;
}

.home-page .home-hero .hero-product-card img {
  transform: none !important;
  transition: none !important;
}

/* Clean cart drawer: clearer product hierarchy and action layout. */
.cart-drawer .cart-item {
  grid-template-columns: 72px minmax(0, 1fr) 92px !important;
  grid-template-rows: auto auto auto !important;
  column-gap: 16px !important;
  row-gap: 6px !important;
  align-items: center !important;
  padding-block: 22px !important;
}

.cart-drawer .cart-item-image {
  grid-column: 1 !important;
  grid-row: 1 / span 3 !important;
  width: 72px !important;
  height: 84px !important;
  border-radius: 8px;
}

.cart-drawer .cart-item-copy {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: start !important;
}

.cart-drawer .cart-item-copy h2 {
  font-size: 19px !important;
  margin: 4px 0 !important;
}

.cart-drawer .cart-item-copy p,
.cart-drawer .cart-item-copy span {
  font-size: 12px !important;
}

.cart-drawer .cart-unit-price {
  display: block;
  margin-top: 5px !important;
}

.cart-drawer .quantity-control {
  grid-column: 2 !important;
  grid-row: 3 !important;
  justify-self: start;
  border: 1px solid var(--moss-deep) !important;
  border-radius: 999px !important;
  overflow: hidden;
  background: transparent !important;
}

.cart-drawer .quantity-control button,
.cart-drawer .quantity-control span {
  width: 36px !important;
  height: 32px !important;
  display: inline-grid !important;
  place-items: center;
  font-size: 13px !important;
}

.cart-drawer .quantity-control span {
  background: var(--moss-soft) !important;
}

.cart-drawer .cart-line-total {
  grid-column: 3 !important;
  grid-row: 1 / span 2 !important;
  align-self: center;
  justify-self: end;
  font-size: 17px !important;
}

.cart-drawer .cart-remove {
  grid-column: 3 !important;
  grid-row: 3 !important;
  justify-self: end;
  font-size: 11px !important;
}

.cart-drawer .promo-choose {
  min-height: 52px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--moss-deep) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  box-shadow: 0 8px 18px rgba(49, 49, 49, .12);
}

/* Cart page header uses the same content margins as the rest of the site. */
.cart-page .site-header .header-shell {
  width: var(--shell) !important;
  margin-inline: auto !important;
  padding-inline: 24px !important;
}

/* Unified Clean header: one full-width bar, no inner separator, centered contents. */
.clean-page .site-header,
.site-header {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 92px !important;
  height: auto !important;
  padding: 14px 0 !important;
  background: var(--surface) !important;
  border-bottom: 1px solid var(--line) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.clean-page .site-header .header-shell,
.site-header .header-shell {
  width: var(--shell) !important;
  height: 64px !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  display: grid !important;
  align-items: center !important;
  background: var(--surface) !important;
  border: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.clean-page .site-header .brand,
.site-header .brand,
.clean-page .site-header .desktop-nav,
.site-header .desktop-nav,
.clean-page .site-header .utility-nav,
.site-header .utility-nav {
  align-self: center !important;
}

/* Mirror the Better-style hierarchy in the full Clean cart. */
.cart-page .cart-items {
  padding: 26px !important;
}

.cart-page .cart-item {
  grid-template-columns: 96px minmax(0, 1fr) 112px !important;
  grid-template-rows: auto auto auto !important;
  column-gap: 18px !important;
  row-gap: 6px !important;
  padding: 24px 0 !important;
  align-items: center !important;
}

.cart-page .cart-item-image {
  grid-column: 1 !important;
  grid-row: 1 / span 3 !important;
  width: 96px !important;
  height: 110px !important;
  border-radius: 10px;
}

.cart-page .cart-item-copy {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  align-self: start !important;
}

.cart-page .cart-item-copy h2 {
  font-size: 23px !important;
  margin: 5px 0 !important;
}

.cart-page .cart-item-copy p,
.cart-page .cart-item-copy span {
  font-size: 12px !important;
}

.cart-page .cart-unit-price {
  display: block;
  margin-top: 6px !important;
}

.cart-page .quantity-control {
  grid-column: 2 !important;
  grid-row: 3 !important;
  justify-self: start;
  border: 1px solid var(--moss-deep) !important;
  border-radius: 999px !important;
  overflow: hidden;
}

.cart-page .quantity-control button,
.cart-page .quantity-control span {
  width: 38px !important;
  height: 34px !important;
  display: inline-grid !important;
  place-items: center;
  font-size: 13px !important;
}

.cart-page .quantity-control span {
  background: var(--moss-soft) !important;
}

.cart-page .cart-line-total {
  grid-column: 3 !important;
  grid-row: 1 / span 2 !important;
  justify-self: end;
  align-self: center;
  font-size: 18px !important;
  font-weight: 600 !important;
}

.cart-page .cart-remove {
  grid-column: 3 !important;
  grid-row: 3 !important;
  justify-self: end;
  font-size: 11px !important;
}

.cart-page .cart-promo-block .promo-choose {
  display: flex !important;
  width: 100% !important;
  min-height: 52px !important;
  align-items: center !important;
  justify-content: center !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--moss-deep) !important;
  color: #fff !important;
}

.cart-page .cart-summary > div:first-child strong {
  font-weight: 700 !important;
}

.cart-page .cart-summary > button[disabled] {
  opacity: 1 !important;
  cursor: not-allowed;
  background: var(--surface-2) !important;
  border: 1px solid var(--line) !important;
  color: rgba(49, 49, 49, .42) !important;
  box-shadow: none !important;
}

body {
  overflow-x: clip;
}

.sticky-site-chrome {
  position: sticky;
  top: 0;
  z-index: 1000;
  min-height: 126px;
  view-transition-name: clean-site-chrome;
}

.sticky-site-chrome .site-header {
  position: relative;
  top: auto;
  height: 92px;
  min-height: 92px;
  padding-block: 14px;
  transition: background-color .3s ease, backdrop-filter .3s ease;
}

.announcement-bar {
  position: relative;
  z-index: 2;
  display: flex;
  width: 100%;
  height: 38px;
  min-height: 38px;
  align-items: center;
  overflow: hidden;
  background: var(--ink);
  color: #fff;
}

.announcement-track {
  display: flex;
  width: max-content;
  height: 100%;
  animation: clean-announcement 136s linear infinite;
  will-change: transform;
}

.announcement-track > div {
  flex: none;
  display: flex;
  min-width: max-content;
  align-items: center;
  gap: 28px;
  padding-right: 28px;
}

.announcement-track span {
  white-space: nowrap;
  font: 500 10px/1 var(--font-body, Microma, sans-serif);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.announcement-track .announcement-info {
  color: rgba(255,255,255,.68);
  font-size: 9px;
}

.announcement-track .announcement-promo {
  color: #fff;
  font-size: 10px;
  font-weight: 700;
}

.announcement-track i {
  color: var(--moss);
  font-size: 8px;
  font-style: normal;
}

.announcement-bar:hover .announcement-track,
.announcement-bar:focus-within .announcement-track {
  animation-play-state: paused;
}

@keyframes clean-announcement {
  to { transform: translateX(-50%); }
}

body > main {
  min-height: calc(100svh - 126px);
  animation: clean-page-enter .58s cubic-bezier(.22,1,.36,1) both;
}

@keyframes clean-page-enter {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: none; }
}

@view-transition {
  navigation: auto;
}

::view-transition-old(root) {
  animation: .16s ease-out both clean-page-exit;
}

::view-transition-new(root) {
  animation: .58s cubic-bezier(.22,1,.36,1) both clean-page-enter;
}

::view-transition-old(clean-site-chrome),
::view-transition-new(clean-site-chrome) {
  animation: none;
}

@keyframes clean-page-exit {
  from { opacity: 1; }
  to { opacity: .94; }
}

.button,
button,
.filter-row button,
.variant {
  transition:
    color .25s ease,
    background-color .25s ease,
    border-color .25s ease,
    transform .48s cubic-bezier(.16,1,.3,1),
    opacity .32s ease;
}

.button:hover:not(:disabled),
button:hover:not(:disabled) {
  box-shadow: none !important;
  transform: translateY(-3px);
}

.button:active:not(:disabled),
button:active:not(:disabled) {
  transform: translateY(0) scale(.985);
}

.button:focus-visible,
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--moss-deep);
  outline-offset: 3px;
}

.button:disabled,
button:disabled {
  cursor: not-allowed;
  opacity: .42;
  transform: none !important;
}

.product-card,
.mini-product-card,
.featured-compact-card,
.strip-product-card,
.embedded-product-card,
.journal-card,
.collection-card {
  transform: translateZ(0);
  transition:
    transform .42s cubic-bezier(.22,1,.36,1),
    border-color .3s ease,
    background-color .3s ease;
}

.product-card img,
.mini-product-card img,
.featured-compact-card img,
.strip-product-card img,
.embedded-product-card img,
.journal-card img,
.collection-card img {
  transition: transform .58s cubic-bezier(.22,1,.36,1), filter .35s ease;
}

@media (hover:hover) and (pointer:fine) {
  .product-card:hover,
  .mini-product-card:hover,
  .featured-compact-card:hover,
  .strip-product-card:hover,
  .embedded-product-card:hover,
  .journal-card:hover,
  .collection-card:hover {
    transform: translateY(-5px);
  }

  .product-card:hover img,
  .mini-product-card:hover img,
  .featured-compact-card:hover img,
  .strip-product-card:hover img,
  .embedded-product-card:hover img,
  .journal-card:hover img {
    transform: scale(1.045);
  }
}

.reveal-enhanced .reveal-item {
  opacity: 0;
  filter: blur(3px);
  transform: translate3d(0, 34px, 0) scale(.988);
  transition:
    opacity .9s ease var(--reveal-delay,0ms),
    filter .85s ease var(--reveal-delay,0ms),
    transform 1s cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms);
}

.reveal-enhanced .reveal-item.is-revealed {
  opacity: 1;
  filter: none;
  transform: none;
}

.reveal-enhanced img.reveal-item,
.reveal-enhanced .detail-image.reveal-item,
.reveal-enhanced .auth-art.reveal-item {
  transform: translate3d(0,18px,0) scale(.975);
}

.reveal-enhanced img.reveal-item.is-revealed,
.reveal-enhanced .detail-image.reveal-item.is-revealed,
.reveal-enhanced .auth-art.reveal-item.is-revealed {
  transform: none;
}

.progressive-text .progressive-word {
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
  transform: translate3d(0,.72em,0) rotate(1.2deg);
  transition:
    opacity .72s ease calc(var(--reveal-delay,0ms) + var(--word-delay,0ms)),
    filter .78s ease calc(var(--reveal-delay,0ms) + var(--word-delay,0ms)),
    transform .86s cubic-bezier(.16,1,.3,1) calc(var(--reveal-delay,0ms) + var(--word-delay,0ms));
}

.progressive-text.is-revealed .progressive-word,
.progressive-text.is-text-revealed .progressive-word {
  opacity: 1;
  filter: none;
  transform: none;
}

.header-cart-button {
  display: none;
  border: 0;
  background: transparent;
  color: var(--ink);
  font: 400 10px/1 var(--font-body, Microma, sans-serif);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.header-cart-button span {
  display: inline-grid;
  min-width: 18px;
  height: 18px;
  margin-left: 4px;
  place-items: center;
  border-radius: 50%;
  background: var(--moss-soft);
  font-size: 9px;
}

.cart-drawer {
  position: fixed;
  z-index: 3000;
  inset: 0;
  visibility: hidden;
  pointer-events: none;
}

.cart-drawer.is-open {
  visibility: visible;
  pointer-events: auto;
}

.cart-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(24,28,26,.34);
  opacity: 0;
  backdrop-filter: blur(3px);
  transition: opacity .32s ease;
}

.cart-drawer.is-open .cart-drawer-backdrop {
  opacity: 1;
}

.cart-drawer-panel {
  position: absolute;
  top: 0;
  right: 0;
  display: grid;
  width: min(520px,100%);
  height: 100%;
  grid-template-rows: auto minmax(0,1fr) auto auto;
  overflow: hidden;
  border-left: 1px solid var(--line);
  background: var(--surface);
  color: var(--ink);
  transform: translateX(102%);
  transition: transform .48s cubic-bezier(.22,1,.36,1);
}

.cart-drawer.is-open .cart-drawer-panel {
  transform: none;
}

.cart-drawer-header {
  display: flex;
  min-height: 108px;
  padding: 24px 28px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}

.cart-drawer-header h2 {
  margin: 4px 0 0;
  font-size: 28px;
}

.icon-button {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: transparent;
  color: var(--ink);
  font-size: 24px;
}

.mini-cart-items {
  overflow: auto;
  padding: 10px 28px;
}

.cart-item {
  display: grid;
  grid-template-columns: 72px minmax(0,1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}

.cart-item-image {
  grid-row: 1 / span 2;
  width: 72px;
  height: 84px;
  overflow: hidden;
  background: var(--surface-2);
}

.cart-item-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cart-item-copy h2 {
  margin: 3px 0;
  font-size: 14px;
}

.cart-item-copy p,
.cart-item-copy span {
  margin: 0;
  color: var(--muted);
  font-size: 9px;
}

.cart-item-kicker {
  color: var(--moss-deep) !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.quantity-control {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line);
}

.quantity-control button {
  width: 30px;
  height: 30px;
  border: 0;
  background: transparent;
  color: var(--ink);
}

.quantity-control span,
.quantity-control strong {
  min-width: 24px;
  text-align: center;
  font-size: 10px;
}

.cart-line-total {
  font-size: 11px;
}

.cart-remove {
  grid-column: 2 / -1;
  width: max-content;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  font-size: 9px;
  text-decoration: underline;
}

.cart-drawer-panel > footer {
  padding: 22px 28px 26px;
  border-top: 1px solid var(--line);
  background: var(--surface);
}

.cart-drawer-subtotal {
  display: flex;
  margin-bottom: 16px;
  align-items: center;
  justify-content: space-between;
}

.cart-drawer-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.cart-drawer-actions .checkout-button {
  grid-column: 1 / -1;
  background: var(--ink);
  border-color: var(--ink);
  color: #fff;
}

.product-detail-quantity {
  display: flex;
  margin: 18px 0;
  align-items: center;
  justify-content: space-between;
}

.product-subscription-label {
  display: block;
  margin-top: 12px;
  color: var(--moss-deep) !important;
  font-size: 9px !important;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.overlay-open {
  overflow: hidden;
}

.why-clean {
  padding-block: clamp(82px,9vw,132px) clamp(48px,6vw,80px);
}

.why-clean-header {
  display: grid;
  max-width: 820px;
  margin: 0 auto clamp(40px,5vw,64px);
  justify-items: center;
  text-align: center;
}

.why-clean-header h2 {
  margin: 16px 0 20px;
  font-size: clamp(48px,6vw,88px);
}

.why-clean-header p {
  max-width: 700px;
  margin: 0;
  line-height: 1.7;
}

.why-clean-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: clamp(16px,2vw,28px);
}

.why-clean-card {
  position: relative;
  min-height: 470px;
  overflow: hidden;
  border-radius: var(--radius-xl);
  color: #fff;
  transform: translateZ(0);
  transition: transform .45s cubic-bezier(.22,1,.36,1);
}

.why-clean-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,rgba(26,34,30,.02) 25%,rgba(26,34,30,.78) 100%);
}

.why-clean-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .58s cubic-bezier(.22,1,.36,1);
}

.why-clean-card-content {
  position: relative;
  z-index: 1;
  display: flex;
  min-height: 470px;
  padding: 30px;
  flex-direction: column;
  justify-content: flex-end;
}

.why-clean-icon {
  position: absolute;
  top: 26px;
  right: 26px;
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 50%;
  background: rgba(255,255,255,.12);
}

.why-clean-card h3 {
  margin: 0 0 16px;
  color: #fff;
  font-size: clamp(24px,2.2vw,34px);
}

.why-clean-card p {
  margin: 0;
  color: rgba(255,255,255,.86);
  line-height: 1.6;
}

@media (hover:hover) and (pointer:fine) {
  .why-clean-card:hover {
    transform: translateY(-5px);
  }

  .why-clean-card:hover img {
    transform: scale(1.035);
  }
}

.usa-sourced-tested {
  padding-bottom: clamp(90px,10vw,144px);
}

.usa-sourced-tested-panel {
  display: flex;
  min-height: 430px;
  padding: clamp(52px,8vw,108px);
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background:
    linear-gradient(90deg,rgba(249,249,249,.96) 0%,rgba(249,249,249,.78) 42%,rgba(249,249,249,.08) 76%),
    url("../assets/home/clean-experience/usa-sourced-usa-tested.jpeg") center/cover no-repeat;
  transition: transform .45s cubic-bezier(.22,1,.36,1);
}

.usa-sourced-tested-panel h2 {
  max-width: 780px;
  margin: 16px 0 22px;
  font-size: clamp(46px,6.2vw,88px);
}

.usa-sourced-tested-panel p {
  max-width: 660px;
  margin: 0 0 30px;
  line-height: 1.7;
}

@media (hover:hover) and (pointer:fine) {
.usa-sourced-tested-panel:hover {
    transform: none;
  }
}

/* Section motion: tactile depth while preserving the restrained Clean palette. */
.collections .section-heading,
.why-clean-header {
  position: relative;
}

.collections .section-heading::after,
.why-clean-header::after {
  position: absolute;
  bottom: -22px;
  left: 0;
  width: min(180px,24vw);
  height: 1px;
  background: var(--moss-deep);
  content: "";
  opacity: .5;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1.1s cubic-bezier(.16,1,.3,1) .3s;
}

.why-clean-header::after {
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
}

.collections.motion-in .section-heading::after {
  transform: scaleX(1);
}

.why-clean.motion-in .why-clean-header::after {
  transform: translateX(-50%) scaleX(1);
}

.collection-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transform-style: preserve-3d;
  transition:
    transform .72s cubic-bezier(.16,1,.3,1),
    box-shadow .55s ease,
    border-color .4s ease !important;
}

.collection-card::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(circle at var(--pointer-x,50%) var(--pointer-y,50%),rgba(255,255,255,.42),transparent 38%),
    linear-gradient(115deg,transparent 20%,rgba(255,255,255,.22) 48%,transparent 76%);
  content: "";
  opacity: 0;
  transform: translateX(-8%);
  transition: opacity .55s ease, transform .8s cubic-bezier(.16,1,.3,1);
}

.collection-card::after {
  position: absolute;
  right: 28px;
  bottom: 24px;
  left: 28px;
  height: 1px;
  background: currentColor;
  content: "";
  opacity: .28;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .75s cubic-bezier(.16,1,.3,1);
}

.collection-card > * {
  position: relative;
  z-index: 1;
}

.collection-card .collection-icon {
  transition: transform .72s cubic-bezier(.16,1,.3,1), opacity .45s ease;
  transform: translateZ(24px);
}

.collection-card h3,
.collection-card p,
.collection-card footer {
  transition: transform .62s cubic-bezier(.16,1,.3,1), opacity .4s ease;
}

.collection-card footer span::after {
  display: inline-block;
  margin-left: 6px;
  content: "→";
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .35s ease, transform .5s cubic-bezier(.16,1,.3,1);
}

.why-clean-card {
  isolation: isolate;
  box-shadow: inset 0 0 0 0 rgba(255,255,255,0);
  transition:
    transform .72s cubic-bezier(.16,1,.3,1),
    box-shadow .55s ease !important;
}

.why-clean-card::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: radial-gradient(circle at var(--pointer-x,50%) var(--pointer-y,50%),rgba(255,255,255,.2),transparent 34%);
  content: "";
  opacity: 0;
  transition: opacity .5s ease;
  pointer-events: none;
}

.why-clean-card::after {
  z-index: 1;
  transition: background .55s ease;
}

.why-clean-card img {
  transform: translate3d(var(--image-shift-x,0px),var(--image-shift-y,0px),0) scale(1.025);
  transition: transform .9s cubic-bezier(.16,1,.3,1), filter .55s ease;
}

.why-clean-card-content {
  z-index: 2;
}

.why-clean-icon {
  transition:
    transform .7s cubic-bezier(.16,1,.3,1),
    background-color .45s ease,
    color .45s ease;
}

.why-clean-card h3,
.why-clean-card p {
  transition: transform .65s cubic-bezier(.16,1,.3,1), opacity .45s ease;
}

.usa-sourced-tested-panel {
  position: relative;
  isolation: isolate;
  background: #f9f9f9;
  box-shadow: inset 0 0 0 1px rgba(49,49,49,.04);
  transition:
    transform .8s cubic-bezier(.16,1,.3,1),
    box-shadow .6s ease !important;
}

.usa-sourced-tested-panel::before {
  position: absolute;
  z-index: -2;
  inset: -4%;
  background: url("../assets/home/clean-experience/usa-sourced-usa-tested.jpeg") center/cover no-repeat;
  content: "";
  transform: translate3d(var(--shift-x,0px),var(--shift-y,0px),0) scale(1.045);
  transition: transform 1.15s cubic-bezier(.16,1,.3,1), filter .65s ease;
}

.usa-sourced-tested-panel::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(circle at var(--pointer-x,35%) var(--pointer-y,50%),rgba(255,255,255,.22),transparent 30%),
    linear-gradient(90deg,rgba(249,249,249,.96) 0%,rgba(249,249,249,.78) 42%,rgba(249,249,249,.08) 76%);
  content: "";
  transition: background .6s ease;
}

.usa-sourced-tested-panel > * {
  position: relative;
  z-index: 1;
}

.usa-sourced-tested-panel h2 {
  transition: letter-spacing .75s cubic-bezier(.16,1,.3,1), transform .75s cubic-bezier(.16,1,.3,1);
}

@media (hover:hover) and (pointer:fine) {
  .collection-card:hover {
    transform: perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-6px);
    box-shadow: 0 22px 50px rgba(49,49,49,.1) !important;
  }

  .collection-card:hover::before {
    opacity: 1;
    transform: none;
  }

  .collection-card:hover::after {
    transform: scaleX(1);
  }

  .collection-card:hover .collection-icon {
    opacity: 1;
    transform: translate3d(4px,-7px,28px) rotate(5deg) scale(1.08);
  }

  .collection-card:hover .collection-icon svg * {
    animation: clean-icon-draw .9s ease both;
  }

  .collection-card:hover h3 {
    transform: translate3d(0,-5px,18px);
  }

  .collection-card:hover p {
    transform: translate3d(0,-2px,12px);
  }

  .collection-card:hover footer span::after {
    opacity: 1;
    transform: none;
  }

  .why-clean-card:hover {
    transform: perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-7px);
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.45),
      0 24px 52px rgba(49,49,49,.12) !important;
  }

  .why-clean-card:hover::before {
    opacity: 1;
  }

  .why-clean-card:hover::after {
    background: linear-gradient(180deg,rgba(26,34,30,.01) 18%,rgba(26,34,30,.72) 100%);
  }

  .why-clean-card:hover img {
    filter: saturate(1.05) contrast(1.025);
    transform: translate3d(var(--image-shift-x,0px),var(--image-shift-y,0px),0) scale(1.085);
  }

  .why-clean-card:hover .why-clean-icon {
    background: rgba(255,255,255,.92);
    color: var(--ink);
    transform: rotate(9deg) scale(1.08);
  }

  .why-clean-card:hover h3 {
    transform: translateY(-5px);
  }

  .why-clean-card:hover p {
    transform: translateY(-2px);
  }

  .usa-sourced-tested-panel:hover {
    transform: none;
    box-shadow: 0 24px 58px rgba(49,49,49,.09) !important;
  }

  .usa-sourced-tested-panel:hover::before {
    filter: saturate(1.035) contrast(1.02);
    transform: translate3d(var(--shift-x,0px),var(--shift-y,0px),0) scale(1.075);
  }

  .usa-sourced-tested-panel:hover h2 {
    letter-spacing: 0;
    transform: none;
  }
}

@keyframes clean-icon-draw {
  from { stroke-dasharray: 80; stroke-dashoffset: 80; }
  to { stroke-dasharray: 80; stroke-dashoffset: 0; }
}

.home-page .subscription-feature.subscription-video-hero {
  position: relative;
  display: flex !important;
  min-height: min(640px,calc(100svh - 126px));
  padding: 0 !important;
  align-items: center;
  overflow: hidden;
  border-radius: var(--radius-xl);
  background: #26302b !important;
}

.home-page .subscription-video-media,
.home-page .subscription-video-overlay {
  position: absolute;
  inset: 0;
}

.home-page .subscription-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 54%;
  transform: translate3d(6%,4%,0) scale(1.12);
  transform-origin: center;
  transition: transform 1.8s cubic-bezier(.16,1,.3,1), filter 1.2s ease;
  will-change: transform;
}

.home-page .subscription-video-overlay {
  background:
    linear-gradient(90deg,rgba(18,24,21,.9) 0%,rgba(18,24,21,.68) 40%,rgba(18,24,21,.12) 74%,transparent 100%),
    linear-gradient(180deg,rgba(18,24,21,.08),transparent 55%,rgba(18,24,21,.14));
  transition: opacity .8s ease;
}

.home-page .subscription-video-hero .subscription-copy {
  position: relative;
  z-index: 1;
  width: min(610px,58%);
  height: auto !important;
  min-height: 0 !important;
  margin: 0;
  padding: clamp(44px,7vw,94px) !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
}

.home-page .subscription-video-hero .subscription-copy > span,
.home-page .subscription-video-hero .subscription-copy h2,
.home-page .subscription-video-hero .subscription-copy p {
  color: #fff !important;
}

.home-page .subscription-video-hero .subscription-copy p {
  color: rgba(255,255,255,.78);
}

.home-page .subscription-video-hero .subscription-copy .button.primary {
  background: #fff !important;
  border-color: #fff !important;
  color: var(--ink) !important;
  transition:
    background-color .38s ease,
    border-color .38s ease,
    color .38s ease,
    transform .48s cubic-bezier(.16,1,.3,1) !important;
}

.home-page .subscription-video-hero .subscription-copy .button.primary:hover,
.home-page .subscription-video-hero .subscription-copy .button.primary:focus-visible {
  border-color: var(--moss-deep) !important;
  background: var(--moss-deep) !important;
  color: #fff !important;
  transform: translateY(-3px);
}

.home-page .subscription-video-hero .subscription-copy .button.primary:active {
  transform: translateY(0) scale(.985);
}

.home-page .subscription-video-hero .subscription-copy > * {
  animation: hero-copy-in .9s cubic-bezier(.16,1,.3,1) both;
}

.home-page .subscription-video-hero .subscription-copy > :nth-child(2) { animation-delay: .08s; }
.home-page .subscription-video-hero .subscription-copy > :nth-child(3) { animation-delay: .16s; }
.home-page .subscription-video-hero .subscription-copy > :nth-child(4) { animation-delay: .22s; }
.home-page .subscription-video-hero .subscription-copy > :nth-child(5) { animation-delay: .28s; }

@keyframes hero-copy-in {
  from { opacity: 0; transform: translate3d(0,24px,0); }
  to { opacity: 1; transform: none; }
}

@media (hover:hover) and (pointer:fine) {
  .home-page .subscription-video-hero:hover .subscription-video {
    filter: saturate(1.05) contrast(1.025);
    transform: translate3d(6%,3.5%,0) scale(1.135);
  }

  .home-page .subscription-video-hero:hover .subscription-video-overlay {
    opacity: .94;
  }
}

@media (max-width:900px) {
  .home-page .subscription-feature.subscription-video-hero {
    display: flex !important;
    min-height: 620px !important;
  }

  .home-page .subscription-video-hero .subscription-copy {
    width: min(620px,86%) !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 44px 34px !important;
    border-radius: 0 !important;
  }

  .vial-options {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .why-clean-grid {
    grid-template-columns: 1fr;
  }

  .why-clean-card,
  .why-clean-card-content {
    min-height: 390px;
  }
}

@media (max-width:800px) {
  .sticky-site-chrome {
    min-height: 116px;
  }

  .sticky-site-chrome .site-header {
    height: 82px;
    min-height: 82px;
  }

  body > main {
    min-height: calc(100svh - 116px);
  }

  .header-cart-button {
    display: inline-flex;
    align-items: center;
    justify-self: end;
  }

  .home-page .subscription-video-hero {
    min-height: 680px !important;
  }

  .home-page .subscription-video-hero .subscription-copy {
    width: 100%;
    padding: 42px 28px;
  }

  .home-page .subscription-video-overlay {
    background: linear-gradient(180deg,rgba(18,24,21,.18) 0%,rgba(18,24,21,.78) 63%,rgba(18,24,21,.92) 100%);
  }

  .home-page .subscription-video {
    transform: translate3d(3%,0,0) scale(1.08);
  }

  .usa-sourced-tested-panel {
    min-height: 500px;
    background: #f9f9f9;
    justify-content: flex-end;
  }

  .usa-sourced-tested-panel::after {
    background:
      radial-gradient(circle at 50% 42%,rgba(255,255,255,.18),transparent 34%),
      linear-gradient(180deg,rgba(249,249,249,.28) 0%,rgba(249,249,249,.96) 68%);
  }
}

@media (max-width:600px) {
  .announcement-bar {
    height: 36px;
    min-height: 36px;
  }

  .announcement-track {
    animation-duration: 104s;
  }

  .announcement-track > div {
    min-width: max-content;
    gap: 20px;
    padding-right: 20px;
  }

  .announcement-track span {
    font-size: 9px;
  }

  .announcement-track .announcement-info {
    display: inline;
    font-size: 8px;
  }

  .cart-drawer-header,
  .mini-cart-items,
  .drawer-promo-block,
  .cart-drawer-panel > footer {
    padding-inline: 20px;
  }

  .cart-drawer-actions {
    grid-template-columns: 1fr;
  }

  .cart-drawer-actions .checkout-button {
    grid-column: auto;
  }

  .home-page .subscription-video-hero .subscription-copy {
    min-height: 0 !important;
    padding: 34px 24px !important;
  }

  .home-page .subscription-video-hero h2 {
    font-size: clamp(44px,14vw,64px) !important;
    line-height: .92 !important;
  }

  .home-page .subscription-video-hero {
    min-height: 700px !important;
  }

  .vial-options {
    grid-template-columns: 1fr;
  }

  .why-clean {
    padding-block: 72px 38px;
  }

  .why-clean-header {
    justify-items: start;
    text-align: left;
  }

  .why-clean-card,
  .why-clean-card-content {
    min-height: 370px;
  }

  .usa-sourced-tested-panel {
    padding: 42px 24px;
  }

  .usa-sourced-tested-panel .button {
    width: 100%;
  }
}

/* Product merchandising polish: stronger imagery, aligned cards and clearer CTAs. */
.top-seller-grid .mini-product-card {
  position: relative;
  grid-template-rows: 340px minmax(0,1fr) !important;
  gap: 0 !important;
  min-height: 670px;
  border: 0 !important;
  border-radius: var(--radius-lg);
  background: var(--surface) !important;
  box-shadow: 0 10px 34px rgba(49,49,49,.06) !important;
  transition:
    box-shadow .42s cubic-bezier(.16,1,.3,1),
    transform .5s cubic-bezier(.16,1,.3,1) !important;
}

.top-seller-grid .mini-product-card::after {
  position: absolute;
  z-index: 4;
  inset: 0;
  border: 1.5px solid rgba(86,112,98,.78);
  border-radius: inherit;
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity .28s ease;
}

.top-seller-grid .mini-product-card > .product-card-media-link {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  width: 100% !important;
  height: 340px;
  margin: 0 !important;
  padding: 0 !important;
  align-self: stretch;
  justify-self: stretch;
  overflow: hidden;
  background: var(--surface-2);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.top-seller-grid .mini-product-card > .product-card-media-link img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: cover !important;
  object-position: center 46% !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: scale(1.25);
  transition:
    transform .68s cubic-bezier(.16,1,.3,1),
    filter .38s ease;
}

.top-seller-grid .mini-product-card > div {
  min-width: 0;
  padding: 28px 24px 24px;
  background: var(--surface) !important;
  transition: color .34s ease;
}

.top-seller-grid .mini-product-card h3 {
  margin-bottom: 12px;
}

.top-seller-grid .mini-product-card strong {
  margin-top: auto;
  padding-top: 22px;
}

.top-seller-grid .mini-product-card .product-subscription-label {
  margin: 18px 0 10px;
}

.top-seller-grid .mini-product-card .button {
  width: 100%;
}

.product-card {
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 720px;
  flex-direction: column;
  border: 0 !important;
  border-color: transparent;
}

.product-card::after {
  position: absolute;
  z-index: 20;
  inset: 0;
  border: 1.5px solid rgba(86,112,98,.82);
  border-radius: inherit;
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity .28s ease;
}

.product-card:focus-within::after {
  opacity: 1;
}

.product-card .product-card-link {
  height: auto;
  flex: 1;
}

.product-card .product-image {
  width: 100% !important;
  height: 410px;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
}

.product-card .product-image img {
  display: block;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: cover !important;
  object-position: center 47% !important;
  transform: scale(1.25);
  transition:
    transform .62s cubic-bezier(.22,1,.36,1),
    filter .38s ease;
}

.product-card .product-copy {
  min-height: 290px;
  transition: background-color .34s ease;
}

.product-card .product-subscription-label,
.mini-product-card .product-subscription-label,
.featured-compact-card .product-subscription-label,
.strip-product-card .product-subscription-label,
.embedded-product-card .product-subscription-label {
  display: inline-flex;
  width: fit-content;
  margin-top: 16px;
  padding: 7px 10px;
  border: 1px solid rgba(102,123,112,.28);
  border-radius: 999px;
  background: rgba(201,210,206,.42);
  color: #50655a !important;
  font-size: 8px !important;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .1em;
}

.product-card-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 0 26px 26px;
  background: var(--surface);
  transition: background-color .34s ease;
}

.product-card-actions .button {
  min-width: 0;
  min-height: 48px;
  padding-inline: 14px;
  text-align: center;
}

.button.primary:hover:not(:disabled),
.add-product:hover:not(:disabled),
.form-panel button:hover:not(:disabled) {
  border-color: var(--ink) !important;
  background: var(--ink) !important;
  color: #fff !important;
}

.button.secondary:hover:not(:disabled),
.product-detail-link:hover {
  border-color: var(--moss-deep) !important;
  background: var(--moss-soft) !important;
  color: var(--ink) !important;
}

.filter-row button:hover:not(.is-active) {
  border-color: var(--moss-deep);
  background: var(--moss-soft);
  color: var(--ink);
}

@media (hover:hover) and (pointer:fine) {
  .product-card:hover {
    border-color: transparent;
    background: var(--surface) !important;
    box-shadow: 0 14px 36px rgba(49,49,49,.07) !important;
  }

  .product-card:hover::after {
    opacity: 1;
  }

  .product-card:hover .product-copy,
  .product-card:hover .product-card-actions {
    background: var(--surface) !important;
  }

  .top-seller-grid .mini-product-card:hover {
    background: var(--surface) !important;
    box-shadow: 0 14px 36px rgba(49,49,49,.08) !important;
    transform: translateZ(0);
  }

  .top-seller-grid .mini-product-card:hover::after {
    opacity: 1;
  }

  .top-seller-grid .mini-product-card:hover > div {
    background: var(--surface) !important;
  }

  .top-seller-grid .mini-product-card:hover > .product-card-media-link img {
    filter: saturate(1.08) contrast(1.03);
    transform: scale(1.3);
  }

  .product-card:hover .product-image img {
    filter: saturate(1.08) contrast(1.03);
    transform: scale(1.3);
  }

  .journal-card:hover {
    border-color: rgba(102,123,112,.5);
    background: var(--moss-soft);
  }

  .collection-card:hover {
    border-color: rgba(102,123,112,.5);
  }
}

@media (max-width:800px) {
  .top-seller-grid .mini-product-card {
    grid-template-rows: 320px minmax(0,1fr) !important;
    min-height: 640px;
  }

  .top-seller-grid .mini-product-card > .product-card-media-link {
    height: 320px;
  }

  .product-card {
    min-height: 0;
  }

  .product-card .product-image {
    height: 390px;
  }
}

@media (max-width:480px) {
  .product-card-actions {
    grid-template-columns: 1fr;
    padding-inline: 20px;
  }
}

/* Home catalog CTA: supplied luminous water texture. */
.home-page .catalog-cta-card.texture-white,
.home-page .catalog-cta-card.texture-teal {
  background:
    linear-gradient(90deg,rgba(255,255,255,.18),rgba(255,255,255,.02)),
    url("../assets/home/clean-experience/text3.jpeg") center / cover no-repeat !important;
  color: var(--ink) !important;
}

.home-page .catalog-cta-card.texture-white p,
.home-page .catalog-cta-card.texture-teal p {
  color: rgba(49,49,49,.72) !important;
}

/* Manifesto closing CTA: supplied travertine texture. */
.manifesto-page .manifesto-cta > div {
  background:
    linear-gradient(90deg,rgba(249,249,249,.62),rgba(249,249,249,.14)),
    url("../assets/home/clean-experience/text1.jpeg") center / cover no-repeat !important;
  color: var(--ink) !important;
}

.manifesto-page .manifesto-cta .button.primary {
  border-color: var(--ink);
  background: rgba(249,249,249,.58);
  color: var(--ink);
  backdrop-filter: blur(8px);
}

.manifesto-page .manifesto-cta .button.primary:hover {
  background: var(--ink) !important;
  color: #fff !important;
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .announcement-track {
    animation: none !important;
  }

  .home-page .subscription-video {
    transform: none !important;
  }
}
.home-page .collection-grid .collection-card > div::after {
  display: none !important;
  content: none !important;
}

/* QA banner refinement: preserve the original Clean layout, add height and shift the video right. */
@media (min-width: 1001px) {
  .home-page .subscription-feature.subscription-video-hero {
    min-height: min(700px, calc(100svh - 110px)) !important;
  }

  .home-page .subscription-video {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0;
    object-position: left 54% !important;
    transform: scale(1.18) !important;
    transform-origin: left center !important;
  }

  .home-page .subscription-video-hero:hover .subscription-video {
    transform: scale(1.195) !important;
  }
}
.home-page .collection-grid .collection-card small {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  min-height: 18px !important;
  margin-top: 24px !important;
  color: var(--ink) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}
.home-page .collection-grid .collection-card small::before {
  display: none !important;
  content: none !important;
}
.home-page .collection-grid .collection-card small::after {
  display: block !important;
  content: 'VIEW →' !important;
  margin-left: auto !important;
  color: var(--ink) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
}
.home-page .collection-grid .collection-card:nth-child(3) small,
.home-page .collection-grid .collection-card:nth-child(3) small::after {
  color: #fff !important;
}

/* Remove legacy floating/duplicate VIEW labels; keep only the inline action above. */
.home-page .collection-grid .collection-card::after,
.home-page .collection-grid .collection-card footer,
.home-page .collection-grid .collection-card footer::before,
.home-page .collection-grid .collection-card footer::after,
.home-page .collection-grid .collection-card footer span::after,
.home-page .collection-grid .collection-card > div::after {
  display: none !important;
  content: none !important;
}
.home-page .collection-grid .collection-card:nth-child(1) small,
.home-page .collection-grid .collection-card:nth-child(1) small::after,
.home-page .collection-grid .collection-card:nth-child(2) small,
.home-page .collection-grid .collection-card:nth-child(2) small::after {
  color: #313131 !important;
}

/* Better-style hover cue: one underline below the compounds/view row. */
.home-page .collection-grid .collection-card small {
  padding-bottom: 16px !important;
  border-bottom: 1px solid transparent !important;
  transition: border-color .3s ease !important;
}
.home-page .collection-grid .collection-card:hover small {
  border-bottom-color: currentColor !important;
}
.home-page .collection-grid .collection-card small::after {
  transition: transform .25s ease, color .25s ease !important;
}
.home-page .collection-grid .collection-card:hover small::after {
  transform: translateX(4px) !important;
}

/* Keep the collection footer visible regardless of inherited card animation rules. */
.home-page .collection-grid .collection-card > div {
  position: relative !important;
  min-height: 220px !important;
  padding-bottom: 42px !important;
}
.home-page .collection-grid .collection-card > div > small {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 5 !important;
}
.home-page .collection-grid .collection-card:nth-child(1) > div > small,
.home-page .collection-grid .collection-card:nth-child(2) > div > small {
  color: #313131 !important;
}
.home-page .collection-grid .collection-card:nth-child(3) > div > small,
.home-page .collection-grid .collection-card:nth-child(3) > div > small::after {
  color: #fff !important;
}

/* Final fallback for the static collection markup: render the footer directly on the card body. */
.home-page .collection-grid .collection-card > div::before {
  position: absolute !important;
  right: auto !important;
  bottom: 0 !important;
  left: 0 !important;
  display: block !important;
  content: '7 COMPOUNDS' !important;
  color: #313131 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
}
.home-page .collection-grid .collection-card:nth-child(2) > div::before { content: '3 COMPOUNDS' !important; }
.home-page .collection-grid .collection-card:nth-child(3) > div::before { content: '6 COMPOUNDS' !important; color: #fff !important; }
.home-page .collection-grid .collection-card > div::after {
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  display: block !important;
  content: 'VIEW →' !important;
  color: #313131 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .12em !important;
}
.home-page .collection-grid .collection-card:nth-child(3) > div::after { color: #fff !important; }

/* Subscribe & Save QA */
.home-page .subscription-feature{position:relative!important;display:grid!important;grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr)!important;min-height:clamp(560px,48vw,690px)!important;padding:0!important;overflow:visible!important;background:var(--moss-soft)!important;border-radius:var(--radius-xl)!important}
.home-page .subscription-visual-media{position:relative!important;inset:auto!important;grid-column:2!important;grid-row:1!important;min-width:0!important;min-height:inherit!important;overflow:hidden!important;background:#f7faf8!important;border-radius:0 var(--radius-xl) var(--radius-xl) 0!important}
.home-page .subscription-visual{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;transform:none!important}
.home-page .subscription-visual-overlay{display:none!important}
.home-page .subscription-copy{position:relative!important;z-index:2!important;grid-column:1!important;grid-row:1!important;display:flex!important;width:auto!important;max-width:none!important;min-height:inherit!important;padding:clamp(42px,5vw,74px)!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;background:transparent!important;color:var(--ink)!important}
.home-page .subscription-copy>span{color:var(--moss-deep)!important;letter-spacing:.14em!important;text-transform:uppercase!important}
.home-page .subscription-copy h2{max-width:620px!important;margin:18px 0 22px!important;color:var(--ink)!important;font-size:clamp(50px,5.3vw,78px)!important;line-height:.98!important;text-wrap:balance!important}
.home-page .subscription-copy p{max-width:520px!important;margin:0 0 30px!important;color:rgba(49,49,49,.74)!important;font-size:clamp(16px,1.35vw,19px)!important;line-height:1.65!important}
.home-page .hero-product-card{overflow:visible!important}
.home-page .hero-product-card img{object-fit:cover!important;object-position:58% center!important}
.product-subscription-label{display:inline-flex;width:fit-content;margin-top:14px;padding:7px 10px;border:1px solid var(--moss-deep);border-radius:999px;color:var(--moss-deep);font-size:11px;font-weight:600;letter-spacing:.05em}
.purchase-options{display:grid;gap:10px;min-width:0;margin:28px 0 18px;padding:0;border:0}
.purchase-options legend{margin-bottom:10px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.purchase-option{display:flex;min-height:58px;padding:14px 16px;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.38);cursor:pointer}
.purchase-option:has(input:checked){border-color:var(--moss-deep);box-shadow:inset 0 0 0 1px var(--moss-deep)}
.purchase-option span{display:flex;align-items:center;gap:10px}.purchase-option input{width:18px;height:18px;margin:0;accent-color:var(--moss-deep)}.purchase-option b{white-space:nowrap}
.delivery-frequency{display:grid;gap:8px;margin-top:4px;font-size:12px;font-weight:700}.delivery-frequency[hidden]{display:none}
.delivery-frequency select,.cart-line-options select{width:100%;min-height:44px;padding:8px 34px 8px 11px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit}
.purchase-option:focus-within,.delivery-frequency select:focus-visible,.cart-line-options select:focus-visible,.quantity-control button:focus-visible{outline:2px solid var(--moss-deep);outline-offset:3px}
.cart-page .cart-item{grid-template-columns:96px minmax(220px,1fr) auto auto!important;grid-template-rows:auto auto!important}
.cart-line-options{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:10px;margin:12px 0}
.cart-line-options label{display:grid;gap:5px;color:var(--muted);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.cart-item .cart-remove{grid-column:4}.cart-item .cart-line-total{white-space:nowrap}
.mini-cart-items .cart-item{grid-template-columns:70px minmax(0,1fr) auto!important;grid-template-rows:auto auto auto!important}.mini-cart-items .cart-item-image{grid-row:1/3}.mini-cart-items .cart-item-copy{min-width:0}.mini-cart-items .cart-line-options{grid-template-columns:1fr}.mini-cart-items .cart-line-total{grid-column:3}.mini-cart-items .cart-remove{grid-column:2;justify-self:start}
.checkout-subscription-info{margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:10px;background:rgba(123,143,133,.08)}.checkout-subscription-info p{margin:0!important}
@media(max-width:900px){.home-page .subscription-feature{grid-template-columns:1fr!important}.home-page .subscription-visual-media{grid-column:1!important;grid-row:1!important;min-height:500px!important;border-radius:var(--radius-xl) var(--radius-xl) 0 0!important}.home-page .subscription-copy{grid-column:1!important;grid-row:2!important;min-height:auto!important}.cart-page .cart-item{grid-template-columns:84px minmax(0,1fr) auto!important}.cart-item .cart-remove{grid-column:2;justify-self:start}}
@media(max-width:600px){.home-page .subscription-feature{border-radius:22px!important}.home-page .subscription-visual-media{min-height:390px!important;border-radius:22px 22px 0 0!important}.home-page .subscription-copy{padding:36px 24px 40px!important}.home-page .subscription-copy h2{font-size:clamp(46px,14vw,62px)!important}.home-page .why-clean-card{min-height:470px!important}.cart-page .cart-items{padding:18px!important}.cart-page .cart-item,.mini-cart-items .cart-item{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto!important}.cart-item-image,.mini-cart-items .cart-item-image{grid-column:1!important;grid-row:auto!important;width:100%!important;height:150px!important}.cart-item-copy,.mini-cart-items .cart-item-copy{grid-column:1!important}.cart-line-options{grid-template-columns:1fr}.cart-item .quantity-control,.cart-item .cart-line-total,.cart-item .cart-remove,.mini-cart-items .cart-line-total,.mini-cart-items .cart-remove{grid-column:1!important;justify-self:start}.cart-item .cart-line-total{margin-top:8px}.cart-item .cart-remove{margin-top:4px}}
@media(max-width:600px){body.cart-page [data-cart-items] .cart-item,body .cart-drawer .cart-item{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:none!important}body.cart-page [data-cart-items] .cart-item>* ,body .cart-drawer .cart-item>*{grid-column:1!important;grid-row:auto!important}body.cart-page [data-cart-items] .cart-item-image,body .cart-drawer .cart-item-image{width:100%!important;height:160px!important}body.cart-page [data-cart-items] .cart-item-copy,body .cart-drawer .cart-item-copy{width:100%!important;min-width:0!important}}

/* Final cart alignment refinements. */
@media(min-width:901px){
  .cart-page .cart-line-total{
    transform:translateY(28px);
  }
}

.cart-page .checkout-subscription-info{
  display:flex;
  min-height:92px;
  align-items:center;
  justify-content:center;
  padding:18px 24px 18px 32px;
  background:#f7f3e9;
}

.cart-page .checkout-subscription-info p{
  width:100%;
  text-align:center;
}

/* Restore the original full-video Clean campaign banner. */
.home-page .subscription-feature.subscription-video-hero,
.home-page .subscription-video-media {
  overflow: hidden !important;
}
