:root {
  --ink: #2e2118;
  --ink-soft: #5f4c3f;
  --cream: #f8f3e9;
  --paper: #fffdf8;
  --saffron: #d9982f;
  --saffron-light: #efc271;
  --chile: #a83b25;
  --leaf: #65733c;
  --walnut: #3b271b;
  --line: rgba(46, 33, 24, 0.16);
  --font-serif: "Libre Baskerville", Georgia, serif;
  --font-sans: "DM Sans", Arial, sans-serif;
  --font-mono: "DM Mono", "Courier New", monospace;
  --font-size-micro: 0.75rem;
  --shadow: 0 20px 60px rgba(46, 33, 24, 0.14);
  --shadow-soft: 0 16px 42px rgba(46, 33, 24, 0.1);
  --radius: min(2.5vw, 12px);
  --radius-inner: calc(var(--radius) - 4px);
  --title-size: clamp(3.35rem, 4.1vw, 4.25rem);
  --title-size-mobile: clamp(3rem, 13vw, 3.35rem);
  --section-title-size: clamp(2.65rem, 4.2vw, 4.5rem);
  --section-title-size-mobile: clamp(2.45rem, 11vw, 3.35rem);
  --page-intro-space: clamp(64px, 7vw, 104px);
  --section-space: clamp(78px, 8.5vw, 126px);
  --dropdown-open-dur: 240ms;
  --dropdown-close-dur: 140ms;
  --dropdown-pre-scale: 0.985;
  --dropdown-closing-scale: 0.995;
  --dropdown-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dropdown-swap-dur: 150ms;
  --dropdown-swap-y: 4px;
  --dropdown-swap-blur: 1.5px;
  --dropdown-swap-ease: ease-in-out;
}

/* Shop catalog: intentionally utilitarian, with the pantry controls always close by. */
.shop-catalog {
  --shop-gutter: clamp(18px, 2.25vw, 40px);
  --shop-filter-gutter: clamp(18px, 1.6vw, 26px);
  background: var(--paper);
}

.shop-catalog__header {
  display: flex;
  min-height: 0;
  padding: clamp(22px, 2.4vw, 34px) 0;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  border-bottom: 1px solid var(--line);
  background: var(--paper);
}

.shop-catalog__header h1 { margin: 0; font-size: clamp(2.6rem, 3.8vw, 4rem); }

.shop-filter-toggle { display: none; }

.shop-catalog__layout {
  display: grid;
  grid-template-columns: minmax(248px, 304px) minmax(0, 1fr);
  align-items: start;
}

.shop-filters {
  position: sticky;
  top: 0;
  max-height: 100vh;
  overflow: auto;
  padding: 24px var(--shop-filter-gutter) 42px;
  border-right: 1px solid var(--line);
  background: var(--cream);
}

.shop-filters__top { display: flex; margin-bottom: 16px; align-items: center; justify-content: space-between; }
.shop-filters__top strong { font-family: var(--font-serif); font-size: 1.25rem; }
.shop-filters__top button { display: none; }
.shop-filters__search { margin-bottom: 20px; }
.shop-filters__search input { min-height: 48px; padding: 10px 14px; }

.shop-filter-group { margin: 0; padding: 23px 0; border: 0; border-top: 1px solid var(--line); }
.shop-filter-group legend { width: 100%; margin-bottom: 13px; font-family: var(--font-mono); font-size: var(--font-size-micro); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.shop-filter-note { margin: -3px 0 8px; color: var(--ink-soft); font-size: .76rem; line-height: 1.4; }
.shop-filter-option { display: grid; grid-template-columns: 18px 1fr auto; gap: 9px; align-items: center; padding: 7px 0; cursor: pointer; }
.shop-filter-option input { width: 16px; height: 16px; margin: 0; accent-color: var(--chile); }
.shop-filter-option span { font-size: .95rem; line-height: 1.25; }
.shop-filter-option small { color: var(--ink-soft); font: .7rem var(--font-mono); }
.shop-filter-letters { display: grid; grid-template-columns: repeat(7, 1fr); gap: 5px; }
.shop-filter-letters button { min-width: 0; min-height: 31px; padding: 3px; border: 1px solid var(--line); border-radius: 3px; color: var(--ink); background: transparent; font: 500 .7rem var(--font-mono); cursor: pointer; }
.shop-filter-letters button:first-child { grid-column: span 2; }
.shop-filter-letters button:hover:not(:disabled), .shop-filter-letters button.is-active { border-color: var(--chile); color: var(--paper); background: var(--chile); }
.shop-filter-letters button:disabled { opacity: .25; cursor: default; }
.shop-filter-check { display: block; padding: 6px 0; font-size: .92rem; cursor: pointer; }
.shop-filter-check input { width: 16px; height: 16px; margin: 0 7px 0 0; vertical-align: -3px; accent-color: var(--chile); }
.shop-filter-clear { padding: 0; border: 0; color: var(--chile); background: none; font: 700 var(--font-size-micro) var(--font-mono); letter-spacing: .08em; text-decoration: underline; text-underline-offset: 4px; text-transform: uppercase; cursor: pointer; }
.shop-filter-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.shop-filter-apply { display: none; }

.shop-results { min-width: 0; padding: 0 var(--shop-gutter) clamp(64px, 7vw, 108px); }
.shop-results__bar { display: flex; min-height: 45px; margin: 22px 0 31px; align-items: center; justify-content: space-between; gap: 22px; border-bottom: 1px solid var(--line); }
.shop-results__bar > p { margin: 0; color: var(--ink-soft); font-family: var(--font-mono); font-size: var(--font-size-micro); letter-spacing: .08em; text-transform: uppercase; }
.shop-results__bar label { display: flex; gap: 9px; align-items: center; color: var(--ink-soft); font-family: var(--font-mono); font-size: var(--font-size-micro); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.shop-results__bar select { padding: 5px 24px 5px 7px; border: 0; color: var(--ink); background: transparent; font: inherit; text-transform: none; cursor: pointer; }
.shop-catalog .shop-catalog__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 1060px) {
  .shop-catalog__layout { grid-template-columns: minmax(225px, 270px) minmax(0, 1fr); }
  .shop-catalog .shop-catalog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  body.shop-filters-open { overflow: hidden; }
  .shop-catalog__header { min-height: 0; padding-block: 28px 24px; align-items: start; }
  .shop-catalog__header h1 { font-size: clamp(2.8rem, 13vw, 4.3rem); }
  .shop-filter-toggle { display: inline-flex; flex: 0 0 auto; padding: 9px 0; border: 0; border-bottom: 1px solid currentColor; color: var(--chile); background: transparent; font: 700 var(--font-size-micro) var(--font-mono); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
  .shop-filter-toggle span { margin-left: 8px; font-size: 1.2rem; line-height: .7; }
  .shop-catalog__layout { display: block; }
  .shop-filters { position: fixed; z-index: 150; top: 0; right: 0; bottom: 0; width: min(410px, 92vw); max-height: none; padding: 28px 24px 44px; box-shadow: -20px 0 50px rgb(46 33 24 / 18%); transform: translateX(105%); transition: transform 220ms ease; }
  .shop-filters.is-open { transform: translateX(0); }
  .shop-filters__top button { display: block; width: 36px; height: 36px; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: var(--paper); font-size: 1.6rem; line-height: 1; cursor: pointer; }
  .shop-filter-apply { display: inline-flex; min-height: 42px; align-items: center; padding: 8px 15px; border: 0; border-radius: 3px; color: var(--paper); background: var(--chile); font: 700 var(--font-size-micro) var(--font-mono); letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
  .shop-results { padding-top: 0; }
  .shop-catalog .shop-catalog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 18px; }
  .catalog-card__copy { min-height: 135px; }
}

@media (max-width: 480px) {
  .shop-catalog__header { display: block; }
  .shop-filter-toggle { margin-top: 20px; }
  .shop-results__bar { align-items: start; padding-bottom: 12px; }
  .shop-results__bar label { flex-direction: column; align-items: end; gap: 3px; }
  .shop-catalog .shop-catalog__grid { grid-template-columns: 1fr; }
}

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

html {
  scroll-behavior: smooth;
  scroll-padding-top: 136px;
}

body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

body.nav-open {
  overflow: hidden;
}

::selection {
  color: var(--paper);
  background: var(--chile);
}

a {
  color: inherit;
}

img,
svg {
  display: block;
  max-width: 100%;
}

button,
input {
  font: inherit;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1,
h2,
h3 {
  font-family: var(--font-serif);
  font-weight: 400;
  line-height: 1.04;
  letter-spacing: -0.045em;
  text-wrap: balance;
}

h1 {
  margin-bottom: 28px;
  font-size: var(--title-size);
}

h2 {
  margin-bottom: 22px;
  font-size: var(--section-title-size);
}

h3 {
  font-size: 1.25rem;
}

.shell {
  width: min(100% - 48px, 1240px);
  margin-inline: auto;
}

.section {
  padding-block: clamp(92px, 10vw, 150px);
}

/* Small layout utilities. These handle composition only; color, type, and
   component appearance stay with the component that owns them. */
.stack {
  display: flex;
  flex-direction: column;
  gap: var(--stack-gap, 24px);
}

.cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: var(--cluster-align, center);
  gap: var(--cluster-gap, 16px);
}

.auto-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--grid-min, 240px)), 1fr));
  gap: var(--grid-gap, 24px);
}

.measure {
  max-width: var(--measure, 58ch);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 1000;
  padding: 10px 16px;
  color: var(--paper);
  background: var(--ink);
  transform: translateY(-150%);
  transition: transform 180ms ease;
}

.skip-link:focus {
  transform: translateY(0);
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 28px;
}

.button {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 13px 22px;
  border: 1px solid transparent;
  border-radius: var(--radius-inner);
  font-family: var(--font-mono);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.button:hover {
  transform: translateY(-2px);
}

.button--primary {
  color: white;
  background: var(--chile);
}

.button--primary:hover {
  background: #8e2f1d;
}

.button--outline {
  border-color: var(--ink);
  background: transparent;
}

.button--outline:hover {
  color: white;
  background: var(--ink);
}

.button--cream {
  color: var(--ink);
  background: var(--cream);
}

.button--cream:hover {
  background: white;
}

.button--text {
  min-height: auto;
  padding: 9px 2px 10px;
  border: 0;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
  color: inherit;
}

.button--with-chevron {
  gap: 14px;
  padding-right: 18px;
}

.link-chevron {
  display: inline-flex;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  transform: translateX(0);
  transition: transform 350ms cubic-bezier(0.22, 1, 0.36, 1);
}

.link-chevron svg {
  width: 16px;
  height: 16px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.5;
}

.link-chevron__arm {
  transform-box: view-box;
  transform-origin: 10px 8px;
  vector-effect: non-scaling-stroke;
  transition: transform 350ms cubic-bezier(0.22, 1, 0.36, 1);
}

.button--with-chevron:hover .link-chevron {
  transform: translateX(2px);
}

.button--with-chevron:hover .link-chevron__arm--top {
  transform: rotate(8deg);
}

.button--with-chevron:hover .link-chevron__arm--bottom {
  transform: rotate(-8deg);
}

.button:focus-visible,
.text-link:focus-visible,
.nav-menu a:focus-visible,
.nav-menu__trigger:focus-visible,
.nav-toggle:focus-visible,
.cart-link:focus-visible,
.site-logo:focus-visible,
.category-card:focus-visible,
.product-card a:focus-visible,
.gift-image:focus-visible,
.footer-grid a:focus-visible {
  outline: 3px solid var(--saffron);
  outline-offset: 4px;
}

.center,
.section-footer {
  margin-top: 58px;
  text-align: center;
}

/* Header */
.site-header {
  position: relative;
  z-index: 100;
  color: var(--ink);
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  transition: box-shadow 180ms ease;
}

.announcement {
  color: #f8efe2;
  background: var(--walnut);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.announcement__inner {
  display: flex;
  min-height: 34px;
  align-items: center;
  justify-content: space-between;
}

.announcement p {
  margin: 0;
}

.announcement a {
  text-decoration: none;
}

.announcement a:hover {
  color: var(--saffron-light);
}

.nav-shell {
  position: relative;
  display: grid;
  min-height: 94px;
  grid-template-columns: 152px 1fr auto;
  align-items: center;
  gap: 36px;
}

.site-logo {
  display: block;
  width: 118px;
  height: 78px;
  overflow: hidden;
}

.site-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.nav-menu {
  --nav-hit-gap: clamp(10px, 1.5vw, 21px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-inline: calc(var(--nav-hit-gap) * -1);
}

.nav-menu > a,
.nav-menu__trigger,
.cart-link {
  position: relative;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.075em;
  padding-inline: var(--nav-hit-gap);
  text-decoration: none;
  text-transform: uppercase;
}

.nav-menu__trigger {
  display: block;
  padding-block: 0;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
}

.nav-menu__trigger::before {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  height: 32px;
  content: "";
}

@media (min-width: 821px) {
  body.mega-menu-open .nav-menu__trigger[aria-expanded="true"]::before {
    height: 54px;
  }
}

.nav-menu > a::after,
.nav-menu__trigger::after {
  position: absolute;
  right: var(--nav-hit-gap);
  bottom: -8px;
  left: var(--nav-hit-gap);
  height: 1px;
  background: var(--chile);
  content: "";
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 180ms ease;
}

.nav-menu > a:hover::after,
.nav-menu__trigger:hover::after,
.nav-menu__trigger[aria-expanded="true"]::after {
  transform: scaleX(1);
  transform-origin: left;
}

.nav-dropdown {
  position: static;
}

.mobile-nav__intro,
.mobile-nav__utility,
.mobile-nav__footer {
  display: none;
}

.mega-menu {
  position: absolute;
  z-index: 20;
  top: 100%;
  right: 0;
  left: 0;
  visibility: hidden;
  padding: 10px 0 20px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px) scale(var(--dropdown-pre-scale));
  transform-origin: var(--dropdown-origin-x, 50%) top;
  transition:
    transform var(--dropdown-open-dur) var(--dropdown-ease),
    opacity var(--dropdown-open-dur) var(--dropdown-ease);
  will-change: transform, opacity;
}

.mega-menu.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}

.mega-menu.is-closing {
  visibility: visible;
  z-index: 19;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-2px) scale(var(--dropdown-closing-scale));
  transition:
    transform var(--dropdown-close-dur) var(--dropdown-ease),
    opacity var(--dropdown-close-dur) var(--dropdown-ease);
}

.mega-menu__inner {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(190px, 2fr) minmax(230px, 2fr);
  gap: 0;
  padding: 30px;
  border-radius: var(--radius);
  color: var(--ink);
  background: #fff;
  box-shadow:
    0 24px 55px rgba(54, 33, 25, 0.18),
    0 1px 0 rgba(54, 33, 25, 0.08);
}

.mega-menu__inner > * {
  transition:
    transform var(--dropdown-swap-dur) var(--dropdown-swap-ease),
    filter var(--dropdown-swap-dur) var(--dropdown-swap-ease),
    opacity var(--dropdown-swap-dur) var(--dropdown-swap-ease);
  will-change: transform, filter, opacity;
}

.mega-menu.is-swap-exit,
.mega-menu.is-swap-enter {
  pointer-events: none;
}

.mega-menu.is-open.is-swap-enter {
  transition: none;
}

.mega-menu.is-swap-exit .mega-menu__inner > * {
  opacity: 0;
  filter: blur(var(--dropdown-swap-blur));
  transform: translateY(calc(var(--dropdown-swap-y) * -1));
}

.mega-menu.is-swap-enter .mega-menu__inner > * {
  opacity: 0;
  filter: blur(var(--dropdown-swap-blur));
  transform: translateY(var(--dropdown-swap-y));
  transition: none;
}

.mega-menu--ideas .mega-menu__inner {
  grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(230px, 0.9fr);
}

.mega-menu--products .mega-menu__inner {
  display: block;
}

.mega-menu__section {
  min-width: 0;
  padding-right: 30px;
}

.mega-menu__section + .mega-menu__section {
  padding-left: 30px;
  border-left: 1px solid rgba(54, 33, 25, 0.12);
}

.mega-menu h2 {
  margin: 0 0 22px;
  font-family: var(--font-serif);
  font-size: 1.35rem;
  font-weight: 600;
  letter-spacing: -0.025em;
}

@media (min-width: 821px) {
  #shop-mega-menu .mega-menu__inner {
    grid-template-columns: minmax(0, 4.7fr) minmax(220px, 2.3fr) minmax(230px, 2fr);
  }
}

.mega-menu__category-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 26px;
}

.mega-menu__category-grid--single {
  grid-template-columns: 1fr;
}

.mega-menu__category {
  min-width: 0;
  padding: 12px 0 14px;
  border-top: 1px solid rgba(54, 33, 25, 0.1);
  text-decoration: none;
}

.mega-menu__category strong,
.mega-menu__occasion-links strong {
  display: block;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.mega-menu__category span,
.mega-menu__occasion-links span {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-family: var(--font-sans);
  font-size: 0.84rem;
  letter-spacing: 0;
  line-height: 1.45;
  text-transform: none;
}

.mega-menu__category:hover strong,
.mega-menu__occasion-links a:hover strong,
.mega-menu__all:hover {
  color: var(--chile);
}

.mega-menu__occasion-links {
  display: grid;
  gap: 0;
}

.mega-menu__occasion-links a {
  padding: 10px 0 12px;
  border-top: 1px solid rgba(54, 33, 25, 0.1);
  text-decoration: none;
}

.mega-menu__all {
  display: inline-block;
  margin-top: 18px;
  padding-bottom: 5px;
  border-bottom: 1px solid currentColor;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-decoration: none;
  text-transform: uppercase;
}

.mega-menu__feature {
  position: relative;
  min-width: 0;
  min-height: 260px;
  overflow: hidden;
  border-radius: var(--radius-inner);
  color: #fff;
  text-decoration: none;
}

.mega-menu__feature::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(31, 18, 12, 0.88), rgba(31, 18, 12, 0.06) 70%);
  content: "";
}

.mega-menu__feature img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms cubic-bezier(.2,.7,.2,1);
}

.mega-menu__feature:hover img {
  transform: scale(1.025);
}

.mega-menu__feature-copy {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  padding: 22px;
  flex-direction: column;
  align-items: start;
  gap: 8px;
}

.mega-menu__feature-copy > strong {
  font-family: var(--font-serif);
  font-size: 1.42rem;
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.05;
}

.mega-menu__feature-copy > span {
  font-family: var(--font-sans);
  font-size: 0.86rem;
  line-height: 1.45;
}

.mega-menu__feature-copy b {
  padding-bottom: 4px;
  border-bottom: 1px solid currentColor;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.065em;
  text-transform: uppercase;
}

.product-menu__header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 30px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(54, 33, 25, 0.1);
}

.product-menu__header > div {
  min-width: 0;
}

.product-menu__header h2 {
  margin-bottom: 7px;
}

.product-menu__header p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.5;
}

.product-menu__header .mega-menu__all {
  flex: none;
  margin: 0;
}

.product-menu__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  padding-top: 22px;
}

.product-menu__card {
  display: grid;
  min-width: 0;
  gap: 13px;
  text-decoration: none;
}

.product-menu__image {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--radius-inner);
  background: var(--cream);
  outline: 1px solid rgba(46, 33, 24, 0.08);
  outline-offset: -1px;
}

.product-menu__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 420ms cubic-bezier(.2,.7,.2,1);
}

.product-menu__image--cutout img {
  object-fit: contain;
  padding: 12px;
}

.product-menu__card:hover .product-menu__image img {
  transform: scale(1.025);
}

.product-menu__card:hover strong {
  color: var(--chile);
}

.product-menu__copy,
.product-menu__type,
.product-menu__price {
  display: block;
}

.product-menu__copy {
  min-width: 0;
}

.product-menu__type {
  margin-bottom: 3px;
  color: var(--muted);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.065em;
  text-transform: uppercase;
}

.product-menu__copy strong {
  display: block;
  font-family: var(--font-serif);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.25;
}

.product-menu__price {
  margin-top: 4px;
  color: var(--ink-soft);
  font-size: 0.78rem;
  line-height: 1.4;
}

.cart-link {
  display: flex;
  align-items: center;
  gap: 9px;
}

.cart-link svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.5;
}

.nav-toggle {
  display: none;
}

/* Hero */
.hero {
  padding-block: 0;
  overflow: visible;
  background:
    radial-gradient(rgba(63, 38, 24, 0.045) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: 7px 7px;
}

.hero__frame {
  --hero-gutter: max(24px, calc((100% - 1240px) / 2));
  display: grid;
  width: calc(100% - var(--hero-gutter));
  min-height: 500px;
  margin-right: 0;
  margin-left: var(--hero-gutter);
  grid-template-columns: minmax(420px, 620px) minmax(0, 1fr);
  overflow: visible;
  background: transparent;
}

.hero__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: start;
  justify-content: center;
  padding: clamp(50px, 6vw, 84px) clamp(42px, 6vw, 84px) clamp(50px, 6vw, 84px) 0;
}

.hero h1 {
  max-width: 12ch;
  margin-bottom: 24px;
  color: var(--ink);
  font-size: var(--title-size);
}

.hero h1 span {
  display: block;
}

.hero__lede {
  max-width: 38ch;
  margin-bottom: 32px;
  color: var(--ink-soft);
  font-size: clamp(1rem, 1.3vw, 1.16rem);
  line-height: 1.65;
}

.hero__visual {
  position: relative;
  min-width: 0;
  min-height: 500px;
  margin: 0;
  overflow: visible;
  background: #d9c6aa;
}

.hero__visual > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 66% center;
}

