/* ==========================================================================
   Waterman Made, post-migration additions.
   Kept separate so prototype/styles.css stays frozen as reference.
   ========================================================================== */


/* --------------------------------------------------------------------------
   Trust Fall funky band, white stays INSIDE the wavy shape.
   Mask-image clips the white band to a wavy top + bottom edge.
   -------------------------------------------------------------------------- */
.trust-fall-funky {
  --tf-wave-top: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='10' viewBox='0 0 32 10'%3E%3Cpath d='M0,5 Q8,0.5 16,5 T32,5 L32,10 L0,10 Z' fill='white'/%3E%3C/svg%3E");
  --tf-wave-bot: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='10' viewBox='0 0 32 10'%3E%3Cpath d='M0,5 Q8,0.5 16,5 T32,5 L32,0 L0,0 Z' fill='white'/%3E%3C/svg%3E");
  -webkit-mask-image: var(--tf-wave-top), linear-gradient(#fff, #fff), var(--tf-wave-bot);
          mask-image: var(--tf-wave-top), linear-gradient(#fff, #fff), var(--tf-wave-bot);
  -webkit-mask-repeat: repeat-x, no-repeat, repeat-x;
          mask-repeat: repeat-x, no-repeat, repeat-x;
  -webkit-mask-size: 32px 10px, 100% calc(100% - 20px), 32px 10px;
          mask-size: 32px 10px, 100% calc(100% - 20px), 32px 10px;
  -webkit-mask-position: top left, center, bottom left;
          mask-position: top left, center, bottom left;
  -webkit-mask-composite: source-over;
          mask-composite: add;
}
/* Old decorative wave stripes are redundant now. The edge IS the wave. */
.trust-fall-funky::before,
.trust-fall-funky::after {
  display: none;
}


/* --------------------------------------------------------------------------
   Trust Fall teaser (used on Finishing + Work Together), same treatment,
   but wavy top edge only (prototype only had a wave on top).
   -------------------------------------------------------------------------- */
.trust-fall-teaser {
  border-top: none;
  --tf-wave-top: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='10' viewBox='0 0 32 10'%3E%3Cpath d='M0,5 Q8,0.5 16,5 T32,5 L32,10 L0,10 Z' fill='white'/%3E%3C/svg%3E");
  -webkit-mask-image: var(--tf-wave-top), linear-gradient(#fff, #fff);
          mask-image: var(--tf-wave-top), linear-gradient(#fff, #fff);
  -webkit-mask-repeat: repeat-x, no-repeat;
          mask-repeat: repeat-x, no-repeat;
  -webkit-mask-size: 32px 10px, 100% calc(100% - 10px);
          mask-size: 32px 10px, 100% calc(100% - 10px);
  -webkit-mask-position: top left, bottom left;
          mask-position: top left, bottom left;
  -webkit-mask-composite: source-over;
          mask-composite: add;
}
.trust-fall-teaser::before {
  display: none;
}


/* --------------------------------------------------------------------------
   Equal-height cards on homepage + Work Together.
   -------------------------------------------------------------------------- */
.work-together-mini,
.doors {
  align-items: stretch;
}
.work-together-mini .wt-card,
.doors .door {
  height: 100%;
}
.wt-card__cta,
.door__cta {
  margin-top: auto;
}


/* --------------------------------------------------------------------------
   Card hover, shared by homepage wt-cards and Work Together doors.
   Both pages use one combined selector block per rule so any future change
   applies to both consistently.
   - 7px outside frame (pseudo-element, opacity-only fade).
   - Wash fills the ENTIRE card on hover so no slivers appear in the gap
     between the figure and the body wrapper.
   - Card content position is locked: prototype's translate/shadow/dim
     are explicitly cancelled so nothing reflows when hovered.
   - Color comes from the inline `--card-wash` variable on each card.
   -------------------------------------------------------------------------- */

/* Default state: strip prototype defaults, prep transition + positioning */
body.page-home .wt-card,
body.page-work-together .door {
  position: relative;
  transition: background 260ms var(--ease);
  transform: none !important;
  box-shadow: none !important;
  border: none !important;
  background: transparent !important;
}

/* Outside frame, opacity 0 by default */
body.page-home .wt-card::before,
body.page-work-together .door::before {
  content: "";
  position: absolute;
  inset: -7px;
  border: 7px solid var(--card-wash, var(--c-cream));
  opacity: 0;
  transition: opacity 260ms var(--ease);
  pointer-events: none;
  z-index: 2;
}

/* Hover/focus: wash fills the card AND the frame fades in */
body.page-home .wt-card:hover,
body.page-home .wt-card:focus-visible,
body.page-work-together .door:hover,
body.page-work-together .door:focus-visible {
  background: var(--card-wash, transparent) !important;
}
body.page-home .wt-card:hover::before,
body.page-home .wt-card:focus-visible::before,
body.page-work-together .door:hover::before,
body.page-work-together .door:focus-visible::before {
  opacity: 1;
}

/* Inner body wrapper. Homepage's .wt-card__inner (added in src/index.njk)
   and Work Together's .door__body (from prototype) get identical layout
   so spacing between text rows matches across both pages. */
body.page-home .wt-card__inner,
body.page-work-together .door__body {
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 1.2vw, 14px);
  padding: clamp(18px, 2.2vw, 28px);
}

/* Cancel prototype's image-dim filter so the only hover motion is wash + frame */
body.page-home .wt-card:hover img,
body.page-work-together .door:hover img {
  filter: none !important;
}


/* --------------------------------------------------------------------------
   Journal entry body: inline images and pull quotes break out of the
   paragraph max-width so they reach their intended widths.
   -------------------------------------------------------------------------- */
body.page-note .note-body {
  max-width: none;
  padding-inline: var(--gutter);
}
body.page-note .note-body > p {
  max-width: 66ch;
  margin-inline: auto;
}
body.page-note .note-body > .note-pullquote {
  max-width: 52ch;
  margin-inline: auto;
}
body.page-note .note-body > .note-image {
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}


/* --------------------------------------------------------------------------
   Gallery lightbox link wrapper
   -------------------------------------------------------------------------- */
.work-item__link {
  display: contents;
  color: inherit;
  text-decoration: none;
}
.work-item__link:focus-visible img {
  outline: 3px solid var(--c-fg);
  outline-offset: 3px;
}
.pswp {
  --pswp-bg: #0a0a0a;
  --pswp-icon-color: var(--c-cream);
  --pswp-icon-color-secondary: rgba(242, 240, 235, 0.3);
}
.pswp__button { opacity: 0.72; }
.pswp__button:hover { opacity: 1; }


/* --------------------------------------------------------------------------
   Shop, product card refinement
   -------------------------------------------------------------------------- */
.product__link {
  display: contents;
  color: inherit;
  text-decoration: none;
}
.product {
  padding: clamp(12px, 1.4vw, 18px);
  margin: calc(-1 * clamp(12px, 1.4vw, 18px));
  transition: background 260ms var(--ease);
  cursor: pointer;
  position: relative;
}
.product:hover {
  background: color-mix(in srgb, var(--c-ink) 6%, transparent);
}
/* Square product images, was 4:5 in prototype */
.product__figure {
  aspect-ratio: 1 / 1 !important;
}
.product__title {
  font-size: clamp(17px, 1.4vw, 21px) !important;
  line-height: 1.2;
}
.product__price {
  font-size: 12.5px !important;
  opacity: 0.82;
}
/* 2-line description clamp keeps every product card the same height. */
.product__body {
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: var(--c-ink) !important;
  max-width: 38ch !important;
  opacity: 0.85;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(14px * 1.5 * 2);
}
/* "Shop All Products" button uses .product__cta but lives outside a
   .product__link wrapper, so wire its hover state directly. */
a.product__cta:hover {
  background: var(--c-ink);
  color: var(--c-bg);
}
a.product__cta:hover::after {
  transform: translateX(4px);
}
.product__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  padding: 10px 16px;
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: var(--tracking-mono);
  color: var(--c-ink);
  background: transparent;
  border: 1px solid var(--c-ink);
  text-decoration: none;
  align-self: flex-start;
  transition: background 160ms var(--ease), color 160ms var(--ease), transform 160ms var(--ease);
}
.product__cta::after {
  content: "→";
  transition: transform var(--t-fast) var(--ease);
}
.product__link:hover .product__cta {
  background: var(--c-ink);
  color: var(--c-bg);
}

.wm-product-page {
  padding-top: clamp(22px, 4vw, 44px);
}

.wm-product-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(28px, 6vw, 86px);
  align-items: start;
}

.wm-product-layout.reveal {
  opacity: 1;
  transform: none;
  will-change: auto;
}

@media (min-width: 980px) {
  .wm-product-page > .wrap {
    padding-right: clamp(18px, 2.25vw, 36px);
  }

  .wm-product-layout {
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.76fr);
    gap: clamp(20px, 2.75vw, 44px);
  }
}

