*, *::before, *::after {
  box-sizing: border-box;
}

:root {
  --mason-ink: var(--mason-text, #24231f);
  --mason-muted: color-mix(in srgb, var(--mason-ink) 66%, transparent);
  --mason-line: color-mix(in srgb, var(--mason-ink) 16%, transparent);
  --mason-surface: color-mix(in srgb, var(--mason-background) 88%, white);
  color: var(--mason-ink);
  background: var(--mason-background, #f8f5ef);
  font-family: var(--mason-body-font, Georgia, serif);
  font-synthesis: none;
  line-height: 1.65;
}

html {
  scroll-behavior: smooth;
}

body {
  min-width: 20rem;
  min-height: 100vh;
  margin: 0;
  background-color: var(--mason-background, #f8f5ef);
  background-image: linear-gradient(135deg, color-mix(in srgb, var(--mason-background) 80%, transparent), color-mix(in srgb, var(--mason-background) 96%, transparent)), var(--mason-background-image, none);
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
}

img,
video {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: var(--mason-accent, #8a3d1e);
  font-weight: 650;
  text-decoration-thickness: .08em;
  text-underline-offset: .15em;
}

a:hover {
  text-decoration-thickness: .15em;
}

a:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--mason-accent) 55%, white);
  outline-offset: .2rem;
  border-radius: .15rem;
}

h1, h2, h3, h4, h5, h6, .site-title {
  font-family: var(--mason-heading-font, Georgia, serif);
  line-height: 1.08;
  text-wrap: balance;
}

h1, h2, h3 {
  letter-spacing: -.025em;
}

h1 {
  margin: 0;
  font-size: clamp(2.7rem, 7vw, 4.0rem);
}

h2 {
  margin: 3rem 0 1rem;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
}

h3 {
  margin: 2.25rem 0 .75rem;
  font-size: clamp(1.3rem, 3vw, 1.7rem);
}

p, ul, ol, blockquote, table, pre {
  margin: 0 0 1.35rem;
}

li + li {
  margin-top: .45rem;
}

.site-shell {
  width: min(100% - 2rem, 75rem);
  margin: 0 auto;
}

.site-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.5rem 0 1.35rem;
  border-bottom: 1px solid var(--mason-line);
}

.site-brand {
  display: flex;
  align-items: center;
  gap: .75rem;
  color: inherit;
  text-decoration: none;
}

.site-brand__copy {
  display: grid;
  gap: .12rem;
}

.site-logo {
  flex: 0 0 auto;
  width: 3rem;
  height: 3rem;
  object-fit: contain;
}

.site-title {
  font-size: 1.35rem;
  font-weight: 750;
  letter-spacing: -.02em;
}

.site-description {
  color: var(--mason-muted);
  font-size: .78rem;
  line-height: 1.25;
}

.mason-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-areas: "hero";
  margin-block: 2.5rem;
  overflow: hidden;
  border-radius: .9rem;
  color: var(--mason-ink);
}

.mason-hero--right .mason-hero__content { justify-self: end; margin-right: clamp(1rem, 3vw, 2.25rem); margin-left: 0; text-align: right; }
.mason-hero--right .mason-hero__actions { justify-content: flex-end; }
.mason-hero__size-reference { grid-area: hero; place-self: start; width: auto; max-width: 100%; height: auto; opacity: 0; pointer-events: none; }
.mason-hero__background { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mason-hero::after { position: absolute; z-index: 1; inset: 0; content: ""; background: linear-gradient(90deg, color-mix(in srgb, var(--mason-background) 62%, transparent), color-mix(in srgb, var(--mason-background) 6%, transparent)); }
.mason-hero--right::after { background: linear-gradient(270deg, color-mix(in srgb, var(--mason-background) 62%, transparent), color-mix(in srgb, var(--mason-background) 6%, transparent)); }
.mason-hero__content { position: relative; grid-area: hero; z-index: 2; align-self: center; justify-self: start; width: min(30rem, calc(100% - 2rem)); margin: 1rem 0 1rem clamp(1rem, 3vw, 2.25rem); padding: clamp(.45rem, 1vw, .75rem) clamp(.75rem, 1.5vw, 1rem); border-radius: .65rem; background: color-mix(in srgb, var(--mason-background) 58%, transparent); box-shadow: 0 1rem 3rem color-mix(in srgb, var(--mason-ink) 12%, transparent); }
.mason-hero__content h2 { margin: 0 0 .4rem; font-size: clamp(1.5rem, 2.25vw, 2.5rem); }
.mason-hero__actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.25rem; }
.mason-hero__actions a { display: inline-block; padding: .65rem 1rem; border-radius: .3rem; background: var(--mason-accent); color: var(--mason-background); text-decoration: none; }

