/* ==========================================================================
   MOSSORY — design system (from v0.app / lunea)
   ========================================================================== */

:root {
  color-scheme: light;
  --ms-background: oklch(0.968 0.007 83);
  --ms-foreground: oklch(0.29 0.018 55);
  --ms-card: oklch(0.982 0.006 85);
  --ms-primary: oklch(0.31 0.028 68);
  --ms-primary-fg: oklch(0.97 0.008 85);
  --ms-secondary: oklch(0.93 0.012 80);
  --ms-muted: oklch(0.925 0.01 80);
  --ms-muted-fg: oklch(0.52 0.02 60);
  --ms-accent: oklch(0.55 0.12 38);
  --ms-border: oklch(0.88 0.012 78);
  --ms-radius: 0.25rem;
  --ms-max: 1200px;
  --ms-font-serif: "Cormorant Garamond", ui-serif, Georgia, serif;
  --ms-font-sans: "Jost", ui-sans-serif, system-ui, sans-serif;
}

/* Reset Astra chrome on brand pages */
.mossory-theme.mossory-home #content,
.mossory-theme.mossory-product #content,
.mossory-theme.mossory-shop #content,
.mossory-theme.mossory-home .site-content,
.mossory-theme.mossory-product .site-content,
.mossory-theme.mossory-shop .site-content,
.mossory-theme.mossory-home .ast-container,
.mossory-theme.mossory-product .ast-container,
.mossory-theme.mossory-shop .ast-container {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

.mossory-theme.mossory-home #ast-scroll-top,
.mossory-theme.mossory-product #ast-scroll-top,
.mossory-theme.mossory-shop #ast-scroll-top {
  display: none !important;
}

.mossory-theme.mossory-home .ms-main,
.mossory-theme.mossory-product .ms-main,
.mossory-theme.mossory-shop .ms-main,
.mossory-theme.mossory-home main,
.mossory-theme.mossory-product .site-main,
.mossory-theme.mossory-shop .site-main {
  margin: 0;
  padding: 0;
}

.mossory-theme img {
  max-width: 100%;
  height: auto;
}

.mossory-theme.mossory-home #primary,
.mossory-theme.mossory-product #primary,
.mossory-theme.mossory-home .ast-article-single,
.mossory-theme.mossory-product .ast-article-single {
  margin: 0;
  padding: 0;
}

.mossory-theme.mossory-home .entry-header,
.mossory-theme.mossory-product .entry-header,
.mossory-theme.mossory-home .ast-breadcrumbs-wrapper,
.mossory-theme.mossory-product .ast-breadcrumbs-wrapper,
.mossory-theme.mossory-product .woocommerce-breadcrumb,
.mossory-theme.mossory-product .woocommerce-product-gallery,
.mossory-theme.mossory-product .product_meta,
.mossory-theme.mossory-product .ms-purchase-wrap > .woocommerce-product-details__short-description,
.mossory-theme.mossory-product .ms-purchase-wrap > .price,
.mossory-theme.mossory-product .ms-purchase-wrap > .product_title,
.mossory-theme.mossory-product .ast-sticky-add-to-cart,
.mossory-theme.mossory-product .ast-onsale-card {
  display: none !important;
}

.mossory-theme.mossory-product .ms-purchase .quantity::before {
  content: none;
}

.mossory-theme.mossory-product .ms-purchase form.cart {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

/* Kill WooCommerce default float/width on .summary — breaks full-bleed grid */
.mossory-theme.mossory-product div.product div.summary,
.mossory-theme.mossory-product .ms-purchase-wrap.summary,
.mossory-theme.mossory-product .ms-purchase-wrap.entry-summary {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  clear: none !important;
  margin: 0 !important;
}

.mossory-theme.mossory-product div.product div.images,
.mossory-theme.mossory-product .woocommerce-product-gallery {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
}

.mossory-theme.mossory-product .ms-purchase__cart .quantity {
  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;
  border: 0 !important;
  white-space: nowrap !important;
}

.mossory-theme.mossory-product .ms-main--product,
.mossory-theme.mossory-product #primary,
.mossory-theme.mossory-product .content-area {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
  float: none !important;
}

.mossory-theme.mossory-product .ast-woocommerce-container,
.mossory-theme.mossory-product .woocommerce {
  max-width: none;
  padding: 0;
  margin: 0;
}

.mossory-theme {
  background: var(--ms-background);
  color: var(--ms-foreground);
  font-family: var(--ms-font-sans);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

.mossory-theme h1,
.mossory-theme h2,
.mossory-theme h3,
.mossory-theme .ms-serif {
  font-family: var(--ms-font-serif);
  font-weight: 500;
}

.ms-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  flex-shrink: 0;
}

.ms-container {
  width: 100%;
  max-width: var(--ms-max);
  margin-inline: auto;
  padding-inline: 1.5rem;
}

#collections,
#story,
#journal {
  scroll-margin-top: 7rem;
}

.ms-eyebrow {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  color: var(--ms-muted-fg);
  margin: 0;
}

.ms-link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--ms-foreground);
  text-decoration: none;
  transition: color 0.2s ease;
}

.ms-link:hover {
  color: var(--ms-accent);
}

.ms-link .ms-icon {
  width: 14px;
  height: 14px;
}

.ms-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.875rem 1.75rem;
  font-size: 12px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.25s ease, color 0.25s ease, opacity 0.25s ease;
  border-radius: 0;
  font-family: inherit;
  line-height: 1.2;
}

.ms-btn--primary {
  background: var(--ms-primary);
  color: var(--ms-primary-fg);
}

.ms-btn--primary:hover {
  background: var(--ms-accent);
  color: var(--ms-primary-fg);
}

.ms-btn .ms-icon {
  width: 14px;
  height: 14px;
}

.ms-btn--outline {
  background: transparent;
  border: 1px solid var(--ms-primary);
  color: var(--ms-primary);
}

.ms-btn--outline:hover {
  background: var(--ms-secondary);
}

.ms-btn--block {
  width: 100%;
  padding: 1rem;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.ms-header {
  position: sticky;
  top: 0;
  z-index: 50;
}

.ms-announce {
  background: var(--ms-primary);
  color: var(--ms-primary-fg);
  text-align: center;
  font-size: 12px; /* v0 text-xs */
  font-weight: 400;
  letter-spacing: 0.15em;
  padding: 0.5rem 1rem; /* py-2 px-4 */
  line-height: 1.4;
}

.ms-nav-bar {
  background: color-mix(in oklab, var(--ms-background) 90%, transparent); /* bg-background/90 */
  backdrop-filter: blur(4px); /* backdrop-blur-sm */
  -webkit-backdrop-filter: blur(4px);
  border-bottom: none;
}

.ms-nav-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 68px;
}

.ms-nav-links {
  display: none;
  flex: 1;
  align-items: center;
  gap: 2rem; /* gap-8 */
  list-style: none;
  margin: 0;
  padding: 0;
}

.ms-nav-item {
  position: relative;
}

.ms-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 12px; /* text-xs */
  text-transform: uppercase;
  letter-spacing: 0.18em;
  white-space: nowrap;
  color: color-mix(in oklab, var(--ms-foreground) 80%, transparent);
  text-decoration: none;
  transition: color 0.2s ease;
}

.ms-nav-link:hover,
.ms-nav-item--has-sub.is-open > .ms-nav-link {
  color: var(--ms-accent);
}

.ms-nav-chevron {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  opacity: 0.7;
  transition: transform 0.2s ease;
}

.ms-nav-item--has-sub.is-open .ms-nav-chevron {
  transform: rotate(180deg);
}

.ms-nav-sub {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 15rem;
  margin: 0;
  padding: 0.75rem 0 0.5rem;
  list-style: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
  z-index: 60;
}

.ms-nav-sub::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0.75rem;
  bottom: 0;
  background: var(--ms-background);
  border: 1px solid var(--ms-border);
  box-shadow: 0 12px 28px rgba(40, 30, 20, 0.08);
  z-index: -1;
}

.ms-nav-item--has-sub:hover > .ms-nav-sub,
.ms-nav-item--has-sub.is-open > .ms-nav-sub,
.ms-nav-item--has-sub:focus-within > .ms-nav-sub {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.ms-nav-sub a {
  display: block;
  position: relative;
  z-index: 1;
  padding: 0.55rem 1rem;
  font-size: 12px;
  letter-spacing: 0.06em;
  text-transform: none;
  white-space: nowrap;
  color: color-mix(in oklab, var(--ms-foreground) 85%, transparent);
  text-decoration: none;
  transition: color 0.2s ease, background 0.2s ease;
}

.ms-nav-sub a:hover {
  color: var(--ms-accent);
  background: var(--ms-secondary);
}

.ms-nav-sub__all {
  margin-top: 0.25rem;
  border-top: 1px solid var(--ms-border);
  padding-top: 0.25rem;
}

.ms-nav-sub__all a {
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-size: 11px;
}

.ms-logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: var(--ms-foreground);
  flex: 1;
  min-width: 0;
  padding-inline: 0.5rem;
  background: transparent;
  outline: none;
  box-shadow: none;
}

.ms-logo:link,
.ms-logo:visited,
.ms-logo:hover,
.ms-logo:active,
.ms-logo:focus,
.ms-logo:focus-visible {
  color: var(--ms-foreground);
  background: transparent;
  text-decoration: none;
  outline: none;
  box-shadow: none;
}

.ms-logo__img {
  display: block;
  max-height: 2.75rem;
  width: auto;
  max-width: 11rem;
  object-fit: contain;
}