.hero-label {
  position: absolute;
  bottom: 28px;
  left: -68px;
  display: flex;
  width: min(26vw, 224px);
  min-height: 156px;
  padding: 22px 20px;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  border-radius: var(--radius-inner);
  color: #362119;
  background: #fff;
  text-align: center;
  box-shadow:
    0 14px 30px rgba(13, 6, 3, 0.18),
    inset 0 0 0 1px rgba(255, 255, 255, 0.7);
  transform: rotate(-1.5deg);
}

.hero-label::before {
  position: absolute;
  inset: 7px;
  border-radius: calc(var(--radius-inner) - 3px);
  outline: 1px solid rgba(54, 33, 25, 0.22);
  outline-offset: -1px;
  content: "";
  pointer-events: none;
}

.hero-label__place {
  position: relative;
  z-index: 2;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.hero-label__logo {
  position: relative;
  z-index: 2;
  display: block;
  width: 86px;
  height: 46px;
}

.hero-label__logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.hero-label strong {
  position: relative;
  z-index: 2;
  font-family: var(--font-serif);
  font-size: clamp(1rem, 1.35vw, 1.3rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.15;
}

.hero-label__place {
  color: rgba(54, 33, 25, 0.72);
}

/* Section heading */
.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 52px;
}

.section-heading > div {
  max-width: 740px;
}

.section-heading h2 {
  margin-bottom: 0;
}

.section-heading--center {
  display: block;
  max-width: 760px;
  margin-inline: auto;
  text-align: center;
}

.section-heading--center > p:last-child {
  max-width: 590px;
  margin: 0 auto;
  color: var(--ink-soft);
}

.text-link {
  flex: 0 0 auto;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--ink);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}

.text-link span {
  display: inline-block;
  margin-left: 10px;
  transition: transform 180ms ease;
}

.text-link:hover span {
  transform: translate(3px, -3px);
}

/* Categories */
.category-section {
  padding-block: 58px 76px;
  background-color: #eddfc9;
  background-image: radial-gradient(rgba(63, 38, 24, 0.055) 0.65px, transparent 0.65px);
  background-size: 6px 6px;
}

.category-section .section-heading {
  margin-bottom: 28px;
}

.category-section h2 {
  font-size: clamp(2.15rem, 3.8vw, 3.6rem);
}

.category-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.category-card {
  position: relative;
  display: block;
  min-height: 310px;
  overflow: hidden;
  border-radius: var(--radius);
  color: white;
  background: var(--walnut);
  text-decoration: none;
}

.category-card::before {
  position: absolute;
  z-index: 2;
  inset: 10px;
  border-radius: var(--radius-inner);
  outline: 1px solid rgba(255, 255, 255, 0.45);
  outline-offset: -1px;
  content: "";
  pointer-events: none;
}

.category-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms cubic-bezier(.2,.7,.2,1), filter 400ms ease;
}

.category-card__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(25, 12, 6, 0.04) 30%, rgba(25, 12, 6, 0.78) 100%);
}

.category-card__title {
  position: absolute;
  right: 60px;
  bottom: 22px;
  left: 20px;
  font-family: var(--font-serif);
  font-size: clamp(1.2rem, 1.7vw, 1.85rem);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

.category-card__arrow {
  position: absolute;
  right: 16px;
  bottom: 16px;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.category-card__arrow svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.5;
}

.category-card:hover img {
  filter: saturate(1.1);
  transform: scale(1.045);
}

.category-card:hover .category-card__arrow {
  color: var(--ink);
  background: white;
  transform: rotate(8deg);
}

/* Campaign gateway */
.campaign-gateway {
  padding: clamp(76px, 8vw, 116px) 0 clamp(54px, 6vw, 78px);
  background: var(--paper);
}

.campaign-gateway__heading {
  display: flex;
  margin-bottom: 34px;
  align-items: end;
  justify-content: space-between;
  gap: 48px;
}

.campaign-gateway__heading h2 {
  max-width: 12ch;
  margin-bottom: 0;
  font-size: clamp(2.6rem, 4.4vw, 4.6rem);
}

.campaign-gateway__heading p {
  max-width: 38ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.65;
  text-wrap: pretty;
}

.campaign-gateway__grid {
  display: grid;
  grid-template-columns: 1.18fr 0.91fr 0.91fr;
  gap: 16px;
}

.campaign-card {
  position: relative;
  display: block;
  min-width: 0;
  height: 420px;
  overflow: hidden;
  border-radius: var(--radius);
  color: white;
  background: var(--walnut);
  text-decoration: none;
}

.campaign-card::after {
  position: absolute;
  z-index: 2;
  inset: 10px;
  border-radius: var(--radius-inner);
  outline: 1px solid rgba(255, 255, 255, 0.45);
  outline-offset: -1px;
  content: "";
  pointer-events: none;
}

.campaign-card > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms cubic-bezier(.2,.7,.2,1), filter 400ms ease;
}

.campaign-card--weeknight > img {
  object-position: 68% center;
}

.campaign-card__shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(28, 15, 8, 0.03) 26%, rgba(28, 15, 8, 0.84) 100%);
}

.campaign-card__copy {
  position: absolute;
  z-index: 3;
  right: 70px;
  bottom: 24px;
  left: 24px;
}

.campaign-card__copy strong {
  display: block;
  margin-bottom: 7px;
  font-family: var(--font-serif);
  font-size: clamp(1.45rem, 2vw, 2rem);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.04em;
}

.campaign-card__copy > span {
  display: block;
  max-width: 35ch;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.9rem;
  line-height: 1.5;
}

.campaign-card__icon {
  position: absolute;
  z-index: 3;
  right: 20px;
  bottom: 20px;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 50%;
  transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.campaign-card__icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.5;
}

.campaign-card:hover > img {
  filter: saturate(1.08);
  transform: scale(1.035);
}

.campaign-card:hover .campaign-card__icon {
  color: var(--ink);
  background: white;
  transform: rotate(7deg);
}

.campaign-card:focus-visible {
  outline: 3px solid var(--saffron);
  outline-offset: 4px;
}

/* Campaign pages */
.campaign-page-hero {
  --hero-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  --hero-min-height: 690px;
  --hero-copy-padding: clamp(58px, 6vw, 105px);
  display: grid;
  min-height: 690px;
  grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  background: var(--cream);
}

.campaign-page-hero__copy {
  display: flex;
  min-width: 0;
  padding: clamp(58px, 6vw, 105px);
  flex-direction: column;
  align-items: start;
  justify-content: center;
}

.campaign-page-hero__copy h1 {
  max-width: 9ch;
  margin-bottom: 30px;
  font-size: clamp(3.5rem, 6.7vw, 7.4rem);
}

.campaign-page-hero__copy p {
  max-width: 48ch;
  margin-bottom: 34px;
  color: var(--ink-soft);
  font-size: 1.12rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.campaign-page-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px 28px;
}

.campaign-page-hero__image {
  min-width: 0;
  min-height: 690px;
  margin: 0;
  overflow: hidden;
}

.campaign-page-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.campaign-page-hero--weeknight .campaign-page-hero__image img {
  object-position: 62% center;
}

.campaign-page-hero--cold .campaign-page-hero__image img {
  object-position: 44% center;
}

.campaign-page-hero--cold .campaign-page-hero__copy h1 {
  max-width: 11ch;
  font-size: clamp(3.5rem, 4.6vw, 5.4rem);
}

.campaign-playbook {
  background: var(--paper);
}

.campaign-playbook--cold {
  background-color: #eee4d4;
  background-image: radial-gradient(rgba(63, 38, 24, 0.04) 0.65px, transparent 0.65px);
  background-size: 7px 7px;
}

.campaign-playbook__heading {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  margin-bottom: 58px;
  align-items: end;
  gap: clamp(48px, 8vw, 110px);
}

.campaign-playbook__heading h2 {
  max-width: 12ch;
  margin-bottom: 0;
}

.campaign-playbook__heading p {
  max-width: 50ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.campaign-playbook__grid {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.campaign-playbook__grid > div {
  min-width: 0;
  padding-inline: 36px;
  border-left: 1px solid rgba(46, 33, 24, 0.16);
}

.campaign-playbook__grid > div:first-child {
  padding-left: 0;
  border-left: 0;
}

.campaign-playbook__grid > div:last-child {
  padding-right: 0;
}

.campaign-playbook__grid dt {
  margin-bottom: 18px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.5rem, 2.2vw, 2.15rem);
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: -0.035em;
}

.campaign-playbook__grid dd {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.7;
}

.campaign-rally {
  padding-block: clamp(68px, 7vw, 104px);
  color: white;
}

.campaign-rally--red {
  background: var(--chile);
}

.campaign-rally--olive {
  background: var(--leaf);
}

.campaign-rally__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.62fr);
  align-items: center;
  gap: 22px clamp(52px, 8vw, 120px);
}

.campaign-rally__inner h2 {
  max-width: 14ch;
  margin-bottom: 0;
  grid-row: 1 / span 2;
  font-size: clamp(2.8rem, 4.4vw, 4.9rem);
}

.campaign-rally__inner p {
  max-width: 36ch;
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(1.08rem, 1.45vw, 1.28rem);
  line-height: 1.62;
  text-wrap: pretty;
}

.campaign-rally__inner .button {
  grid-column: 2;
  justify-self: start;
}

/* Seasonal campaign lab */
.campaign-lab-hero {
  padding-block: clamp(72px, 8vw, 112px);
  background-color: #eddfc9;
  background-image: radial-gradient(rgba(63, 38, 24, 0.055) 0.65px, transparent 0.65px);
  background-size: 6px 6px;
}

.campaign-lab-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  align-items: end;
  gap: clamp(48px, 8vw, 110px);
}

.campaign-lab-hero h1 {
  max-width: 11ch;
  margin-bottom: 0;
  font-size: clamp(3.25rem, 5.7vw, 6rem);
}

.campaign-lab-hero p {
  max-width: 54ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: clamp(1.08rem, 1.5vw, 1.25rem);
  line-height: 1.7;
  text-wrap: pretty;
}

.campaign-lab-gallery {
  background: var(--paper);
}

.holiday-concepts {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 64px 18px;
}

.holiday-concept {
  min-width: 0;
}

.holiday-concept figure {
  aspect-ratio: 4 / 5;
  margin: 0 0 22px;
  overflow: hidden;
  border-radius: var(--radius);
  outline: 1px solid rgba(46, 33, 24, 0.06);
  outline-offset: -1px;
}

.holiday-concept figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.holiday-concept dt {
  margin-bottom: 12px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.7rem, 2.2vw, 2.25rem);
  font-weight: 400;
  line-height: 1.12;
  letter-spacing: -0.04em;
}

.holiday-concept dd {
  margin: 0;
  color: var(--ink-soft);
}

.holiday-concept dd strong {
  display: block;
  margin-bottom: 7px;
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.07em;
  line-height: 1.45;
  text-transform: uppercase;
}

.holiday-concept dd p {
  max-width: 42ch;
  margin: 0;
  line-height: 1.65;
  text-wrap: pretty;
}

/* Gift bundle lab */
.bundle-lab-hero h1 {
  max-width: 12ch;
}

.bundle-concepts {
  row-gap: clamp(54px, 6vw, 82px);
}

.bundle-concept figure {
  aspect-ratio: 1;
  background: #e4d7c2;
}

.bundle-concept dt {
  max-width: 17ch;
}

.bundle-lab-note {
  padding-block: clamp(76px, 8vw, 112px);
  color: white;
  background: var(--leaf);
}

.bundle-lab-note__inner {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 0.62fr);
  align-items: start;
  gap: 28px clamp(52px, 9vw, 136px);
}

.bundle-lab-note h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(2.8rem, 4.6vw, 4.8rem);
}

.bundle-lab-note p {
  max-width: 42ch;
  margin: 8px 0 30px;
  color: rgba(255, 255, 255, 0.8);
  font-size: clamp(1.04rem, 1.4vw, 1.22rem);
  line-height: 1.68;
  text-wrap: pretty;
}

.campaign-lab-passport {
  padding-block: clamp(82px, 9vw, 132px);
  color: white;
  background: var(--leaf);
}

.campaign-lab-passport__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  align-items: center;
  gap: clamp(52px, 8vw, 110px);
}

.campaign-lab-passport__image {
  min-height: 500px;
  margin: 0;
  overflow: hidden;
  border-radius: var(--radius);
}

.campaign-lab-passport__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.campaign-lab-passport__copy {
  max-width: 550px;
}

.campaign-lab-passport__copy h2 {
  max-width: 10ch;
  font-size: clamp(2.9rem, 4.8vw, 5rem);
}

.campaign-lab-passport__copy p {
  max-width: 46ch;
  margin-bottom: 32px;
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.05rem;
  line-height: 1.7;
  text-wrap: pretty;
}

/* Process */
.process-section {
  padding: clamp(54px, 6vw, 78px) 0 clamp(62px, 6vw, 86px);
  border-top: 1px solid rgb(63 38 24 / 16%);
  background: var(--paper);
}

.process-heading {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  align-items: end;
  gap: clamp(48px, 8vw, 110px);
  margin-bottom: 42px;
}

.process-heading h2 {
  max-width: 11ch;
  margin-bottom: 0;
  font-size: clamp(2.8rem, 4.7vw, 4.75rem);
}

.process-heading p {
  max-width: 58ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.7;
}

.process-gallery {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr 1fr;
  gap: 16px;
}

.process-photo {
  position: relative;
  display: block;
  height: 420px;
  min-width: 0;
  overflow: hidden;
  border-radius: var(--radius);
  color: white;
  background: var(--walnut);
  text-decoration: none;
}

.process-photo > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 600ms cubic-bezier(.2,.7,.2,1);
}

.process-photo::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgb(28 15 8 / 0%) 44%, rgb(28 15 8 / 82%) 100%);
  content: "";
  pointer-events: none;
}

.process-photo::before {
  position: absolute;
  z-index: 2;
  inset: 14px;
  border: 1px solid rgb(255 255 255 / 54%);
  border-radius: calc(var(--radius) - 7px);
  content: "";
  pointer-events: none;
}

.process-photo--blend > img {
  object-position: center;
}

.process-photo:nth-child(2) > img {
  object-position: center 58%;
}

.process-photo:nth-child(3) > img {
  object-position: center 48%;
}

.process-photo__label {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: start;
  gap: 7px;
}

.process-photo__label strong {
  font-family: var(--font-serif);
  font-size: clamp(1.35rem, 2vw, 2rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.08;
  white-space: nowrap;
}

.process-photo__label > span {
  max-width: 34ch;
  color: rgb(255 255 255 / 82%);
  font-size: 0.9rem;
  line-height: 1.5;
}

.process-photo:hover > img {
  transform: scale(1.035);
}

.process-photo:focus-visible {
  outline: 3px solid var(--saffron);
  outline-offset: 4px;
}

/* Products */
.new-section,
.product-shelf--featured {
  padding-block: clamp(92px, 10vw, 150px);
  background-color: var(--paper);
  background-image: radial-gradient(rgba(63, 38, 24, 0.04) 0.65px, transparent 0.65px);
  background-size: 7px 7px;
}

.product-shelf--related {
  padding-block: var(--section-space);
  background: var(--paper);
}

.product-shelf__heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 52px;
}

.product-shelf__heading-copy {
  max-width: 760px;
}

.product-shelf__heading h2 {
  margin-bottom: 0;
}

.product-shelf__heading-copy > p:last-child {
  max-width: 590px;
  margin: 14px auto 0;
  color: var(--ink-soft);
}

.product-shelf__heading--center {
  display: block;
  max-width: 760px;
  margin-inline: auto;
  text-align: center;
}

.product-shelf__heading--center .product-shelf__heading-copy {
  max-width: none;
}

.product-shelf__heading--center .product-shelf__heading-copy > p:last-child {
  margin-inline: auto;
}

.product-shelf--related .product-shelf__heading h2 {
  font-size: clamp(2.4rem, 3.1vw, 3.4rem);
}

.product-shelf__footer {
  margin-top: 46px;
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}

.product-card__image {
  position: relative;
  display: block;
  height: clamp(310px, 29vw, 430px);
  overflow: hidden;
  border-radius: var(--radius);
  background: #efe8dc;
  contain: paint;
  isolation: isolate;
}

.product-card__image > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-card__image--cutout {
  padding: 18px;
  background: #d9b35f;
}

.product-card__image--cutout > img {
  object-fit: contain;
}

.product-card__badge {
  position: absolute;
  z-index: 2;
  top: 13px;
  left: 13px;
  padding: 6px 10px;
  color: #472519;
  background:
    linear-gradient(135deg, #f5f4ef, #d2d5d4 48%, #f3f2ed);
  border-radius: var(--radius-inner);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.1em;
  outline: 1px solid rgba(79, 39, 14, 0.28);
  outline-offset: -3px;
  text-transform: uppercase;
}

.product-card__action {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 18px;
  color: white;
  background: rgba(46, 33, 24, 0.94);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.1em;
  opacity: 0;
  border-radius: 0 0 var(--radius) var(--radius);
  text-transform: uppercase;
  transition: opacity 160ms ease;
}

.product-card__action b {
  font-size: 1rem;
}

.product-card__info {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
  padding-top: 18px;
}

.product-card h3 {
  margin-bottom: 0;
  font-family: var(--font-serif);
  font-size: 0.98rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.4;
}

.product-card h3 a {
  text-decoration: none;
}

.product-card__info p {
  flex: 0 0 auto;
  margin: 0;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 600;
}

.product-card__stock {
  display: block;
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.product-card:hover .product-card__action,
.product-card:focus-within .product-card__action {
  opacity: 1;
}

@media (hover: none) {
  .product-card__action {
    opacity: 1;
  }
}

/* Story */
.story-section {
  position: relative;
  display: grid;
  min-height: 740px;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  color: #f8efe2;
  background: var(--walnut);
}

.story-section__image {
  position: relative;
  z-index: 1;
  min-height: 600px;
  overflow: visible;
}

.story-section__image::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(20deg, rgba(46, 20, 8, 0.25), transparent 55%);
  content: "";
}

.story-section__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 68% center;
}

.story-stamp {
  position: absolute;
  z-index: 2;
  right: clamp(24px, 3vw, 48px);
  bottom: clamp(24px, 3vw, 48px);
  display: flex;
  width: 168px;
  min-height: 174px;
  padding: 22px 20px 20px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border-radius: var(--radius);
  color: var(--ink);
  background: #fff;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.13em;
  line-height: 1.35;
  text-align: center;
  text-transform: uppercase;
  outline: 1px solid rgba(46, 33, 24, 0.22);
  outline-offset: -8px;
  transform: rotate(-2deg);
  box-shadow: 0 14px 28px rgba(13, 6, 3, 0.24);
}

.story-stamp img {
  width: 92px;
  height: 54px;
  object-fit: contain;
}

.story-stamp__est {
  display: flex;
  align-items: baseline;
  gap: 7px;
}

.story-stamp__est b {
  color: var(--chile);
  font-family: var(--font-serif);
  font-size: 1.28rem;
  font-weight: 400;
  letter-spacing: 0;
}

.story-stamp__place {
  white-space: nowrap;
}

.story-section__copy {
  display: flex;
  max-width: 760px;
  flex-direction: column;
  align-items: start;
  justify-content: center;
  padding: clamp(64px, 5.5vw, 96px);
}

.story-section__copy h2 {
  max-width: 12ch;
  color: white;
  font-size: clamp(3rem, 4.2vw, 4.75rem);
}

.story-section__copy > p {
  color: rgba(248, 239, 226, 0.74);
}

.story-section__copy .story-section__lead {
  color: #fff8ef;
  font-family: var(--font-serif);
  font-size: 1.35rem;
  line-height: 1.5;
}

.story-section__copy .button {
  margin-top: 16px;
}

/* Gifts */
.gift-section {
  background-color: #eddfc9;
  background-image: radial-gradient(rgba(63, 38, 24, 0.05) 0.7px, transparent 0.7px);
  background-size: 6px 6px;
}

.gift-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.75fr) 1.25fr;
  align-items: center;
  gap: clamp(60px, 9vw, 140px);
}

.gift-copy {
  max-width: 470px;
}

.gift-copy > p {
  margin-bottom: 34px;
  color: var(--ink-soft);
  font-size: 1.06rem;
}

.gift-image {
  position: relative;
  display: block;
  min-height: 560px;
  overflow: hidden;
  border-radius: var(--radius);
  background: #c9b89b;
}

.gift-image img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: 65% center;
  transition: transform 600ms cubic-bezier(.2,.7,.2,1);
}

.gift-image > span {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 20px;
  color: var(--ink);
  background: rgba(255, 253, 248, 0.93);
  border-radius: var(--radius-inner);
  backdrop-filter: blur(8px);
  box-shadow: 0 7px 24px rgba(46, 33, 24, 0.12);
  outline: 1px solid rgba(46, 33, 24, 0.2);
  outline-offset: -6px;
  transform: rotate(-0.7deg);
}

.gift-image b {
  font-family: var(--font-mono);
  font-size: 0.84rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.gift-image em {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  font-style: normal;
}

.gift-image:hover img {
  transform: scale(1.035);
}

/* Ask the shop */
.ask-section {
  position: relative;
  overflow: hidden;
  padding-block: clamp(76px, 8vw, 112px);
  background-color: var(--saffron-light);
  background-image:
    linear-gradient(rgba(46, 33, 24, 0.12), rgba(46, 33, 24, 0.12)),
    radial-gradient(rgba(46, 33, 24, 0.08) 0.65px, transparent 0.65px);
  background-size: 100% 1px, 6px 6px;
  background-repeat: no-repeat, repeat;
}

.ask-section::after {
  position: absolute;
  right: -90px;
  bottom: -145px;
  width: 330px;
  height: 330px;
  border: 1px solid rgba(46, 33, 24, 0.14);
  border-radius: 50%;
  content: "";
  box-shadow:
    0 0 0 18px rgba(46, 33, 24, 0.035),
    0 0 0 48px rgba(46, 33, 24, 0.025);
  pointer-events: none;
}

.ask-section__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 0.8fr);
  align-items: start;
  gap: clamp(60px, 9vw, 140px);
}