.site-nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .35rem 1.1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-nav li + li {
  margin-top: 0;
}

.site-nav a {
  color: inherit;
  font-family: var(--mason-heading-font, Georgia, serif);
  font-size: .94rem;
  font-weight: 650;
  text-decoration: none;
}

.site-nav a[aria-current="page"] {
  color: var(--mason-accent);
  text-decoration: underline;
  text-decoration-thickness: .14em;
  text-underline-offset: .32em;
}

.site-main {
  padding: clamp(3.5rem, 9vw, 7.5rem) 0;
}

.page {
  margin: 0 auto;
}

.page-default,
.page-article {
  width: min(100%, 55rem);
}

.page-listing {
  width: min(100%, 70rem);
}

.page-taxonomy-index {
  width: min(100%, 55rem);
}

.page-heading {
  margin-bottom: 2.25rem;
}

.page-dek {
  max-width: 38rem;
  margin: 1.25rem 0 0;
  color: var(--mason-muted);
  font-size: clamp(1.15rem, 2.4vw, 1.45rem);
  line-height: 1.45;
}

.taxonomy-backlink {
  margin: 1.15rem 0 0;
  font-family: var(--mason-heading-font, Georgia, serif);
  font-size: .92rem;
}

.taxonomy-backlink a::before {
  content: "← ";
}

.post-date {
  margin: 1rem 0 0;
  color: var(--mason-accent);
  font-family: var(--mason-heading-font, Georgia, serif);
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.featured-image {
  margin: 0 0 2.5rem;
  overflow: hidden;
  border-radius: 1.25rem;
  background: var(--mason-surface);
  box-shadow: 0 1.25rem 3.5rem color-mix(in srgb, var(--mason-ink) 15%, transparent);
}

.featured-image img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.mason-image {
  width: min(100%, 42rem);
  margin: 2.25rem auto;
  overflow: hidden;
  border-radius: .9rem;
  background: var(--mason-surface);
  box-shadow: 0 .85rem 2.5rem color-mix(in srgb, var(--mason-ink) 10%, transparent);
}

.mason-image__media {
  width: 100%;
}

.mason-image__caption {
  padding: .75rem 1rem .9rem;
  color: var(--mason-muted);
  font-size: .88rem;
  line-height: 1.45;
}

.mason-rotating-banner {
  width: min(100%, 56rem);
  margin: 2.5rem auto;
  overflow: hidden;
  border-radius: .9rem;
  background: var(--mason-surface);
  box-shadow: 0 .85rem 2.5rem color-mix(in srgb, var(--mason-ink) 10%, transparent);
}

.mason-rotating-banner__viewport,
.mason-rotating-banner__link {
  display: block;
  overflow: hidden;
}

.mason-rotating-banner__link:focus-visible {
  outline: .2rem solid var(--mason-accent);
  outline-offset: -.2rem;
}

.mason-rotating-banner__image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 7;
  object-fit: cover;
  transition: opacity .18s ease;
}

.mason-rotating-banner__image--changing {
  opacity: .25;
}

.mason-rotating-banner__caption {
  padding: .75rem 1rem .9rem;
  color: var(--mason-muted);
  font-size: .88rem;
  line-height: 1.45;
}

.mason-rotating-banner__control {
  margin: 0 1rem 1rem;
  padding: .45rem .65rem;
  border: 1px solid color-mix(in srgb, var(--mason-ink) 24%, transparent);
  border-radius: .4rem;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-size: .82rem;
}

.mason-rotating-banner__control:hover,
.mason-rotating-banner__control:focus-visible {
  border-color: var(--mason-accent);
}

.mason-video {
  width: min(100%, 48rem);
  margin: 2.25rem auto;
  overflow: hidden;
  border-radius: .9rem;
  background: var(--mason-surface);
  box-shadow: 0 .85rem 2.5rem color-mix(in srgb, var(--mason-ink) 10%, transparent);
}

.mason-video__frame {
  position: relative;
  aspect-ratio: 16 / 9;
}