.ms-logo__name {
  font-family: var(--ms-font-serif);
  font-size: 1.875rem; /* text-3xl */
  font-weight: 400;
  letter-spacing: 0.3em;
  line-height: 1;
  margin-right: -0.3em; /* optical center for tracking */
  color: inherit;
}

.ms-logo__tag {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  color: var(--ms-muted-fg);
  margin-top: 0.25rem; /* mt-1 */
  line-height: 1.2;
  text-align: center;
}

.ms-nav-actions {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: flex-end;
  gap: 1.25rem; /* gap-5 */
}

.ms-nav-action {
  display: none;
  align-items: center;
  gap: 0.5rem;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  white-space: nowrap;
  color: color-mix(in oklab, var(--ms-foreground) 80%, transparent);
  text-decoration: none;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  padding: 0;
  transition: color 0.2s ease;
}

.ms-nav-action:hover {
  color: var(--ms-accent);
}

.ms-nav-action--cart {
  display: inline-flex;
}

.ms-nav-action .ms-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Header search overlay */
.ms-search {
  position: relative;
  z-index: 70;
}

.ms-search[hidden] {
  display: none !important;
}

.ms-search__backdrop {
  position: fixed;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  appearance: none;
  -webkit-appearance: none;
  background: rgba(42, 36, 24, 0.42) !important;
  background-color: rgba(42, 36, 24, 0.42) !important;
  background-image: none !important;
  color: transparent !important;
  cursor: pointer;
}

.ms-search__sheet {
  position: relative;
  z-index: 1;
  background: var(--ms-background);
  border-bottom: 1px solid var(--ms-border);
  box-shadow: 0 12px 32px rgba(40, 30, 20, 0.1);
  padding: 1.1rem 0;
  animation: ms-search-in 0.22s ease;
}

@keyframes ms-search-in {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ms-search__form {
  width: 100%;
  max-width: var(--ms-max);
  margin-inline: auto;
  padding-inline: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.ms-search__icon {
  display: inline-flex;
  color: var(--ms-muted-fg);
  flex-shrink: 0;
}

.ms-search__icon .ms-icon {
  width: 18px;
  height: 18px;
}

.ms-search__input {
  flex: 1;
  min-width: 0;
  border: 0 !important;
  border-bottom: 1px solid var(--ms-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--ms-foreground) !important;
  font-family: var(--ms-font-serif);
  font-size: 1.35rem;
  font-weight: 500;
  line-height: 1.4;
  padding: 0.4rem 0 !important;
  outline: none !important;
  -webkit-appearance: none;
  appearance: none;
}

.ms-search__input::placeholder {
  color: var(--ms-muted-fg);
  font-weight: 400;
}

.ms-search__input:focus,
.ms-search__input:focus-visible {
  border-bottom-color: var(--ms-foreground) !important;
  outline: none !important;
  box-shadow: none !important;
}

.ms-search__submit {
  flex-shrink: 0;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: var(--ms-primary) !important;
  background-color: var(--ms-primary) !important;
  color: var(--ms-primary-fg) !important;
  font-family: var(--ms-font-sans);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.7rem 1.1rem;
  cursor: pointer;
  transition: background 0.2s ease;
}

.ms-search__submit:hover,
.ms-search__submit:focus {
  background: var(--ms-accent) !important;
  background-color: var(--ms-accent) !important;
  color: var(--ms-primary-fg) !important;
}

.ms-search__close {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  color: var(--ms-foreground) !important;
  cursor: pointer;
  padding: 0;
}

.ms-search__close:hover,
.ms-search__close:focus {
  color: var(--ms-accent) !important;
  background: transparent !important;
}

.ms-search__close .ms-icon {
  width: 18px;
  height: 18px;
}

.ms-search .screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body.ms-search-open {
  overflow: hidden;
}

/* Labels: hidden below md (v0 hidden md:inline) */
.ms-nav-action span {
  display: none;
}

.ms-nav-action--cart span {
  display: inline;
}

.ms-menu-toggle {
  display: inline-flex;
  background: none;
  border: none;
  color: var(--ms-foreground);
  cursor: pointer;
  padding: 0;
}

.ms-menu-toggle .ms-icon {
  width: 20px;
  height: 20px;
}

.ms-mobile-nav {
  display: none;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem 1.5rem;
  border-top: 1px solid var(--ms-border);
  background: var(--ms-background);
}

.ms-mobile-nav.is-open {
  display: flex;
}

.ms-mobile-nav a {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: color-mix(in oklab, var(--ms-foreground) 80%, transparent);
  text-decoration: none;
}

.ms-mobile-nav__group {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.ms-mobile-nav__children {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding-left: 0.75rem;
  border-left: 1px solid var(--ms-border);
}

.ms-mobile-nav__children a {
  text-transform: none;
  letter-spacing: 0.06em;
  font-size: 12px;
  color: var(--ms-muted-fg);
}

.ms-mobile-nav__all {
  text-transform: uppercase !important;
  letter-spacing: 0.14em !important;
  font-size: 11px !important;
  color: var(--ms-foreground) !important;
}

@media (min-width: 640px) {
  .ms-nav-action--sm {
    display: inline-flex;
  }
}

@media (min-width: 768px) {
  .ms-nav-action span {
    display: inline;
  }
}

@media (min-width: 1024px) {
  .ms-nav-links {
    display: flex;
  }
  .ms-nav-actions {
    gap: 1.5rem; /* lg:gap-6 */
  }
  .ms-menu-toggle {
    display: none;
  }
  .ms-mobile-nav,
  .ms-mobile-nav.is-open {
    display: none;
  }
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */
.ms-hero {
  position: relative;
}

.ms-hero__media {
  position: relative;
  height: min(72vh, 600px);
  min-height: 520px;
  width: 100%;
  overflow: hidden;
  background: #2a2418;
}

.ms-hero__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  transform: scale(1.02);
  animation: ms-hero-ken 18s ease-out forwards;
}

@keyframes ms-hero-ken {
  from { transform: scale(1.06); }
  to { transform: scale(1.02); }
}

.ms-hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(20, 16, 10, 0.62) 0%, rgba(20, 16, 10, 0.38) 38%, rgba(20, 16, 10, 0.12) 68%, transparent 100%),
    linear-gradient(180deg, rgba(20, 16, 10, 0.12) 0%, transparent 35%, rgba(20, 16, 10, 0.18) 100%);
  z-index: 1;
}

.ms-hero__content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  align-items: center;
}

.ms-hero__copy {
  max-width: 36rem;
  color: #fff;
  animation: ms-fade-up 0.9s ease-out both;
}

@keyframes ms-fade-up {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

.ms-hero__copy h1 {
  font-family: var(--ms-font-serif);
  font-size: clamp(2.75rem, 5vw, 3.75rem);
  font-weight: 500;
  line-height: 1.05;
  margin: 0;
  text-wrap: balance;
  color: #fff;
  letter-spacing: 0.01em;
}

.ms-hero__copy p {
  margin: 1.5rem 0 0;
  font-size: 0.9375rem;
  font-weight: 300;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.88);
  max-width: 22rem;
}

@media (min-width: 768px) {
  .ms-hero__copy p {
    font-size: 1rem;
  }
  .ms-hero__media {
    height: 600px;
    min-height: 600px;
  }
}

.ms-hero__copy .ms-btn {
  margin-top: 2rem;
}

/* --------------------------------------------------------------------------
   Home sections shared
   -------------------------------------------------------------------------- */
.ms-section {
  background: var(--ms-background);
}

.ms-section--muted {
  background: var(--ms-muted);
}

.ms-section--soft {
  background: color-mix(in oklab, var(--ms-secondary) 60%, transparent);
}

.ms-section__inner {
  padding-block: 5rem;
}

@media (min-width: 768px) {
  .ms-section__inner {
    padding-block: 6rem;
  }
}

.ms-split {
  display: grid;
  gap: 2.5rem;
}

.ms-split--center {
  align-items: center;
}

@media (min-width: 1024px) {
  .ms-split--intro {
    grid-template-columns: 0.85fr 2.6fr;
    gap: 3.5rem;
  }
  .ms-split--story {
    grid-template-columns: 1fr 1.4fr 0.9fr;
    gap: 3rem;
    align-items: start;
  }
}

.ms-split__intro h2 {
  margin: 1rem 0 0;
  font-family: var(--ms-font-serif);
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 500;
  line-height: 1.15;
  text-wrap: balance;
  color: var(--ms-foreground);
}

.ms-split__intro > p {
  margin: 1.25rem 0 0;
  font-size: 0.875rem;
  font-weight: 300;
  line-height: 1.7;
  color: var(--ms-muted-fg);
  max-width: 16rem;
}

.ms-split__intro .ms-link {
  margin-top: 1.25rem;
}

/* Our Story */
.ms-story__intro .ms-link {
  margin-top: 1.5rem;
}

.ms-story__title {
  margin: 1rem 0 0;
  font-family: var(--ms-font-serif);
  font-size: clamp(2rem, 3.5vw, 2.75rem);
  font-weight: 500;
  line-height: 1.1;
  text-wrap: balance;
  color: var(--ms-foreground);
}

.ms-story__text {
  margin: 1.5rem 0 0;
  font-size: 0.875rem;
  font-weight: 300;
  line-height: 1.7;
  color: var(--ms-muted-fg);
  max-width: 20rem;
}

.ms-story__images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  align-self: stretch;
}

.ms-story__images figure {
  margin: 0;
  overflow: hidden;
  height: 100%;
}

.ms-story__images img {
  width: 100%;
  height: 100%;
  min-height: 280px;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  display: block;
  transition: transform 0.7s ease;
}

.ms-story__images figure:hover img {
  transform: scale(1.04);
}