.ask-section__heading h2 {
  max-width: 10ch;
  margin-bottom: 0;
}

.ask-section__copy {
  min-width: 0;
  padding-left: clamp(28px, 4vw, 58px);
  border-left: 1px solid rgba(46, 33, 24, 0.28);
}

.ask-section__copy > p {
  max-width: 46ch;
  color: rgba(46, 33, 24, 0.78);
}

.ask-section__copy .ask-section__lead {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  line-height: 1.45;
}

.ask-section__copy .button-row {
  margin-top: 30px;
}

/* Flavor passport */
.passport-section {
  padding-block: clamp(94px, 10vw, 140px);
  color: #fff8ef;
  background:
    radial-gradient(rgba(255, 248, 239, 0.065) 0.7px, transparent 0.7px),
    #687052;
  background-size: 7px 7px;
}

.passport-grid {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  align-items: center;
  gap: clamp(60px, 8vw, 120px);
}

.passport-visual {
  min-height: 610px;
  margin: 0;
  overflow: hidden;
  border-radius: var(--radius);
  box-shadow: 0 24px 50px rgba(24, 27, 16, 0.24);
  transform: rotate(-0.6deg);
}

.passport-visual img {
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: 53% center;
}

.passport-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: start;
}

.passport-copy h2 {
  max-width: 10ch;
  color: #fff;
}

.passport-lede {
  max-width: 48ch;
  margin-bottom: 32px;
  color: rgba(255, 248, 239, 0.78);
  font-size: 1.06rem;
}