.wm-product-media {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.5vw, 18px);
  margin: 0;
}

.wm-product-media__mobile-scroll {
  display: flex;
  gap: 10px;
  margin-inline: calc(-1 * var(--gutter));
  padding-inline: var(--gutter);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.wm-product-media__mobile-scroll::-webkit-scrollbar {
  display: none;
}

.wm-product-media__mobile-panel {
  flex: 0 0 min(86vw, 520px);
  scroll-snap-align: start;
  background: color-mix(in srgb, var(--c-ink) 5%, transparent);
}

.wm-product-media__mobile-image {
  width: 100%;
  aspect-ratio: 1 / 1.08;
  object-fit: cover;
  display: block;
}

.wm-product-media__cascade {
  display: grid;
  gap: clamp(12px, 1.5vw, 18px);
}

.wm-product-media__cascade-panel {
  background: color-mix(in srgb, var(--c-ink) 5%, transparent);
  overflow: hidden;
}

.wm-product-media__image {
  width: 100%;
  aspect-ratio: 1 / 1.04;
  object-fit: cover;
  display: block;
  transition: opacity 160ms var(--ease);
}

@media (min-width: 980px) {
  .wm-product-media__mobile-scroll {
    display: none;
  }

  .wm-product-media__cascade-panel:nth-child(n + 2) {
    width: 92%;
  }

  .wm-product-media__cascade-panel:nth-child(even) {
    justify-self: end;
  }

  .wm-product-media__cascade-panel:nth-child(3n) {
    width: 84%;
  }

  .wm-product-media__cascade-panel--primary {
    width: 100%;
  }

  .wm-product-media__cascade-panel--primary .wm-product-media__image {
    min-height: min(720px, calc(100vh - 150px));
  }
}

@media (max-width: 979px) {
  .wm-product-media__cascade {
    display: none;
  }
}

.wm-product-summary {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

@media (min-width: 980px) {
  .wm-product-summary {
    position: sticky;
    top: 96px;
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}

.wm-product-summary__eyebrow {
  margin-bottom: 14px;
}

.wm-product-summary__title {
  max-width: 13ch;
  margin: 0;
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: clamp(40px, 4.8vw, 66px);
  line-height: 0.96;
  letter-spacing: 0;
}

.wm-product-summary__price {
  margin-top: clamp(18px, 2.4vw, 28px);
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: var(--tracking-mono);
}

.wm-product-summary__materials,
.wm-product-summary__note {
  margin-top: 10px;
  max-width: 46ch;
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.45;
  letter-spacing: var(--tracking-mono);
  color: var(--c-ink-muted);
}

.wm-product-summary__intro {
  margin-top: clamp(18px, 2.4vw, 26px);
  max-width: 56ch;
  font-size: clamp(16px, 1.12vw, 18px);
  line-height: 1.55;
}

.wm-product-buy {
  width: 100%;
  margin-top: clamp(14px, 1.9vw, 22px);
  padding-top: clamp(12px, 1.6vw, 18px);
  border-top: 1px solid var(--c-rule);
}

.wm-product-buy .variations_form,
.wm-product-buy form.cart {
  width: 100%;
}

.wm-variation-swatch-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
}

.wm-swatches-ready .wm-variation-native {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.wm-variation-picker {
  position: relative;
  width: 100%;
}

.wm-variation-picker[open] {
  z-index: 18;
}

.wm-variation-picker__summary {
  min-height: 48px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--c-ink) 28%, transparent);
  background: color-mix(in srgb, var(--c-bg) 84%, white);
  color: var(--c-ink);
  cursor: pointer;
  list-style: none;
  transition: border-color 160ms var(--ease), background 160ms var(--ease), box-shadow 160ms var(--ease);
}

.wm-variation-picker__summary::-webkit-details-marker {
  display: none;
}

.wm-variation-picker__summary:hover,
.wm-variation-picker[open] .wm-variation-picker__summary {
  border-color: var(--c-ink);
  background: color-mix(in srgb, var(--c-ink) 6%, transparent);
}

.wm-variation-picker[open] .wm-variation-picker__summary {
  box-shadow: inset 0 0 0 1px var(--c-ink);
}

.wm-variation-picker__selection {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  overflow: hidden;
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.25;
  letter-spacing: var(--tracking-mono);
  text-transform: uppercase;
}

.wm-variation-swatch-field:not(.has-selection) .wm-variation-picker__selection {
  color: var(--c-ink-muted);
}

.wm-variation-picker__selection .wm-swatch-button__chip {
  width: 22px;
  height: 22px;
}

.wm-variation-picker__value {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wm-variation-picker__chevron {
  width: 10px;
  height: 10px;
  flex: 0 0 auto;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 160ms var(--ease);
}

.wm-variation-picker[open] .wm-variation-picker__chevron {
  transform: rotate(-135deg) translateY(-1px);
}

.wm-variation-picker__panel {
  margin-top: 8px;
  padding: 10px;
  border: 1px solid var(--c-ink);
  background: var(--c-bg);
  z-index: 18;
}

@media (min-width: 980px) {
  .wm-product-summary__eyebrow {
    margin-bottom: 10px;
  }

  .wm-product-summary__price {
    margin-top: 16px;
  }

  .wm-product-summary__intro {
    margin-top: 14px;
    line-height: 1.48;
  }

  .wm-variation-picker__panel {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    margin-top: 0;
    box-shadow: 0 18px 38px color-mix(in srgb, var(--c-ink) 15%, transparent);
  }
}

.wm-variation-swatches {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  max-width: none;
}

.wm-variation-swatches[data-attribute_name="attribute_pa_wmm-finish"] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wm-variation-swatches[data-attribute_name="attribute_pa_wmm-wood"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.wm-swatch-button {
  min-height: 44px;
  width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  border: 1px solid color-mix(in srgb, var(--c-ink) 24%, transparent);
  background: color-mix(in srgb, var(--c-bg) 84%, white);
  color: var(--c-ink);
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: var(--tracking-mono);
  text-align: left;
  line-height: 1.2;
  transition: border-color 160ms var(--ease), background 160ms var(--ease), box-shadow 160ms var(--ease), color 160ms var(--ease), opacity 160ms var(--ease);
}

.wm-swatch-button:hover,
.wm-swatch-button.is-selected {
  border-color: var(--c-ink);
  background: color-mix(in srgb, var(--c-ink) 6%, transparent);
}

.wm-swatch-button.is-selected {
  box-shadow: inset 0 0 0 1px var(--c-ink);
}

.wm-swatch-button:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}

.wm-swatch-button.is-unavailable {
  color: color-mix(in srgb, var(--c-ink) 55%, transparent);
  background: repeating-linear-gradient(
    -45deg,
    transparent,
    transparent 7px,
    color-mix(in srgb, var(--c-ink) 8%, transparent) 7px,
    color-mix(in srgb, var(--c-ink) 8%, transparent) 9px
  );
}

.wm-swatch-button.is-unavailable .wm-swatch-button__chip {
  filter: grayscale(1);
}

.wm-swatch-button__chip {
  width: 24px;
  height: 24px;
  border-radius: 999px;
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--c-ink) 22%, transparent);
  overflow: hidden;
}