.ms-features {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
  padding-top: 0.25rem;
}

.ms-feature {
  display: flex;
  gap: 1rem;
}

.ms-feature .ms-icon {
  width: 24px;
  height: 24px;
  color: var(--ms-accent);
  margin-top: 2px;
  stroke-width: 1.25;
}

.ms-feature h3 {
  margin: 0;
  font-family: var(--ms-font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--ms-foreground);
}

.ms-feature p {
  margin: 0.25rem 0 0;
  font-size: 12px;
  font-weight: 300;
  line-height: 1.65;
  color: var(--ms-muted-fg);
}

/* Design journal steps */
.ms-steps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

@media (min-width: 640px) {
  .ms-steps {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .ms-steps {
    grid-template-columns: repeat(5, 1fr);
  }
}

.ms-step img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  display: block;
  transition: transform 0.55s ease;
}

.ms-step:hover img {
  transform: scale(1.05);
}

.ms-step__media {
  overflow: hidden;
  background: var(--ms-secondary);
}

.ms-step__no {
  margin: 0.75rem 0 0;
  font-size: 12px;
  font-weight: 300;
  color: color-mix(in oklab, var(--ms-muted-fg) 70%, transparent);
}

.ms-step__label {
  margin: 0.25rem 0 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.55;
  color: var(--ms-foreground);
}

/* New Arrivals carousel */
.ms-new__right {
  min-width: 0;
}

.ms-carousel-viewport {
  overflow: hidden;
  width: 100%;
}

.ms-products {
  display: flex;
  width: 100%;
  gap: 1.25rem;
  will-change: transform;
  transition: transform 0.45s ease;
}

.ms-products .ms-product-card {
  flex: 0 0 calc((100% - 1.25rem) / 2);
  min-width: 0;
}

@media (min-width: 1024px) {
  .ms-products .ms-product-card {
    flex-basis: calc((100% - 3.75rem) / 4);
  }
}

.ms-carousel-nav {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-bottom: 1rem;
  position: relative;
  z-index: 2;
}

.ms-carousel-btn {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 1px solid var(--ms-border);
  background: var(--ms-background);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--ms-foreground);
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.ms-carousel-btn:hover:not(:disabled) {
  background: var(--ms-secondary);
}

.ms-carousel-btn[data-ms-carousel-next]:not(:disabled) {
  border-color: var(--ms-primary);
  background: var(--ms-primary);
  color: var(--ms-primary-fg);
}

.ms-carousel-btn[data-ms-carousel-next]:hover:not(:disabled) {
  border-color: var(--ms-primary);
  background: var(--ms-primary);
  color: var(--ms-primary-fg);
  filter: brightness(1.08);
}

.ms-carousel-btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
  border-color: var(--ms-border);
  background: var(--ms-background);
  color: var(--ms-foreground);
  filter: none;
}

.ms-carousel-btn.is-loading {
  opacity: 0.7;
  cursor: wait;
}

.ms-carousel-btn .ms-icon {
  width: 16px;
  height: 16px;
  pointer-events: none;
}

.ms-product-card {
  color: inherit;
}

.ms-product-card > a {
  display: block;
  text-decoration: none;
  color: inherit;
}

.ms-product-card__media {
  position: relative;
  overflow: hidden;
  background: var(--ms-secondary);
}

.ms-product-card__badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 1;
  background: var(--ms-primary);
  color: var(--ms-primary-fg);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  padding: 0.25rem 0.65rem;
  border-radius: 0;
}

.ms-product-card__media img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center;
  transition: transform 0.55s ease;
  display: block;
}

.ms-product-card:hover .ms-product-card__media img {
  transform: scale(1.05);
}

.ms-product-card__date {
  margin: 1rem 0 0;
  font-size: 11px;
  font-weight: 300;
  color: color-mix(in oklab, var(--ms-muted-fg) 70%, transparent);
}

.ms-product-card__name {
  margin: 0.4rem 0 0;
  font-family: var(--ms-font-sans);
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--ms-foreground);
}

.ms-product-card__meta {
  margin: 0.15rem 0 0;
  font-size: 12px;
  font-weight: 300;
  color: var(--ms-muted-fg);
}

.ms-product-card__meta--top {
  margin: 1rem 0 0;
}

.ms-product-card__price {
  margin: 0.45rem 0 0;
  font-size: 0.875rem;
  font-weight: 400;
  color: var(--ms-foreground);
}

.ms-product-card__price del {
  opacity: 0.55;
  margin-right: 0.35rem;
}

.ms-product-card__price ins {
  text-decoration: none;
}

.ms-product-card .ms-link {
  margin-top: 0.75rem;
  font-size: 11px;
}

/* --------------------------------------------------------------------------
   Shop / category archive
   -------------------------------------------------------------------------- */
.ms-shop {
  padding-block: 2.5rem 4.5rem;
  background: var(--ms-background);
}

@media (min-width: 768px) {
  .ms-shop {
    padding-block: 3rem 5.5rem;
  }
}

.ms-shop__header {
  max-width: 40rem;
  margin-bottom: 2rem;
}

.ms-shop__crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 1.25rem;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ms-muted-fg);
}

.ms-shop__crumb a {
  color: inherit;
  text-decoration: none;
  transition: color 0.2s ease;
}

.ms-shop__crumb a:hover {
  color: var(--ms-accent);
}

.ms-shop__title {
  margin: 0.75rem 0 0;
  font-family: var(--ms-font-serif);
  font-size: clamp(2rem, 4vw, 2.75rem);
  font-weight: 500;
  line-height: 1.15;
  color: var(--ms-foreground);
}

.ms-shop__desc {
  margin-top: 1rem;
  font-size: 0.9375rem;
  font-weight: 300;
  line-height: 1.7;
  color: var(--ms-muted-fg);
}

.ms-shop__desc p {
  margin: 0;
}

.ms-shop__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.75rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--ms-border);
}

.ms-shop .woocommerce-result-count {
  margin: 0;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ms-muted-fg);
}

.ms-shop .woocommerce-ordering {
  margin: 0;
}

.ms-shop .woocommerce-ordering select {
  appearance: none;
  background: var(--ms-background);
  border: 1px solid var(--ms-border);
  border-radius: 999px;
  color: var(--ms-foreground);
  font-family: inherit;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.55rem 2.25rem 0.55rem 1rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23665c52' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
  cursor: pointer;
}

.ms-shop .woocommerce-ordering select:focus {
  outline: none;
  border-color: var(--ms-primary);
}

.ms-shop ul.products {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem 1.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
}

@media (min-width: 1024px) {
  .ms-shop ul.products {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 2rem 1.25rem;
  }
}

.ms-shop ul.products::before,
.ms-shop ul.products::after {
  display: none;
}

.ms-shop ul.products li.product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.ms-shop .ast-on-card-button,
.ms-shop .ast-card-action-tooltip,
.ms-shop .ast-woo-product-category,
.ms-shop .button.add_to_cart_button,
.ms-shop .added_to_cart {
  display: none !important;
}

.ms-shop .woocommerce-pagination {
  margin-top: 3rem;
}

.ms-shop .woocommerce-pagination ul {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0;
}

.ms-shop .woocommerce-pagination li {
  border: 0;
  margin: 0;
}

.ms-shop .woocommerce-pagination a,
.ms-shop .woocommerce-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.65rem;
  border: 1px solid var(--ms-border);
  border-radius: 999px;
  background: var(--ms-background);
  color: var(--ms-foreground);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-decoration: none;
}

.ms-shop .woocommerce-pagination .current {
  background: var(--ms-primary);
  border-color: var(--ms-primary);
  color: var(--ms-primary-fg);
}

.ms-shop .woocommerce-info,
.ms-shop .woocommerce-message,
.ms-shop .woocommerce-error {
  border: 1px solid var(--ms-border);
  background: var(--ms-secondary);
  color: var(--ms-foreground);
  border-top: 0;
  border-radius: 2px;
}

.mossory-theme.mossory-shop .woocommerce-breadcrumb,
.mossory-theme.mossory-shop .ast-breadcrumbs-wrapper,
.mossory-theme.mossory-shop .entry-header {
  display: none !important;
}

.mossory-theme.mossory-shop #primary,
.mossory-theme.mossory-shop .ast-woocommerce-container,
.mossory-theme.mossory-shop .woocommerce {
  margin: 0;
  padding: 0;
  max-width: none;
  width: 100%;
  float: none;
}

.mossory-theme.mossory-search #content,
.mossory-theme.mossory-search .site-content,
.mossory-theme.mossory-search .ast-container,
.mossory-theme.mossory-search #primary,
.mossory-theme.mossory-search .content-area,
.mossory-theme.mossory-search .site-main {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.ms-search-page__empty {
  padding: 3rem 0 1rem;
  text-align: center;
}

.ms-search-page__empty p {
  margin: 0 0 1.5rem;
  font-family: var(--ms-font-serif);
  font-size: 1.25rem;
  color: var(--ms-muted-fg);
}

.ms-search-page .navigation.pagination,
.ms-search-page .nav-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 2.5rem;
}

.ms-search-page .nav-links a,
.ms-search-page .nav-links span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.65rem;
  border: 1px solid var(--ms-border);
  color: var(--ms-foreground);
  text-decoration: none;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ms-search-page .nav-links .current {
  background: var(--ms-primary);
  border-color: var(--ms-primary);
  color: var(--ms-primary-fg);
}

.ms-search-page .nav-links a:hover {
  border-color: var(--ms-foreground);
}

/* Brand journal banner */
.ms-brand-journal {
  padding-bottom: 2rem;
}