.mason-video__media {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  background: var(--mason-ink);
}

.mason-video__frame .mason-video__media {
  position: absolute;
  inset: 0;
  height: 100%;
}

.mason-video--portrait {
  width: min(100%, 26rem);
}

.mason-video--portrait .mason-video__frame,
.mason-video--portrait .mason-video__media {
  aspect-ratio: 9 / 16;
}

.mason-video__caption {
  padding: .75rem 1rem .9rem;
  color: var(--mason-muted);
  font-size: .88rem;
  line-height: 1.45;
}

.mason-product {
  display: grid;
  grid-template-columns: minmax(8.5rem, 11rem) minmax(0, 1fr);
  overflow: hidden;
  margin: 2.5rem 0;
  border: 1px solid var(--mason-line);
  border-radius: 1rem;
  background: var(--mason-surface);
  box-shadow: 0 1rem 2.75rem color-mix(in srgb, var(--mason-ink) 9%, transparent);
}

.mason-product__image {
  width: 100%;
  height: 100%;
  min-height: 12rem;
  object-fit: cover;
  background: color-mix(in srgb, var(--mason-accent) 14%, var(--mason-surface));
}

.mason-product__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.35rem 1.45rem;
}

.mason-product__title {
  margin: 0 0 .65rem;
  font-family: var(--mason-heading-font, Georgia, serif);
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.08;
}

.mason-product__description {
  margin-bottom: 1.2rem;
  color: var(--mason-muted);
}

.mason-product__action {
  margin-top: auto;
  padding: .6rem .85rem;
  border-radius: .45rem;
  background: var(--mason-accent);
  color: var(--mason-background);
  font-family: var(--mason-heading-font, Georgia, serif);
  font-size: .9rem;
  text-decoration: none;
}

.mason-product__action:hover {
  color: var(--mason-background);
  filter: brightness(.92);
}

.content {
  font-size: 1.05rem;
}

.content > :last-child {
  margin-bottom: 0;
}

.content blockquote {
  margin-inline: 0;
  padding: .25rem 0 .25rem 1.35rem;
  border-left: .3rem solid var(--mason-accent);
  color: color-mix(in srgb, var(--mason-ink) 80%, var(--mason-accent));
  font-family: var(--mason-heading-font, Georgia, serif);
  font-size: 1.3em;
  line-height: 1.4;
}

.content hr {
  width: 5rem;
  margin: 3rem 0;
  border: 0;
  border-top: 2px solid var(--mason-accent);
}

.content table {
  width: 100%;
  border-collapse: collapse;
  font-size: .93em;
}

.content th,
.content td {
  padding: .75rem;
  border-bottom: 1px solid var(--mason-line);
  text-align: left;
}

.content th {
  color: var(--mason-muted);
  font-family: var(--mason-heading-font, Georgia, serif);
}

.content code {
  padding: .15em .35em;
  border-radius: .25rem;
  background: color-mix(in srgb, var(--mason-accent) 11%, var(--mason-surface));
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .87em;
}

.content pre {
  overflow-x: auto;
  padding: 1.1rem 1.25rem;
  border-radius: .75rem;
  background: #24231f;
  color: #f8f5ef;
}

.content pre code {
  padding: 0;
  background: transparent;
  color: inherit;
}

.landing-hero {
  display: grid;
  align-items: center;
  grid-template-columns: minmax(0, 1.05fr) minmax(18rem, .95fr);
  gap: clamp(2rem, 6vw, 5rem);
  min-height: min(42rem, 70vh);
}

.landing-copy .page-heading {
  margin-bottom: 1.75rem;
}

.landing-copy .content {
  max-width: 36rem;
  font-size: 1.13rem;
}

.landing-image {
  margin: 0;
  transform: rotate(1.75deg);
}

.landing-image img {
  aspect-ratio: 4 / 5;
}

.page-listing .content {
  max-width: 42rem;
  margin-bottom: 2.75rem;
}

.post-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}

.post-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--mason-line);
  border-radius: 1rem;
  background: var(--mason-surface);
  box-shadow: 0 .65rem 1.5rem color-mix(in srgb, var(--mason-ink) 6%, transparent);
}

.post-card-image {
  display: block;
  overflow: hidden;
  background: color-mix(in srgb, var(--mason-accent) 16%, var(--mason-surface));
}

.post-card-image img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform .35s ease;
}