.wm-swatch-button__label {
  overflow-wrap: anywhere;
}

.wm-swatch-button__chip--color {
  background: var(--wm-swatch-color);
}

.wm-swatch-button__chip--image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.woocommerce div.product form.cart table.variations,
.wm-product-buy form.cart table.variations {
  display: block;
  width: 100%;
  border: 0;
  margin: 0;
}

.woocommerce div.product form.cart table.variations tbody,
.wm-product-buy form.cart table.variations tbody {
  display: block;
}

.woocommerce div.product form.cart table.variations tr,
.wm-product-buy form.cart table.variations tr {
  display: block;
  padding: 0 0 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid var(--c-rule);
}

.woocommerce div.product form.cart table.variations tr:last-child,
.wm-product-buy form.cart table.variations tr:last-child {
  margin-bottom: 0;
  border-bottom: 0;
}

.woocommerce div.product form.cart table.variations th,
.woocommerce div.product form.cart table.variations td,
.wm-product-buy form.cart table.variations th,
.wm-product-buy form.cart table.variations td {
  display: block;
  padding: 0;
  border: 0;
  text-align: left;
}

.woocommerce div.product form.cart table.variations label,
.wm-product-buy form.cart table.variations label {
  display: block;
  margin: 0 0 7px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: var(--tracking-mono);
  text-transform: uppercase;
  color: var(--c-ink-muted);
}