.ms-brand-journal__box {
  background: color-mix(in oklab, var(--ms-secondary) 60%, transparent);
  border-radius: 2px;
  padding: 1.5rem;
  display: grid;
  gap: 2rem;
  align-items: center;
}

@media (min-width: 768px) {
  .ms-brand-journal__box {
    grid-template-columns: 1.4fr 1.6fr;
    padding: 2rem;
  }
}

.ms-brand-journal__left {
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
}

.ms-brand-journal__left .ms-icon {
  width: 48px;
  height: 48px;
  color: var(--ms-accent);
  stroke-width: 0.9;
}

.ms-brand-journal__left h3 {
  margin: 0;
  font-size: 1.5rem;
}

.ms-brand-journal__left p {
  margin: 0.75rem 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--ms-muted-fg);
  max-width: 20rem;
}

.ms-brand-journal__left .ms-link {
  margin-top: 1rem;
  font-size: 11px;
}

.ms-brand-journal__imgs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}

.ms-brand-journal__imgs img {
  width: 100%;
  aspect-ratio: 5 / 4;
  object-fit: cover;
  border-radius: var(--ms-radius);
}

/* Collections */
.ms-collections-section__inner {
  padding-block: 4rem 5rem;
}

@media (min-width: 768px) {
  .ms-collections-section__inner {
    padding-block: 4rem 5rem;
  }
}

.ms-collections {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

@media (min-width: 1024px) {
  .ms-collections {
    grid-template-columns: repeat(4, 1fr);
  }
}

.ms-collection-card {
  position: relative;
  overflow: hidden;
  border-radius: 2px;
  display: block;
  text-decoration: none;
  isolation: isolate;
}

.ms-collection-card img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  transition: transform 0.55s ease;
  display: block;
}

.ms-collection-card:hover img {
  transform: scale(1.05);
}

.ms-collection-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(20, 16, 10, 0.62) 0%, rgba(20, 16, 10, 0.18) 45%, transparent 70%);
  z-index: 1;
  pointer-events: none;
}

.ms-collection-card h3 {
  position: absolute;
  bottom: 1.25rem;
  left: 1rem;
  right: 1rem;
  margin: 0;
  z-index: 2;
  font-family: var(--ms-font-serif);
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.25;
  color: #fff;
  text-wrap: balance;
}

/* Life gallery */
.ms-life__inner {
  padding-block: 4rem 5rem;
}

.ms-life-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}

@media (min-width: 640px) {
  .ms-life-grid {
    grid-template-columns: repeat(5, 1fr);
  }
}

.ms-life-grid a {
  overflow: hidden;
  border-radius: 2px;
  display: block;
  background: var(--ms-secondary);
}

.ms-life-grid img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  transition: transform 0.5s ease;
  display: block;
}

.ms-life-grid a:hover img {
  transform: scale(1.05);
}

/* Inner circle */
.ms-circle {
  display: grid;
  gap: 2.5rem;
  align-items: center;
  padding-block: 3.5rem;
}

@media (min-width: 1024px) {
  .ms-circle {
    grid-template-columns: 1fr 1.6fr;
    gap: 4rem;
  }
}

.ms-circle h2 {
  margin: 0;
  font-family: var(--ms-font-sans);
  font-size: 0.875rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.22em;
}

.ms-circle > div > p {
  margin: 0.75rem 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: var(--ms-muted-fg);
  max-width: 20rem;
}

.ms-subscribe {
  margin-top: 1.25rem;
  display: flex;
  max-width: 28rem;
  border: 1px solid var(--ms-border);
  background: var(--ms-background);
}

.ms-subscribe input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  color: var(--ms-foreground);
  font-family: inherit;
  outline: none;
  min-width: 0;
}

.ms-subscribe button {
  background: var(--ms-primary);
  color: var(--ms-primary-fg);
  border: none;
  padding: 0 1.5rem;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s ease;
}

.ms-subscribe button:hover {
  background: var(--ms-accent);
}

.ms-benefits {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  text-align: center;
}

@media (min-width: 768px) {
  .ms-benefits {
    grid-template-columns: repeat(4, 1fr);
  }
}

.ms-benefits .ms-icon {
  width: 24px;
  height: 24px;
  color: var(--ms-accent);
  margin-inline: auto;
}

.ms-benefits h3 {
  margin: 0.75rem 0 0;
  font-family: var(--ms-font-sans);
  font-size: 12px;
  font-weight: 500;
}

.ms-benefits p {
  margin: 0.4rem 0 0;
  font-size: 11px;
  line-height: 1.55;
  color: var(--ms-muted-fg);
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.ms-footer {
  background: var(--ms-background);
  border-top: 1px solid var(--ms-border);
}

.ms-footer__inner {
  padding-block: 4rem;
}

.ms-footer__grid {
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 1024px) {
  .ms-footer__grid {
    grid-template-columns: 1.4fr 1fr 1fr 1fr 1.1fr;
  }
}

.ms-footer__brand .ms-logo__name {
  font-size: 1.5rem;
}

.ms-footer__brand > p {
  margin: 1.25rem 0 0;
  font-size: 12px;
  line-height: 1.65;
  color: var(--ms-muted-fg);
  max-width: 15rem;
}

.ms-footer__social {
  display: flex;
  gap: 1rem;
  margin-top: 1.5rem;
}

.ms-footer__social a {
  color: var(--ms-muted-fg);
  transition: color 0.2s ease;
}

.ms-footer__social a:hover {
  color: var(--ms-accent);
}

.ms-footer__social .ms-icon {
  width: 16px;
  height: 16px;
}

.ms-footer__col h3 {
  margin: 0;
  font-family: var(--ms-font-sans);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.2em;
}

.ms-footer__col ul {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}

.ms-footer__col li + li {
  margin-top: 0.65rem;
}

.ms-footer__col a {
  font-size: 12px;
  color: var(--ms-muted-fg);
  text-decoration: none;
  transition: color 0.2s ease;
}

.ms-footer__col a:hover {
  color: var(--ms-accent);
}

.ms-footer__img {
  width: 100%;
  aspect-ratio: 10 / 7;
  object-fit: cover;
  border-radius: var(--ms-radius);
}

.ms-footer__bottom {
  margin-top: 3.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--ms-border);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

@media (min-width: 640px) {
  .ms-footer__bottom {
    flex-direction: row;
  }
}

.ms-footer__bottom p,
.ms-footer__bottom a {
  font-size: 11px;
  color: var(--ms-muted-fg);
  text-decoration: none;
  margin: 0;
}

.ms-footer__legal {
  display: flex;
  gap: 1.5rem;
}

.ms-footer__legal a:hover {
  color: var(--ms-accent);
}

/* --------------------------------------------------------------------------
   Product page — full-bleed gallery-forward hero (v0 update)
   -------------------------------------------------------------------------- */
.ms-product-hero {
  position: relative;
  padding: 0;
  /*
   * Shared: thumb top + slant low point.
   * Align to title text top (pad + badge + title margin), plus optical nudge
   * so the serif cap-height reads level with the cut.
   */
  --ms-pdp-title-top: calc(2.5rem + 13px + 0.75rem + 14px);
}

.ms-product-hero__grid {
  display: grid;
  gap: 0;
}

@media (min-width: 1024px) {
  .ms-product-hero__grid {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
  }
}

.ms-product-hero__gallery {
  position: relative;
  min-width: 0;
  padding: 0;
  /* Mobile: height from content */
  height: auto;
  min-height: 0;
}

@media (min-width: 640px) {
  .ms-product-hero__gallery {
    height: 100%;
    min-height: 420px;
  }
}

@media (min-width: 1024px) {
  .ms-product-hero__gallery {
    min-height: 640px;
  }
}

.ms-purchase-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 2.5rem 1.5rem;
  min-width: 0;
  box-sizing: border-box;
}

@media (min-width: 1024px) {
  .ms-purchase-wrap {
    padding: 2.5rem 3.5rem;
  }
}

.ms-purchase-wrap .ms-purchase {
  width: 100%;
  max-width: 32rem;
  min-width: 0;
}

/* ------------------------------------------------------------------
   Gallery
   Mobile (<640): main on top, horizontal thumbs below (lunea update)
   Desktop (640+): overlay thumbs — keep PC customizations
   ------------------------------------------------------------------ */
.ms-gallery {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  gap: 0.75rem;
  width: 100%;
  height: auto;
  min-height: 0;
}

/* Mobile thumbs — horizontal scroll under main image */
.ms-gallery__thumbs {
  display: flex;
  position: static;
  z-index: 2;
  left: auto;
  top: auto;
  transform: none;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  width: auto;
  max-width: 100%;
  padding: 0 1rem 0.25rem;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  pointer-events: auto;
}

.ms-gallery__thumbs > * {
  pointer-events: auto;
  flex-shrink: 0;
}

.ms-gallery__thumb {
  overflow: hidden;
  width: 64px;
  border-radius: var(--ms-radius);
  border: 1px solid var(--ms-border);
  box-shadow: none;
  padding: 0;
  background: var(--ms-card);
  cursor: pointer;
  opacity: 1;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.ms-gallery__thumb:hover {
  border-color: var(--ms-muted-fg);
  opacity: 1;
}

.ms-gallery__thumb.is-active {
  border-color: var(--ms-accent);
  box-shadow: none;
  opacity: 1;
}

.ms-gallery__thumb img {
  width: 100%;
  aspect-ratio: 76 / 88;
  object-fit: cover;
  display: block;
}

.ms-gallery__video {
  margin-top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  color: var(--ms-muted-fg);
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  opacity: 1;
  transition: color 0.2s ease, opacity 0.2s ease;
  text-shadow: none;
}

.ms-gallery__video:hover {
  color: var(--ms-accent);
  opacity: 1;
}

.ms-gallery__video-circle {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid var(--ms-border);
  background: transparent;
  backdrop-filter: none;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
}

.ms-gallery__video .ms-icon {
  width: 14px;
  height: 14px;
}

.ms-gallery__video span {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  line-height: 1.2;
  text-align: center;
}

/* Product video modal */
html.ms-video-open,
html.ms-video-open body {
  overflow: hidden;
}

.ms-video-modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}