.passport-stamps {
  display: grid;
  width: 100%;
  margin: 0 0 36px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.passport-stamps > div {
  display: flex;
  min-width: 0;
  min-height: 54px;
  padding: 12px 14px;
  align-items: center;
  border: 1px solid rgba(255, 248, 239, 0.34);
  border-radius: 3px;
  color: #3d2a20;
  background: #f5ead7;
  outline: 1px solid rgba(61, 42, 32, 0.22);
  outline-offset: -5px;
}

.passport-stamps > div:nth-child(3n + 1) {
  transform: rotate(-0.7deg);
}

.passport-stamps > div:nth-child(3n + 2) {
  transform: rotate(0.55deg);
}

.passport-stamps .passport-stamp--place {
  color: #fff8ef;
  background: rgba(38, 42, 27, 0.24);
  outline-color: rgba(255, 248, 239, 0.18);
}

.passport-stamps dt {
  overflow-wrap: anywhere;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* Visit */
.visit-section {
  padding-block: clamp(90px, 10vw, 140px);
  color: #fff8ef;
  background: var(--chile);
}

.visit-grid {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  align-items: start;
  gap: 100px;
}

.visit-heading {
  max-width: 720px;
}

.visit-heading h2 {
  margin-bottom: 0;
}

.visit-details {
  display: grid;
  gap: 30px;
  padding-top: 8px;
}

.visit-details > div {
  padding-bottom: 26px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.visit-details__label {
  display: block;
  margin-bottom: 8px;
  color: rgba(255, 255, 255, 0.65);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.visit-details p {
  margin-bottom: 0;
  font-family: var(--font-serif);
  font-size: 1.35rem;
  line-height: 1.45;
}

.visit-details a:not(.button) {
  text-decoration: none;
}

/* Footer */
.site-footer {
  color: #ede2d2;
  background: #261810;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.8fr repeat(3, 1fr);
  gap: clamp(40px, 7vw, 100px);
  padding-block: 82px 68px;
}

.footer-grid > div:not(.footer-brand) {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 10px;
}

.footer-brand {
  max-width: 315px;
}

.footer-brand > a {
  display: block;
  width: 150px;
  height: 112px;
  margin-bottom: 22px;
  overflow: hidden;
}

.footer-brand img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.footer-brand p {
  margin-bottom: 0;
  color: rgba(237, 226, 210, 0.62);
  font-size: 0.87rem;
}

.footer-grid h2 {
  margin-bottom: 14px;
  color: var(--saffron-light);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.footer-grid a:not(.footer-brand > a) {
  color: rgba(237, 226, 210, 0.72);
  font-size: 0.82rem;
  line-height: 1.6;
  text-decoration: none;
  transition: color 180ms ease;
}

.footer-grid a:hover {
  color: white;
}

.footer-bottom {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(237, 226, 210, 0.45);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.footer-bottom p {
  margin: 0;
}

/* Reveal */
.js .reveal,
.js .stagger > * {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 700ms ease, transform 700ms cubic-bezier(.2,.7,.2,1);
}

.js .stagger > *:nth-child(2) { transition-delay: 90ms; }
.js .stagger > *:nth-child(3) { transition-delay: 180ms; }
.js .stagger > *:nth-child(4) { transition-delay: 270ms; }

.js .reveal.is-visible,
.js .stagger.is-visible > * {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1020px) {
  .nav-shell {
    grid-template-columns: 120px 1fr auto;
    gap: 18px;
  }

  .nav-menu {
    --nav-hit-gap: 11px;
  }

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

  .hero__copy {
    padding: 48px;
  }

  .hero-label {
    bottom: 18px;
    left: 18px;
  }

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

  .category-card {
    min-height: 330px;
  }

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

  .campaign-card--weeknight {
    grid-column: 1 / -1;
  }

  .campaign-page-hero {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .campaign-page-hero__copy {
    padding: 72px 54px;
  }

  .campaign-playbook__grid > div {
    padding-inline: 24px;
  }

  .holiday-concepts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 56px 18px;
  }

  .product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 44px 22px;
  }

  .product-card__image {
    height: 520px;
  }

  .story-section__copy {
    padding: 54px;
  }

  .visit-grid {
    gap: 60px;
  }
}

@media (max-width: 820px) {
  html {
    scroll-padding-top: 98px;
  }

  .shell {
    width: min(100% - 32px, 1240px);
  }

  .announcement__inner {
    justify-content: center;
  }

  .announcement a {
    display: none;
  }

  .nav-shell {
    min-height: 80px;
    grid-template-columns: 1fr auto auto;
  }

  .site-logo {
    width: 96px;
    height: 68px;
  }

  .nav-toggle {
    display: flex;
    width: 48px;
    height: 48px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0;
    border: 0;
    color: var(--ink);
    background: transparent;
    cursor: pointer;
  }

  .nav-toggle i {
    width: 23px;
    height: 1px;
    background: currentColor;
    transition: transform 180ms ease, opacity 180ms ease;
  }

  .nav-toggle[aria-expanded="true"] i:nth-of-type(1) {
    transform: translateY(6px) rotate(45deg);
  }

  .nav-toggle[aria-expanded="true"] i:nth-of-type(2) {
    opacity: 0;
  }

  .nav-toggle[aria-expanded="true"] i:nth-of-type(3) {
    transform: translateY(-6px) rotate(-45deg);
  }

  .nav-menu {
    --nav-hit-gap: 0px;
    position: fixed;
    z-index: -1;
    top: 114px;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    margin: 0;
    padding: 12px 20px max(44px, env(safe-area-inset-bottom));
    flex-direction: column;
    align-items: start;
    justify-content: start;
    gap: 0;
    visibility: hidden;
    overflow-y: auto;
    opacity: 0;
    background: var(--cream);
    overscroll-behavior: contain;
    transform: translateY(-12px);
    transition: opacity 180ms ease, transform 180ms ease, visibility 180ms;
  }

  .nav-menu.open {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  .nav-menu > a,
  .nav-menu__trigger {
    display: flex;
    width: 100%;
    min-height: 58px;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid var(--line);
    font-family: var(--font-serif);
    font-size: 1.45rem;
    font-weight: 500;
    letter-spacing: -0.02em;
    text-transform: none;
  }

  .nav-menu > a::after {
    display: none;
  }

  .nav-dropdown {
    width: 100%;
  }

  .nav-menu__trigger {
    padding-right: 44px;
    scroll-margin-top: 18px;
    text-align: left;
  }

  .nav-menu__trigger::after {
    display: none;
  }

  .nav-menu__trigger::before {
    position: absolute;
    top: 50%;
    right: 4px;
    left: auto;
    width: 10px;
    height: 10px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    content: "";
    transform: translateY(-70%) rotate(45deg);
    transition: transform 180ms ease;
  }

  .nav-menu__trigger[aria-expanded="true"]::before {
    transform: translateY(-30%) rotate(225deg);
  }

  .mega-menu {
    position: static;
    display: none;
    padding: 0;
    visibility: visible;
    overflow: visible;
    opacity: 1;
    pointer-events: auto;
    transform: none;
    transition: none;
  }

  .mega-menu.is-open {
    display: block;
  }

  .mega-menu__inner {
    grid-template-columns: 1fr;
    gap: 34px;
    padding: 24px 0 30px;
    border-bottom: 1px solid var(--line);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .mega-menu--ideas .mega-menu__inner {
    grid-template-columns: 1fr;
  }

  .mega-menu--products .mega-menu__inner {
    display: block;
  }

  .mega-menu__section {
    padding: 0;
  }

  .mega-menu__section + .mega-menu__section {
    padding: 0;
    border: 0;
  }

  .mega-menu h2 {
    margin-bottom: 12px;
    color: var(--ink-soft);
    font-family: var(--font-mono);
    font-size: 0.76rem;
    font-weight: 600;
    letter-spacing: 0.075em;
    text-transform: uppercase;
  }

  .mega-menu__category-grid {
    grid-template-columns: 1fr;
  }

  .mega-menu__category,
  .mega-menu__occasion-links a {
    width: 100%;
    min-height: 48px;
    padding: 13px 0 15px;
    border-bottom: 0;
  }

  .mega-menu__category strong,
  .mega-menu__occasion-links strong {
    font-size: 0.78rem;
  }

  .mega-menu__category span,
  .mega-menu__occasion-links span {
    display: block;
    max-width: 39ch;
    margin-top: 5px;
    font-size: 1rem;
    line-height: 1.45;
  }

  .mega-menu__all {
    margin-top: 12px;
    min-height: 48px;
    padding-top: 12px;
  }

  .mega-menu__feature {
    min-height: 230px;
  }

  .mega-menu__feature-copy > span {
    font-size: 1rem;
  }

  .product-menu__header {
    display: block;
    padding-bottom: 20px;
  }

  .product-menu__header p {
    max-width: 34ch;
    font-size: 1rem;
  }

  .product-menu__header .mega-menu__all {
    display: inline-flex;
    align-items: center;
    margin-top: 14px;
  }

  .product-menu__grid {
    grid-template-columns: 1fr;
    gap: 0;
    padding-top: 8px;
  }

  .product-menu__card {
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 15px;
    min-height: 120px;
    align-items: center;
    padding: 14px 0;
  }

  .product-menu__card + .product-menu__card {
    border-top: 1px solid var(--line);
  }

  .product-menu__image {
    aspect-ratio: 1;
  }

  .product-menu__image--cutout img {
    padding: 8px;
  }

  .product-menu__type {
    font-size: var(--font-size-micro);
  }

  .product-menu__copy strong {
    font-size: 1rem;
  }

  .product-menu__price {
    font-size: 1rem;
  }

  .mobile-nav__utility {
    display: grid;
    width: 100%;
    margin-top: 24px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-top: 1px solid var(--line);
    border-left: 1px solid var(--line);
  }

  .mobile-nav__utility a {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    padding: 10px 12px;
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    font-family: var(--font-mono);
    font-size: var(--font-size-micro);
    font-weight: 600;
    letter-spacing: 0.055em;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
  }

  .mobile-nav__utility a:last-child {
    grid-column: 1 / -1;
  }

  .mobile-nav__footer {
    display: block;
    width: 100%;
    padding-top: 28px;
  }

  .mobile-nav__footer > span {
    display: block;
    margin-bottom: 8px;
    color: var(--chile);
    font-family: var(--font-mono);
    font-size: var(--font-size-micro);
    font-weight: 600;
    letter-spacing: 0.075em;
    text-transform: uppercase;
  }

  .mobile-nav__footer p {
    margin: 0;
    color: var(--ink-soft);
    font-size: 1rem;
    line-height: 1.5;
  }

  .cart-link span {
    display: none;
  }

  .cart-link {
    width: 48px;
    height: 48px;
    justify-content: center;
  }

  .hero {
    padding-block: 0;
  }

  .hero__frame {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .hero__copy {
    min-height: 360px;
    padding: clamp(44px, 8vw, 70px);
  }

  .hero h1 {
    max-width: 11ch;
  }

  .hero__visual {
    height: 320px;
    min-height: 320px;
  }

  .hero-label {
    right: auto;
    width: 210px;
  }

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

  .category-card__title {
    font-size: clamp(1.6rem, 4vw, 2.3rem);
  }

  .campaign-gateway__heading {
    align-items: start;
    flex-direction: column;
    gap: 18px;
  }

  .campaign-page-hero {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .campaign-page-hero__copy {
    min-height: 520px;
    padding: 72px 40px;
  }

  .campaign-page-hero__image {
    min-height: 520px;
  }

  .campaign-playbook__heading {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 24px;
  }

  .campaign-rally__inner {
    grid-template-columns: 1fr;
  }

  .campaign-rally__inner h2 {
    grid-row: auto;
  }

  .campaign-rally__inner .button {
    grid-column: auto;
  }

  .campaign-lab-hero__inner,
  .campaign-lab-passport__grid,
  .bundle-lab-note__inner {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 42px;
  }

  .campaign-lab-hero p {
    max-width: 46ch;
  }

  .campaign-lab-passport__image {
    min-height: 520px;
  }

  .process-heading {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 24px;
  }

  .process-heading h2 {
    max-width: 13ch;
  }

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

  .process-photo--blend {
    grid-column: 1 / -1;
  }

  .process-photo {
    height: 340px;
  }

  .story-section {
    grid-template-columns: 1fr;
  }

  .story-section__image {
    min-height: 520px;
  }

  .story-stamp {
    right: 24px;
    bottom: 24px;
  }

  .story-section__copy {
    max-width: none;
    padding: 88px 32px 188px;
  }

  .story-section__copy h2 {
    max-width: 12ch;
  }

  .gift-grid,
  .visit-grid {
    grid-template-columns: 1fr;
  }

  .gift-grid {
    gap: 60px;
  }

  .gift-copy {
    max-width: 600px;
  }

  .gift-image {
    min-height: 520px;
  }

  .ask-section__grid {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .ask-section__heading h2 {
    max-width: 12ch;
  }

  .ask-section__copy {
    max-width: 680px;
    padding-top: 32px;
    padding-left: 0;
    border-top: 1px solid rgba(46, 33, 24, 0.28);
    border-left: 0;
  }

  .passport-grid {
    grid-template-columns: 1fr;
  }

  .passport-visual {
    min-height: 520px;
  }

  .passport-copy {
    max-width: 680px;
  }

  .visit-grid {
    gap: 50px;
  }

  .visit-details {
    max-width: 480px;
  }

  .footer-grid {
    grid-template-columns: 1.5fr 1fr 1fr;
  }

  .footer-grid > div:last-child {
    grid-column: 2;
  }
}

@media (max-width: 560px) {
  h1 {
    font-size: clamp(3rem, 15vw, 4.65rem);
  }

  h2 {
    font-size: clamp(2.45rem, 12vw, 3.7rem);
  }

  .section {
    padding-block: 82px;
  }

  .announcement {
    font-size: var(--font-size-micro);
  }

  .hero {
    padding-block: 0;
  }

  .hero__frame {
    width: 100%;
    margin-left: 0;
  }

  .hero__copy {
    min-height: 340px;
    padding: 38px 24px 40px;
  }

  .hero h1 {
    margin-bottom: 20px;
    font-size: 3.15rem;
  }

  .hero__lede {
    font-size: 1rem;
  }

  .hero__visual {
    height: 250px;
    min-height: 250px;
  }

  .hero__visual > img {
    object-position: 70% center;
  }

  .hero .button-row {
    flex-wrap: nowrap;
    gap: 12px;
  }

  .hero .button {
    font-size: var(--font-size-micro);
  }

  .hero .button--primary {
    gap: 20px;
    padding-right: 12px;
    padding-left: 16px;
  }

  .hero-label {
    right: 12px;
    bottom: 12px;
    left: auto;
    width: min(58vw, 210px);
    min-height: 138px;
    padding: 18px;
  }

  .section-heading {
    display: block;
    margin-bottom: 40px;
  }

  .section-heading .text-link {
    display: inline-block;
    margin-top: 24px;
  }

  .category-grid {
    display: flex;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    gap: 14px;
    overflow-x: auto;
    padding-right: 32px;
    padding-bottom: 16px;
    padding-left: 16px;
    scroll-padding-inline: 16px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }

  .category-card {
    min-width: min(78vw, 310px);
    min-height: 340px;
    scroll-snap-align: start;
  }

  .category-card__title {
    right: 70px;
    bottom: 24px;
    left: 22px;
  }

  .category-card__arrow {
    right: 20px;
    bottom: 22px;
  }

  .campaign-gateway {
    padding: 72px 0 52px;
  }

  .campaign-gateway__heading {
    margin-bottom: 30px;
  }

  .campaign-gateway__heading p {
    font-size: 1rem;
  }

  .campaign-gateway__grid {
    display: flex;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    gap: 14px;
    overflow-x: auto;
    padding-right: 32px;
    padding-bottom: 16px;
    padding-left: 16px;
    scroll-padding-inline: 16px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }

  .campaign-card,
  .campaign-card--weeknight {
    min-width: min(84vw, 340px);
    height: 440px;
    scroll-snap-align: start;
  }

  .campaign-card__copy {
    right: 68px;
    bottom: 22px;
    left: 22px;
  }

  .campaign-card__copy strong {
    font-size: 1.65rem;
  }

  .campaign-card__copy > span {
    font-size: 1rem;
  }

  .campaign-page-hero__copy {
    min-height: 480px;
    padding: 64px 24px;
  }

  .campaign-page-hero__copy h1 {
    font-size: clamp(3.2rem, 15vw, 4.8rem);
  }

  .campaign-page-hero__copy p {
    font-size: 1rem;
  }

  .campaign-page-hero__actions {
    align-items: start;
    flex-direction: column;
    gap: 14px;
  }

  .campaign-page-hero__image {
    min-height: 390px;
  }

  .campaign-page-hero--weeknight .campaign-page-hero__image img {
    object-position: 64% center;
  }

  .campaign-playbook__heading {
    margin-bottom: 40px;
  }

  .campaign-playbook__grid {
    grid-template-columns: 1fr;
  }

  .campaign-playbook__grid > div,
  .campaign-playbook__grid > div:first-child,
  .campaign-playbook__grid > div:last-child {
    padding: 30px 0;
    border-top: 1px solid rgba(46, 33, 24, 0.16);
    border-left: 0;
  }

  .campaign-playbook__grid > div:first-child {
    padding-top: 0;
    border-top: 0;
  }

  .campaign-playbook__grid > div:last-child {
    padding-bottom: 0;
  }

  .campaign-playbook__grid dt {
    font-size: 1.75rem;
  }

  .campaign-playbook__grid dd {
    font-size: 1rem;
  }

  .campaign-rally__inner {
    align-items: start;
  }

  .campaign-rally__inner p {
    font-size: 1rem;
  }

  .campaign-lab-hero {
    padding-block: 64px;
  }

  .campaign-lab-hero__inner {
    gap: 22px;
  }

  .campaign-lab-hero h1 {
    font-size: clamp(3rem, 14vw, 4.35rem);
  }

  .campaign-lab-hero p {
    font-size: 1rem;
  }

  .holiday-concepts {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .holiday-concept figure {
    margin-bottom: 18px;
  }

  .holiday-concept dt {
    font-size: 2rem;
  }

  .holiday-concept dd strong {
    font-size: 0.82rem;
  }

  .holiday-concept dd p {
    font-size: 1rem;
  }

  .bundle-lab-note {
    padding-block: 76px;
  }

  .bundle-lab-note__inner {
    gap: 24px;
  }

  .bundle-lab-note h2 {
    font-size: clamp(2.8rem, 13vw, 4rem);
  }

  .bundle-lab-note p {
    margin-top: 0;
    font-size: 1rem;
  }

  .campaign-lab-passport {
    padding-block: 76px;
  }

  .campaign-lab-passport__image {
    min-height: 360px;
  }

  .campaign-lab-passport__copy h2 {
    font-size: clamp(2.8rem, 13vw, 4rem);
  }

  .campaign-lab-passport__copy p {
    font-size: 1rem;
  }

  .process-section {
    padding: 52px 0 76px;
  }

  .process-heading {
    margin-bottom: 34px;
  }

  .process-heading p {
    font-size: 1rem;
  }

  .process-gallery {
    gap: 28px 12px;
  }

  .process-photo {
    height: 230px;
  }

  .process-photo--blend {
    height: 310px;
  }

  .process-photo__label {
    padding: 18px;
  }

  .process-photo__label strong {
    font-size: 1.2rem;
  }

  .process-photo__label > span {
    display: none;
  }

  .product-shelf__heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 30px;
  }

  .product-shelf__heading--center {
    align-items: center;
    gap: 0;
  }

  .product-shelf--related .product-shelf__heading h2 {
    font-size: clamp(2.15rem, 9.5vw, 2.5rem);
  }

  .product-grid {
    display: flex;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    gap: 15px;
    overflow-x: auto;
    padding-right: 32px;
    padding-bottom: 18px;
    padding-left: 16px;
    scroll-padding-inline: 16px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
  }

  .product-card {
    min-width: min(82vw, 340px);
    scroll-snap-align: start;
  }

  .product-card__image {
    height: 430px;
  }

  .product-card__action {
    opacity: 1;
  }

  .story-section__image {
    min-height: 410px;
  }

  .story-section__copy {
    padding: 82px 24px 32px;
  }

  .story-stamp {
    position: relative;
    right: auto;
    bottom: auto;
    margin: 0 24px 28px auto;
  }

  .gift-grid {
    gap: 48px;
  }

  .gift-image {
    min-height: 420px;
  }

  .gift-image > span {
    right: 10px;
    bottom: 10px;
    left: 10px;
    padding: 14px;
  }

  .ask-section {
    padding-block: 76px;
  }

  .ask-section::after {
    right: -150px;
    bottom: -190px;
  }

  .ask-section__grid {
    gap: 28px;
  }

  .ask-section__copy {
    padding-top: 28px;
  }

  .ask-section__copy .ask-section__lead {
    font-size: 1.25rem;
  }

  .ask-section__copy .button-row {
    margin-top: 26px;
  }

  .passport-section {
    padding-block: 82px;
  }

  .passport-grid {
    gap: 48px;
  }

  .passport-visual {
    min-height: 360px;
    transform: rotate(-0.35deg);
  }

  .passport-visual img {
    object-position: 51% center;
  }

  .passport-copy h2 {
    max-width: 9ch;
  }

  .passport-lede {
    margin-bottom: 28px;
    font-size: 1rem;
  }

  .passport-stamps {
    margin-bottom: 32px;
    gap: 10px;
  }

  .passport-stamps > div {
    min-height: 58px;
    padding: 12px;
  }

  .passport-stamps dt {
    font-size: 0.75rem;
  }

  .visit-section {
    padding-block: 82px;
  }

  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 46px 28px;
    padding-block: 68px 52px;
  }

  .footer-brand {
    grid-column: 1 / -1;
  }

  .footer-grid > div:last-child {
    grid-column: auto;
  }

  .footer-bottom {
    min-height: 90px;
    padding-block: 20px;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    gap: 5px;
  }
}

/* Personality bundles */
.personality-bundles {
  background-color: #eddfc9;
  background-image: radial-gradient(rgba(63, 38, 24, 0.055) 0.65px, transparent 0.65px);
  background-size: 6px 6px;
}

.bundle-family-heading {
  display: grid;
  margin-bottom: clamp(52px, 6vw, 80px);
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 0.62fr);
  align-items: end;
  gap: 28px clamp(52px, 9vw, 136px);
}

.bundle-family-heading h2 {
  max-width: 11ch;
  margin: 0;
  font-size: clamp(3rem, 4.8vw, 5rem);
}

.bundle-family-heading p {
  max-width: 48ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: clamp(1.04rem, 1.4vw, 1.2rem);
  line-height: 1.68;
  text-wrap: pretty;
}

.everyday-bundles {
  background: #f7f0e5;
}

/* Flavor Passport campaign */
.passport-campaign-hero {
  --hero-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  --hero-min-height: 620px;
  --hero-copy-padding: clamp(64px, 7vw, 112px) clamp(36px, 5vw, 88px);
  display: grid;
  min-height: 620px;
  grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  color: white;
  background: var(--chile);
}

.passport-campaign-hero__copy {
  display: flex;
  max-width: 760px;
  padding: clamp(64px, 7vw, 112px) clamp(36px, 5vw, 88px);
  flex-direction: column;
  align-items: start;
  justify-content: center;
}

.passport-campaign-hero h1 {
  max-width: 10ch;
  margin-bottom: 24px;
  color: white;
  font-size: clamp(3.8rem, 5.4vw, 5.7rem);
}

.passport-campaign-hero p {
  max-width: 43ch;
  margin: 0 0 24px;
  color: rgba(255, 255, 255, 0.82);
  font-size: clamp(1.06rem, 1.35vw, 1.22rem);
  line-height: 1.7;
  text-wrap: pretty;
}

.passport-campaign-hero__image {
  min-height: 100%;
  margin: 0;
  overflow: hidden;
}

.passport-campaign-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.passport-how {
  background: var(--paper);
}

.passport-heading {
  display: grid;
  margin-bottom: clamp(52px, 6vw, 80px);
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 0.62fr);
  align-items: end;
  gap: 28px clamp(52px, 9vw, 136px);
}

.passport-heading h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(3rem, 4.8vw, 5rem);
}

.passport-heading p {
  max-width: 48ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: clamp(1.04rem, 1.4vw, 1.2rem);
  line-height: 1.68;
  text-wrap: pretty;
}

.passport-steps,
.passport-program__ideas {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.passport-steps > div {
  padding-inline: 32px;
  border-left: 1px solid rgba(46, 33, 24, 0.14);
}

.passport-steps > div:first-child {
  padding-left: 0;
  border-left: 0;
}

.passport-steps > div:last-child {
  padding-right: 0;
}

.passport-steps dt,
.passport-program__ideas dt {
  margin-bottom: 14px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.75rem, 2.2vw, 2.25rem);
  line-height: 1.14;
  letter-spacing: -0.035em;
}

.passport-steps dd,
.passport-program__ideas dd {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.68;
  text-wrap: pretty;
}

.passport-flavors {
  background-color: #eddfc9;
  background-image: radial-gradient(rgba(63, 38, 24, 0.055) 0.65px, transparent 0.65px);
  background-size: 6px 6px;
}

.passport-family-grid {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(46, 33, 24, 0.16);
  border-left: 1px solid rgba(46, 33, 24, 0.16);
}

.passport-family-grid > div {
  min-height: 210px;
  padding: 28px 24px;
  border-right: 1px solid rgba(46, 33, 24, 0.16);
  border-bottom: 1px solid rgba(46, 33, 24, 0.16);
}

.passport-family-grid dt {
  margin-bottom: 20px;
  color: var(--chile);
  font-family: var(--font-serif);
  font-size: clamp(1.65rem, 2vw, 1.85rem);
  line-height: 1;
  letter-spacing: -0.04em;
  text-wrap: balance;
  white-space: nowrap;
}

.passport-family-grid dd {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.6;
  text-wrap: pretty;
}

.passport-program {
  padding-block: clamp(84px, 9vw, 136px);
  color: white;
  background: var(--leaf);
}

.passport-program__inner h2 {
  max-width: 11ch;
  margin-bottom: clamp(48px, 6vw, 78px);
  color: white;
  font-size: clamp(3rem, 5vw, 5.2rem);
}

.passport-program__ideas {
  margin-bottom: 46px;
}

.passport-program__ideas > div {
  padding-inline: 32px;
  border-left: 1px solid rgba(255, 255, 255, 0.22);
}

.passport-program__ideas > div:first-child {
  padding-left: 0;
  border-left: 0;
}

.passport-program__ideas > div:last-child {
  padding-right: 0;
}

.passport-program__ideas dt {
  color: white;
}

.passport-program__ideas dd {
  color: rgba(255, 255, 255, 0.76);
}

@media (max-width: 1100px) {
  .passport-family-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .bundle-family-heading,
  .passport-heading {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 22px;
  }

  .passport-campaign-hero {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .passport-campaign-hero__copy {
    min-height: 520px;
    padding: 72px 32px;
  }

  .passport-campaign-hero__image {
    min-height: 520px;
  }

  .passport-steps,
  .passport-program__ideas {
    grid-template-columns: 1fr;
  }

  .passport-steps > div,
  .passport-program__ideas > div {
    padding: 28px 0;
    border-top: 1px solid rgba(46, 33, 24, 0.14);
    border-left: 0;
  }

  .passport-steps > div:first-child,
  .passport-program__ideas > div:first-child {
    padding-top: 0;
    border-top: 0;
  }

  .passport-steps > div:last-child,
  .passport-program__ideas > div:last-child {
    padding-bottom: 0;
  }

  .passport-program__ideas > div {
    border-top-color: rgba(255, 255, 255, 0.22);
  }
}

@media (max-width: 560px) {
  .bundle-family-heading h2,
  .passport-heading h2,
  .passport-program__inner h2 {
    font-size: clamp(2.8rem, 13vw, 4rem);
  }

  .bundle-family-heading p,
  .passport-heading p,
  .passport-campaign-hero p {
    font-size: 1rem;
  }

  .passport-campaign-hero__copy {
    min-height: 480px;
    padding: 64px 24px;
  }

  .passport-campaign-hero h1 {
    font-size: clamp(3.7rem, 16vw, 5rem);
  }

  .passport-campaign-hero__image {
    min-height: 390px;
  }

  .passport-family-grid {
    grid-template-columns: 1fr;
  }

  .passport-family-grid > div {
    min-height: 0;
    padding: 26px 22px;
  }

  .passport-family-grid dt {
    margin-bottom: 12px;
    font-size: 2.2rem;
  }

  .passport-family-grid dd,
  .passport-steps dd,
  .passport-program__ideas dd {
    font-size: 1rem;
  }
}

/* Campaign index */
.campaign-index {
  background: var(--paper);
}

.campaign-index__intro {
  padding-block: clamp(72px, 8vw, 122px);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(rgb(63 38 24 / 4.5%) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: 7px 7px;
}

.campaign-index__intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(340px, 0.58fr);
  align-items: end;
  gap: clamp(50px, 8vw, 130px);
}

.campaign-index__intro h1 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(3.35rem, 4.1vw, 4.25rem);
  letter-spacing: -0.045em;
  line-height: 1.04;
  text-wrap: balance;
}

.campaign-index__intro p {
  max-width: 60ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: 1.04rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.campaign-index__library {
  padding-block: clamp(72px, 8vw, 116px);
}

.campaign-index__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 16px;
}

.campaign-preview {
  display: flex;
  min-width: 0;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--ink);
  background: var(--paper);
  text-decoration: none;
}

.campaign-preview__image {
  position: relative;
  height: 240px;
  min-height: 240px;
  margin: 0;
  overflow: hidden;
  flex: 0 0 240px;
  background: #ddcdb4;
}

.campaign-preview__image::after {
  position: absolute;
  inset: 0;
  box-shadow: inset 0 0 0 1px rgba(54, 33, 25, 0.06);
  content: "";
  pointer-events: none;
}

.campaign-preview__image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 550ms cubic-bezier(.2,.7,.2,1);
}

.campaign-preview:hover .campaign-preview__image img {
  transform: scale(1.025);
}

.campaign-preview__copy {
  display: flex;
  min-height: 230px;
  min-width: 0;
  padding: 26px;
  flex: 1;
  flex-direction: column;
  align-items: start;
}

.campaign-preview h2 {
  margin: 0;
  font-size: clamp(1.7rem, 2.4vw, 2.35rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-wrap: balance;
}

.campaign-preview p {
  margin: 16px 0 0;
  color: var(--ink-soft);
  font-size: 0.94rem;
  line-height: 1.58;
  text-wrap: pretty;
}

.campaign-preview__copy > span {
  margin-top: auto;
  padding-top: 24px;
  padding-bottom: 4px;
  border-bottom: 1px solid currentColor;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.065em;
  text-transform: uppercase;
}

@media (max-width: 940px) {
  .campaign-index__intro-grid {
    grid-template-columns: 1fr;
  }

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

@media (max-width: 620px) {
  .campaign-index__intro {
    padding-block: 64px;
  }

  .campaign-index__intro h1 {
    max-width: 12ch;
    font-size: clamp(3.35rem, 14vw, 4.25rem);
  }

  .campaign-index__intro p {
    font-size: 1rem;
  }

  .campaign-index__grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .campaign-preview__image {
    height: 230px;
    min-height: 230px;
    flex-basis: 230px;
  }

  .campaign-preview__copy {
    min-height: 0;
    padding: 24px;
  }

  .campaign-preview h2 {
    font-size: 1.8rem;
  }

  .campaign-preview p {
    font-size: 1rem;
  }
}

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

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

  .js .reveal,
  .js .stagger > * {
    opacity: 1;
    transform: none;
  }

  .link-chevron,
  .link-chevron__arm {
    transition: none;
  }
}

/* Not found */
.not-found {
  display: grid;
  min-height: 66vh;
  padding-block: clamp(88px, 10vw, 150px);
  place-items: center;
  background:
    radial-gradient(rgba(63, 38, 24, 0.055) 0.7px, transparent 0.7px),
    var(--cream);
  background-size: 6px 6px;
}

.not-found__inner {
  text-align: center;
}

.not-found h1 {
  max-width: 13ch;
  margin: 0 auto;
  font-size: clamp(3.1rem, 7vw, 7rem);
  letter-spacing: -0.06em;
  line-height: 0.94;
  text-wrap: balance;
}

.not-found p {
  max-width: 58ch;
  margin: 28px auto 32px;
  color: var(--ink-soft);
  line-height: 1.68;
  text-wrap: pretty;
}

.not-found p a {
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

/* AI image review */
.ai-review {
  background: var(--paper);
  color: var(--ink);
}

.ai-review-hero {
  padding: clamp(76px, 8vw, 124px) 0 clamp(58px, 6vw, 90px);
  border-bottom: 1px solid var(--line);
}

.ai-review-hero .shell {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(340px, 0.75fr);
  gap: clamp(48px, 8vw, 140px);
  align-items: end;
}

.ai-review-hero h1 {
  max-width: 8ch;
  margin: 0;
  font-size: clamp(4.4rem, 9vw, 8.6rem);
  font-weight: 500;
  letter-spacing: -0.065em;
  line-height: 0.84;
}

.ai-review-hero__intro {
  padding-bottom: 0.45rem;
}

.ai-review-hero__intro p {
  max-width: 62ch;
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.68;
}

.ai-review-hero__intro .ai-review-hero__lead {
  margin-bottom: 20px;
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: clamp(1.55rem, 2.25vw, 2.25rem);
  line-height: 1.15;
}

.ai-review-guide {
  padding: clamp(54px, 6vw, 82px) 0;
  background: var(--chile);
  color: var(--paper);
}

.ai-review-guide .shell {
  display: grid;
  grid-template-columns: minmax(180px, 0.35fr) minmax(0, 1fr);
  gap: clamp(38px, 7vw, 110px);
}

.ai-review-guide h2 {
  max-width: 8ch;
  margin: 0;
  font-size: clamp(2rem, 3.5vw, 3.3rem);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1;
}

.ai-review-guide dl {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid rgb(255 255 255 / 28%);
}

.ai-review-guide dl > div {
  padding: 22px 28px 4px 0;
  border-right: 1px solid rgb(255 255 255 / 28%);
}

.ai-review-guide dl > div + div {
  padding-left: 28px;
}

.ai-review-guide dl > div:last-child {
  border-right: 0;
}

.ai-review-guide dt {
  margin-bottom: 12px;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.ai-review-guide dd {
  margin: 0;
  color: rgb(255 255 255 / 80%);
  font-size: 0.92rem;
  line-height: 1.58;
}

.ai-review-nav {
  position: sticky;
  z-index: 8;
  top: var(--header-height, 0);
  overflow-x: auto;
  border-bottom: 1px solid var(--line);
  background: color-mix(in srgb, var(--paper) 94%, transparent);
  backdrop-filter: blur(14px);
}

.ai-review-nav .shell {
  display: flex;
  width: auto;
  min-width: max-content;
  margin: 0;
  padding-inline: max(24px, calc((100vw - 1240px) / 2));
}

.ai-review-nav a {
  padding: 18px 28px;
  border-right: 1px solid var(--line);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 650;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ai-review-nav a:first-child {
  padding-left: 0;
}

.ai-review-nav a:hover {
  color: var(--chile);
}

.ai-review-section {
  padding: clamp(74px, 8vw, 118px) 0;
  scroll-margin-top: 120px;
}

.ai-review-section--tint {
  background: var(--cream);
}

.ai-review-section--dark {
  background: var(--ink);
  color: var(--paper);
}

.ai-review-section__heading {
  display: grid;
  margin-bottom: clamp(38px, 5vw, 68px);
  grid-template-columns: minmax(0, 0.8fr) minmax(280px, 0.45fr);
  gap: 40px;
  align-items: end;
}

.ai-review-section__heading h2 {
  max-width: 10ch;
  margin: 0;
  font-size: clamp(2.8rem, 5vw, 5.5rem);
  font-weight: 500;
  letter-spacing: -0.055em;
  line-height: 0.94;
}

.ai-review-section__heading p {
  max-width: 54ch;
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.62;
}

.ai-review-section--dark .ai-review-section__heading p {
  color: rgb(255 255 255 / 66%);
}

.ai-review-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2vw, 30px);
}

.ai-review-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ai-review-card {
  display: flex;
  min-width: 0;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
  color: var(--ink);
}

.ai-review-card__image {
  display: grid;
  height: 260px;
  padding: 14px;
  overflow: hidden;
  place-items: center;
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 1px 1px, rgb(47 35 28 / 8%) 1px, transparent 1px),
    var(--cream);
  background-size: 10px 10px;
}

.ai-review-grid--two .ai-review-card__image {
  height: 360px;
}

.ai-review-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 260ms ease;
}

.ai-review-card__image:hover img {
  transform: scale(1.015);
}

.ai-review-card__copy {
  display: flex;
  min-height: 190px;
  padding: 24px;
  flex: 1;
  flex-direction: column;
}

.ai-review-card__copy h3 {
  margin: 0;
  font-size: clamp(1.4rem, 1.8vw, 1.8rem);
  font-weight: 600;
  letter-spacing: -0.035em;
  line-height: 1.08;
}

.ai-review-card__copy p {
  margin: 14px 0 0;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.52;
}

.ai-review-card__copy .ai-review-card__used {
  margin-top: auto;
  padding-top: 24px;
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 650;
  letter-spacing: 0.035em;
  line-height: 1.45;
  text-transform: uppercase;
}

.ai-review-subsection + .ai-review-subsection {
  margin-top: clamp(70px, 8vw, 112px);
}

.ai-review-subsection > h3 {
  margin: 0 0 28px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.ai-review-close {
  padding: clamp(76px, 9vw, 132px) 0;
  background: var(--cream);
}

.ai-review-close h2 {
  max-width: 12ch;
  margin: 0;
  font-size: clamp(3rem, 6.6vw, 6.8rem);
  font-weight: 500;
  letter-spacing: -0.06em;
  line-height: 0.92;
}

.ai-review-close p {
  max-width: 54ch;
  margin: 28px 0 0;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.65;
}

.ai-review-close__links {
  display: flex;
  margin-top: 34px;
  gap: 26px;
  align-items: center;
  flex-wrap: wrap;
}

@media (max-width: 940px) {
  .ai-review-hero .shell,
  .ai-review-guide .shell,
  .ai-review-section__heading {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .ai-review-hero h1 {
    max-width: none;
  }

  .ai-review-guide h2 {
    max-width: none;
  }

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

@media (max-width: 640px) {
  .ai-review-hero {
    padding-top: 58px;
  }

  .ai-review-hero h1 {
    max-width: 7ch;
    font-size: clamp(3.6rem, 18vw, 5rem);
  }

  .ai-review-guide dl {
    grid-template-columns: 1fr;
  }

  .ai-review-guide dl > div,
  .ai-review-guide dl > div + div {
    padding: 20px 0;
    border-right: 0;
    border-bottom: 1px solid rgb(255 255 255 / 28%);
  }

  .ai-review-guide dl > div:last-child {
    border-bottom: 0;
  }

  .ai-review-nav a {
    padding: 15px 20px;
  }

  .ai-review-nav a:first-child {
    padding-left: 0;
  }

  .ai-review-nav .shell {
    padding-inline: 16px;
  }

  .ai-review-grid,
  .ai-review-grid--two {
    grid-template-columns: 1fr;
  }

  .ai-review-grid--two .ai-review-card__image,
  .ai-review-card__image {
    height: 250px;
  }

  .ai-review-card__copy {
    min-height: 0;
  }

  .ai-review-section__heading h2 {
    font-size: clamp(2.9rem, 14vw, 4.3rem);
  }
}

/* Pantry pairing guide teaser */

.pantry-guide-teaser {
  padding-block: clamp(68px, 7vw, 96px);
  overflow: hidden;
  background: #e5bd69;
}

.pantry-guide-teaser__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
  align-items: center;
  gap: clamp(50px, 8vw, 128px);
}

.pantry-guide-teaser__visual {
  position: relative;
  display: grid;
  min-height: 430px;
  place-items: center;
}

.pantry-guide-teaser__visual::before {
  position: absolute;
  width: min(34vw, 430px);
  aspect-ratio: 1;
  border: 1px solid rgb(46 33 24 / 24%);
  border-radius: 50%;
  content: "";
}

.pantry-guide-teaser__visual img {
  position: relative;
  z-index: 2;
  width: min(78%, 335px);
  max-height: 430px;
  object-fit: contain;
  filter: drop-shadow(0 24px 24px rgb(61 38 21 / 20%));
  transform: rotate(-2deg);
}

.pantry-guide-teaser__word {
  position: absolute;
  z-index: 3;
  padding: 7px 12px;
  border: 1px solid rgb(46 33 24 / 45%);
  border-radius: 999px;
  background: #f8f3e9;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.pantry-guide-teaser__word--one {
  top: 15%;
  left: 0;
  transform: rotate(-5deg);
}

.pantry-guide-teaser__word--two {
  top: 39%;
  right: -2%;
  transform: rotate(4deg);
}

.pantry-guide-teaser__word--three {
  bottom: 13%;
  left: 8%;
  transform: rotate(2deg);
}

.pantry-guide-teaser__copy h2 {
  max-width: 10ch;
  margin-bottom: 24px;
  font-size: clamp(3.2rem, 5.7vw, 6rem);
}

.pantry-guide-teaser__copy > p {
  max-width: 57ch;
  margin-bottom: 34px;
  color: rgb(46 33 24 / 78%);
  font-size: 1.06rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.pantry-guide-teaser__details {
  display: grid;
  margin: 0 0 36px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid rgb(46 33 24 / 24%);
}

.pantry-guide-teaser__details > div {
  min-width: 0;
  padding: 20px 20px 0 0;
}

.pantry-guide-teaser__details > div + div {
  padding-left: 20px;
  border-left: 1px solid rgb(46 33 24 / 24%);
}

.pantry-guide-teaser__details dt {
  margin-bottom: 8px;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.pantry-guide-teaser__details dd {
  margin: 0;
  color: rgb(46 33 24 / 72%);
  font-size: 0.9rem;
  line-height: 1.5;
}

/* Pantry pairing campaign */
.pairing-guide {
  overflow: hidden;
  background: var(--paper);
}

.pairing-hero {
  padding-block: clamp(58px, 6.5vw, 88px);
  background:
    radial-gradient(rgb(63 38 24 / 5%) 0.65px, transparent 0.65px),
    #e5bd69;
  background-size: 7px 7px;
}

.pairing-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.72fr);
  align-items: center;
  gap: clamp(48px, 9vw, 138px);
}

.pairing-hero__copy h1 {
  max-width: 10ch;
  margin-bottom: 28px;
  font-size: clamp(3.6rem, 7vw, 7.4rem);
  letter-spacing: -0.065em;
  line-height: 0.91;
}

.pairing-hero__copy > p {
  max-width: 56ch;
  margin-bottom: 32px;
  color: rgb(46 33 24 / 78%);
  font-size: 1.08rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.pairing-signup {
  display: grid;
  max-width: 520px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
}

.pairing-signup input {
  min-width: 0;
  min-height: 54px;
  padding: 13px 16px;
  border: 1px solid rgb(46 33 24 / 40%);
  border-radius: var(--radius-inner);
  color: var(--ink);
  background: rgb(255 253 248 / 86%);
  font-size: 1rem;
  outline: none;
}

.pairing-signup input:focus {
  border-color: var(--ink);
  outline: 2px solid var(--saffron);
  outline-offset: 0;
}

.pairing-signup__note {
  margin: 2px 0 0;
  grid-column: 1 / -1;
  color: rgb(46 33 24 / 68%);
  font-size: 0.88rem;
  line-height: 1.5;
}

.pairing-hero__visual {
  position: relative;
  display: grid;
  min-height: 490px;
  place-items: center;
}

.pairing-hero__visual::before,
.pairing-hero__visual::after {
  position: absolute;
  border: 1px solid rgb(46 33 24 / 24%);
  border-radius: 50%;
  content: "";
}

.pairing-hero__visual::before {
  width: min(36vw, 480px);
  aspect-ratio: 1;
}

.pairing-hero__visual::after {
  width: min(27vw, 350px);
  aspect-ratio: 1;
}

.pairing-hero__visual > img {
  position: relative;
  z-index: 2;
  width: min(86%, 440px);
  max-height: 480px;
  object-fit: contain;
  filter: drop-shadow(0 26px 26px rgb(61 38 21 / 19%));
  transform: rotate(2deg);
}

.pairing-hero__note {
  position: absolute;
  z-index: 3;
  padding: 9px 14px;
  border: 1px solid rgb(46 33 24 / 42%);
  border-radius: 999px;
  background: var(--paper);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.pairing-hero__note--top {
  top: 13%;
  left: -8%;
  transform: rotate(-4deg);
}

.pairing-hero__note--bottom {
  right: -5%;
  bottom: 17%;
  transform: rotate(3deg);
}

.pairing-section-heading {
  display: grid;
  margin-bottom: 48px;
  grid-template-columns: minmax(0, 0.9fr) minmax(280px, 0.52fr);
  align-items: end;
  gap: 48px;
}

.pairing-section-heading h2 {
  max-width: 11ch;
  margin: 0;
  font-size: clamp(3rem, 5.5vw, 5.6rem);
}

.pairing-section-heading p {
  max-width: 54ch;
  margin: 0;
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.65;
  text-wrap: pretty;
}

.pairing-ingredients {
  background: var(--paper);
}

.pairing-grid {
  display: grid;
  margin: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.pairing-card {
  min-width: 0;
  padding: clamp(26px, 3vw, 42px);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.pairing-card dt {
  margin-bottom: 28px;
  color: var(--chile);
  font-family: var(--font-serif);
  font-size: clamp(2rem, 3vw, 3.1rem);
  line-height: 1;
  letter-spacing: -0.045em;
}

.pairing-card dd {
  margin: 0;
  color: var(--ink-soft);
  font-size: 0.94rem;
  line-height: 1.6;
}

.pairing-card dd + dd {
  margin-top: 14px;
}

.pairing-card dd strong {
  color: var(--ink);
  font-weight: 600;
}

.pairing-method {
  padding-block: clamp(74px, 8vw, 116px);
  background: var(--walnut);
  color: var(--paper);
}

.pairing-method__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(50px, 9vw, 140px);
}

.pairing-method__copy h2 {
  max-width: 10ch;
  margin-bottom: 24px;
  font-size: clamp(3rem, 5vw, 5.3rem);
}

.pairing-method__copy p {
  max-width: 47ch;
  margin: 0;
  color: rgb(255 253 248 / 69%);
  line-height: 1.7;
  text-wrap: pretty;
}

.pairing-method__steps {
  margin: 0;
  border-top: 1px solid rgb(255 255 255 / 20%);
}

.pairing-method__steps > div {
  display: grid;
  padding: 25px 0;
  grid-template-columns: minmax(130px, 0.38fr) minmax(0, 1fr);
  gap: 28px;
  border-bottom: 1px solid rgb(255 255 255 / 20%);
}

.pairing-method__steps dt {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pairing-method__steps dd {
  margin: 0;
  color: rgb(255 253 248 / 72%);
  line-height: 1.65;
}

.pairing-recipes {
  background:
    radial-gradient(rgb(63 38 24 / 4.5%) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: 7px 7px;
}

.pairing-recipes__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.pairing-recipes__grid article {
  min-width: 0;
  padding: clamp(28px, 3vw, 42px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgb(255 253 248 / 68%);
}

.pairing-recipes__grid article > span,
.demo-tile > div > span {
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.pairing-recipes__grid h3 {
  max-width: 14ch;
  margin: 28px 0 16px;
  font-size: clamp(1.8rem, 2.7vw, 2.7rem);
}

.pairing-recipes__grid p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.65;
}

.pairing-close {
  padding-block: clamp(70px, 8vw, 114px);
  overflow: hidden;
  background: var(--chile);
  color: var(--paper);
}

.pairing-close__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
  align-items: center;
  gap: clamp(42px, 8vw, 124px);
}

.pairing-close__copy h2 {
  max-width: 10ch;
  margin-bottom: 24px;
  font-size: clamp(3rem, 5.5vw, 5.7rem);
}

.pairing-close__copy > p {
  max-width: 53ch;
  margin-bottom: 30px;
  color: rgb(255 253 248 / 78%);
  line-height: 1.7;
  text-wrap: pretty;
}

.pairing-signup--light input {
  border-color: rgb(255 255 255 / 42%);
  background: rgb(255 255 255 / 95%);
}

.pairing-signup--light .pairing-signup__note {
  color: rgb(255 253 248 / 70%);
}

.pairing-close__basket img {
  width: 112%;
  max-width: none;
  filter: drop-shadow(0 30px 30px rgb(45 16 9 / 26%));
  transform: rotate(1.5deg);
}

/* Demo library */
.demo-library {
  background: var(--paper);
}

.demo-library__hero {
  padding-block: clamp(72px, 8vw, 122px);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(rgb(63 38 24 / 4.5%) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: 7px 7px;
}

.demo-library__hero .shell {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(340px, 0.58fr);
  align-items: end;
  gap: clamp(50px, 8vw, 130px);
}

.demo-library__hero h1 {
  max-width: 8ch;
  margin: 0;
  font-size: clamp(4rem, 8vw, 8.4rem);
  letter-spacing: -0.065em;
  line-height: 0.88;
}

.demo-library__hero p {
  max-width: 60ch;
  margin: 0 0 8px;
  color: var(--ink-soft);
  font-size: 1.04rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.demo-library__section {
  padding-block: clamp(72px, 8vw, 116px);
}

.demo-library__section--tint {
  background: var(--cream);
}

.demo-library__heading {
  display: flex;
  margin-bottom: 38px;
  align-items: end;
  justify-content: space-between;
  gap: 40px;
}

.demo-library__heading h2 {
  margin: 0;
  font-size: clamp(2.7rem, 4vw, 4.3rem);
}

.demo-library__heading p {
  max-width: 48ch;
  margin: 0;
  color: var(--ink-soft);
}

.demo-library__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.demo-tile {
  display: flex;
  min-width: 0;
  overflow: hidden;
  flex-direction: column;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  text-decoration: none;
}

.demo-tile figure {
  height: 220px;
  margin: 0;
  overflow: hidden;
  background: #d8b45f;
}

.demo-tile figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms cubic-bezier(.2,.7,.2,1);
}

.demo-tile figure.demo-tile__cutout {
  display: grid;
  padding: 18px;
  place-items: center;
  background: #e5bd69;
}

.demo-tile figure.demo-tile__cutout img {
  object-fit: contain;
  filter: drop-shadow(0 18px 18px rgb(61 38 21 / 18%));
}

.demo-tile > div {
  display: flex;
  min-height: 230px;
  padding: 26px;
  flex: 1;
  flex-direction: column;
}

.demo-tile > div > span {
  color: var(--chile);
}

.demo-tile h3 {
  margin: auto 0 14px;
  padding-top: 28px;
  font-size: clamp(1.7rem, 2.4vw, 2.35rem);
}

.demo-tile p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.6;
}

.demo-tile:hover figure img {
  transform: scale(1.025);
}

.demo-library__grid--featured .demo-tile--home {
  grid-column: span 2;
}

.demo-library__grid--featured .demo-tile--home figure {
  height: 330px;
}

.demo-library__close {
  padding-block: clamp(76px, 8vw, 120px);
  background: #e5bd69;
}

.demo-library__close h2 {
  max-width: 12ch;
  margin-bottom: 24px;
  font-size: clamp(3rem, 5.7vw, 6rem);
}

.demo-library__close p {
  max-width: 58ch;
  margin-bottom: 30px;
  color: rgb(46 33 24 / 76%);
  line-height: 1.7;
  text-wrap: pretty;
}

.campaign-index__intro .text-link {
  display: inline-block;
  margin-top: 28px;
}

.campaign-preview--cutout .campaign-preview__image {
  display: grid;
  padding: 22px;
  place-items: center;
  background: #e5bd69;
}

.campaign-preview--cutout .campaign-preview__image img {
  object-fit: contain;
  filter: drop-shadow(0 18px 18px rgb(61 38 21 / 18%));
}

@media (max-width: 940px) {
  .pantry-guide-teaser__grid,
  .pairing-hero__grid,
  .pairing-method__grid,
  .pairing-close__grid,
  .demo-library__hero .shell {
    grid-template-columns: 1fr;
  }

  .pantry-guide-teaser__grid,
  .pairing-hero__grid {
    gap: 28px;
  }

  .pantry-guide-teaser__visual {
    min-height: 430px;
    grid-row: 2;
  }

  .pantry-guide-teaser__visual::before {
    width: min(60vw, 410px);
  }

  .pairing-hero__copy h1 {
    max-width: 11ch;
  }

  .pairing-hero__visual {
    min-height: 470px;
  }

  .pairing-hero__visual::before {
    width: min(62vw, 450px);
  }

  .pairing-hero__visual::after {
    width: min(48vw, 330px);
  }

  .pairing-section-heading {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .pairing-grid,
  .pairing-recipes__grid,
  .demo-library__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pairing-close__basket img {
    width: 100%;
  }

  .demo-library__grid--featured .demo-tile--home {
    grid-column: span 2;
  }
}

@media (max-width: 640px) {
  .pantry-guide-teaser__grid {
    gap: 36px;
  }

  .pantry-guide-teaser__visual {
    min-height: 360px;
  }

  .pantry-guide-teaser__visual img {
    max-height: 360px;
  }

  .pantry-guide-teaser__word--one {
    left: -4px;
  }

  .pantry-guide-teaser__word--two {
    right: -4px;
  }

  .pantry-guide-teaser__details {
    grid-template-columns: 1fr;
  }

  .pantry-guide-teaser__details > div,
  .pantry-guide-teaser__details > div + div {
    padding: 18px 0;
    border-left: 0;
    border-bottom: 1px solid rgb(46 33 24 / 24%);
  }

  .pantry-guide-teaser__details > div:last-child {
    border-bottom: 0;
  }

  .pairing-hero__copy h1 {
    font-size: clamp(3.35rem, 16vw, 5rem);
  }

  .pairing-signup {
    grid-template-columns: 1fr;
  }

  .pairing-signup__note {
    grid-column: auto;
    font-size: 1rem;
  }

  .pairing-hero__visual {
    min-height: 400px;
  }

  .pairing-hero__visual > img {
    max-height: 410px;
  }

  .pairing-hero__note {
    font-size: var(--font-size-micro);
  }

  .pairing-hero__note--top {
    top: 7%;
    left: 0;
  }

  .pairing-hero__note--bottom {
    right: 0;
    bottom: 10%;
  }

  .pairing-grid,
  .pairing-recipes__grid,
  .demo-library__grid {
    grid-template-columns: 1fr;
  }

  .pairing-card dd {
    font-size: 1rem;
  }

  .pairing-method__steps > div {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .pairing-method__steps dd {
    font-size: 1rem;
  }

  .pairing-close__grid {
    gap: 34px;
  }

  .demo-library__hero h1 {
    font-size: clamp(3.7rem, 18vw, 5.2rem);
  }

  .demo-library__heading {
    display: block;
  }

  .demo-library__heading p {
    margin-top: 14px;
  }

  .demo-library__grid--featured .demo-tile--home {
    grid-column: auto;
  }

  .demo-library__grid--featured .demo-tile--home figure,
  .demo-tile figure {
    height: 230px;
  }

  .demo-tile > div {
    min-height: 0;
  }
}

/* Redo storefront pilot: product detail and persistent cart */
[hidden] {
  display: none !important;
}

body.cart-open {
  overflow: hidden;
}

.product-page {
  min-width: 0;
  overflow: clip;
  background: var(--paper);
}

.product-detail {
  padding-block: clamp(24px, 4vw, 58px) clamp(72px, 9vw, 126px);
}

.product-breadcrumbs {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 7px 10px;
  align-items: center;
  margin-bottom: clamp(30px, 4vw, 54px);
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.065em;
  text-transform: uppercase;
}

.product-breadcrumbs a {
  text-underline-offset: 4px;
}

.product-breadcrumbs a:hover {
  color: var(--chile);
}

/* Shared server-rendered breadcrumb partial. Keep it quiet so the page title
   remains the visual anchor while preserving a clear navigation landmark. */
.site-breadcrumbs {
  display: block;
  min-width: 0;
  margin-bottom: clamp(24px, 3vw, 36px);
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.065em;
  text-transform: uppercase;
}

.site-breadcrumbs ol {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  gap: 7px 0;
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-breadcrumbs li {
  display: inline-flex;
  min-width: 0;
  align-items: center;
}

.site-breadcrumbs li + li::before {
  margin-inline: 10px;
  color: var(--line);
  content: "/";
}

.site-breadcrumbs a {
  text-underline-offset: 4px;
}

.site-breadcrumbs a:hover {
  color: var(--chile);
}

.site-breadcrumbs [aria-current="page"] {
  overflow: hidden;
  color: var(--ink);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.catalog-product__hero .site-breadcrumbs {
  margin-bottom: 28px;
}

.product-detail__layout {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  gap: clamp(46px, 7vw, 104px);
  align-items: start;
}

.product-detail__media,
.product-detail__summary {
  min-width: 0;
}

.product-detail__media {
  position: sticky;
  top: 26px;
  margin: 0;
}

.product-detail__image {
  display: grid;
  min-height: clamp(440px, 50vw, 650px);
  place-items: center;
  overflow: hidden;
  border-radius: min(1.2vw, 14px);
  background:
    radial-gradient(circle at 48% 42%, rgb(255 255 255 / 88%) 0 21%, transparent 56%),
    linear-gradient(145deg, #eee5d3, var(--cream));
  outline: 1px solid rgb(46 33 24 / 7%);
  outline-offset: -1px;
}

.product-detail__image img {
  width: 100%;
  height: 100%;
  max-height: 650px;
  object-fit: contain;
}

.product-detail__media figcaption {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding-top: 14px;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.045em;
  line-height: 1.45;
  text-transform: uppercase;
}

.product-detail__media figcaption span:last-child {
  text-align: right;
}

.product-detail__summary {
  padding-top: clamp(8px, 2vw, 28px);
}

.product-detail__summary h1 {
  max-width: 12ch;
  margin-bottom: 22px;
  font-family: var(--font-serif);
  font-size: clamp(2.9rem, 5vw, 5.15rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.99;
  text-wrap: balance;
}

.product-detail__lead {
  max-width: 42ch;
  margin-bottom: 28px;
  color: var(--ink-soft);
  font-size: clamp(1.08rem, 1.5vw, 1.28rem);
  line-height: 1.62;
  text-wrap: pretty;
}

.product-detail__price {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  align-items: baseline;
  padding-block: 20px;
  border-block: 1px solid rgb(46 33 24 / 14%);
}

.product-detail__price strong {
  font-family: var(--font-serif);
  font-size: clamp(1.7rem, 2.4vw, 2.25rem);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.product-detail__price span {
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.product-form {
  display: grid;
  gap: 22px;
  padding-top: 28px;
}

.product-options {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

.product-options legend {
  padding: 0;
  margin-bottom: 12px;
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

.product-options__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.product-option {
  position: relative;
  min-width: 0;
}

.product-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.product-option label {
  display: grid;
  min-height: 94px;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-content: center;
  padding: 15px 16px;
  border: 1px solid rgb(46 33 24 / 18%);
  border-radius: var(--radius-inner);
  background: rgb(255 255 255 / 52%);
  cursor: pointer;
}

.product-option label span {
  min-width: 0;
  font-weight: 600;
  line-height: 1.25;
}

.product-option label strong {
  font-family: var(--font-mono);
  font-size: 0.79rem;
  font-variant-numeric: tabular-nums;
}

.product-option label small {
  grid-column: 1 / -1;
  color: var(--ink-soft);
  font-size: 0.88rem;
}

.product-option input:checked + label {
  border-color: var(--chile);
  background: rgb(168 59 37 / 7%);
  box-shadow: inset 0 0 0 1px var(--chile);
}

.product-option input:focus-visible + label {
  outline: 3px solid var(--saffron);
  outline-offset: 3px;
}

.product-option input:disabled + label {
  color: rgb(46 33 24 / 48%);
  background:
    repeating-linear-gradient(-45deg, transparent 0 7px, rgb(46 33 24 / 4%) 7px 8px),
    rgb(46 33 24 / 3%);
  cursor: not-allowed;
}

.product-option input:disabled + label small {
  color: var(--chile);
}

.product-form__actions {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
}

.quantity-picker {
  display: grid;
  min-height: 54px;
  grid-template-columns: 44px 46px 44px;
  align-items: stretch;
  overflow: hidden;
  border: 1px solid rgb(46 33 24 / 23%);
  border-radius: var(--radius-inner);
  background: white;
}

.quantity-picker button,
.quantity-picker input {
  min-width: 0;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: center;
}

.quantity-picker button {
  position: relative;
  font-size: 1.2rem;
  cursor: pointer;
}

.quantity-picker button::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(100%, 48px);
  height: max(100%, 48px);
  content: "";
  transform: translate(-50%, -50%);
}

.quantity-picker button:hover {
  background: var(--cream);
}

.quantity-picker button:focus-visible,
.quantity-picker input:focus-visible {
  z-index: 1;
  outline: 2px solid var(--saffron);
  outline-offset: -2px;
}

.quantity-picker input {
  width: 46px;
  padding: 0;
  border-inline: 1px solid rgb(46 33 24 / 13%);
  border-radius: 0;
  font-family: var(--font-mono);
  font-size: 1rem;
  font-variant-numeric: tabular-nums;
  -moz-appearance: textfield;
}

.quantity-picker input::-webkit-inner-spin-button,
.quantity-picker input::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.product-form__add {
  width: 100%;
  cursor: pointer;
}

.product-form__message {
  min-height: 1.4em;
  margin: -10px 0 0;
  color: var(--leaf);
  font-size: 0.92rem;
  font-weight: 600;
}

.product-detail__highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 28px 0 0;
  margin: 2px 0 0;
  border-top: 1px solid rgb(46 33 24 / 14%);
  list-style: none;
}

.product-detail__highlights li {
  padding-inline: 15px;
  color: var(--ink-soft);
  font-size: 0.91rem;
  line-height: 1.45;
  text-align: center;
}

.product-detail__highlights li:first-child {
  padding-left: 0;
}

.product-detail__highlights li + li {
  border-left: 1px solid rgb(46 33 24 / 14%);
}

.product-detail__highlights li:last-child {
  padding-right: 0;
}

.product-detail__checkout-note {
  margin: 22px 0 0;
  color: var(--ink-soft);
  font-size: 0.88rem;
  line-height: 1.55;
}

.product-story {
  padding-block: clamp(72px, 9vw, 124px);
  color: #f8efe2;
  background: var(--walnut);
}

.product-story__heading {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 7fr);
  gap: clamp(26px, 5vw, 68px);
  align-items: end;
  margin-bottom: clamp(42px, 6vw, 72px);
}

.product-story__heading > h2 {
  max-width: 18ch;
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(2.2rem, 4vw, 4rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.06;
  text-wrap: balance;
}

.product-story__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.product-story__grid article {
  min-width: 0;
  padding-inline: clamp(24px, 3vw, 42px);
}

.product-story__grid article:first-child {
  padding-left: 0;
}

.product-story__grid article + article {
  border-left: 1px solid rgb(248 239 226 / 19%);
}

.product-story__grid article:last-child {
  padding-right: 0;
}

.product-story__grid h2 {
  margin-bottom: 16px;
  color: var(--saffron-light);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.product-story__grid p {
  max-width: 38ch;
  margin: 0;
  color: rgb(248 239 226 / 78%);
  font-size: 1rem;
  line-height: 1.7;
  text-wrap: pretty;
}

.related-products {
  padding-block: clamp(74px, 9vw, 126px);
  background: var(--cream);
}

.related-products__heading {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 28px;
  align-items: end;
  margin-bottom: 34px;
}

.related-products__heading h2 {
  max-width: 14ch;
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(2.2rem, 4vw, 3.75rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.05;
  text-wrap: balance;
}

.related-products__heading p {
  max-width: 37ch;
  margin: 0;
  color: var(--ink-soft);
  text-wrap: pretty;
}

.related-products__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 38px);
}

.related-product {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(132px, 2fr) minmax(0, 3fr);
  border: 1px solid rgb(46 33 24 / 10%);
  border-radius: var(--radius);
  overflow: hidden;
  color: inherit;
  background: var(--paper);
  text-decoration: none;
}

.related-product__image {
  display: grid;
  min-height: 230px;
  place-items: center;
  overflow: hidden;
  background: #eee5d3;
}

.related-product__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(1);
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.related-product__copy {
  display: grid;
  min-width: 0;
  align-content: center;
  gap: 10px;
  padding: clamp(24px, 3vw, 38px);
}

.related-product__copy > span {
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.related-product__copy strong {
  font-family: var(--font-serif);
  font-size: clamp(1.3rem, 2vw, 1.85rem);
  font-weight: 400;
  line-height: 1.2;
}

.related-product__copy small {
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

.related-product:hover .related-product__image img {
  transform: scale(1.035);
}

.related-product:focus-visible {
  outline: 3px solid var(--saffron);
  outline-offset: 4px;
}

.cart-link {
  position: relative;
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  gap: 8px;
  padding: 8px 2px;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
}

.cart-link__count {
  position: absolute;
  top: 1px;
  right: -12px;
  z-index: 1;
  display: inline-grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  padding-inline: 6px;
  border-radius: 999px;
  color: white;
  background: var(--chile);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.cart-link__loading {
  display: none;
}

.cart-scrim {
  position: fixed;
  inset: 0;
  z-index: 990;
  background: rgb(46 33 24 / 48%);
  opacity: 0;
  backdrop-filter: blur(2px);
  transition: opacity 240ms ease;
}

.cart-scrim.is-open {
  opacity: 1;
}

.cart-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 991;
  display: grid;
  width: min(100%, 470px);
  height: 100dvh;
  grid-template-rows: auto minmax(0, 1fr) auto;
  color: var(--ink);
  background: var(--paper);
  box-shadow: -24px 0 70px rgb(46 33 24 / 23%);
  outline: 1px solid rgb(46 33 24 / 8%);
  outline-offset: -1px;
  transform: translateX(104%);
  transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

.cart-drawer.is-open {
  transform: translateX(0);
}

.cart-drawer__header {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px clamp(22px, 5vw, 34px);
  border-bottom: 1px solid rgb(46 33 24 / 12%);
}

.cart-drawer__header p {
  margin: 0 0 3px;
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.cart-drawer__header h2 {
  margin: 0;
  font-family: var(--font-serif);
  font-size: 1.9rem;
  font-weight: 400;
  line-height: 1.1;
}

.cart-drawer__close {
  position: relative;
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgb(46 33 24 / 17%);
  border-radius: 50%;
  color: var(--ink);
  background: transparent;
  cursor: pointer;
}

.cart-drawer__close span {
  font-size: 1.85rem;
  font-weight: 300;
  line-height: 1;
  transform: translateY(-1px);
}

.cart-drawer__close:hover {
  background: var(--cream);
}

.cart-drawer__close:focus-visible {
  outline: 3px solid var(--saffron);
  outline-offset: 3px;
}

.cart-drawer__body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.cart-loading {
  display: grid;
  gap: 12px;
  padding: 38px clamp(22px, 7vw, 44px);
  color: var(--ink-soft);
}

.cart-loading__label {
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.075em;
  text-transform: uppercase;
}

.cart-loading__bar {
  display: block;
  width: 100%;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgb(46 33 24 / 7%), rgb(217 152 47 / 20%), rgb(46 33 24 / 7%));
  background-size: 220% 100%;
  animation: cart-loading-shimmer 1.4s ease-in-out infinite;
}

.cart-loading__bar--short {
  width: 68%;
}

.cart-loading__bar--tiny {
  width: 42%;
}

.cart-loading--page {
  min-height: 420px;
  align-content: center;
}

.cart-loading--checkout,
.cart-loading--checkout-summary {
  padding: 0;
}

.cart-loading--checkout-summary {
  min-height: 170px;
  align-content: center;
}

@keyframes cart-loading-shimmer {
  0% {
    background-position: 100% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.cart-empty {
  display: grid;
  min-height: 100%;
  place-content: center;
  justify-items: start;
  padding: 46px clamp(22px, 7vw, 44px);
}

.cart-empty__mark {
  display: grid;
  width: 60px;
  height: 60px;
  place-items: center;
  margin-bottom: 28px;
  border-radius: 50%;
  color: var(--chile);
  background: rgb(168 59 37 / 8%);
  font-family: var(--font-serif);
  font-size: 2.4rem;
}

.cart-empty h3 {
  max-width: 13ch;
  margin-bottom: 12px;
  font-family: var(--font-serif);
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.15;
  text-wrap: balance;
}

.cart-empty p {
  max-width: 34ch;
  margin-bottom: 28px;
  color: var(--ink-soft);
  font-size: 1rem;
  text-wrap: pretty;
}

.cart-items {
  display: grid;
  padding: 0 clamp(22px, 5vw, 34px);
}

.cart-item {
  display: grid;
  min-width: 0;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 18px;
  padding-block: 24px;
  border-bottom: 1px solid rgb(46 33 24 / 12%);
}

.cart-item__image {
  display: grid;
  width: 86px;
  height: 102px;
  place-items: center;
  overflow: hidden;
  border-radius: var(--radius-inner);
  background: var(--cream);
  outline: 1px solid rgb(46 33 24 / 7%);
  outline-offset: -1px;
}

.cart-item__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.cart-item__image img.cart-item__image--fallback,
.checkout-item img.checkout-item__image--fallback {
  object-fit: cover;
  opacity: 0.92;
}

.cart-item__copy {
  min-width: 0;
}

.cart-item__name {
  display: block;
  margin-bottom: 5px;
  font-family: var(--font-serif);
  font-size: 1.08rem;
  line-height: 1.3;
  text-decoration: none;
}

.cart-item__copy > p {
  margin-bottom: 15px;
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.45;
}

.cart-item__bottom {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.cart-item__bottom > strong {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
}

.cart-item__controls {
  display: grid;
  grid-template-columns: 32px 28px 32px;
  align-items: center;
  overflow: hidden;
  border: 1px solid rgb(46 33 24 / 16%);
  border-radius: 6px;
}

.cart-item__controls button,
.cart-item__controls span {
  display: grid;
  min-width: 0;
  height: 32px;
  place-items: center;
  border: 0;
  background: transparent;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

.cart-item__controls button {
  position: relative;
  cursor: pointer;
}

.cart-item__controls button::after,
.cart-item__remove::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: max(100%, 48px);
  height: max(100%, 48px);
  content: "";
  transform: translate(-50%, -50%);
}

.cart-item__controls button:hover {
  background: var(--cream);
}

.cart-item__remove {
  position: relative;
  justify-self: start;
  padding: 5px 0;
  border: 0;
  color: var(--ink-soft);
  background: transparent;
  font-size: 0.76rem;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.cart-item button:focus-visible,
.cart-item a:focus-visible {
  outline: 2px solid var(--saffron);
  outline-offset: 2px;
}

.cart-drawer__footer {
  padding: 22px clamp(22px, 5vw, 34px) 26px;
  border-top: 1px solid rgb(46 33 24 / 12%);
  background: var(--cream);
}

.cart-drawer__subtotal {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: baseline;
}

.cart-drawer__subtotal span {
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cart-drawer__subtotal strong {
  font-family: var(--font-serif);
  font-size: 1.6rem;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}

.cart-drawer__footer > p {
  margin: 8px 0 18px;
  color: var(--ink-soft);
  font-size: 0.85rem;
  line-height: 1.45;
}

.cart-drawer__footer .button {
  width: 100%;
  cursor: pointer;
}

.cart-drawer__footer .cart-drawer__handoff-note {
  min-height: 1.4em;
  margin: 12px 0 0;
  color: var(--leaf);
  font-size: 0.83rem;
  font-weight: 600;
}

@media (max-width: 900px) {
  .product-detail__layout {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .product-detail__media {
    position: static;
  }

  .product-detail__image {
    min-height: min(78vw, 620px);
  }

  .product-detail__summary {
    padding-top: 0;
  }

  .product-detail__summary h1 {
    max-width: 15ch;
  }

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

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

  .related-product__image {
    min-height: min(36vw, 300px);
  }
}

@media (max-width: 640px) {
  .cart-link__count {
    top: 2px;
    right: 2px;
  }

  .product-detail {
    padding-top: 18px;
  }

  .product-breadcrumbs {
    margin-bottom: 28px;
    font-size: var(--font-size-micro);
  }

  .product-detail__image {
    min-height: 88vw;
    border-radius: min(2.5vw, 12px);
  }

  .product-detail__media figcaption {
    display: grid;
    font-size: var(--font-size-micro);
  }

  .product-detail__media figcaption span:last-child {
    text-align: left;
  }

  .product-detail__summary h1 {
    font-size: clamp(2.65rem, 13vw, 4rem);
  }

  .product-detail__lead {
    font-size: 1.08rem;
  }

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

  .product-option label {
    min-height: 84px;
  }

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

  .quantity-picker {
    grid-template-columns: 1fr 62px 1fr;
  }

  .quantity-picker input {
    width: 62px;
    font-size: 1rem;
  }

  .product-detail__highlights {
    grid-template-columns: 1fr;
    padding-top: 4px;
  }

  .product-detail__highlights li,
  .product-detail__highlights li:first-child,
  .product-detail__highlights li:last-child {
    padding: 16px 0;
    text-align: left;
  }

  .product-detail__highlights li + li {
    border-top: 1px solid rgb(46 33 24 / 14%);
    border-left: 0;
  }

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

  .product-story__grid article,
  .product-story__grid article:first-child,
  .product-story__grid article:last-child {
    padding: 24px 0;
  }

  .product-story__grid article + article {
    border-top: 1px solid rgb(248 239 226 / 19%);
    border-left: 0;
  }

  .related-products__heading,
  .related-products__grid {
    grid-template-columns: 1fr;
  }

  .related-product {
    grid-template-columns: minmax(118px, 2fr) minmax(0, 3fr);
  }

  .related-product__image {
    min-height: 190px;
  }

  .related-product__copy {
    padding: 22px;
  }

  .cart-drawer {
    width: 100%;
  }

  .cart-drawer__header {
    padding-block: 18px;
  }

  .cart-item {
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 14px;
  }

  .cart-item__image {
    width: 76px;
    height: 94px;
  }

  .cart-item__bottom {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 9px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cart-drawer,
  .cart-scrim,
  .related-product__image img,
  .cart-loading__bar {
    transition: none;
    animation: none;
  }
}

/* Shared editorial primitives
   Reuse these classes on future pages instead of inventing new hero and
   heading scales. Legacy page selectors below are adapters for existing work. */
.page-intro.page-intro {
  padding-block: var(--page-intro-space);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(rgb(63 38 24 / 4.5%) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: 7px 7px;
}

.page-intro__grid.page-intro__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(340px, 0.58fr);
  align-items: end;
  gap: clamp(50px, 8vw, 130px);
}

h1.page-title.page-title,
.not-found h1,
.product-detail__summary h1 {
  margin-bottom: 24px;
  font-size: var(--title-size);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1.04;
  text-wrap: balance;
}

.page-intro h1.page-title {
  margin-bottom: 0;
}

.page-lede.page-lede {
  max-width: 58ch;
  color: var(--ink-soft);
  font-family: var(--font-sans);
  font-size: clamp(1rem, 1.3vw, 1.16rem);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.65;
  text-wrap: pretty;
}

.page-hero--split.page-hero--split {
  display: grid;
  min-height: var(--hero-min-height, 580px);
  grid-template-columns: var(--hero-columns, minmax(0, 1fr) minmax(0, 1fr));
  background:
    radial-gradient(rgb(63 38 24 / 4.5%) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: 7px 7px;
}

.page-hero--dark.page-hero--dark {
  color: white;
  background:
    radial-gradient(rgb(255 255 255 / 7%) 0.65px, transparent 0.65px),
    var(--chile);
  background-size: 7px 7px;
}

.page-hero--split .page-hero__copy.page-hero__copy {
  display: flex;
  min-width: 0;
  min-height: var(--hero-min-height, 580px);
  padding: var(--hero-copy-padding, clamp(54px, 5.5vw, 82px));
  flex-direction: column;
  align-items: start;
  justify-content: center;
}

.page-hero--split .page-hero__media.page-hero__media {
  position: relative;
  min-width: 0;
  min-height: var(--hero-min-height, 580px);
  margin: 0;
  overflow: visible;
  background: #d9c6aa;
}

.page-hero__media > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--hero-media-position, center);
}

.page-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--hero-action-gap, 16px 28px);
}

.page-hero__media .hero-label {
  z-index: 3;
}

.page-hero--dark .page-lede {
  color: rgb(255 255 255 / 82%);
}

.campaign-playbook__heading h2,
.campaign-rally__inner h2,
.campaign-lab-passport__copy h2,
.bundle-family-heading h2,
.bundle-lab-note h2,
.passport-heading h2,
.passport-program__inner h2,
.ai-review-section__heading h2,
.ai-review-close h2,
.pairing-section-heading h2,
.pairing-method__copy h2,
.pairing-recipes__heading h2,
.pairing-close__copy h2,
.demo-library__heading h2,
.demo-library__close h2 {
  font-size: var(--section-title-size);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1.04;
}

.campaign-preview,
.demo-tile,
.ai-review-card {
  box-shadow: 0 1px 0 rgb(46 33 24 / 4%);
  transition:
    border-color 220ms ease,
    box-shadow 220ms ease,
    transform 220ms ease;
}

.holiday-concept figure,
.bundle-concept figure {
  box-shadow:
    0 1px 0 rgb(46 33 24 / 8%),
    0 14px 34px rgb(46 33 24 / 7%);
  transition:
    box-shadow 220ms ease,
    transform 220ms ease;
}

@media (hover: hover) {
  .campaign-preview:hover,
  .demo-tile:hover,
  .ai-review-card:hover {
    border-color: rgb(46 33 24 / 28%);
    box-shadow: var(--shadow-soft);
    transform: translateY(-4px);
  }

  .holiday-concept:hover figure,
  .bundle-concept:hover figure {
    box-shadow: var(--shadow-soft);
    transform: translateY(-3px);
  }
}

@media (max-width: 820px) {
  .page-intro__grid.page-intro__grid {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 24px;
  }

  .page-hero--split.page-hero--split {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .page-hero--split .page-hero__copy.page-hero__copy {
    min-height: 0;
    padding: 58px max(24px, 6vw) 68px;
  }

  .page-hero--split .page-hero__media.page-hero__media {
    min-height: 390px;
  }

  .page-hero__media .hero-label {
    right: auto;
    bottom: 20px;
    left: 20px;
    width: min(210px, calc(100% - 40px));
  }
}

@media (max-width: 640px) {
  .page-intro.page-intro {
    padding-block: 58px 64px;
  }

  h1.page-title.page-title,
  .not-found h1,
  .product-detail__summary h1 {
    font-size: var(--title-size-mobile);
    line-height: 1.04;
  }

  .campaign-playbook__heading h2,
  .campaign-rally__inner h2,
  .campaign-lab-passport__copy h2,
  .bundle-family-heading h2,
  .bundle-lab-note h2,
  .passport-heading h2,
  .passport-program__inner h2,
  .ai-review-section__heading h2,
  .ai-review-close h2,
  .pairing-section-heading h2,
  .pairing-method__copy h2,
  .pairing-recipes__heading h2,
  .pairing-close__copy h2,
  .demo-library__heading h2,
  .demo-library__close h2 {
    font-size: var(--section-title-size-mobile);
  }

  .page-hero--split .page-hero__copy.page-hero__copy {
    padding: 50px 24px 58px;
  }

  .page-hero--split .page-hero__media.page-hero__media {
    min-height: 340px;
  }

  .page-hero__media .hero-label {
    bottom: 16px;
    left: 16px;
    min-height: 140px;
  }
}

/* Full catalog and migrated content
   Generated by scripts/build_full_site.py. Keep these primitives shared so
   product, archive, search, policy, and legacy content pages stay coherent. */

.catalog-intro {
  position: relative;
  overflow: hidden;
  padding-block: clamp(64px, 8vw, 116px);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 86% 16%, rgb(217 152 47 / 15%), transparent 27%),
    radial-gradient(rgb(63 38 24 / 4.5%) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: auto, 7px 7px, auto;
}

.catalog-intro::after {
  position: absolute;
  top: 50%;
  right: clamp(-100px, -3vw, -40px);
  width: clamp(260px, 30vw, 470px);
  aspect-ratio: 1;
  border: 1px solid rgb(46 33 24 / 9%);
  border-radius: 50%;
  content: "";
  transform: translateY(-50%);
}

.catalog-intro__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(280px, 0.44fr);
  align-items: center;
  gap: clamp(50px, 8vw, 122px);
}

.catalog-intro__grid:has(.catalog-intro__image) {
  grid-template-columns: minmax(0, 0.8fr) minmax(300px, 0.56fr);
}

.catalog-intro .page-title {
  max-width: 13ch;
  margin-bottom: 25px;
}

.catalog-intro .page-lede {
  max-width: 60ch;
}

.catalog-intro__image {
  position: relative;
  z-index: 2;
  aspect-ratio: 4 / 3;
  margin: 0;
  overflow: hidden;
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}

.catalog-intro__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.catalog-intro--editorial {
  padding-block: 0;
}

/* Editorial archive heroes begin at the top edge. Keep breadcrumbs layered
   inside the copy wall so they do not create a blank row above the image. */
.catalog-intro--editorial > .shell {
  position: relative;
  width: 100%;
}

.catalog-intro--editorial > .shell > .site-breadcrumbs {
  position: absolute;
  z-index: 3;
  top: clamp(18px, 2vw, 28px);
  left: max(24px, calc((100% - 1240px) / 2));
  width: min(560px, calc(50% - 48px));
  margin-bottom: 0;
}

.catalog-intro--editorial::after {
  display: none;
}

.catalog-intro--editorial .catalog-intro__grid,
.catalog-intro--editorial .catalog-intro__grid:has(.catalog-intro__image) {
  --catalog-hero-gutter: max(24px, calc((100% - 1240px) / 2));
  width: calc(100% - var(--catalog-hero-gutter));
  min-height: 500px;
  margin-right: 0;
  margin-left: var(--catalog-hero-gutter);
  grid-template-columns: minmax(420px, 620px) minmax(0, 1fr);
  gap: 0;
}

.catalog-intro--editorial .catalog-intro__grid > div:first-child {
  padding: clamp(50px, 6vw, 84px) clamp(42px, 6vw, 84px) clamp(50px, 6vw, 84px) 0;
}

.catalog-intro--editorial .catalog-intro__image {
  min-height: 500px;
  aspect-ratio: auto;
  overflow: visible;
  border-radius: 0;
  box-shadow: none;
}

.catalog-intro--editorial .catalog-intro__image > img {
  position: absolute;
  inset: 0;
  object-position: var(--catalog-hero-position, center);
}

.catalog-intro__label {
  bottom: 28px;
  left: -68px;
  min-height: 132px;
  justify-content: center;
}

.catalog-intro__label .catalog-intro__label-mark {
  font-family: var(--font-serif);
  font-size: clamp(2.35rem, 3.2vw, 3.4rem);
  font-weight: 700;
  letter-spacing: -0.055em;
  line-height: 0.95;
  white-space: nowrap;
}

.catalog-intro__label .catalog-intro__label-mark--mono {
  font-family: var(--font-mono);
  font-size: clamp(1.35rem, 1.9vw, 1.85rem);
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.05;
  text-align: center;
  text-transform: uppercase;
  white-space: normal;
}

.catalog-listing {
  min-height: 58vh;
  padding-block: clamp(58px, 7vw, 108px);
  background: var(--paper);
}

.archive-guide {
  margin-bottom: clamp(52px, 7vw, 88px);
}

.catalog-listing__heading {
  margin-bottom: 30px;
  font-size: clamp(2.2rem, 3.8vw, 3.65rem);
}

.archive-guide h2 {
  max-width: 12ch;
  margin-bottom: 30px;
  font-size: clamp(2.35rem, 4vw, 4rem);
}

.archive-guide__links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.archive-guide__links a {
  min-height: 126px;
  padding: 22px 20px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  text-decoration: none;
  transition: color 180ms ease, background 180ms ease;
}

.archive-guide__links strong {
  display: block;
  margin-bottom: 10px;
  font-family: var(--font-serif);
  font-size: 1.2rem;
  line-height: 1.15;
}

.archive-guide__links span {
  display: block;
  color: var(--ink-soft);
  font-size: 0.88rem;
  line-height: 1.5;
}

.archive-guide__links a:hover {
  color: var(--chile);
  background: var(--cream);
}

@media (min-width: 980px) {
  .archive-guide--feature-first .archive-guide__links {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }

  .archive-guide--feature-first .archive-guide__links a:first-child {
    grid-column: span 2;
    padding-inline: 28px;
    background: var(--cream);
  }

  .archive-guide--feature-first .archive-guide__links a:first-child strong {
    max-width: 15ch;
    font-size: clamp(1.5rem, 2.4vw, 2.25rem);
  }
}

.catalog-tools {
  display: grid;
  grid-template-columns: minmax(210px, 0.5fr) minmax(320px, 0.9fr) auto;
  gap: 20px 30px;
  align-items: center;
  margin-bottom: 50px;
  padding: 24px 28px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--cream);
}

.catalog-tools > label {
  font-family: var(--font-serif);
  font-size: 1.2rem;
  line-height: 1.25;
}

.catalog-tools > p {
  margin: 0;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.08em;
  text-align: right;
  text-transform: uppercase;
}

.catalog-search {
  position: relative;
}

.catalog-search input {
  width: 100%;
  min-height: 54px;
  padding: 12px 52px 12px 18px;
  border: 1px solid rgb(46 33 24 / 22%);
  border-radius: var(--radius-inner);
  outline: none;
  color: var(--ink);
  background: var(--paper);
}

.catalog-search input:focus {
  border-color: var(--chile);
  box-shadow: 0 0 0 3px rgb(168 59 37 / 10%);
}

.catalog-search span {
  position: absolute;
  top: 50%;
  right: 17px;
  color: var(--chile);
  font-family: var(--font-serif);
  font-size: 1.45rem;
  pointer-events: none;
  transform: translateY(-52%);
}

.catalog-source-note {
  margin: -18px 0 38px;
  padding: 14px 17px;
  border-left: 3px solid var(--saffron);
  color: var(--ink-soft);
  background: rgb(217 152 47 / 9%);
  font-size: 0.9rem;
}

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(28px, 3vw, 46px) clamp(18px, 2.25vw, 34px);
}

.product-grid--archive {
  gap: clamp(42px, 5vw, 68px) clamp(18px, 2.25vw, 34px);
}

.catalog-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.catalog-card[hidden] {
  display: none;
}

.catalog-card__image {
  position: relative;
  display: block;
  aspect-ratio: 0.82;
  overflow: hidden;
  border: 1px solid rgb(46 33 24 / 9%);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 50% 46%, rgb(255 255 255 / 92%), transparent 47%),
    #eee5d7;
}

.catalog-card__image::after {
  position: absolute;
  right: 18px;
  bottom: 18px;
  display: grid;
  width: 46px;
  height: 46px;
  border: 1px solid rgb(46 33 24 / 38%);
  border-radius: 50%;
  color: var(--ink);
  background: rgb(255 253 248 / 48%);
  backdrop-filter: blur(4px);
  content: "↗";
  font-family: Arial, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  place-items: center;
  transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.catalog-card__image img {
  width: 100%;
  height: 100%;
  padding: clamp(12px, 1.5vw, 22px);
  object-fit: contain;
  transition: transform 420ms var(--dropdown-ease);
}

.catalog-card:hover .catalog-card__image img {
  transform: scale(1.035);
}

.catalog-card:hover .catalog-card__image::after {
  color: var(--ink);
  background: white;
  transform: rotate(8deg);
}

.catalog-card__copy {
  display: flex;
  min-height: 155px;
  flex: 1;
  flex-direction: column;
  padding: 19px 2px 0;
}

.catalog-card__copy > p {
  margin-bottom: 9px;
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.09em;
  line-height: 1.4;
  text-transform: uppercase;
}

.catalog-card__copy h2 {
  margin-bottom: 21px;
  font-size: clamp(1.2rem, 1.45vw, 1.55rem);
  letter-spacing: -0.035em;
  line-height: 1.14;
}

.catalog-card__copy h2 a {
  text-decoration: none;
}

.catalog-card__copy > div {
  display: flex;
  margin-top: auto;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  padding-top: 13px;
  border-top: 1px solid var(--line);
}

.catalog-card__copy strong {
  font-family: var(--font-serif);
  font-size: 0.98rem;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}

.catalog-card__copy span {
  color: var(--ink-soft);
  font-size: var(--font-size-micro);
  line-height: 1.35;
  text-align: right;
}

.catalog-empty,
.catalog-no-results {
  grid-column: 1 / -1;
  padding: clamp(48px, 7vw, 92px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  text-align: center;
  background: var(--cream);
}

.catalog-empty h2,
.catalog-no-results h2 {
  margin-bottom: 14px;
  font-size: clamp(2rem, 4vw, 3.7rem);
}

.catalog-empty p,
.catalog-no-results p {
  max-width: 50ch;
  margin-inline: auto;
  color: var(--ink-soft);
}

.catalog-empty .button-row {
  justify-content: center;
  margin-top: 28px;
}

.catalog-product__hero {
  padding-block: 26px clamp(80px, 8vw, 124px);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 12% 54%, rgb(217 152 47 / 10%), transparent 32%),
    var(--cream);
}

.catalog-product__hero .product-breadcrumbs {
  margin-bottom: 28px;
}

.catalog-product__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(390px, 0.78fr);
  gap: clamp(54px, 8vw, 126px);
  align-items: start;
}

.catalog-product__media {
  position: sticky;
  top: 16px;
  margin: 0;
}

/* Let tall product photography scroll normally in short desktop viewports. */
@media (min-width: 821px) and (max-height: 800px) {
  .catalog-product__media {
    position: static;
  }
}

.catalog-product__media > img {
  width: 100%;
  aspect-ratio: 0.87;
  padding: clamp(26px, 4vw, 58px);
  border: 1px solid rgb(46 33 24 / 10%);
  border-radius: var(--radius);
  object-fit: contain;
  background:
    radial-gradient(circle at 50% 42%, rgb(255 255 255 / 96%), transparent 48%),
    #e9dfcf;
  box-shadow: var(--shadow-soft);
}

.catalog-product__media figcaption {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 14px 4px 0;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.catalog-product__summary {
  padding-top: clamp(22px, 4vw, 72px);
}

.catalog-product__summary h1 {
  max-width: 13ch;
  margin-bottom: 26px;
  font-size: clamp(3.25rem, 5.8vw, 5.7rem);
}

.catalog-product__lede {
  max-width: 52ch;
  margin-bottom: 30px;
  color: var(--ink-soft);
  font-size: clamp(1.06rem, 1.4vw, 1.22rem);
  line-height: 1.62;
}

.catalog-product__price {
  display: flex;
  align-items: baseline;
  gap: 15px;
  margin-bottom: 22px;
}

.catalog-product__price strong {
  font-family: var(--font-serif);
  font-size: clamp(1.65rem, 3vw, 2.4rem);
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}

.catalog-product__price span {
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.catalog-product__buy {
  width: min(100%, 390px);
}

.catalog-product__handoff {
  max-width: 50ch;
  margin: 14px 0 30px;
  color: var(--ink-soft);
  font-size: 0.8rem;
  line-height: 1.5;
}

.catalog-product__facts {
  margin: 0;
  border-top: 1px solid var(--line);
}

.catalog-product__facts > div {
  display: grid;
  grid-template-columns: minmax(100px, 0.35fr) minmax(0, 1fr);
  gap: 22px;
  padding-block: 14px;
  border-bottom: 1px solid var(--line);
}

.catalog-product__facts dt {
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.catalog-product__facts dd {
  margin: 0;
  font-size: 0.9rem;
  text-align: right;
}

.catalog-product__story {
  padding-block: var(--section-space);
  color: var(--paper);
  background:
    radial-gradient(rgb(255 255 255 / 5%) 0.65px, transparent 0.65px),
    var(--walnut);
  background-size: 7px 7px;
}

.catalog-product__story-grid {
  display: grid;
  grid-template-columns: minmax(250px, 0.48fr) minmax(0, 1fr);
  gap: clamp(54px, 9vw, 140px);
  align-items: start;
}

.catalog-product__story h2 {
  max-width: 8ch;
}

.catalog-product__story .rich-text {
  color: rgb(255 253 248 / 84%);
  font-size: clamp(1rem, 1.35vw, 1.12rem);
  line-height: 1.72;
}

.catalog-product__story .rich-text > :first-child {
  margin-top: 0;
}

.catalog-product__story .rich-text a {
  color: var(--saffron-light);
}

.catalog-product__taxonomy {
  padding-block: clamp(60px, 7vw, 98px);
  background: var(--cream);
}

.catalog-product__taxonomy-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(42px, 7vw, 104px);
}

.catalog-product__taxonomy h2 {
  margin-bottom: 20px;
  font-size: 1.55rem;
}

.catalog-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.catalog-chips a {
  display: inline-flex;
  min-height: 38px;
  padding: 8px 13px;
  align-items: center;
  border: 1px solid rgb(46 33 24 / 17%);
  border-radius: 999px;
  background: rgb(255 253 248 / 75%);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.06em;
  line-height: 1.25;
  text-decoration: none;
  text-transform: uppercase;
  transition: border-color 180ms ease, color 180ms ease, background 180ms ease;
}

.catalog-chips a:hover {
  border-color: var(--chile);
  color: var(--paper);
  background: var(--chile);
}

.catalog-related {
  padding-block: var(--section-space);
  background: var(--paper);
}

.catalog-related .section-heading h2 {
  font-size: clamp(2.4rem, 3.1vw, 3.4rem);
}

.catalog-grid--related {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.content-hero {
  background: var(--cream);
}

.content-hero--split > .shell {
  position: relative;
}

.content-hero--split > .shell > .site-breadcrumbs {
  position: absolute;
  z-index: 3;
  top: clamp(18px, 2vw, 28px);
  left: 0;
  max-width: min(620px, calc(100% - 48px));
  margin-bottom: 0;
}

.content-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.78fr) minmax(380px, 0.76fr);
  min-height: 590px;
  align-items: stretch;
}

.content-hero__copy {
  display: flex;
  max-width: 640px;
  flex-direction: column;
  justify-content: center;
  padding: clamp(60px, 8vw, 112px) clamp(40px, 7vw, 105px) clamp(60px, 8vw, 112px) 0;
}

.content-hero__copy h1 {
  max-width: 12ch;
}

.content-hero__grid figure {
  min-height: 590px;
  margin: 0 calc((100vw - min(100vw - 48px, 1240px)) / -2) 0 0;
  overflow: hidden;
}

.content-hero__grid figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content-section {
  padding-block: var(--section-space);
  background: var(--paper);
}

.content-narrow {
  width: min(100% - 48px, 840px);
}

.content-page__image {
  aspect-ratio: 16 / 9;
  margin: 0 0 clamp(42px, 6vw, 72px);
  overflow: hidden;
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}

.content-page__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rich-text {
  font-size: clamp(1rem, 1.1vw, 1.08rem);
}

.rich-text > * + * {
  margin-top: 1.2em;
}

.rich-text h2 {
  margin-top: 1.65em;
  margin-bottom: 0.55em;
  font-size: clamp(2rem, 4vw, 3.4rem);
}

.rich-text h3 {
  margin-top: 1.7em;
  margin-bottom: 0.55em;
  font-size: clamp(1.35rem, 2.4vw, 2rem);
}

.rich-text h4 {
  margin-top: 1.5em;
  font-family: var(--font-serif);
  font-size: 1.15rem;
}

.rich-text p,
.rich-text li {
  color: var(--ink-soft);
  line-height: 1.76;
}

.rich-text ul,
.rich-text ol {
  padding-left: 1.3em;
}

.rich-text blockquote {
  margin: 2em 0;
  padding: 1.2em 1.5em;
  border-left: 3px solid var(--saffron);
  background: var(--cream);
  font-family: var(--font-serif);
  font-size: 1.2rem;
}

.rich-text a {
  text-decoration-color: var(--saffron);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.content-callout {
  padding-block: clamp(70px, 8vw, 110px);
  color: var(--paper);
  background:
    radial-gradient(circle at 75% 20%, rgb(217 152 47 / 13%), transparent 26%),
    var(--walnut);
}

.content-callout__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.45fr);
  gap: clamp(48px, 8vw, 120px);
  align-items: end;
}

.content-callout h2 {
  max-width: 14ch;
  margin-bottom: 0;
}

.content-callout__inner > div:last-child {
  padding-left: 26px;
  border-left: 1px solid rgb(255 255 255 / 18%);
}

.content-callout__inner > div:last-child p {
  color: rgb(255 255 255 / 78%);
}

.legal-page .content-narrow {
  width: min(100% - 48px, 920px);
}

.legal-page .rich-text h2 {
  padding-top: 0.3em;
  border-top: 1px solid var(--line);
}

.handoff {
  display: grid;
  min-height: 68vh;
  align-items: center;
  padding-block: clamp(78px, 10vw, 150px);
  background:
    radial-gradient(circle at 82% 22%, rgb(217 152 47 / 16%), transparent 30%),
    radial-gradient(rgb(63 38 24 / 4.5%) 0.65px, transparent 0.65px),
    var(--cream);
  background-size: auto, 7px 7px, auto;
}

.handoff__inner {
  max-width: 800px;
}

.handoff h1 {
  max-width: 12ch;
}

.handoff__inner > p {
  max-width: 57ch;
  margin-bottom: 32px;
  color: var(--ink-soft);
  font-size: 1.12rem;
}

.guide-listing {
  padding-block: var(--section-space);
  background: var(--paper);
}

.guide-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.guide-card {
  display: flex;
  min-height: 260px;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(28px, 4vw, 52px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 88% 16%, rgb(217 152 47 / 14%), transparent 28%),
    var(--cream);
  text-decoration: none;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.guide-card > span {
  margin-bottom: auto;
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.guide-card h2 {
  margin: 28px 0 12px;
  font-size: clamp(1.9rem, 3.5vw, 3rem);
}

.guide-card p {
  max-width: 43ch;
  margin: 0;
  color: var(--ink-soft);
}

.guide-card:hover {
  border-color: rgb(46 33 24 / 28%);
  box-shadow: var(--shadow-soft);
  transform: translateY(-4px);
}

@media (max-width: 1060px) {
  .catalog-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .catalog-product__layout {
    grid-template-columns: minmax(0, 0.94fr) minmax(360px, 0.78fr);
    gap: 52px;
  }
}

@media (max-width: 820px) {
  .catalog-intro__grid,
  .catalog-intro__grid:has(.catalog-intro__image) {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .catalog-intro::after {
    top: 20px;
    transform: none;
  }

  .catalog-intro__image {
    max-height: 430px;
  }

  .catalog-intro--editorial .catalog-intro__grid,
  .catalog-intro--editorial .catalog-intro__grid:has(.catalog-intro__image) {
    width: 100%;
    margin: 0;
    grid-template-columns: 1fr;
  }

  .catalog-intro--editorial > .shell > .site-breadcrumbs {
    top: 18px;
    right: 24px;
    left: 24px;
    width: auto;
  }

  .catalog-intro--editorial .catalog-intro__grid > div:first-child {
    min-height: 360px;
    padding: 58px 24px 64px;
  }

  .catalog-intro--editorial .catalog-intro__image {
    width: 100%;
    min-height: 360px;
    max-height: none;
  }

  .catalog-intro--editorial .catalog-intro__image > img {
    object-position: var(--catalog-hero-position-mobile, var(--catalog-hero-position, center));
  }

  .catalog-intro__label {
    right: auto;
    bottom: 20px;
    left: 24px;
    width: 210px;
  }

  .catalog-tools {
    grid-template-columns: 1fr;
  }

  .catalog-tools > p {
    text-align: left;
  }

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

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

  .catalog-product__layout,
  .catalog-product__story-grid {
    grid-template-columns: 1fr;
  }

  .catalog-product__media {
    position: static;
  }

  .catalog-product__summary {
    padding-top: 0;
  }

  .catalog-product__story-grid {
    gap: 28px;
  }

  .catalog-product__story h2 {
    max-width: 12ch;
  }

  .catalog-grid--related {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .content-hero__grid {
    grid-template-columns: 1fr;
  }

  .content-hero__copy {
    padding-right: 0;
  }

  .content-hero__grid figure {
    min-height: 440px;
    margin: 0 calc((100vw - min(100vw - 48px, 1240px)) / -2);
  }
}

@media (max-width: 640px) {
  .catalog-intro {
    padding-block: 58px 65px;
  }

  .catalog-intro--editorial {
    padding-block: 0;
  }

  .catalog-intro__grid {
    gap: 32px;
  }

  .catalog-intro__image {
    aspect-ratio: 1.18;
  }

  .catalog-listing {
    padding-block: 42px 74px;
  }

  .catalog-tools {
    margin-bottom: 38px;
    padding: 20px;
  }

  .archive-guide {
    margin-bottom: 48px;
  }

  .archive-guide h2 {
    margin-bottom: 24px;
  }

  .archive-guide__links {
    grid-template-columns: 1fr;
  }

  .archive-guide__links a {
    min-height: 0;
  }

  .catalog-grid,
  .catalog-grid--related {
    grid-template-columns: 1fr;
    gap: 38px;
  }

  .catalog-card {
    max-width: 520px;
    width: 100%;
    margin-inline: auto;
  }

  .catalog-related .section-heading h2 {
    font-size: clamp(2.15rem, 9.5vw, 2.5rem);
  }

  .catalog-card__image {
    aspect-ratio: 0.96;
  }

  .catalog-card__copy {
    min-height: 135px;
  }

  .catalog-card__copy h2 {
    font-size: 1.45rem;
  }

  .product-grid.product-grid--archive {
    display: grid;
    width: auto;
    margin-left: 0;
    grid-template-columns: 1fr;
    gap: 42px;
    overflow: visible;
    padding: 0;
  }

  .product-grid--archive .product-card {
    min-width: 0;
  }

  .catalog-product__hero {
    padding-top: 18px;
  }

  .catalog-product__hero .site-breadcrumbs {
    overflow: visible;
    white-space: normal;
  }

  .catalog-product__media > img {
    aspect-ratio: 0.94;
    padding: 24px;
  }

  .catalog-product__media figcaption {
    display: grid;
    gap: 3px;
  }

  .catalog-product__summary h1 {
    font-size: var(--title-size-mobile);
  }

  .catalog-product__price {
    display: grid;
    gap: 2px;
  }

  .catalog-product__buy {
    width: 100%;
  }

  .catalog-product__facts > div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .catalog-product__facts dd {
    text-align: left;
  }

  .catalog-product__taxonomy-grid,
  .content-callout__inner,
  .guide-grid {
    grid-template-columns: 1fr;
  }

  .content-hero__grid {
    min-height: 0;
  }

  .content-hero__copy {
    padding-block: 54px 64px;
  }

  .content-hero__grid figure {
    min-height: 330px;
  }

  .content-narrow,
  .legal-page .content-narrow {
    width: min(100% - 48px, 100%);
  }

  .content-callout__inner > div:last-child {
    padding: 26px 0 0;
    border-top: 1px solid rgb(255 255 255 / 18%);
    border-left: 0;
  }

  .rich-text h2 {
    font-size: 2.25rem;
  }

  .guide-card {
    min-height: 230px;
  }
}

@media (max-width: 480px) {
  .catalog-intro--editorial .catalog-intro__grid > div:first-child {
    padding-top: 96px;
  }

  .content-hero--split .content-hero__copy {
    padding-top: 88px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .catalog-card__image img,
  .catalog-card__image::after,
  .guide-card {
    transition: none;
  }
}

/* Native product selection and checkout flow */
.catalog-product__summary h1 {
  max-width: 15ch;
  font-size: clamp(2.8rem, 4.35vw, 4.65rem);
  line-height: 1.02;
}

.catalog-product__story .rich-text p,
.catalog-product__story .rich-text li {
  color: rgb(255 253 248 / 86%);
}

.catalog-product__story .rich-text strong {
  color: var(--paper);
}

.catalog-product__story .rich-text h2,
.catalog-product__story .rich-text h3,
.catalog-product__story .rich-text h4 {
  color: var(--paper);
}

.product-stock--out {
  color: var(--chile) !important;
  font-weight: 600;
}

.product-purchase {
  display: grid;
  gap: 20px;
  width: min(100%, 520px);
  margin-top: 24px;
  padding-top: 26px;
  border-top: 1px solid var(--line);
}

.product-options {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

.product-options legend {
  padding: 0;
  margin-bottom: 12px;
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.085em;
  text-transform: uppercase;
}

.product-options__list {
  display: grid;
  gap: 10px;
}

label.product-option {
  position: relative;
  display: grid;
  min-height: 76px;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid rgb(46 33 24 / 20%);
  border-radius: var(--radius-inner);
  background: rgb(255 253 248 / 72%);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

label.product-option:hover {
  border-color: rgb(46 33 24 / 42%);
}

label.product-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.product-option__radio {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1.5px solid rgb(46 33 24 / 48%);
  border-radius: 50%;
  background: white;
}

.product-option__radio::after {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--chile);
  content: "";
  opacity: 0;
  transform: scale(0.5);
  transition: opacity 160ms ease, transform 160ms ease;
}

.product-option__copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.product-option__copy strong {
  font-size: 0.98rem;
  line-height: 1.25;
}

.product-option__copy small {
  color: var(--ink-soft);
  font-size: 0.82rem;
}

.product-option > b {
  font-family: var(--font-mono);
  font-size: 0.82rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

label.product-option:has(input:checked) {
  border-color: var(--chile);
  background: rgb(168 59 37 / 7%);
  box-shadow: inset 0 0 0 1px var(--chile);
}

.product-option input:checked + .product-option__radio {
  border-color: var(--chile);
}

.product-option input:checked + .product-option__radio::after {
  opacity: 1;
  transform: scale(1);
}

label.product-option:has(input:focus-visible) {
  outline: 3px solid var(--saffron);
  outline-offset: 3px;
}

label.product-option.is-unavailable {
  opacity: 0.62;
  background:
    repeating-linear-gradient(-45deg, transparent 0 8px, rgb(46 33 24 / 4%) 8px 9px),
    rgb(46 33 24 / 3%);
  cursor: not-allowed;
}

.product-package-note {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid rgb(101 115 60 / 30%);
  border-radius: var(--radius-inner);
  background: rgb(101 115 60 / 7%);
}

.product-package-note > span {
  display: grid;
  width: 25px;
  height: 25px;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: white;
  background: var(--leaf);
  font-size: 0.8rem;
}

.product-package-note p {
  display: grid;
  gap: 1px;
  margin: 0;
}

.product-package-note small {
  color: var(--ink-soft);
}

.product-purchase__row {
  display: grid;
  grid-template-columns: 138px minmax(0, 1fr);
  gap: 12px;
  align-items: end;
}

.product-quantity {
  display: grid;
  gap: 7px;
}

.product-quantity > span {
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.product-quantity > div {
  display: grid;
  height: 52px;
  grid-template-columns: 42px 52px 42px;
  overflow: hidden;
  border: 1px solid rgb(46 33 24 / 22%);
  border-radius: var(--radius-inner);
  background: white;
}

.product-quantity button,
.product-quantity input {
  min-width: 0;
  border: 0;
  color: var(--ink);
  background: transparent;
  text-align: center;
}

.product-quantity button {
  font-size: 1.15rem;
  cursor: pointer;
}

.product-quantity button:hover {
  background: var(--cream);
}

.product-quantity input {
  width: 52px;
  padding: 0;
  border-inline: 1px solid var(--line);
  border-radius: 0;
  font-family: var(--font-mono);
  -moz-appearance: textfield;
}

.product-quantity input::-webkit-inner-spin-button,
.product-quantity input::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.product-quantity button:focus-visible,
.product-quantity input:focus-visible {
  z-index: 1;
  outline: 2px solid var(--saffron);
  outline-offset: -2px;
}

.product-purchase__row .catalog-product__buy {
  width: 100%;
  min-height: 52px;
}

.product-form__message {
  min-height: 1.4em;
  margin: -7px 0 0;
  color: var(--leaf);
  font-size: 0.88rem;
  font-weight: 600;
}

.catalog-product__confidence {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 15px 0 30px;
  color: var(--ink-soft);
  font-size: 0.82rem;
}

.catalog-product__confidence span {
  color: var(--leaf);
  font-weight: 700;
}

.button:disabled {
  opacity: 0.52;
  cursor: not-allowed;
}

.cart-drawer__view-cart {
  display: block;
  margin-top: 13px;
  color: var(--ink-soft);
  font-size: 0.82rem;
  text-align: center;
  text-underline-offset: 3px;
}

.commerce-page {
  min-height: 70vh;
  background: var(--cream);
}

.commerce-intro {
  padding-block: clamp(46px, 5vw, 68px);
  border-bottom: 1px solid var(--line);
  background:
    radial-gradient(circle at 82% 28%, rgb(217 152 47 / 13%), transparent 27%),
    var(--cream);
}

.commerce-intro h1 {
  max-width: 12ch;
  margin-bottom: 16px;
  font-size: clamp(3rem, 4.4vw, 4.45rem);
}

.commerce-intro > .shell > p:last-child {
  max-width: 54ch;
  margin-bottom: 0;
  color: var(--ink-soft);
  font-size: 1.08rem;
}

.commerce-body {
  padding-block: clamp(48px, 7vw, 92px);
}

.commerce-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(310px, 0.42fr);
  gap: clamp(28px, 5vw, 70px);
  align-items: start;
}

.commerce-card,
.order-summary {
  border: 1px solid rgb(46 33 24 / 12%);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: 0 18px 48px rgb(46 33 24 / 7%);
}

.commerce-card--items .cart-empty {
  min-height: 420px;
}

.commerce-card--items .cart-items {
  padding-inline: clamp(22px, 4vw, 38px);
}

.order-summary {
  position: sticky;
  top: 142px;
  padding: clamp(24px, 3vw, 34px);
}

.order-summary__line {
  display: flex;
  justify-content: space-between;
  gap: 22px;
  align-items: baseline;
  padding-block: 18px;
  border-block: 1px solid var(--line);
}

.order-summary__line span {
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.order-summary__line strong {
  font-family: var(--font-serif);
  font-size: 1.75rem;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
}

.order-summary__title {
  margin-bottom: 20px;
  font-size: clamp(1.65rem, 2.4vw, 2.2rem);
}

.order-summary > p {
  margin: 14px 0 20px;
  color: var(--ink-soft);
  font-size: 0.85rem;
  line-height: 1.5;
}

.order-summary .button {
  width: 100%;
}

.order-summary .button + .button {
  margin-top: 9px;
}

.order-summary ul {
  display: grid;
  gap: 8px;
  padding: 20px 0 0;
  margin: 22px 0 0;
  border-top: 1px solid var(--line);
  color: var(--ink-soft);
  font-size: 0.82rem;
  list-style: none;
}

.order-summary li::before {
  margin-right: 8px;
  color: var(--leaf);
  content: "✓";
  font-weight: 700;
}

.checkout-steps {
  display: flex;
  gap: 24px;
  padding: 0;
  margin: 0 0 34px;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--font-size-micro);
  letter-spacing: 0.06em;
  list-style: none;
  text-transform: uppercase;
}

.checkout-steps li {
  display: flex;
  gap: 8px;
  align-items: center;
}

.checkout-steps span {
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  border: 1px solid rgb(46 33 24 / 24%);
  border-radius: 50%;
}

.checkout-steps [aria-current="step"] {
  color: var(--ink);
  font-weight: 600;
}

.checkout-steps [aria-current="step"] span {
  border-color: var(--chile);
  color: white;
  background: var(--chile);
}

.checkout-steps .is-complete span {
  border-color: var(--leaf);
  color: white;
  background: var(--leaf);
}

.checkout-form {
  display: grid;
  gap: 34px;
  padding: clamp(24px, 4vw, 42px);
}

.checkout-form__handoff {
  display: grid;
  gap: 18px;
}

.checkout-form fieldset {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 0;
  margin: 0;
  border: 0;
}

.checkout-form legend {
  grid-column: 1 / -1;
  width: 100%;
  padding: 0 0 14px;
  margin-bottom: 3px;
  border-bottom: 1px solid var(--line);
  font-family: var(--font-serif);
  font-size: 1.65rem;
}

.checkout-form label {
  display: grid;
  gap: 7px;
}

.checkout-form .field--wide {
  grid-column: 1 / -1;
}

.checkout-form label > span {
  font-size: 0.82rem;
  font-weight: 600;
}

.checkout-form label small {
  color: var(--ink-soft);
  font-weight: 400;
}

.checkout-form input,
.checkout-form select {
  width: 100%;
  min-height: 50px;
  padding: 11px 13px;
  border: 1px solid rgb(46 33 24 / 24%);
  border-radius: var(--radius-inner);
  color: var(--ink);
  background: white;
  font: inherit;
}

.checkout-form input:focus,
.checkout-form select:focus {
  border-color: var(--chile);
  outline: 3px solid rgb(217 152 47 / 30%);
  outline-offset: 1px;
}

.checkout-form > .button {
  width: 100%;
}

.checkout-form__message {
  min-height: 1.5em;
  margin: -20px 0 0;
  color: var(--leaf);
  font-weight: 600;
}

.checkout-items {
  display: grid;
  margin-bottom: 18px;
}

.checkout-item {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding-block: 13px;
  border-bottom: 1px solid var(--line);
}

.checkout-item img {
  width: 58px;
  height: 66px;
  object-fit: contain;
  border-radius: 5px;
  background: var(--cream);
}

.checkout-item > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.checkout-item strong {
  font-family: var(--font-serif);
  font-size: 0.94rem;
  font-weight: 400;
  line-height: 1.3;
}

.checkout-item span {
  color: var(--ink-soft);
  font-size: 0.75rem;
}

.checkout-item > b {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-variant-numeric: tabular-nums;
}

.checkout-items__empty {
  color: var(--ink-soft);
}

@media (max-width: 820px) {
  .commerce-layout,
  .commerce-layout--checkout {
    grid-template-columns: 1fr;
  }

  .order-summary {
    position: static;
  }

  .commerce-layout--checkout .order-summary {
    grid-row: 1;
  }
}

@media (max-width: 640px) {
  .catalog-product__summary h1 {
    font-size: clamp(2.65rem, 12vw, 3.4rem);
  }

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

  .product-quantity > div {
    width: 138px;
  }

  .commerce-intro {
    padding-block: 38px 46px;
  }

  .commerce-intro h1 {
    font-size: clamp(2.8rem, 14vw, 3.75rem);
  }

  .commerce-body {
    padding-block: 32px 70px;
  }

  .commerce-card--items .cart-empty {
    min-height: 340px;
  }

  .checkout-steps {
    gap: 12px;
    margin-bottom: 34px;
    font-size: var(--font-size-micro);
  }

  .checkout-steps li {
    gap: 5px;
  }

  .checkout-steps span {
    width: 23px;
    height: 23px;
  }

  .checkout-form fieldset {
    grid-template-columns: 1fr;
  }

  .checkout-form .field--wide {
    grid-column: auto;
  }
}

/* product-image-review:css:start */
.product-image-review {
  padding-block: clamp(72px, 8vw, 118px);
  border-bottom: 1px solid var(--line);
  background: var(--cream);
}

.product-image-review__heading {
  display: grid;
  grid-template-columns: minmax(280px, 0.68fr) minmax(420px, 1.1fr);
  gap: clamp(40px, 8vw, 118px);
  align-items: end;
  margin-bottom: 38px;
}

.product-image-review__heading h2 {
  max-width: 8ch;
  margin: 0;
  font-size: clamp(3rem, 6vw, 6rem);
  letter-spacing: -0.06em;
  line-height: 0.9;
}

.product-image-review__heading > div:last-child > p:first-child {
  max-width: 650px;
  margin: 0;
  color: var(--ink-soft);
  font-size: 1.05rem;
  line-height: 1.65;
}

.product-image-review__eyebrow,
.product-image-review__source,
.product-image-review__controls label > span,
.product-image-status,
.product-image-qa,
.product-image-chip,
.product-image-table small {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.075em;
  line-height: 1.4;
  text-transform: uppercase;
}

.product-image-review__eyebrow {
  margin: 0 0 18px;
  color: var(--chile);
}

.product-image-review__source {
  margin: 18px 0 0;
  color: var(--ink-soft);
}

.product-image-review__stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  margin: 0 0 28px;
  border: 1px solid var(--line);
  background: var(--paper);
}

.product-image-review__stats > div {
  min-width: 0;
  padding: 20px 22px;
  border-left: 1px solid var(--line);
}

.product-image-review__stats > div:first-child {
  border-left: 0;
}

.product-image-review__stats dt {
  margin-bottom: 5px;
  color: var(--chile);
  font-family: var(--font-serif);
  font-size: clamp(1.9rem, 3vw, 2.8rem);
  line-height: 1;
}

.product-image-review__stats dd {
  margin: 0;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.07em;
  line-height: 1.4;
  text-transform: uppercase;
}

.product-image-review__policy {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 26px;
  margin-bottom: 28px;
  padding: 20px 22px;
  color: var(--paper);
  background: var(--walnut);
}

.product-image-review__policy strong {
  color: var(--saffron-light);
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.product-image-review__policy p {
  max-width: 900px;
  margin: 0;
  color: rgb(255 253 248 / 78%);
}

.product-image-review__controls {
  position: sticky;
  z-index: 3;
  top: calc(var(--header-height, 0px) + 10px);
  display: grid;
  grid-template-columns: minmax(200px, 1.05fr) repeat(5, minmax(130px, 0.64fr)) auto;
  gap: 12px;
  align-items: end;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid var(--line);
  background: rgb(255 253 248 / 96%);
  box-shadow: 0 14px 34px rgb(46 33 24 / 8%);
  backdrop-filter: blur(12px);
}

.product-image-review__controls label > span {
  display: block;
  margin-bottom: 7px;
  color: var(--ink-soft);
}

.product-image-review__controls input,
.product-image-review__controls select {
  width: 100%;
  min-height: 46px;
  padding: 9px 12px;
  border: 1px solid rgb(46 33 24 / 22%);
  border-radius: 0;
  color: var(--ink);
  background: var(--paper);
}

.product-image-review__controls > p {
  margin: 0 4px 13px 8px;
  color: var(--ink-soft);
  font-size: 0.8rem;
  white-space: nowrap;
}

.product-image-review__controls > p strong {
  color: var(--ink);
  font-family: var(--font-serif);
  font-size: 1.2rem;
  font-weight: 400;
}

.product-image-review__table-wrap {
  position: relative;
  overflow-x: auto;
  border: 1px solid var(--line);
  background: var(--paper);
}

.product-image-table {
  width: 100%;
  min-width: 1380px;
  border-collapse: collapse;
  table-layout: fixed;
}

.product-image-table th {
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  color: var(--ink-soft);
  background: var(--cream);
  font-family: var(--font-mono);
  font-size: 0.67rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-align: left;
  text-transform: uppercase;
}

.product-image-table th:nth-child(1) { width: 300px; }
.product-image-table th:nth-child(2) { width: 220px; }
.product-image-table th:nth-child(3) { width: 230px; }
.product-image-table th:nth-child(4) { width: 190px; }

.product-image-table td {
  padding: 16px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}

.product-image-table tr:last-child td {
  border-bottom: 0;
}

.product-image-table tr[hidden] {
  display: none;
}

.product-image-table__photo a {
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border: 1px solid rgb(46 33 24 / 10%);
  background: #eadfd2;
}

.product-image-table__photo-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
}

.product-image-table__photo-pair figure {
  min-width: 0;
  margin: 0;
}

.product-image-table__photo-pair .product-image-table__final a {
  outline: 2px solid rgb(161 63 38 / 22%);
  outline-offset: 2px;
}

.product-image-table__photo-pair figcaption {
  margin-top: 5px;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 0.61rem;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.product-image-table__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-image-table__photo small {
  display: block;
  margin-top: 7px;
  color: var(--ink-soft);
  letter-spacing: 0.03em;
  text-transform: none;
}

.product-image-table__product strong,
.product-image-table__product span,
.product-image-table__product em,
.product-image-table__product a {
  display: block;
}

.product-image-table__product strong {
  margin-bottom: 8px;
  font-family: var(--font-serif);
  font-size: 1.14rem;
  line-height: 1.15;
}

.product-image-table__product span {
  margin-bottom: 7px;
  color: var(--ink-soft);
  font-size: 0.78rem;
}

.product-image-spec {
  margin: 12px 0;
  padding: 10px 11px;
  border-left: 3px solid rgb(168 59 37 / 30%);
  background: rgb(168 59 37 / 5%);
}

.product-image-table__product .product-image-spec span {
  margin-bottom: 3px;
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: 0.66rem;
  line-height: 1.4;
}

.product-image-spec__correction {
  margin-top: 7px;
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: 0.6rem;
  font-style: normal;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.product-image-availability {
  margin-bottom: 16px;
  color: var(--leaf);
  font-family: var(--font-mono);
  font-size: 0.64rem;
  font-style: normal;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.product-image-availability--out {
  color: var(--chile);
}

.product-image-table__product a,
.product-image-copy {
  color: var(--chile);
  font-family: var(--font-mono);
  font-size: 0.69rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.product-image-table__flags > div {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 12px;
}

.product-image-chip {
  display: inline-flex;
  padding: 5px 7px;
  border: 1px solid rgb(46 33 24 / 17%);
  color: var(--ink-soft);
  background: var(--cream);
  letter-spacing: 0.04em;
}

.product-image-chip--jar,
.product-image-chip--large-brown-bottle,
.product-image-chip--retired-glass-jar-or-disliked-plain-background,
.product-image-chip--retired-glass-jar-on-red-background,
.product-image-chip--retired-flavor-bottle-or-vendor-stock,
.product-image-chip--missing-image-or-shared-generic-fallback,
.product-image-chip--generated-or-fallback,
.product-image-chip--missing-image,
.product-image-chip--shared-image {
  border-color: rgb(168 59 37 / 26%);
  color: var(--chile);
  background: rgb(168 59 37 / 7%);
}

.product-image-chip--preferred-red-background,
.product-image-chip--preferred-red-background-bag {
  border-color: rgb(101 115 60 / 32%);
  color: var(--leaf);
  background: rgb(101 115 60 / 8%);
}

.product-image-table__flags small {
  color: var(--ink-soft);
  font-family: var(--font-sans);
  font-size: 0.78rem;
  letter-spacing: 0;
  line-height: 1.5;
  text-transform: none;
}

.product-image-status {
  display: inline-flex;
  margin-bottom: 8px;
  padding: 6px 8px;
  border: 1px solid currentColor;
}

.product-image-qa {
  display: inline-flex;
  margin-bottom: 9px;
  padding: 6px 8px;
  border: 1px solid rgb(46 33 24 / 18%);
  color: var(--ink-soft);
  background: var(--cream);
  letter-spacing: 0.04em;
}

.product-image-qa--deterministic-closure-seal-needed,
.product-image-qa--keep-current {
  border-color: rgb(101 115 60 / 34%);
  color: var(--leaf);
  background: rgb(101 115 60 / 8%);
}

.product-image-qa--preserve-current-package-background-only,
.product-image-qa--label-source-hold,
.product-image-qa--package-geometry-source-hold {
  border-color: rgb(138 101 15 / 34%);
  color: #71530d;
  background: rgb(216 162 38 / 9%);
}

.product-image-qa--contents-mismatch,
.product-image-qa--package-construction-drift,
.product-image-qa--scale-proportion-remake {
  border-color: rgb(168 59 37 / 28%);
  color: var(--chile);
  background: rgb(168 59 37 / 7%);
}

.product-image-status--replace { color: var(--chile); }
.product-image-status--review { color: #8a650f; }
.product-image-status--keep { color: var(--leaf); }

.product-image-table__decision b {
  display: block;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: 0.72rem;
}

.product-image-table__decision small {
  display: block;
  margin-top: 9px;
  color: var(--ink-soft);
  font-family: var(--font-sans);
  font-size: 0.68rem;
  letter-spacing: 0;
  line-height: 1.4;
  text-transform: none;
}

.product-image-table__next p {
  margin: 0 0 12px;
  color: var(--ink-soft);
  font-size: 0.8rem;
  line-height: 1.5;
}

.product-image-copy {
  padding: 0 0 3px;
  border: 0;
  border-bottom: 1px solid currentColor;
  cursor: pointer;
  background: transparent;
}

.product-image-hold {
  display: inline-flex;
  padding: 5px 7px;
  border: 1px solid rgb(138 101 15 / 32%);
  color: #71530d;
  background: rgb(216 162 38 / 9%);
  font-family: var(--font-mono);
  font-size: 0.67rem;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.product-image-keep {
  display: inline-flex;
  padding: 5px 7px;
  border: 1px solid rgb(101 115 60 / 34%);
  color: var(--leaf);
  background: rgb(101 115 60 / 8%);
  font-family: var(--font-mono);
  font-size: 0.67rem;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.product-image-review__empty {
  padding: 48px;
  color: var(--ink-soft);
  text-align: center;
}

@media (max-width: 980px) {
  .product-image-review__heading,
  .product-image-review__policy {
    grid-template-columns: 1fr;
  }

  .product-image-review__stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .product-image-review__stats > div:nth-child(4) {
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .product-image-review__stats > div:nth-child(5) {
    border-top: 1px solid var(--line);
  }

  .product-image-review__stats > div:nth-child(6) {
    border-top: 1px solid var(--line);
  }

  .product-image-review__controls {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .product-image-review {
    padding-block: 58px 76px;
  }

  .product-image-review__stats,
  .product-image-review__controls {
    grid-template-columns: 1fr;
  }

  .product-image-review__stats > div,
  .product-image-review__stats > div:nth-child(4),
  .product-image-review__stats > div:nth-child(5),
  .product-image-review__stats > div:nth-child(6) {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .product-image-review__stats > div:first-child {
    border-top: 0;
  }

  .product-image-review__controls > p {
    margin: 4px 0;
  }

  .product-image-review__table-wrap {
    overflow: visible;
    border: 0;
    background: transparent;
  }

  .product-image-table,
  .product-image-table tbody,
  .product-image-table tr,
  .product-image-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .product-image-table thead {
    display: none;
  }

  .product-image-table tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    margin-bottom: 18px;
    border: 1px solid var(--line);
    background: var(--paper);
  }

  .product-image-table tr[hidden] {
    display: none;
  }

  .product-image-table td {
    border-bottom: 1px solid var(--line);
  }

  .product-image-table__photo {
    grid-column: 1 / -1;
  }

  .product-image-table__photo-pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .product-image-table__photo-pair a {
    max-height: 340px;
  }

  .product-image-table__flags,
  .product-image-table__decision,
  .product-image-table__next {
    grid-column: 1 / -1;
  }

  .product-image-table__decision {
    display: flex !important;
    gap: 10px;
    align-items: center;
  }

  .product-image-status {
    margin: 0;
  }

  .product-image-table__next {
    border-bottom: 0 !important;
  }
}
/* product-image-review:css:end */