.woocommerce div.product form.cart .reset_variations,
.wm-product-buy form.cart .reset_variations {
  display: inline-block;
  margin-top: 14px;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--c-ink-muted);
}

.woocommerce div.product .single_variation_wrap,
.wm-product-buy .single_variation_wrap {
  margin-top: clamp(12px, 1.9vw, 20px);
}

.woocommerce div.product .woocommerce-variation,
.wm-product-buy .woocommerce-variation {
  margin-bottom: 14px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: var(--tracking-mono);
}

.woocommerce div.product .woocommerce-variation-price,
.wm-product-buy .woocommerce-variation-price {
  margin-bottom: 8px;
}

.woocommerce div.product .woocommerce-variation-availability p,
.wm-product-buy .woocommerce-variation-availability p {
  margin: 0;
}

.woocommerce div.product .woocommerce-variation-availability .stock,
.wm-product-buy .woocommerce-variation-availability .stock {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid var(--c-ink);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: var(--tracking-mono);
  color: var(--c-ink);
  background: color-mix(in srgb, var(--c-ink) 6%, transparent);
}

.woocommerce div.product .woocommerce-variation-availability .stock.out-of-stock,
.wm-product-buy .woocommerce-variation-availability .stock.out-of-stock {
  background: var(--c-ink);
  color: var(--c-bg);
}