.ms-video-modal[hidden] {
  display: none !important;
}

.ms-video-modal__backdrop {
  position: absolute;
  inset: 0;
  background: color-mix(in oklab, var(--ms-foreground) 55%, transparent);
  border: none;
  cursor: pointer;
}

.ms-video-modal__dialog {
  position: relative;
  z-index: 1;
  width: min(920px, 100%);
  background: #000;
  border-radius: var(--ms-radius);
  overflow: hidden;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
}

.ms-video-modal__close {
  position: absolute;
  top: 0.65rem;
  right: 0.65rem;
  z-index: 2;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 999px;
  background: color-mix(in oklab, #000 45%, transparent);
  color: #fff;
  cursor: pointer;
  padding: 0;
}

.ms-video-modal__close:hover {
  background: color-mix(in oklab, #000 65%, transparent);
}

.ms-video-modal__close .ms-icon {
  width: 1.1rem;
  height: 1.1rem;
}

.ms-video-modal__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}

.ms-video-modal__frame iframe,
.ms-video-modal__frame video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: #000;
}

.ms-video-modal__frame video {
  object-fit: contain;
}

/* Mobile main image */
.ms-gallery__main {
  position: relative;
  inset: auto;
  width: 100%;
  min-height: 380px;
  overflow: hidden;
  background: var(--ms-secondary);
  /* Mobile slant: left high, right low (same direction as PC) */
  clip-path: polygon(0 0, 100% 3.5%, 100% 100%, 0 100%);
}

.ms-gallery__main img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Desktop / tablet — overlay thumbs (PC customizations preserved) */
@media (min-width: 640px) {
  .ms-gallery {
    display: block;
    height: 100%;
    min-height: inherit;
    gap: 0;
  }

  .ms-gallery__thumbs {
    position: absolute;
    left: 5rem;
    top: var(--ms-pdp-title-top);
    flex-direction: column;
    align-items: stretch;
    width: 72px;
    max-width: none;
    padding: 0;
    overflow: visible;
    pointer-events: none;
  }

  .ms-gallery__thumbs > * {
    pointer-events: auto;
    flex-shrink: 0;
  }

  .ms-gallery__thumb {
    width: 100%;
    border: 1.5px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 1px 6px rgba(42, 36, 24, 0.14);
    opacity: 1;
  }

  .ms-gallery__thumb:hover {
    border-color: var(--ms-foreground);
    box-shadow: 0 2px 8px rgba(42, 36, 24, 0.18);
  }

  .ms-gallery__thumb.is-active {
    border-color: var(--ms-foreground);
    border-width: 2px;
    box-shadow: 0 2px 10px rgba(42, 36, 24, 0.22);
  }

  .ms-gallery__thumb img {
    aspect-ratio: 1;
  }

  .ms-gallery__video {
    margin-top: 0.35rem;
    color: var(--ms-foreground);
    opacity: 1;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.55);
  }

  .ms-gallery__video:hover {
    color: var(--ms-accent);
  }

  .ms-gallery__video-circle {
    border: 1.5px solid rgba(255, 255, 255, 0.9);
    background: color-mix(in oklab, var(--ms-card) 82%, transparent);
    backdrop-filter: blur(4px);
    box-shadow: 0 1px 6px rgba(42, 36, 24, 0.16);
  }

  .ms-gallery__main {
    position: absolute;
    inset: 0;
    min-height: 0;
    /* PC slant: left high, right low */
    clip-path: polygon(0 0, 100% var(--ms-pdp-title-top), 100% 100%, 0 100%);
  }
}

@media (min-width: 1024px) {
  .ms-gallery__thumbs {
    left: 7.5rem;
    width: 76px;
    gap: 0.75rem;
  }
}

/* Purchase panel — match v0 PurchasePanel (gallery slant untouched) */
.ms-purchase {
  font-family: var(--ms-font-sans);
  color: var(--ms-foreground);
}

.ms-purchase .ms-badge {
  font-size: 11px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  color: var(--ms-accent);
  margin: 0;
  font-family: var(--ms-font-sans);
  font-weight: 400;
}

.ms-purchase h1,
.ms-purchase__title {
  margin: 0.75rem 0 0;
  padding: 0;
  font-family: var(--ms-font-serif);
  font-size: 2.25rem; /* text-4xl */
  font-weight: 500;
  line-height: 1.25; /* leading-tight */
  letter-spacing: normal;
  color: var(--ms-foreground);
}

@media (min-width: 768px) {
  .ms-purchase h1,
  .ms-purchase__title {
    font-size: 2.6rem; /* md:text-[2.6rem] */
  }
}

.ms-purchase__price {
  margin: 0.75rem 0 0; /* mt-3 */
  padding: 0;
  font-family: var(--ms-font-serif);
  font-size: 1.5rem; /* text-2xl */
  font-weight: 400;
  line-height: 1.3;
  color: var(--ms-foreground);
  min-height: 1.3em;
  font-variant-numeric: tabular-nums;
}

.ms-purchase__price .amount,
.ms-purchase__price .woocommerce-Price-amount {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

.ms-purchase__excerpt {
  margin: 1rem 0 0; /* mt-4 */
  font-family: var(--ms-font-sans);
  font-size: 0.875rem; /* text-sm */
  font-style: normal;
  font-weight: 400;
  line-height: 1.625; /* leading-relaxed */
  color: var(--ms-muted-fg);
  max-width: 28rem; /* max-w-md */
}

.ms-purchase__excerpt p {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
}

.ms-purchase__features {
  margin-top: 1.5rem; /* mt-6 */
  display: flex;
  flex-wrap: wrap;
  column-gap: 1.5rem; /* gap-x-6 */
  row-gap: 0.75rem; /* gap-y-3 */
  border-block: 1px solid var(--ms-border);
  padding-block: 1rem; /* py-4 */
}

.ms-purchase__features span {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem; /* gap-2 */
  font-family: var(--ms-font-sans);
  font-size: 0.75rem; /* text-xs */
  line-height: 1.3;
  color: color-mix(in oklab, var(--ms-foreground) 80%, transparent);
  white-space: nowrap;
}

.ms-purchase__features .ms-icon {
  width: 16px; /* h-4 w-4 */
  height: 16px;
  flex-shrink: 0;
  color: var(--ms-accent);
  stroke-width: 1.4;
}

/* Option groups: Chain / Gift / etc. — v0 mt-6 rhythm */
.ms-purchase__options {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-top: 1.5rem;
}

.ms-purchase__options .ms-option {
  margin-top: 0;
}

.ms-option {
  margin-top: 1.5rem;
}

.ms-option__label {
  font-family: var(--ms-font-sans);
  font-size: 11px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--ms-muted-fg);
  margin: 0;
  font-weight: 400;
}

.ms-option__chips {
  margin-top: 0.75rem; /* mt-3 */
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem; /* gap-3 */
}

.ms-chip {
  padding: 0.5rem 1.25rem; /* py-2 px-5 */
  font-family: var(--ms-font-sans);
  font-size: 0.75rem; /* text-xs */
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0.025em; /* tracking-wide */
  border-radius: calc(var(--ms-radius) * 0.6); /* rounded-sm */
  border: 1px solid var(--ms-border);
  background: transparent;
  color: color-mix(in oklab, var(--ms-foreground) 80%, transparent);
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}

.ms-chip.is-active {
  background: var(--ms-primary);
  color: var(--ms-primary-fg);
  border-color: var(--ms-primary);
}

.ms-chip.is-active:hover {
  background: var(--ms-primary);
  border-color: var(--ms-primary);
  opacity: 0.92;
}

.ms-chip:hover:not(.is-active) {
  border-color: color-mix(in oklab, var(--ms-foreground) 28%, var(--ms-border));
  background: color-mix(in oklab, var(--ms-secondary) 88%, var(--ms-background));
  color: var(--ms-foreground);
}

.ms-chip small {
  margin-left: 0.5rem; /* ml-2 */
  opacity: 0.7;
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
}

.ms-chip.is-active small {
  opacity: 0.85;
  color: inherit;
}

/* Custom quantity (matches v0) */
.ms-qty {
  margin-top: 0.75rem;
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--ms-border);
  border-radius: calc(var(--ms-radius) * 0.6);
  background: transparent;
  overflow: hidden;
}

.ms-qty__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.625rem 0.75rem; /* py-2.5 px-3 */
  border: none;
  background: transparent;
  color: var(--ms-muted-fg);
  cursor: pointer;
  font-family: inherit;
  line-height: 1;
  transition: color 0.2s ease, background 0.2s ease;
}

.ms-qty__btn:hover {
  color: var(--ms-foreground);
  background: color-mix(in oklab, var(--ms-secondary) 88%, var(--ms-background));
}

.ms-qty__btn .ms-icon {
  width: 14px; /* h-3.5 w-3.5 */
  height: 14px;
}

.ms-qty__value {
  width: 3rem; /* w-12 */
  text-align: center;
  font-size: 0.875rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--ms-foreground);
  font-family: var(--ms-font-sans);
}