.post-card:hover .post-card-image img {
  transform: scale(1.04);
}

.post-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.25rem;
}

.post-card time {
  color: var(--mason-muted);
  font-size: .77rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.post-card h2 {
  margin: .65rem 0 .8rem;
  font-size: 1.65rem;
}

.post-card h2 a {
  color: inherit;
  text-decoration: none;
}

.post-card p {
  margin-bottom: 1.15rem;
  color: var(--mason-muted);
  font-size: .96rem;
}

.taxonomy-list {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  margin: auto 0 0;
  padding: 0;
  list-style: none;
}

.taxonomy-list li {
  margin: 0;
  padding: .22rem .58rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--mason-accent) 13%, var(--mason-surface));
  color: color-mix(in srgb, var(--mason-ink) 78%, var(--mason-accent));
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.taxonomy-list a {
  color: inherit;
  text-decoration: none;
}

.taxonomy-list a:hover {
  text-decoration: underline;
}

.category-list li {
  background: color-mix(in srgb, var(--mason-accent) 20%, var(--mason-surface));
}

.taxonomy-group + .taxonomy-group {
  margin-top: 1rem;
}

.taxonomy-label {
  margin: 0 0 .55rem;
  color: var(--mason-muted);
  font-size: .76rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.post-card-categories {
  margin: 0 0 1rem;
}

.taxonomy-index-list {
  display: grid;
  gap: .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.taxonomy-index-list a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.15rem;
  border: 1px solid var(--mason-line);
  border-radius: .75rem;
  background: var(--mason-surface);
  color: inherit;
  text-decoration: none;
}

.taxonomy-index-list a span:last-child {
  color: var(--mason-muted);
  font-size: .85rem;
  font-weight: 650;
}

.article-footer {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--mason-line);
}

.article-footer .taxonomy-list {
  margin: 0;
}

.empty-collection {
  padding: 2rem;
  border: 1px dashed var(--mason-line);
  border-radius: .75rem;
  color: var(--mason-muted);
}

.site-footer {
  display: flex;
  justify-content: space-between;
  padding: 1.4rem 0 2.5rem;
  border-top: 1px solid var(--mason-line);
  color: var(--mason-muted);
  font-family: var(--mason-heading-font, Georgia, serif);
  font-size: .9rem;
}

.site-footer p {
  margin: 0;
}

@media (max-width: 48rem) {
  .site-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 1rem;
  }

  .site-nav ul {
    justify-content: flex-start;
  }

  .landing-hero {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .landing-image {
    width: min(100%, 32rem);
    margin-inline: auto;
    transform: rotate(.8deg);
  }

  .landing-image img {
    aspect-ratio: 16 / 10;
  }

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

@media (max-width: 34rem) {
  .site-shell {
    width: min(100% - 1.25rem, 75rem);
  }

  .site-main {
    padding: 3rem 0;
  }

  .post-list {
    grid-template-columns: 1fr;
  }

  .mason-product {
    grid-template-columns: 1fr;
  }

  .mason-product__image {
    max-height: 20rem;
  }
}

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

  .post-card-image img {
    transition: none;
  }
}