.wm-selection-unavailable .woocommerce-variation-add-to-cart {
  opacity: 0.45;
}

.woocommerce div.product .woocommerce-variation-add-to-cart,
.wm-product-buy .woocommerce-variation-add-to-cart {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px;
}

.wm-product-buy__dock-price {
  display: none;
}

@media (min-width: 980px) {
  .wm-product-buy .woocommerce-variation-add-to-cart {
    position: fixed;
    right: max(
      clamp(18px, 2.25vw, 36px),
      calc((100vw - var(--max-content)) / 2 + clamp(18px, 2.25vw, 36px))
    );
    bottom: 16px;
    z-index: 12;
    width: min(37vw, 480px);
    margin-top: 0;
    padding: 12px;
    border: 1px solid var(--c-ink);
    background: color-mix(in srgb, var(--c-bg) 92%, white);
    box-shadow: 0 18px 38px color-mix(in srgb, var(--c-ink) 14%, transparent);
  }

  .wm-product-buy__dock-price {
    display: block;
    flex: 1 1 100%;
    margin: 0 0 2px;
    font-family: var(--font-mono);
    font-size: 12px;
    line-height: 1.35;
    letter-spacing: var(--tracking-mono);
  }
}

.woocommerce .quantity {
  margin: 0;
}

.woocommerce .quantity input {
  width: 72px;
  min-height: 46px;
  border: 1px solid var(--c-ink);
  background: transparent;
  text-align: center;
  font-family: var(--font-mono);
}

.woocommerce .single_add_to_cart_button {
  min-height: 46px;
  flex: 1 1 190px;
  border: 1px solid var(--c-ink);
  background: var(--c-ink);
  color: var(--c-bg);
  position: relative;
  transition: background 160ms var(--ease), color 160ms var(--ease), opacity 160ms var(--ease);
}

.woocommerce .single_add_to_cart_button:hover {
  background: transparent;
  color: var(--c-ink);
}

.woocommerce .single_add_to_cart_button.disabled,
.woocommerce .single_add_to_cart_button:disabled,
.woocommerce .single_add_to_cart_button[disabled] {
  opacity: 0.38;
  cursor: not-allowed;
  background: transparent;
  color: var(--c-ink);
}

.woocommerce .single_add_to_cart_button.is-loading {
  color: transparent;
  pointer-events: none;
}

.woocommerce .single_add_to_cart_button.is-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 999px;
  color: var(--c-bg);
  animation: wm-button-spin 700ms linear infinite;
}

@keyframes wm-button-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 680px) {
  .wm-variation-swatches,
  .wm-variation-swatches[data-attribute_name="attribute_pa_wmm-finish"],
  .wm-variation-swatches[data-attribute_name="attribute_pa_wmm-wood"] {
    grid-template-columns: minmax(0, 1fr);
    max-width: none;
  }
}

.wm-product-detail-band,
.wm-product-spec-band,
.wm-product-related {
  padding-block: clamp(42px, 7vw, 86px);
}

.wm-product-detail-band {
  border-top: 1px solid var(--c-rule);
}

.wm-product-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(22px, 5vw, 72px);
  align-items: start;
}

@media (min-width: 860px) {
  .wm-product-detail-grid {
    grid-template-columns: minmax(220px, 0.42fr) minmax(0, 0.58fr);
  }
}

.wm-product-detail-title {
  max-width: 12ch;
  margin-top: 14px;
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: clamp(30px, 4.4vw, 64px);
  line-height: 1;
  letter-spacing: 0;
}

.wm-product-story {
  max-width: 68ch;
  font-size: clamp(16px, 1.12vw, 18px);
  line-height: 1.58;
}

.wm-product-spec-band {
  border-top: 1px solid var(--c-rule);
  border-bottom: 1px solid var(--c-rule);
}

.wm-product-specs {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  margin: 0;
}