.ms-purchase__cta {
  margin-top: 1.75rem; /* mt-7 */
  display: flex;
  flex-direction: column;
  gap: 0.75rem; /* space-y-3 */
}

.ms-purchase__cart {
  margin-top: 0;
}

.ms-purchase__cart form.cart {
  margin: 0;
  display: block;
  position: relative;
}

.ms-purchase__cart form.cart::after {
  content: none;
  display: none;
}

.ms-purchase form.cart .single_add_to_cart_button,
.ms-purchase .ms-buy-now {
  width: 100%;
  margin: 0 !important;
  float: none !important;
  background: var(--ms-primary) !important;
  color: var(--ms-primary-fg) !important;
  border: none !important;
  border-radius: calc(var(--ms-radius) * 0.6) !important; /* rounded-sm */
  padding: 1rem !important; /* py-4 */
  font-size: 0.75rem !important; /* text-xs */
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 400 !important;
  font-family: var(--ms-font-sans) !important;
  line-height: 1.2 !important;
  cursor: pointer;
  box-shadow: none !important;
  height: auto !important;
  min-height: 0 !important;
  white-space: nowrap;
}

.ms-purchase form.cart .single_add_to_cart_button:hover {
  opacity: 0.9;
  background: var(--ms-primary) !important;
}

.ms-purchase .ms-buy-now {
  display: block;
  text-align: center;
  text-decoration: none;
  background: transparent !important;
  color: var(--ms-primary) !important;
  border: 1px solid var(--ms-primary) !important;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.ms-purchase .ms-buy-now:hover {
  background: color-mix(in oklab, var(--ms-secondary) 92%, var(--ms-primary)) !important;
  border-color: var(--ms-primary) !important;
  color: var(--ms-primary) !important;
}

.ms-materials-section {
  background: var(--ms-background);
}

.ms-materials {
  max-width: 1100px;
  margin-inline: auto;
  padding: 3.5rem 1.5rem;
}

@media (min-width: 768px) {
  .ms-materials {
    padding-block: 4rem;
  }
}

.ms-complete {
  padding-block: 3.5rem;
}

@media (min-width: 768px) {
  .ms-complete {
    padding-block: 4rem;
  }
}

.ms-reviews {
  padding-block: 3.5rem;
}

@media (min-width: 768px) {
  .ms-reviews {
    padding-block: 4rem;
  }
}

.ms-footer__brand-link {
  display: inline-flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  background: transparent;
}

.ms-footer__brand-link:link,
.ms-footer__brand-link:visited,
.ms-footer__brand-link:hover,
.ms-footer__brand-link:active,
.ms-footer__brand-link:focus {
  color: inherit;
  background: transparent;
  text-decoration: none;
  outline: none;
}

.ms-footer__brand-link .ms-logo__tag {
  display: block;
}

.ms-mobile-nav__util {
  margin-top: 0.5rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--ms-border);
  color: var(--ms-muted-fg) !important;
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
  font-family: inherit;
  font-size: inherit;
  cursor: pointer;
}

.ms-purchase table.variations {
  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;
}

.ms-purchase table.variations th,
.ms-purchase table.variations td {
  display: block;
  text-align: left;
  padding: 0;
  border: none;
  background: none;
}

.ms-purchase table.variations th.label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: var(--ms-muted-fg);
  font-weight: 400;
  padding-bottom: 0.5rem;
}

.ms-purchase table.variations tr + tr th.label {
  padding-top: 1rem;
}

.ms-purchase table.variations select {
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius);
  background: var(--ms-background);
  padding: 0.6rem 0.75rem;
  font-family: inherit;
  font-size: 0.875rem;
}

.ms-purchase .reset_variations {
  display: none !important;
}

/* Hide WC variation info block — we show price / ATC ourselves (avoids layout jump). */
.ms-purchase .single_variation_wrap .woocommerce-variation,
.ms-purchase .woocommerce-variation-description,
.ms-purchase .woocommerce-variation-price,
.ms-purchase .woocommerce-variation-availability {
  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;
  border: 0 !important;
}

/* Accordion — v0 PurchasePanel */
.ms-accordion {
  margin-top: 1.75rem; /* mt-7 */
  border-top: 1px solid var(--ms-border);
  background: transparent;
}

.ms-accordion__item {
  border-bottom: 1px solid var(--ms-border);
  background: transparent;
}

.ms-accordion__trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 0.35rem;
  margin: 0 -0.35rem;
  background: none;
  border: none;
  border-radius: calc(var(--ms-radius) * 0.6);
  cursor: pointer;
  font-family: var(--ms-font-sans);
  font-size: 0.75rem;
  line-height: 1.2;
  text-align: left;
  color: inherit;
  box-shadow: none;
  transition: background 0.2s ease;
}

.ms-accordion__trigger:hover {
  background: color-mix(in oklab, var(--ms-secondary) 85%, var(--ms-background));
}

.ms-accordion__trigger-label {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem; /* gap-3 */
  font-size: 0.75rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: color-mix(in oklab, var(--ms-foreground) 90%, transparent);
}

.ms-accordion__trigger-label .ms-icon {
  width: 16px;
  height: 16px;
  color: var(--ms-accent);
  flex-shrink: 0;
}

.ms-accordion__trigger > .ms-icon {
  width: 16px;
  height: 16px;
  color: var(--ms-muted-fg);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.ms-accordion__item.is-open .ms-accordion__trigger > .ms-icon {
  transform: rotate(180deg);
}

.ms-accordion__body {
  display: none;
  padding: 0 1rem 1rem 1.75rem; /* pb-4 pl-7 pr-4 */
  font-family: var(--ms-font-sans);
  font-size: 0.75rem;
  line-height: 1.625;
  color: var(--ms-muted-fg);
  margin: 0;
}

.ms-accordion__item.is-open .ms-accordion__body {
  display: block;
}

/* Product story — full-bleed split, image flush to right edge */
.ms-pstory {
  background: color-mix(in oklab, var(--ms-secondary) 50%, transparent);
}

.ms-pstory__grid {
  display: grid;
}

@media (min-width: 1024px) {
  .ms-pstory__grid {
    grid-template-columns: 1fr 1.1fr;
  }
}

.ms-pstory__copy {
  display: flex;
  align-items: center;
  padding: 3.5rem 1.5rem;
}

@media (min-width: 1024px) {
  .ms-pstory__copy {
    padding-top: 6rem;
    padding-bottom: 6rem;
    padding-right: 4rem;
    padding-left: max(2rem, calc((100vw - 1200px) / 2));
  }
}

.ms-pstory__copy-inner {
  max-width: 28rem;
}

.ms-pstory__copy h2 {
  margin: 1rem 0 0;
  font-size: clamp(1.875rem, 3.2vw, 2.5rem);
  line-height: 1.15;
  text-wrap: balance;
}

.ms-pstory__copy p {
  margin: 1.25rem 0 0;
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--ms-muted-fg);
}

.ms-pstory__copy .ms-link {
  margin-top: 1.5rem;
  font-size: 11px;
}

.ms-pstory__media {
  position: relative;
  min-height: 340px;
}

@media (min-width: 1024px) {
  .ms-pstory__media {
    min-height: 520px;
  }
}

.ms-pstory__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ms-materials__grid {
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 768px) {
  .ms-materials__grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .ms-materials__item + .ms-materials__item {
    border-left: 1px solid var(--ms-border);
    padding-left: 2.5rem;
  }
}

.ms-materials__item {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

.ms-materials__item img {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: var(--ms-radius);
  flex-shrink: 0;
}

.ms-materials__item h3 {
  margin: 0;
  font-family: var(--ms-font-sans);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.18em;
}

.ms-materials__item p {
  margin: 0.5rem 0 0;
  font-size: 12px;
  line-height: 1.55;
  color: var(--ms-muted-fg);
}

/* Wear gallery */
.ms-wear {
  padding-top: 0;
  padding-bottom: 1rem;
}

.ms-wear h2 {
  margin: 0;
  text-align: center;
  font-family: var(--ms-font-sans);
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: var(--ms-muted-fg);
}

.ms-wear__grid {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}

@media (min-width: 1024px) {
  .ms-wear__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.ms-wear__grid img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--ms-radius);
  transition: transform 0.5s ease;
  display: block;
}

.ms-wear__item {
  overflow: hidden;
  border-radius: var(--ms-radius);
}

.ms-wear__item:hover img {
  transform: scale(1.05);
}

/* Complete collection */
.ms-complete {
  padding-block: 3.5rem;
}

.ms-complete__grid {
  display: grid;
  gap: 3rem;
}

@media (min-width: 1024px) {
  .ms-complete__grid {
    grid-template-columns: 1.6fr 1.4fr;
    gap: 4rem;
  }
}

.ms-complete__products {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
  margin-top: 1.5rem;
}

.ms-complete__product {
  text-align: center;
  text-decoration: none;
  color: inherit;
}

.ms-complete__product-media {
  overflow: hidden;
  border-radius: var(--ms-radius);
  background: color-mix(in oklab, var(--ms-secondary) 60%, transparent);
}

.ms-complete__product img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  transition: transform 0.5s ease;
  display: block;
}

.ms-complete__product:hover img {
  transform: scale(1.05);
}

.ms-complete__product p {
  margin: 0.75rem 0 0;
  font-size: 12px;
}

.ms-complete__product .price {
  margin-top: 0.25rem;
  color: var(--ms-muted-fg);
}

.ms-complete__studio {
  display: grid;
  gap: 1.5rem;
  align-items: center;
}

@media (min-width: 640px) {
  .ms-complete__studio {
    grid-template-columns: 1fr 1fr;
  }
}