/* Shared product document metadata. */
.mason-product-details { margin-block: 1.5rem; }
.mason-product-details dl { display: grid; grid-template-columns: auto 1fr; gap: .35rem 1rem; }
.mason-product-details dd { margin: 0; }
.mason-product-purchase-links { display: flex; flex-wrap: wrap; gap: .75rem; list-style: none; padding: 0; }
.mason-product-purchase-links a { display: inline-block; padding: .65rem 1rem; border: 1px solid currentColor; border-radius: .25rem; }
.mason-product-gallery { width: min(100%, 48rem); margin-block: 2rem; }
.mason-product-gallery__main-image { display: flex; align-items: center; justify-content: center; width: 100%; min-height: clamp(18rem, 50vw, 34rem); padding: 1rem; border: 1px solid var(--mason-line, currentColor); border-radius: .5rem; background: var(--mason-surface, var(--mason-background)); cursor: zoom-in; }
.mason-product-gallery__main-image:focus-visible { outline: 2px solid var(--mason-accent, currentColor); outline-offset: 3px; }
.mason-product-gallery__main-image img { display: block; width: 100%; max-height: 32rem; object-fit: contain; }
.mason-product-gallery__thumbnails { display: flex; gap: .75rem; margin-top: .75rem; padding-bottom: .2rem; overflow-x: auto; }
.mason-product-gallery__thumbnails a { flex: 0 0 5rem; display: flex; align-items: center; justify-content: center; height: 5rem; padding: .2rem; border: 2px solid transparent; border-radius: .35rem; background: var(--mason-surface, var(--mason-background)); }
.mason-product-gallery__thumbnails a[aria-current="true"] { border-color: var(--mason-accent, currentColor); }
.mason-product-gallery__thumbnails a:focus-visible { outline: 2px solid var(--mason-accent, currentColor); outline-offset: 2px; }
.mason-product-gallery__thumbnails img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mason-product-gallery__status { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mason-product-gallery__dialog { width: min(calc(100% - 2rem), 75rem); max-width: 75rem; max-height: calc(100dvh - 2rem); padding: 0; border: 0; border-radius: .5rem; background: var(--mason-surface, var(--mason-background)); color: var(--mason-text, currentColor); }
.mason-product-gallery__dialog::backdrop { background: rgb(0 0 0 / 72%); }
.mason-product-gallery__dialog-content { display: grid; padding: 1rem; }
.mason-product-gallery__dialog-close { justify-self: end; padding: .55rem .8rem; border: 1px solid currentColor; border-radius: .25rem; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.mason-product-gallery__dialog-image { display: block; width: auto; max-width: 100%; max-height: calc(100dvh - 7rem); margin: .75rem auto 0; object-fit: contain; }

/* Preserve complete product covers in catalog and mixed taxonomy cards. */
.mason-product-card .post-card-image img,
.mason-product-card .folio-index-image img { object-fit: contain; }

.mason-taxonomy-cloud { margin-block: 1.5rem; padding: 1.2rem; border: 1px solid var(--mason-line, currentColor); border-radius: .5rem; }
.mason-taxonomy-cloud__title { margin: 0 0 1rem; font-size: 1.3rem; }
.mason-taxonomy-cloud__terms { display: flex; flex-wrap: wrap; gap: .6rem; list-style: none; padding: 0; margin: 0; }
.mason-taxonomy-cloud__terms a { display: inline-block; border: 1px solid currentColor; border-radius: 2rem; padding: .3rem .8rem; text-decoration: none; }
.mason-taxonomy-cloud__terms a:hover { text-decoration: underline; }

.mason-sidebar { min-width: 0; margin-block: 2rem; }
.mason-sidebar > :first-child { margin-top: 0; }

.mason-sidebar { grid-column: 1 / -1; }

.mason-callout { display: grid; grid-template-columns: minmax(4rem, 1fr) minmax(0, 2fr); gap: 1rem; align-items: center; margin-block: 1.5rem; padding: 1rem; border: 1px solid var(--mason-line, currentColor); border-radius: .4rem; }
.mason-callout__image { width: 100%; max-height: 15rem; object-fit: contain; }
.mason-callout__title { margin: 0; font-size: 1.3rem; }
.mason-callout__copy p { margin-block: .6rem; }
.mason-callout__action { display: inline-block; padding: .45rem .75rem; border: 1px solid currentColor; border-radius: .25rem; }
.mason-callout-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: 1rem; margin-block: 1.5rem; }
.mason-callout-grid > .mason-callout { margin: 0; }
.mason-sidebar .mason-callout { font-size: .9rem; padding: .85rem; gap: .7rem; }
.mason-sidebar .mason-callout__title { font-size: 1.1rem; }

.mason-product-grid { margin-block: 2rem; }
.mason-product-grid__items { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 16.25rem)); gap: 1.5rem; }
.mason-product-grid__card { display: grid; grid-template-rows: auto 1fr; min-width: 0; overflow: hidden; border: 1px solid var(--mason-line, currentColor); border-radius: .4rem; background: var(--mason-surface, var(--mason-background)); text-align: center; }
.mason-product-grid__media { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 16.25rem; aspect-ratio: 1; background: color-mix(in srgb, var(--mason-surface, var(--mason-background)) 80%, white); }
.mason-product-grid__image-link { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.mason-product-grid__card img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mason-product-grid__copy { display: flex; flex-direction: column; min-width: 0; padding: 1.25rem 1rem 1rem; }
.mason-product-grid__copy h3 { margin: 0 0 .75rem; font-size: 1.2rem; }
.mason-product-grid__copy p { margin: 0 0 1rem; }
.mason-product-grid__copy .mason-product-purchase-links { justify-content: center; margin-top: auto; margin-bottom: 0; }
.mason-product-grid__title { margin-bottom: 1.5rem; }

.mason-product-thumbnail-grid { margin-block: 2rem; }
.mason-product-thumbnail-grid__title { margin-bottom: 1.5rem; }
.mason-product-thumbnail-grid__items { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 12rem)); gap: 1rem; }
.mason-product-thumbnail-grid__card { display: grid; grid-template-rows: auto 1fr; min-width: 0; padding: .75rem; border: 1px solid var(--mason-line, currentColor); border-radius: .4rem; background: var(--mason-surface, var(--mason-background)); text-align: center; }
.mason-product-thumbnail-grid__media { display: flex; align-items: center; justify-content: center; width: 100%; max-width: 10rem; aspect-ratio: 1; margin-inline: auto; }
.mason-product-thumbnail-grid__image-link { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.mason-product-thumbnail-grid__card img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mason-product-thumbnail-grid__copy { display: flex; flex-direction: column; min-width: 0; padding-top: .65rem; }
.mason-product-thumbnail-grid__copy h3 { margin: 0 0 .6rem; font-size: 1rem; line-height: 1.3; }
.mason-product-thumbnail-grid__copy .mason-product-purchase-links { justify-content: center; margin-top: auto; margin-bottom: 0; }

.mason-featured-product { margin-block: 2rem; }
.mason-featured-product__heading { margin-bottom: 1rem; }
.mason-featured-product__panel { display: grid; grid-template-columns: minmax(0, 9fr) minmax(5rem, 2fr) minmax(0, 7fr); gap: 2.5%; align-items: center; padding: 1.5rem; border: 1px solid var(--mason-line, currentColor); border-radius: .5rem; }
.mason-featured-product__main-image { display: flex; align-items: center; min-width: 0; }
.mason-featured-product__main-image .mason-featured-product__image-link { display: flex; width: 100%; }
.mason-featured-product__main-image img { display: block; width: 100%; max-height: 32rem; object-fit: contain; }
.mason-featured-product__supporting-images { position: relative; align-self: stretch; min-width: 0; min-height: 0; }
.mason-featured-product__supporting-images .mason-featured-product__image-link { position: absolute; inset-inline: 0; display: flex; width: 100%; height: calc(50% - .5rem); min-height: 0; }
.mason-featured-product__supporting-images .mason-featured-product__image-link:first-child { top: 0; }
.mason-featured-product__supporting-images .mason-featured-product__image-link:last-child { bottom: 0; }
.mason-featured-product__supporting-images img { display: block; width: 100%; height: 100%; object-fit: contain; }
.mason-featured-product__copy { min-width: 0; }
.mason-featured-product__copy h3 { margin: 0 0 .5rem; font-size: 1.5rem; }
.mason-featured-product__subtitle { margin-top: 0; font-size: 1.05rem; }
.mason-featured-product__action { display: inline-block; padding: .6rem 1rem; border: 1px solid currentColor; border-radius: .3rem; }
.mason-sidebar .mason-featured-product__panel { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
.mason-sidebar .mason-featured-product__supporting-images { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-self: auto; align-items: start; }
.mason-sidebar .mason-featured-product__supporting-images .mason-featured-product__image-link { position: static; height: auto; }
.mason-sidebar .mason-featured-product__supporting-images img { height: auto; }
@media (max-width: 52rem) { .mason-featured-product__panel { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1rem; } .mason-featured-product__supporting-images { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-self: auto; align-items: start; } .mason-featured-product__supporting-images .mason-featured-product__image-link { position: static; height: auto; } .mason-featured-product__supporting-images img { height: auto; } }

.mason-featured-products { margin-block: 2rem; }
.mason-featured-products__heading { margin-bottom: 1rem; }
.mason-featured-products__viewport { display: grid; gap: 1.5rem; }
.mason-featured-products__slide { min-width: 0; }
.mason-featured-products__control { align-self: stretch; width: 2.5rem; padding: 0; border: 1px solid currentColor; border-radius: .3rem; background: var(--mason-surface, var(--mason-background)); color: inherit; font: inherit; font-size: 2rem; line-height: 1; cursor: pointer; }
.mason-featured-products__control:focus-visible { outline: 2px solid var(--mason-accent, currentColor); outline-offset: 3px; }
.mason-featured-products__dots { display: flex; justify-content: center; gap: .45rem; margin-top: .75rem; }
.mason-featured-products__dot { display: block; width: .42rem; height: .42rem; border-radius: 50%; background: currentColor; opacity: .3; }
.mason-featured-products__dot[data-mason-current="true"] { opacity: 1; transform: scale(1.2); }
.mason-featured-products__status:empty { display: none; }
.mason-featured-products[data-mason-enhanced="true"] .mason-featured-products__gallery { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr) 2.5rem; gap: .75rem; align-items: stretch; }
.mason-featured-products[data-mason-enhanced="true"] .mason-featured-products__viewport { display: block; }
@media (max-width: 34rem) { .mason-featured-products[data-mason-enhanced="true"] .mason-featured-products__gallery { grid-template-columns: 2rem minmax(0, 1fr) 2rem; gap: .4rem; } .mason-featured-products__control { width: 2rem; font-size: 1.7rem; } }

.mason-category-grid { margin-block: 2rem; }
.mason-category-grid__items { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 16.25rem)); gap: 1rem; }
.mason-category-grid__card { min-width: 0; border: 1px solid var(--mason-line, currentColor); border-radius: .4rem; overflow: hidden; }
.mason-category-grid__image-link { display: block; }
.mason-category-grid__image-link:focus-visible { outline: 2px solid var(--mason-accent, currentColor); outline-offset: -4px; }
.mason-category-grid__card img { width: min(100%, 16.25rem); aspect-ratio: 13 / 8; object-fit: cover; }
.mason-category-grid__copy { padding: 1rem; }
.mason-category-grid__copy h3 { margin: 0; font-size: 1.2rem; }
.mason-category-grid__action { display: inline-block; padding: .4rem .65rem; border: 1px solid currentColor; border-radius: .25rem; }