.wm-product-specs__item {
  display: grid;
  grid-template-columns: minmax(110px, 0.35fr) minmax(0, 0.65fr);
  gap: clamp(18px, 3vw, 40px);
  padding-block: 16px;
  border-top: 1px solid var(--c-rule);
}

.wm-product-specs__item:first-child {
  border-top: 0;
}

.wm-product-specs dt {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: var(--tracking-mono);
  text-transform: uppercase;
  color: var(--c-ink-muted);
}

.wm-product-specs dd {
  margin: 0;
  max-width: 78ch;
  color: var(--c-ink);
}

.wm-product-related .related > h2 {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.wm-product-related ul.products {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(24px, 3vw, 42px);
  margin-top: clamp(24px, 4vw, 42px);
  margin-left: 0 !important;
  padding-left: 0 !important;
}

.wm-product-related ul.products::before,
.wm-product-related ul.products::after {
  display: none !important;
}

.wm-product-related ul.products li.product {
  float: none !important;
  width: auto !important;
  max-width: 420px;
  margin: 0 !important;
}

@media (min-width: 740px) {
  .wm-product-related ul.products {
    grid-template-columns: repeat(2, minmax(280px, 420px));
  }
}

@media (min-width: 1180px) {
  .wm-product-related ul.products {
    grid-template-columns: repeat(3, minmax(280px, 380px));
  }
}
.product__link:hover .product__cta::after {
  transform: translateX(4px);
}


/* --------------------------------------------------------------------------
   Studio, contact block.
   -------------------------------------------------------------------------- */
.contact-block {
  max-width: 640px;
  margin-top: clamp(36px, 5vw, 64px);
}
.contact-block__note {
  font-size: clamp(16px, 1.1vw, 18px);
  line-height: 1.5;
  max-width: 54ch;
  margin-bottom: clamp(24px, 3vw, 36px);
  color: var(--c-ink);
}
.contact-block__channels {
  display: grid;
  gap: 14px;
  margin: 0;
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: var(--tracking-mono);
}
.contact-block__channels > div {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 24px;
  align-items: baseline;
}
.contact-block__channels dt {
  color: var(--c-ink-muted);
  font-weight: 500;
}
.contact-block__channels dd {
  margin: 0;
  color: var(--c-ink);
  max-width: 44ch;
}
.contact-block__channels a {
  color: inherit;
  border-bottom: 1px solid currentColor;
}


/* --------------------------------------------------------------------------
   First-email checklist.
   Small, practical, and deliberately not an address request.
   -------------------------------------------------------------------------- */
.intake-note {
  margin-top: clamp(22px, 3vw, 34px);
  padding-top: clamp(18px, 2.4vw, 26px);
  border-top: 1px solid var(--c-rule);
  max-width: 58ch;
}
.intake-note__label {
  margin: 0 0 12px;
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  font-weight: 500;
  letter-spacing: var(--tracking-mono);
  color: var(--c-ink-muted);
}
.intake-note ul {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px 22px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: clamp(14px, 0.95vw, 16px);
  line-height: 1.45;
}
.intake-note li {
  position: relative;
  padding-left: 18px;
}
.intake-note li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.65em;
  width: 7px;
  height: 1px;
  background: currentColor;
  opacity: 0.55;
}
@media (min-width: 760px) {
  .intake-note ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* --------------------------------------------------------------------------
   Cart links.
   The header cart lives in the same action cluster as the menu button.
   -------------------------------------------------------------------------- */
.site-nav__actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(6px, 0.8vw, 10px);
  flex: 0 0 auto;
}
.wm-cart-link {
  --cart-size: 32px;
  --cart-count-size: 17px;
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--c-fg);
  text-decoration: none;
  border-bottom: 0;
}
.wm-cart-link__icon {
  width: 24px;
  height: 24px;
  display: block;
  overflow: visible;
}
.wm-cart-link__bag,
.wm-cart-link__handle,
.wm-cart-link__base {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.95;
  vector-effect: non-scaling-stroke;
}
.wm-cart-link__handle,
.wm-cart-link__base {
  opacity: 0.72;
}
.wm-cart-link__count {
  min-width: var(--cart-count-size);
  height: var(--cart-count-size);
  border-radius: 999px;
  background: var(--c-fg);
  color: var(--c-bg);
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  line-height: var(--cart-count-size);
  text-align: center;
  letter-spacing: 0;
  padding: 0 5px;
}
.wm-cart-link--nav {
  width: var(--cart-size);
  height: var(--cart-size);
  justify-content: center;
  color: var(--c-fg);
  transition: opacity 160ms var(--ease), transform 160ms var(--ease);
}
.wm-cart-link--nav:hover {
  opacity: 0.66;
  transform: translateY(-1px);
}
.wm-cart-link--nav .wm-cart-link__text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.wm-cart-link--nav .wm-cart-link__count {
  position: absolute;
  top: -6px;
  right: -8px;
  box-shadow: 0 0 0 2px var(--c-bg);
}
.wm-cart-link--overlay,
.wm-cart-link--footer {
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  letter-spacing: var(--tracking-mono);
  line-height: 1.4;
}
.wm-cart-link--overlay .wm-cart-link__icon,
.wm-cart-link--footer .wm-cart-link__icon {
  width: 18px;
  height: 18px;
}
.wm-cart-link--overlay:hover,
.wm-cart-link--footer:hover {
  opacity: 0.6;
}
.wm-cart-link--footer {
  width: max-content;
}
.wm-cart-link--footer .wm-cart-link__count,
.wm-cart-link--overlay .wm-cart-link__count {
  margin-left: 2px;
}