@media (min-width: 1024px) {
  .ms-complete__studio {
    border-left: 1px solid var(--ms-border);
    padding-left: 4rem;
  }
}

.ms-complete__studio p.text {
  margin: 1rem 0 0;
  font-size: 0.875rem;
  line-height: 1.65;
  color: var(--ms-muted-fg);
}

.ms-complete__studio .ms-link {
  margin-top: 1.5rem;
  font-size: 11px;
}

.ms-complete__studio img {
  width: 100%;
  aspect-ratio: 6 / 5;
  object-fit: cover;
  border-radius: var(--ms-radius);
}

/* Reviews */
.ms-reviews {
  background: color-mix(in oklab, var(--ms-secondary) 50%, transparent);
  border-block: 1px solid var(--ms-border);
  padding-block: 3.5rem;
}

.ms-reviews__grid {
  display: grid;
  gap: 2.5rem;
}

@media (min-width: 1024px) {
  .ms-reviews__grid {
    grid-template-columns: 0.9fr 2.4fr;
    gap: 3.5rem;
    align-items: start;
  }
}

.ms-reviews__score {
  font-family: var(--ms-font-serif);
  font-size: 3.75rem;
  line-height: 1;
  margin: 1.25rem 0 0;
}

.ms-stars {
  display: flex;
  gap: 2px;
  color: var(--ms-accent);
  margin-top: 0.75rem;
}

.ms-stars .ms-icon {
  width: 14px;
  height: 14px;
  fill: currentColor;
  stroke: none;
}

.ms-reviews__count {
  margin: 0.5rem 0 0;
  font-size: 12px;
  color: var(--ms-muted-fg);
}

.ms-reviews__all {
  margin-top: 1.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius);
  padding: 0.65rem 1rem;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--ms-foreground);
  text-decoration: none;
  transition: background 0.2s ease;
}

.ms-reviews__all:hover {
  background: var(--ms-background);
}

.ms-reviews__cards {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 768px) {
  .ms-reviews__cards {
    grid-template-columns: repeat(3, 1fr);
  }
}

.ms-review {
  display: flex;
  gap: 1rem;
}

.ms-review img {
  width: 96px;
  height: 112px;
  object-fit: cover;
  border-radius: var(--ms-radius);
  flex-shrink: 0;
}

.ms-review p {
  margin: 0.75rem 0 0;
  font-size: 12px;
  line-height: 1.6;
  color: color-mix(in oklab, var(--ms-foreground) 90%, transparent);
}

.ms-review__author {
  margin-top: 1rem !important;
  font-size: 11px !important;
  color: var(--ms-muted-fg) !important;
}

/* Service bar */
.ms-services {
  border-bottom: 1px solid var(--ms-border);
  padding-block: 2rem;
}

.ms-services__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .ms-services__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.ms-service {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.ms-service .ms-icon {
  width: 24px;
  height: 24px;
  color: var(--ms-accent);
}

.ms-service strong {
  display: block;
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.ms-service span {
  font-size: 11px;
  color: var(--ms-muted-fg);
}

/* Sticky bar */
.ms-sticky-bar {
  position: fixed;
  bottom: 1.25rem;
  right: 1.25rem;
  z-index: 40;
  opacity: 0;
  transform: translateY(1rem);
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.ms-sticky-bar.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.ms-sticky-bar__inner {
  display: flex;
  align-items: center;
  gap: 1rem;
  border: 1px solid var(--ms-border);
  background: var(--ms-card);
  padding: 0.75rem;
  border-radius: var(--ms-radius);
  box-shadow: 0 10px 30px rgba(42, 36, 24, 0.12);
}

.ms-sticky-bar__inner img {
  width: 48px;
  height: 48px;
  object-fit: cover;
  border-radius: var(--ms-radius);
  flex-shrink: 0;
}

.ms-sticky-bar__info {
  padding-right: 0.5rem;
  min-width: 0;
}

.ms-sticky-bar__info p {
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ms-sticky-bar__info span {
  font-size: 12px;
  color: var(--ms-muted-fg);
}

.ms-sticky-bar__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--ms-primary) !important;
  background-color: var(--ms-primary) !important;
  color: var(--ms-primary-fg) !important;
  border: none !important;
  padding: 0.65rem 1rem;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  border-radius: var(--ms-radius);
  cursor: pointer;
  font-family: inherit;
  flex-shrink: 0;
  box-shadow: none !important;
  transition: background 0.25s ease, background-color 0.25s ease;
}

.ms-sticky-bar__btn:hover,
.ms-sticky-bar__btn:focus,
.ms-sticky-bar__btn:active,
body.mossory-theme .ms-sticky-bar__btn:hover,
body.mossory-theme .ms-sticky-bar__btn:focus,
body.mossory-theme.woocommerce-js .ms-sticky-bar__btn:hover {
  background: var(--ms-accent) !important;
  background-color: var(--ms-accent) !important;
  color: var(--ms-primary-fg) !important;
}

.ms-sticky-bar__btn .ms-icon {
  width: 14px;
  height: 14px;
}

/* Mobile sticky — full-width bottom bar (lunea) */
@media (max-width: 639px) {
  .mossory-theme.mossory-product {
    padding-bottom: 4.75rem;
  }

  .ms-sticky-bar {
    left: 0;
    right: 0;
    bottom: 0;
  }

  .ms-sticky-bar__inner {
    width: 100%;
    gap: 0.75rem;
    border: none;
    border-top: 1px solid var(--ms-border);
    border-radius: 0;
    padding: 0.75rem 1rem;
    box-shadow: 0 -8px 24px rgba(42, 36, 24, 0.1);
  }

  .ms-sticky-bar__inner img {
    width: 44px;
    height: 44px;
  }

  .ms-sticky-bar__info {
    flex: 1;
    padding-right: 0;
  }

  .ms-sticky-bar__btn {
    padding: 0.75rem 1.25rem;
  }

  /* Purchase panel mobile spacing */
  .ms-purchase-wrap {
    padding: 2rem 1.5rem 2.5rem;
  }

  .ms-purchase h1,
  .ms-purchase__title {
    font-size: 2rem;
  }

  .ms-option__chips {
    gap: 0.5rem;
  }

  .ms-chip {
    padding: 0.5rem 1rem;
  }

  .ms-complete__product p {
    font-size: 11px;
  }
}

/* --------------------------------------------------------------------------
   WooCommerce / default pages — shared content width
   Astra plain-container leaves titles full-bleed while .woocommerce is 1200px
   -------------------------------------------------------------------------- */
.mossory-theme.woocommerce-account #primary,
.mossory-theme.woocommerce-cart #primary,
.mossory-theme.woocommerce-checkout #primary,
.mossory-theme.woocommerce-order-received #primary,
.mossory-theme.page-template-default:not(.mossory-home):not(.mossory-product):not(.mossory-shop) #primary {
  width: 100%;
  max-width: var(--ms-max);
  margin-inline: auto;
  padding-inline: 1.5rem;
  box-sizing: border-box;
}

.mossory-theme.woocommerce-account .woocommerce,
.mossory-theme.woocommerce-cart .woocommerce,
.mossory-theme.woocommerce-checkout .woocommerce,
.mossory-theme.woocommerce-order-received .woocommerce {
  max-width: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
}

.mossory-theme.woocommerce-account .entry-header,
.mossory-theme.woocommerce-cart .entry-header,
.mossory-theme.woocommerce-checkout .entry-header,
.mossory-theme.woocommerce-order-received .entry-header,
.mossory-theme.page-template-default:not(.mossory-home):not(.mossory-product):not(.mossory-shop) .entry-header {
  margin: 0 0 1.75rem;
  padding: 0;
  width: 100%;
}

.mossory-theme.woocommerce-account .entry-title,
.mossory-theme.woocommerce-cart .entry-title,
.mossory-theme.woocommerce-checkout .entry-title,
.mossory-theme.woocommerce-order-received .entry-title,
.mossory-theme.page-template-default:not(.mossory-home):not(.mossory-product):not(.mossory-shop) .entry-title {
  margin: 0;
  width: auto;
  max-width: none;
}

/* --------------------------------------------------------------------------
   WooCommerce system pages — My Account / Cart / Checkout
   Align default blue links & chrome with Mossory palette
   -------------------------------------------------------------------------- */
.mossory-theme.woocommerce-account,
.mossory-theme.woocommerce-cart,
.mossory-theme.woocommerce-checkout,
.mossory-theme.woocommerce-order-received {
  background: var(--ms-background);
  color: var(--ms-foreground);
}

.mossory-theme.woocommerce-account .entry-title,
.mossory-theme.woocommerce-account .ast-article-single .entry-header .entry-title,
.mossory-theme.woocommerce-cart .entry-title,
.mossory-theme.woocommerce-checkout .entry-title,
.mossory-theme.woocommerce-account h1,
.mossory-theme.woocommerce-account h2,
.mossory-theme.woocommerce-account h3,
.mossory-theme.woocommerce-cart h1,
.mossory-theme.woocommerce-cart h2,
.mossory-theme.woocommerce-checkout h1,
.mossory-theme.woocommerce-checkout h2,
.mossory-theme.woocommerce-checkout h3 {
  color: var(--ms-foreground) !important;
  font-family: var(--ms-font-serif);
  font-weight: 500;
}

.mossory-theme.woocommerce-account a,
.mossory-theme.woocommerce-cart a,
.mossory-theme.woocommerce-checkout a,
.mossory-theme.woocommerce-order-received a,
.mossory-theme.woocommerce-account .woocommerce-MyAccount-content a,
.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation a {
  color: var(--ms-foreground) !important;
  text-decoration: none;
  transition: color 0.2s ease;
}

.mossory-theme.woocommerce-account a:hover,
.mossory-theme.woocommerce-account a:focus,
.mossory-theme.woocommerce-cart a:hover,
.mossory-theme.woocommerce-cart a:focus,
.mossory-theme.woocommerce-checkout a:hover,
.mossory-theme.woocommerce-checkout a:focus,
.mossory-theme.woocommerce-order-received a:hover,
.mossory-theme.woocommerce-account .woocommerce-MyAccount-content a:hover,
.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation a:hover {
  color: var(--ms-accent) !important;
}

/* My Account navigation */
.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation {
  background: var(--ms-card);
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius);
  overflow: hidden;
}

