:root {
  --cream: #fff3df;
  --paper: #fffbf4;
  --red: #861f31;
  --red-dark: #611326;
  --ink: #342019;
  --muted: #655047;
  --green: #214c3c;
  --edge: #ead6bd;
  --display: Georgia, 'Times New Roman', serif;
}
.announcement {background: var(--green); color: #fff7e6; letter-spacing: .12em}
.navigation, .nav {background: var(--paper)}
.navigation .nav-shop {border-radius: 999px; background: #f8e8d8; border-color: #eed9c3}
.button, .button.secondary, .filter {border-radius: 999px}
.button.secondary:hover {background: #f9e8dc; color: var(--red-dark)}
.hero {padding: 29px 0 35px; background: var(--cream)}
.hero-inner {
  width: min(1320px, calc(100% - 64px));
  grid-template-columns: .93fr 1.07fr;
  background: var(--red-dark);
  border-radius: 28px;
  overflow: hidden;
}
.hero-copy {padding: clamp(30px, 5.2vw, 74px); position: relative}
.hero .eyebrow {color: #ffe0a7; letter-spacing: .105em; font-size: 11px}
.hero .eyebrow span {color: inherit}
.hero h1 {font-size: clamp(48px, 6.2vw, 94px); color: #fff8ea; line-height: .97; margin: 18px 0}
.hero h1 em {color: #ffd996}
.hero-copy p {color: #fff0dd; max-width: 415px}
.hero-visual {border-radius: 0}
.hero-visual img {object-position: 29% 50%}
.hero-actions {display: flex; align-items: center; flex-wrap: wrap; gap: 14px 18px}
.hero .button {background: #fff3dc; color: var(--red-dark); border-color: #fff3dc}
.hero .button:hover {background: #ffdb9c; border-color: #ffdb9c}
.hero-guide {color: #fff4e2; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 4px}
.hero a:focus-visible {outline-color: #ffd996}
.category-band {background: #f7e5cb}
.category-nav a {border-radius: 999px; padding: 8px 10px}
.category-nav a:hover {background: #fff3df; text-decoration: none}
.collection {padding-top: 58px}
.collection-catalog {font-size: 14px; font-weight: 700; color: var(--red); text-decoration: underline; text-underline-offset: 4px}
.product, .catalog-card, .panel, .bulk-form, .story-strip {border-radius: 17px}
.product, .catalog-card {box-shadow: 0 4px 12px #5f321009; transition: box-shadow .2s, border-color .2s}
.product:hover, .catalog-card:hover {border-color: #cfa98b; box-shadow: 0 8px 22px #5f321018}
.product-photo-link, .catalog-photo-link {display: block; overflow: hidden}
.catalog-photo-link {position: relative; z-index: 1}
.product-photo-link:focus-visible, .catalog-photo-link:focus-visible {outline-offset: -4px; outline-color: var(--red)}
.product-photo-link img, .catalog-photo-link img {transition: transform .24s ease}
.product-photo-link:hover img, .catalog-photo-link:hover img {transform: scale(1.035)}
.product-body {padding: 19px}
.product .variants {border-radius: 999px; background: #f8eadd; padding: 5px 10px}
.story-wrap {background: #f7e5cb}
.story {border-radius: 24px}
.faq details {border-radius: 0}
.catalog-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  align-items: center;
  gap: 20px;
  padding: clamp(18px, 3vw, 36px);
  background: #f8e7d1;
  border-radius: 22px;
}
.catalog-intro-photo {width: 100%; height: 100%; max-height: 270px; min-height: 180px; object-fit: cover; border-radius: 14px}
.catalog-section {padding-top: 12px}
.catalog-options a {border-radius: 6px; padding: 5px 8px; margin-left: -8px}
.catalog-options a:hover {background: #f8eadd}
.site-footer {background: var(--green)}
.site-footer-copyright {border-color: #9bbaaa}
@media(max-width: 900px) {
  .hero-inner {width: calc(100% - 42px)}
  .hero-copy {padding: 36px 26px}
  .hero h1 {font-size: clamp(42px, 6.7vw, 68px)}
}
@media(max-width: 700px) {
  .hero-inner, .catalog-intro {grid-template-columns: 1fr}
  .hero-visual {aspect-ratio: 1.48}
  .hero-visual img {object-position: 34% 50%}
  .hero h1 {font-size: clamp(44px, 10vw, 72px)}
  .catalog-intro-photo {max-height: 210px}
}
@media(max-width: 560px) {
  .hero {padding: 15px 0 22px}
  .hero-inner {width: calc(100% - 30px); border-radius: 21px; gap: 0}
  .hero-copy {padding: 27px 21px 24px}
  .hero-copy p {margin-bottom: 18px}
  .section-head {align-items: start; flex-direction: column; gap: 8px}
  .collection {padding-top: 43px}
  .product-body {padding: 12px}
}
@media(prefers-reduced-motion: reduce) {
  .product, .catalog-card, .product-photo-link img, .catalog-photo-link img {transition: none}
  .product-photo-link:hover img, .catalog-photo-link:hover img {transform: none}
}

.hero-copy .facility-note {margin: -10px 0 20px; color: #ffe0a7; font-size: 13px; font-weight: 700}
.product-copy .facility-note {margin-top: 6px; color: var(--muted); font-size: 14px}

.thumbs {flex-wrap: wrap}