/* --------------------------------------------------------------------------
   WooCommerce cart and checkout block pages.
   The block-based cart/checkout have their own container that pushes
   content far below the breadcrumb. Pull it up so the page feels
   like it starts where the visitor expects.
   -------------------------------------------------------------------------- */
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content,
body.woocommerce-cart main > .wp-block-woocommerce-cart,
body.woocommerce-checkout main > .wp-block-woocommerce-checkout,
body.woocommerce-cart main .wp-block-woocommerce-cart,
body.woocommerce-checkout main .wp-block-woocommerce-checkout {
  padding-top: 0 !important;
  margin-top: 0 !important;
}
/* The WC blocks sometimes wrap in a wide-width container with large top margin */
body.woocommerce-cart .wp-block-group,
body.woocommerce-checkout .wp-block-group {
  margin-top: 0;
}
/* Tighten the overall page top spacing on cart/checkout */
body.woocommerce-cart main,
body.woocommerce-checkout main {
  padding-top: clamp(16px, 2vw, 24px);
}
/* Cart/checkout page templates own their inner width through .wrap. */
body.woocommerce-cart main > *,
body.woocommerce-checkout main > * {
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}


/* --------------------------------------------------------------------------
   Cart and checkout page polish.
   -------------------------------------------------------------------------- */