.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation li {
  border-bottom: 1px solid var(--ms-border);
  margin: 0;
  padding: 0;
}

.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
  border-bottom: none;
}

.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation a {
  display: block;
  padding: 0.85rem 1.1rem;
  font-size: 13px;
  letter-spacing: 0.04em;
  background: transparent;
}

.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.mossory-theme.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a:hover {
  background: var(--ms-secondary);
  color: var(--ms-foreground) !important;
  font-weight: 500;
}

.mossory-theme.woocommerce-account .woocommerce-MyAccount-content {
  color: var(--ms-foreground);
}

.mossory-theme.woocommerce-account .woocommerce-MyAccount-content strong {
  color: var(--ms-foreground);
  font-weight: 500;
}

/* Buttons */
.mossory-theme.woocommerce-account .woocommerce button.button,
.mossory-theme.woocommerce-account .woocommerce a.button,
.mossory-theme.woocommerce-account .woocommerce input.button,
.mossory-theme.woocommerce-cart .woocommerce button.button,
.mossory-theme.woocommerce-cart .woocommerce a.button,
.mossory-theme.woocommerce-cart .woocommerce input.button,
.mossory-theme.woocommerce-checkout .woocommerce button.button,
.mossory-theme.woocommerce-checkout .woocommerce a.button,
.mossory-theme.woocommerce-checkout .woocommerce input.button,
.mossory-theme.woocommerce-checkout #place_order {
  background: var(--ms-primary) !important;
  color: var(--ms-primary-fg) !important;
  border: none !important;
  border-radius: 0;
  font-family: var(--ms-font-sans);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.85rem 1.5rem;
  transition: background 0.25s ease;
}

.mossory-theme.woocommerce-account .woocommerce button.button:hover,
.mossory-theme.woocommerce-account .woocommerce a.button:hover,
.mossory-theme.woocommerce-account .woocommerce input.button:hover,
.mossory-theme.woocommerce-cart .woocommerce button.button:hover,
.mossory-theme.woocommerce-cart .woocommerce a.button:hover,
.mossory-theme.woocommerce-cart .woocommerce input.button:hover,
.mossory-theme.woocommerce-checkout .woocommerce button.button:hover,
.mossory-theme.woocommerce-checkout .woocommerce a.button:hover,
.mossory-theme.woocommerce-checkout .woocommerce input.button:hover,
.mossory-theme.woocommerce-checkout #place_order:hover {
  background: var(--ms-accent) !important;
  color: var(--ms-primary-fg) !important;
}

.mossory-theme.woocommerce-account .woocommerce button.button.alt,
.mossory-theme.woocommerce-cart .woocommerce button.button.alt,
.mossory-theme.woocommerce-checkout .woocommerce button.button.alt {
  background: var(--ms-primary) !important;
  color: var(--ms-primary-fg) !important;
}

/* Forms */
.mossory-theme.woocommerce-account .woocommerce input[type="text"],
.mossory-theme.woocommerce-account .woocommerce input[type="email"],
.mossory-theme.woocommerce-account .woocommerce input[type="password"],
.mossory-theme.woocommerce-account .woocommerce input[type="tel"],
.mossory-theme.woocommerce-account .woocommerce input[type="number"],
.mossory-theme.woocommerce-account .woocommerce select,
.mossory-theme.woocommerce-account .woocommerce textarea,
.mossory-theme.woocommerce-cart .woocommerce input.input-text,
.mossory-theme.woocommerce-checkout .woocommerce input.input-text,
.mossory-theme.woocommerce-checkout .woocommerce select,
.mossory-theme.woocommerce-checkout .woocommerce textarea {
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius);
  background: var(--ms-card);
  color: var(--ms-foreground);
  font-family: var(--ms-font-sans);
}

.mossory-theme.woocommerce-account .woocommerce input:focus,
.mossory-theme.woocommerce-account .woocommerce select:focus,
.mossory-theme.woocommerce-account .woocommerce textarea:focus,
.mossory-theme.woocommerce-cart .woocommerce input.input-text:focus,
.mossory-theme.woocommerce-checkout .woocommerce input.input-text:focus,
.mossory-theme.woocommerce-checkout .woocommerce select:focus,
.mossory-theme.woocommerce-checkout .woocommerce textarea:focus {
  border-color: var(--ms-foreground);
  outline: none;
  box-shadow: none;
}

/* Tables */
.mossory-theme.woocommerce-account .woocommerce table.shop_table,
.mossory-theme.woocommerce-cart .woocommerce table.shop_table,
.mossory-theme.woocommerce-checkout .woocommerce table.shop_table {
  border: 1px solid var(--ms-border);
  border-radius: var(--ms-radius);
  background: var(--ms-card);
}

.mossory-theme.woocommerce-account .woocommerce table.shop_table th,
.mossory-theme.woocommerce-account .woocommerce table.shop_table td,
.mossory-theme.woocommerce-cart .woocommerce table.shop_table th,
.mossory-theme.woocommerce-cart .woocommerce table.shop_table td,
.mossory-theme.woocommerce-checkout .woocommerce table.shop_table th,
.mossory-theme.woocommerce-checkout .woocommerce table.shop_table td {
  border-color: var(--ms-border);
  color: var(--ms-foreground);
}

/* Notices — override Astra/Woo default blue icon & View cart button */
body.mossory-theme .woocommerce-message,
body.mossory-theme .woocommerce-info,
body.mossory-theme .woocommerce-error,
body.mossory-theme.woocommerce-js .woocommerce-message,
body.mossory-theme.woocommerce-js .woocommerce-info,
body.mossory-theme.woocommerce-js .woocommerce-error {
  border: 1px solid var(--ms-border) !important;
  border-top-width: 3px !important;
  background: var(--ms-secondary) !important;
  color: var(--ms-foreground) !important;
  border-radius: var(--ms-radius);
}

body.mossory-theme .woocommerce-message {
  border-top-color: var(--ms-accent) !important;
}

body.mossory-theme .woocommerce-info {
  border-top-color: var(--ms-muted-fg) !important;
}

body.mossory-theme .woocommerce-error {
  border-top-color: #b54a3a !important;
  background: color-mix(in oklab, #b54a3a 8%, var(--ms-card)) !important;
}

body.mossory-theme .woocommerce-message::before,
body.mossory-theme .woocommerce-info::before,
body.mossory-theme.woocommerce-js .woocommerce-message::before,
body.mossory-theme.woocommerce-js .woocommerce-info::before {
  color: var(--ms-accent) !important;
}

body.mossory-theme .woocommerce-error::before,
body.mossory-theme.woocommerce-js .woocommerce-error::before {
  color: #b54a3a !important;
}

body.mossory-theme .woocommerce-message a:not(.button),
body.mossory-theme .woocommerce-info a:not(.button),
body.mossory-theme .woocommerce-error a:not(.button) {
  color: var(--ms-accent) !important;
}

body.mossory-theme .woocommerce-message a.button,
body.mossory-theme .woocommerce-info a.button,
body.mossory-theme .woocommerce-error a.button,
body.mossory-theme .woocommerce-message a.button.wc-forward,
body.mossory-theme .woocommerce-info a.button.wc-forward,
body.mossory-theme .woocommerce-error a.button.wc-forward,
body.mossory-theme.woocommerce-js .woocommerce-message a.button,
body.mossory-theme.woocommerce-js .woocommerce-message a.button.wc-forward {
  background: var(--ms-primary) !important;
  background-color: var(--ms-primary) !important;
  color: var(--ms-primary-fg) !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: var(--ms-font-sans);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none !important;
  padding: 0.65rem 1.15rem !important;
  box-shadow: none !important;
}

body.mossory-theme .woocommerce-message a.button:hover,
body.mossory-theme .woocommerce-info a.button:hover,
body.mossory-theme .woocommerce-error a.button:hover,
body.mossory-theme .woocommerce-message a.button.wc-forward:hover,
body.mossory-theme.woocommerce-js .woocommerce-message a.button:hover,
body.mossory-theme.woocommerce-js .woocommerce-message a.button.wc-forward:hover {
  background: var(--ms-accent) !important;
  background-color: var(--ms-accent) !important;
  color: var(--ms-primary-fg) !important;
}

/* Woo notices */
.mossory-product .woocommerce-notices-wrapper {
  max-width: var(--ms-max);
  margin: 1rem auto 0;
  padding-inline: 1.5rem;
}

/* Fallback when oklch unsupported */
@supports not (color: oklch(0 0 0)) {
  :root {
    --ms-background: #f5f2ec;
    --ms-foreground: #4a4238;
    --ms-card: #faf8f4;
    --ms-primary: #4a4032;
    --ms-primary-fg: #f7f4ee;
    --ms-secondary: #ede9e1;
    --ms-muted: #ebe7df;
    --ms-muted-fg: #8a8070;
    --ms-accent: #c06b3e;
    --ms-border: #ded8cd;
  }
}