/* A calm equestrian setting, scoped to the assortment and saved products. */
.catalog-scene {
  --muted: #60695d;
  --line: #d9ddcf;
  background-color: #f1f1e8;
  background-image:
    radial-gradient(ellipse at 0 400px, #dfe5d2a6, transparent 55%),
    radial-gradient(ellipse at 100% 1500px, #e6dac44d, transparent 50%),
    repeating-linear-gradient(0deg, #56634703 0, #56634703 1px, transparent 1px, transparent 4px);
}
.catalog-masthead {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #e6e8dc;
  border-bottom: 1px solid #cfd6c4;
}
.catalog-masthead::before,
.catalog-masthead::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.catalog-masthead::before {
  left: 40%;
  background: url('./assets/hero.png') 65% 41% / cover no-repeat;
  opacity: .64;
}
.catalog-masthead::after {
  background:
    linear-gradient(0deg, #e6e8dc85, transparent 45%),
    linear-gradient(90deg, #e6e8dc 0%, #e6e8dc 34%, #e6e8dcf0 44%, #e6e8dc52 67%, #e6e8dc0a 100%);
}
.catalog-masthead .breadcrumb {
  padding-top: 22px;
  margin-bottom: 18px;
  color: #535f4e;
}
.catalog-masthead .page-head {
  padding: 10px 0 34px;
  min-height: 180px;
}
.catalog-masthead .eyebrow { color: #4e6248; }
.catalog-masthead .page-title {
  max-width: 65%;
  font-size: clamp(35px, 3.6vw, 50px);
  line-height: 1.15;
  margin: 14px 0;
  overflow-wrap: anywhere;
  color: #263e2e;
}
.catalog-masthead .page-intro {
  max-width: 52%;
  color: #525e4c;
  line-height: 1.7;
}
.catalog-content { padding-top: 32px; }
.catalog-scene .catalog-layout { align-items: start; }
.catalog-scene .filters {
  padding: 22px 18px;
  background: #fafbf5e6;
  border: 1px solid #d5dccc;
  border-radius: 12px;
  box-shadow: 0 5px 22px #3b4b2f05;
}
.catalog-scene .filters h3 { color: #354b37; }
.catalog-scene .filter-link {
  padding-left: 10px;
  padding-right: 7px;
  border-left: 2px solid transparent;
  margin: 2px -10px;
}
.catalog-scene .filter-link.active {
  background: #e9eedf;
  border-left-color: #6f865e;
  border-radius: 0 4px 4px 0;
}
.catalog-scene .filter-group select,
.catalog-scene .field { border-radius: 5px; }
.catalog-scene .catalog-top {
  padding: 4px 0 18px;
  margin-bottom: 24px;
  color: #55614e;
}
.catalog-scene .catalog-top select {
  padding: 9px 12px;
  background: #fafbf5;
  border: 1px solid #d5dccc;
  border-radius: 6px;
  color: #42513c;
}
.catalog-scene .product-card {
  background: #fffefa;
  border: 1px solid #dce0d2;
  border-radius: 12px;
  box-shadow: 0 4px 15px #344b2905;
  transition: box-shadow .2s, border-color .2s;
}
.catalog-scene .product-image {
  background: #f8f7f2;
  border-radius: 11px 11px 0 0;
  border-bottom: 1px solid #eeeee6;
}
.catalog-scene .product-info { padding: 15px 16px 17px; }
.catalog-scene .product-card .brand { color: #69715f; }
.catalog-scene .product-card .prices { color: #263e2e; }
.catalog-scene .catalog-note { color: #626d58; }
.catalog-scene .pagination button { background-color: #fffefa; }
.catalog-scene .pagination button.active {
  background: var(--forest);
  color: #fff;
}
.catalog-scene .empty {
  background: #fffefa;
  border: 1px solid #dce0d2;
  border-radius: 12px;
  padding: 45px 24px;
}
@media (hover:hover) {
  .catalog-scene .product-card:hover {
    border-color: #aabb98;
    box-shadow: 0 9px 26px #344b2910;
  }
}
@media (max-width:960px) {
  .catalog-masthead::before { left: 35%; }
  .catalog-scene .filters { padding: 20px 14px; }
}
@media (max-width:680px) {
  .catalog-masthead::before {
    left: 28%;
    opacity: .26;
    background-position: 64% 43%;
  }
  .catalog-masthead::after {
    background: linear-gradient(90deg, #e6e8dc 12%, #e6e8dce6 48%, #e6e8dc55 100%);
  }
  .catalog-masthead .breadcrumb {
    padding-top: 16px;
    margin-bottom: 10px;
  }
  .catalog-masthead .page-head {
    padding: 7px 0 22px;
    min-height: 0;
  }
  .catalog-masthead .page-title {
    max-width: 100%;
    font-size: 33px;
    margin: 10px 0;
  }
  .catalog-masthead .page-intro { max-width: 88%; }
  .catalog-content { padding-top: 20px; }
  .catalog-scene .filter-mobile-toggle {
    background: #fafbf5;
    color: #354b37;
    border: 1px solid #d0d8c4;
    border-radius: 7px;
    padding: 13px 16px;
  }
  .catalog-scene .filters { padding: 20px; }
  .catalog-scene .catalog-top { gap: 8px; align-items: center; margin-bottom: 18px; }
  .catalog-scene .catalog-top select { max-width: 156px; padding: 8px; }
  .catalog-scene .catalog-layout .product-grid { gap: 16px 10px; }
  .catalog-scene .product-card { border-radius: 9px; }
  .catalog-scene .product-image { padding: 10px; border-radius: 8px 8px 0 0; }
  .catalog-scene .product-info { padding: 11px 10px 12px; }
  .catalog-scene .product-name { font-size: 11px; line-height: 1.5; }
}
@media (prefers-reduced-motion:reduce) {
  .catalog-scene .product-card { transition: none; }
}