.commerce-hero {
  padding-top: clamp(28px, 4vw, 52px);
  padding-bottom: clamp(18px, 3vw, 36px);
}
.commerce-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(18px, 3vw, 40px);
  align-items: end;
  padding-top: clamp(18px, 2.6vw, 34px);
}
@media (min-width: 840px) {
  .commerce-hero__grid {
    grid-template-columns: 4fr 7fr;
  }
}
.commerce-hero__title {
  font-family: var(--font-serif);
  font-size: clamp(58px, 8vw, 116px);
  font-weight: 400;
  line-height: 0.95;
  letter-spacing: var(--tracking-hero);
}
.commerce-hero__copy {
  max-width: 48ch;
  color: var(--c-ink-muted);
  font-size: clamp(16px, 1.1vw, 18px);
  line-height: 1.5;
}
.commerce-content {
  padding-block: clamp(18px, 3vw, 42px) clamp(56px, 7vw, 96px);
}
.commerce-content__body {
  width: 100%;
}
body.woocommerce-cart .commerce-content .wc-block-cart,
body.woocommerce-checkout .commerce-content .wp-block-woocommerce-checkout {
  margin: 0;
}
body.woocommerce-cart .wc-block-cart__empty-cart__wrapper {
  width: min(100%, 980px);
  margin: 0 auto;
  padding: clamp(26px, 4vw, 48px) 0 0;
  border-top: 1px solid var(--c-rule);
}
body.woocommerce-cart h2.wc-block-cart__empty-cart__title.with-empty-cart-icon {
  margin: 0;
  display: grid;
  justify-items: start;
  gap: 14px;
  text-align: left;
  font-size: 0;
  line-height: 0;
}
body.woocommerce-cart h2.wc-block-cart__empty-cart__title.with-empty-cart-icon::before {
  content: "Nothing in the cart yet.";
  display: block;
  width: auto;
  height: auto;
  border: 0;
  transform: none;
  opacity: 1;
  font-family: var(--font-serif);
  font-size: clamp(28px, 3.4vw, 46px);
  line-height: 1.04;
  letter-spacing: var(--tracking-tight);
}
body.woocommerce-cart h2.wc-block-cart__empty-cart__title.with-empty-cart-icon::after {
  content: "The shelf is short on purpose. Start with one object from the shop, or come back when the next run lands.";
  max-width: 38ch;
  color: var(--c-ink-muted);
  font-size: clamp(15px, 1.05vw, 17px);
  line-height: 1.5;
}
body.woocommerce-cart h2.wc-block-cart__empty-cart__title.with-empty-cart-icon > svg {
  display: none;
}
body.woocommerce-cart h2.wc-block-cart__empty-cart__title.with-empty-cart-icon .wc-block-cart__empty-cart__title,
body.woocommerce-cart h2.wc-block-cart__empty-cart__title.with-empty-cart-icon .wc-block-components-title {
  display: none;
}
body.woocommerce-cart .wp-block-separator.is-style-dots {
  display: none;
}
body.woocommerce-cart .wc-block-cart__empty-cart__title + .wp-block-heading,
body.woocommerce-cart .wc-block-cart__empty-cart__wrapper .wp-block-heading.has-text-align-center {
  margin-top: clamp(32px, 5vw, 64px);
  text-align: left;
  font-size: clamp(24px, 2.5vw, 38px);
  line-height: 1.08;
}
body.woocommerce-cart .wc-block-grid__products {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: clamp(18px, 2.6vw, 32px);
  margin-top: clamp(18px, 2vw, 26px);
}
@media (min-width: 680px) {
  body.woocommerce-cart .wc-block-grid__products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
body.woocommerce-cart .wc-block-grid__product {
  max-width: none;
  padding: 0;
  text-align: left;
  border: 0;
}
body.woocommerce-cart .wc-block-grid__product-image {
  margin: 0 0 12px;
}
body.woocommerce-cart .wc-block-grid__product-image img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  background: color-mix(in srgb, var(--c-paper) 70%, transparent);
}
body.woocommerce-cart .wc-block-grid__product-title {
  font-family: var(--font-serif);
  font-size: clamp(18px, 1.6vw, 24px);
  font-weight: 400;
  line-height: 1.12;
  color: var(--c-fg);
}
body.woocommerce-cart .wc-block-grid__product-price,
body.woocommerce-cart .wc-block-grid__product-rating,
body.woocommerce-cart .wc-block-grid__product-add-to-cart {
  margin-top: 8px;
}
body.woocommerce-cart .wc-block-grid__product-add-to-cart .wp-block-button__link {
  display: inline-flex;
  width: auto;
  min-height: 0;
  padding: 0 0 2px;
  border: 0;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
  background: transparent;
  color: var(--c-fg);
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  letter-spacing: var(--tracking-mono);
  line-height: 1.25;
  text-transform: none;
}
body.woocommerce-cart .wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
  opacity: 0.62;
}
body.woocommerce-checkout .wc-block-components-sidebar-layout {
  padding-top: 0;
}

/* --------------------------------------------------------------------------
   0.2.29 polish: logo micro-motion, product origin note, calmer checkout.
   -------------------------------------------------------------------------- */

/* WM mark: a small, tactile lift on hover. Restrained, not bouncy. */
.site-nav__mark {
  display: inline-block;
  transform-origin: left center;
  transition: font-size var(--t-nav) var(--ease),
              color var(--t-nav) var(--ease),
              transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.site-nav__mark:hover {
  transform: translateY(-1px) scale(1.05) rotate(-1.5deg);
}
@media (prefers-reduced-motion: reduce) {
  .site-nav__mark { transition: font-size var(--t-nav) var(--ease), color var(--t-nav) var(--ease); }
  .site-nav__mark:hover { transform: none; }
}

/* Product image origin note (explains the "Thud" marks on some pieces). */
.wm-product-media__note {
  margin-top: 14px;
  font-family: var(--font-mono);
  font-size: var(--fs-caption);
  line-height: 1.5;
  color: var(--c-ink-faint);
  max-width: 46ch;
}

/* Until Stripe is live, calm the "no payment methods" notice so it reads as
   a friendly heads-up, not a site error. Covers block + classic checkout. */
.woocommerce-checkout .wc-block-components-notice-banner.is-error,
.woocommerce-checkout .woocommerce-error,
.wc-block-checkout .wc-block-components-notice-banner.is-error {
  background: var(--c-wash-service);
  color: var(--c-ink);
  border: 1px solid var(--c-rule);
  border-radius: 2px;
  box-shadow: none;
}
.woocommerce-checkout .wc-block-components-notice-banner.is-error svg,
.wc-block-checkout .wc-block-components-notice-banner.is-error svg {
  fill: var(--c-ink-service);
}
.woocommerce-checkout .wc-block-components-notice-banner.is-error a {
  color: var(--c-ink-service);
}

/* 404 actions: space the two links. */
.wm-404__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
  margin-top: 28px;
}