.mason-media-feature { margin-block: 2rem; }
.mason-media-feature__panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; align-items: center; padding: 1.5rem; border: 1px solid var(--mason-line, currentColor); border-radius: .5rem; }
.mason-media-feature__panel--two-thirds { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.mason-media-feature__media { min-width: 0; }
.mason-media-feature__media > img { width: 100%; max-height: 32rem; object-fit: contain; }
.mason-media-feature__media .mason-video { margin: 0; width: 100%; }
.mason-media-feature__copy { min-width: 0; }
.mason-media-feature__copy h3 { margin-top: 0; font-size: 1.5rem; }
.mason-media-feature__action { display: inline-block; padding: .6rem 1rem; border: 1px solid currentColor; border-radius: .3rem; }
.mason-sidebar .mason-media-feature__panel { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 48rem) { .mason-media-feature__panel { grid-template-columns: minmax(0, 1fr); padding: 1rem; } }

.mason-closing { grid-column: 1 / -1; min-width: 0; width: 100%; margin-block: 2rem; }

.mason-video-gallery { margin-block: 2rem; }
.mason-video-gallery__layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.mason-video-gallery__player { min-width: 0; }
.mason-video-gallery__player .mason-video { margin: 0; width: 100%; }
.mason-video-gallery__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.mason-video-gallery__choice { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: .7rem; padding: .5rem; border: 2px solid transparent; text-decoration: none; }
.mason-video-gallery__choice[aria-current="true"] { border-color: currentColor; border-radius: .3rem; }
.mason-video-gallery__choice img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.mason-video-gallery__description { display: block; font-size: .85em; font-weight: normal; margin-top: .4rem; }
.mason-video-gallery__status:empty { display: none; }
.mason-sidebar .mason-video-gallery__layout { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 48rem) { .mason-video-gallery__layout { grid-template-columns: minmax(0, 1fr); } }

.mason-search { margin-block: 1.5rem; padding: 1rem; border: 1px solid var(--mason-line, currentColor); border-radius: .4rem; }
.mason-search h2 { font-size: 1.3rem; margin-top: 0; }
.mason-search__form label { display: block; font-size: .9rem; }
.mason-search input { display: block; width: 100%; min-width: 0; margin-block: .5rem; padding: .6rem; font: inherit; }
.mason-search button { padding: .5rem .8rem; font: inherit; cursor: pointer; }
.mason-search__results { padding-left: 1.2rem; }
.mason-search__results p { font-size: .9rem; }
.mason-search__status:empty, .mason-search__results:empty { display: none; }