.category-site {
  min-height: 100vh;
  background: var(--night);
  color: #edf1ef;
}

.category-site.theme-paper { background: #edf0ed; color: var(--ink); }
.category-site.theme-warm { background: #e9e4da; color: var(--ink); }
.category-site.gallery-dark .site-header { color: #e9eeee; }
.category-site.gallery-dark .brand img { filter: brightness(0) invert(1); }
.category-site.gallery-dark .header-cta { color: var(--ink); background: var(--paper); }
.category-site.gallery-dark .header-cta:hover { color: var(--paper); background: transparent; }

.category-rail {
  position: sticky;
  z-index: 24;
  top: clamp(94px, 4.8vw, 124px);
  border-bottom: 1px solid rgba(255,255,255,.12);
  background: rgba(14,21,23,.96);
  color: #dce4e3;
  backdrop-filter: blur(16px);
}
.theme-paper .category-rail, .theme-warm .category-rail {
  border-color: rgba(28,48,56,.14);
  background: rgba(238,241,239,.96);
  color: var(--ink);
}
.category-rail-inner {
  width: min(var(--wide-width), calc(100% - 2 * var(--gutter)));
  min-height: 48px;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(18px, 2.2vw, 34px);
  overflow-x: auto;
  scrollbar-width: none;
  white-space: nowrap;
}
.category-rail-inner::-webkit-scrollbar { display: none; }
.category-rail a {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  color: inherit;
  font-size: 11px;
  font-weight: 600;
  opacity: .72;
  padding: 8px 3px;
  transition: opacity .18s, color .18s;
}
.category-rail a::after {
  position: absolute;
  right: 3px;
  bottom: 3px;
  left: 3px;
  height: 1px;
  background: #111;
  content: "";
  opacity: 0;
  transform: scaleX(.55);
  transition: opacity .18s, transform .18s;
}
.category-rail a:hover::after, .category-rail a:focus-visible::after,
.category-rail a[aria-current="page"]::after { opacity: 1; transform: scaleX(1); }
.category-site:not(.theme-paper):not(.theme-warm) .category-rail a::after { background: #fff; }

.category-hero, .gallery-section, .decision-section, .faq-section, .category-cta {
  width: min(var(--wide-width), calc(100% - 2 * var(--gutter)));
  margin-inline: auto;
}
.category-hero {
  display: grid;
  grid-template-columns: minmax(280px, .76fr) minmax(0, 1.24fr);
  align-items: end;
  gap: clamp(30px, 5vw, 84px);
  padding-block: clamp(50px, 6vw, 92px) 26px;
}
.category-copy { max-width: 640px; }
.category-kicker, .section-kicker {
  margin: 0 0 15px;
  color: #91abb0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  line-height: 1.5;
  text-transform: uppercase;
}
.theme-paper .category-kicker, .theme-paper .section-kicker,
.theme-warm .category-kicker, .theme-warm .section-kicker { color: #4c6268; }
.category-copy h1 {
  max-width: 14ch;
  margin: 0;
  font-family: "Bodoni 72", "Times New Roman", serif;
  font-size: clamp(42px, 4.8vw, 68px);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: .98;
}
.category-intro {
  max-width: 52ch;
  margin: 18px 0 0;
  color: #b8c5c4;
  font-size: clamp(14px, 1vw, 16px);
  line-height: 1.7;
}
.theme-paper .category-intro, .theme-warm .category-intro { color: #5e7176; }
.category-actions { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; margin-top: 22px; }
.category-actions a { padding-bottom: 4px; border-bottom: 1px solid currentColor; font-size: 12px; font-weight: 700; }
.category-actions a:first-child { color: #52a6bd; }
.theme-paper .category-actions a:first-child, .theme-warm .category-actions a:first-child { color: #006b85; }
.category-actions a span { margin-left: 8px; }

.hero-media-group { min-width: 0; }
.hero-media, .hero-pair-item {
  margin: 0;
  position: relative;
  overflow: hidden;
  aspect-ratio: 2 / 1;
  border-radius: 8px;
  background: #dedbd3;
}
.hero-media img, .hero-pair-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-media figcaption, .hero-pair-item figcaption {
  position: absolute;
  inset: auto 12px 12px;
  width: fit-content;
  max-width: calc(100% - 24px);
  padding: 7px 9px;
  color: #f3f4f1;
  background: rgba(14,21,23,.78);
  font-size: 9px;
  letter-spacing: .08em;
  line-height: 1.4;
}
.hero-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.hero-pair-item { aspect-ratio: 1 / 1; }
.visual-note { margin: 9px 0 0; color: #9cabab; font-size: 9px; letter-spacing: .08em; }
.theme-paper .visual-note, .theme-warm .visual-note { color: #65797d; }

.gallery-section { padding-block: 22px clamp(68px,7vw,104px); }
.gallery-intro { display: grid; grid-template-columns: minmax(220px,.72fr) minmax(0,.7fr); align-items: end; gap: 28px; margin-bottom: 24px; }
.gallery-intro .section-kicker { margin-bottom: 9px; }
.gallery-intro h2, .decision-heading h2, .faq-heading h2, .category-cta h2 {
  margin: 0;
  font-family: "Bodoni 72", "Times New Roman", serif;
  font-size: clamp(30px, 3.4vw, 48px);
  font-weight: 400;
  letter-spacing: -.045em;
  line-height: 1.02;
}
.gallery-intro > p { max-width: 56ch; margin: 0; color: #adbcbb; font-size: 12px; line-height: 1.65; }
.theme-paper .gallery-intro > p, .theme-warm .gallery-intro > p { color: #4c6268; }
.product-gallery { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: clamp(14px,1.5vw,22px); }
.product-reference { min-width: 0; position: relative; }
.product-reference figure { margin: 0; overflow: hidden; aspect-ratio: 1 / 1; border-radius: 6px; background: #fff; }
.product-reference figure > [hidden], .product-card-gallery-controls[hidden] { display: none !important; }
.product-card-gallery-slide { display: block; width: 100%; height: 100%; }
.product-card-gallery-ready { position: relative; touch-action: pan-y; }
.product-card-gallery-ready > .product-card-gallery-frame { position: absolute; inset: 0; width: 100%; height: 100%; }
.gallery-out-left { animation: gallery-out-left .52s cubic-bezier(.22,.75,.2,1) both; }
.gallery-out-right { animation: gallery-out-right .52s cubic-bezier(.22,.75,.2,1) both; }
.gallery-in-right { animation: gallery-in-right .52s cubic-bezier(.22,.75,.2,1) both; }
.gallery-in-left { animation: gallery-in-left .52s cubic-bezier(.22,.75,.2,1) both; }
@keyframes gallery-out-left { to { transform: translateX(-100%); } }
@keyframes gallery-out-right { to { transform: translateX(100%); } }
@keyframes gallery-in-right { from { transform: translateX(100%); } to { transform: translateX(0); } }
@keyframes gallery-in-left { from { transform: translateX(-100%); } to { transform: translateX(0); } }
.product-card-gallery-controls { position: absolute; top: 0; left: 0; width: 100%; aspect-ratio: 1 / 1; display: flex; justify-content: space-between; align-items: center; padding: 10px; pointer-events: none; opacity: 0; transition: opacity .25s ease; }
.product-reference:has(figure:hover) .product-card-gallery-controls, .product-card-gallery-controls:hover, .product-reference:focus-within .product-card-gallery-controls { opacity: 1; }
.product-card-gallery-controls button { position: relative; isolation: isolate; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; color: #1c3038; background: transparent; font-size: 0; cursor: pointer; pointer-events: auto; }
.product-card-gallery-controls button::before { position: absolute; z-index: -1; inset: 7px; border: 1px solid rgba(28,48,56,.12); border-radius: 50%; background: rgba(248,250,248,.88); box-shadow: 0 1px 4px rgba(28,48,56,.1); content: ""; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.product-card-gallery-controls button[data-gallery-previous]::after, .product-card-gallery-controls button[data-gallery-next]::after { position: absolute; top: 50%; left: 50%; width: 6px; height: 6px; border-top: 1px solid currentColor; border-right: 1px solid currentColor; content: ""; transition: transform .2s ease; }
.product-card-gallery-controls button[data-gallery-previous]::after { transform: translate(-35%, -50%) rotate(-135deg); }
.product-card-gallery-controls button[data-gallery-next]::after { transform: translate(-65%, -50%) rotate(45deg); }
.product-card-gallery-controls button:hover::before, .product-card-gallery-controls button:focus-visible::before { background: #fff; border-color: rgba(28,48,56,.32); transform: scale(1.05); }
.product-card-gallery-controls button:focus-visible { outline-offset: -4px; }
.product-card-gallery-controls button:active::before { transform: scale(.94); }
.product-card-gallery-dots { position: absolute; bottom: 2px; left: 50%; display: flex; transform: translateX(-50%); pointer-events: none; }
.product-card-gallery-controls .product-card-gallery-dot { width: 24px; height: 40px; pointer-events: auto; }
.product-card-gallery-controls .product-card-gallery-dot::before { inset: 17px 9px; border: 1px solid #fff; background: rgba(28,48,56,.3); box-shadow: 0 0 0 1px rgba(28,48,56,.25); }
.product-card-gallery-controls .product-card-gallery-dot[aria-current="true"]::before { background: #1c3038; transform: scale(1.15); }
.product-card-gallery-controls .product-card-gallery-dot:hover::before { background: #1c3038; transform: scale(1.2); }
.product-card-gallery-controls .product-card-gallery-dot:focus-visible { outline: none; }
.product-card-gallery-controls .product-card-gallery-dot:focus-visible::before { background: #1c3038; box-shadow: 0 0 0 2px #537d8b, 0 0 0 4px #fff; transform: scale(1.15); }
.product-card-gallery-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (hover: none) { .product-card-gallery-controls { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .product-card-gallery-controls, .product-card-gallery-controls button, .product-card-gallery-controls button::before, .product-card-gallery-controls button::after { transition: none; } }
.product-reference img { width: 100%; height: 100%; object-fit: contain; background: #fff; transition: transform .7s cubic-bezier(.16,1,.3,1); }
.product-reference a:hover img { transform: scale(1.035); }
.product-reference figcaption { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding-top: 10px; }
.product-reference h3 { margin: 0; font-size: 13px; font-weight: 600; }
.product-reference p { margin: 0; color: #90a3a6; font-size: 10px; letter-spacing: .06em; text-align: right; text-transform: uppercase; }
.theme-paper .product-reference p, .theme-warm .product-reference p { color: #4c6268; }

.decision-section { padding-block: 22px clamp(64px,7vw,98px); border-top: 1px solid rgba(255,255,255,.15); }
.theme-paper .decision-section, .theme-warm .decision-section { border-color: rgba(28,48,56,.16); }
.decision-heading { display: flex; justify-content: space-between; align-items: end; gap: 36px; margin-bottom: 23px; }
.decision-heading h2 { max-width: 14ch; }
.decision-heading > p { max-width: 42ch; margin: 0; color: #adbcbb; font-size: 12px; line-height: 1.65; }
.theme-paper .decision-heading > p, .theme-warm .decision-heading > p { color: #4c6268; }
.decision-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top: 1px solid rgba(255,255,255,.14); }
.theme-paper .decision-list, .theme-warm .decision-list { border-color: rgba(28,48,56,.16); }
.decision-item { padding: 15px 18px 0 0; }
.decision-item + .decision-item { padding-left: 18px; border-left: 1px solid rgba(255,255,255,.14); }
.theme-paper .decision-item + .decision-item, .theme-warm .decision-item + .decision-item { border-color: rgba(28,48,56,.16); }
.decision-item b { display: block; margin-bottom: 7px; color: #e4e9e7; font-size: 11px; }
.theme-paper .decision-item b, .theme-warm .decision-item b { color: var(--ink); }
.decision-item span { display: block; color: #aab9b9; font-size: 12px; line-height: 1.55; }
.theme-paper .decision-item span, .theme-warm .decision-item span { color: #4c6268; }

.memorial-note { margin-top: 20px; padding: 15px 18px; border: 1px solid rgba(255,255,255,.18); color: #c1ccca; font-size: 11px; line-height: 1.65; }
.faq-section { display: grid; grid-template-columns: minmax(240px,.55fr) minmax(0,1fr); gap: clamp(35px,7vw,110px); padding-block: 24px clamp(72px,8vw,112px); border-top: 1px solid rgba(255,255,255,.15); }
.theme-paper .faq-section, .theme-warm .faq-section { border-color: rgba(28,48,56,.16); }
.faq-heading > p { max-width: 38ch; color: #adbcbb; font-size: 12px; line-height: 1.65; }
.theme-paper .faq-heading > p, .theme-warm .faq-heading > p { color: #4c6268; }
.faq-list { border-top: 1px solid rgba(255,255,255,.16); }
.theme-paper .faq-list, .theme-warm .faq-list { border-color: rgba(28,48,56,.16); }
.faq-list details { border-bottom: 1px solid rgba(255,255,255,.16); }
.theme-paper .faq-list details, .theme-warm .faq-list details { border-color: rgba(28,48,56,.16); }
.faq-list summary { position: relative; padding: 16px 32px 16px 0; cursor: pointer; font-size: 13px; font-weight: 600; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; right: 2px; color: #61a8ba; font-size: 18px; font-weight: 400; }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 68ch; margin: -2px 30px 16px 0; color: #b4c1c0; font-size: 11px; line-height: 1.7; }
.theme-paper .faq-list details p, .theme-warm .faq-list details p { color: #4c6268; }

.category-cta { display: grid; grid-template-columns: 1fr .8fr; gap: 34px; align-items: end; margin-bottom: clamp(68px,8vw,112px); padding: clamp(24px,4vw,48px); border: 1px solid rgba(255,255,255,.2); }
.theme-paper .category-cta, .theme-warm .category-cta { border-color: rgba(28,48,56,.2); }
.category-cta > div:last-child p { margin: 0 0 18px; color: #b4c1c0; font-size: 12px; line-height: 1.7; }
.theme-paper .category-cta > div:last-child p, .theme-warm .category-cta > div:last-child p { color: #4c6268; }
.category-cta .button { display: inline-flex; align-items: center; gap: 26px; padding: 13px 16px; background: #edf1ef; color: var(--ink); font-size: 11px; font-weight: 700; }
.theme-paper .category-cta .button, .theme-warm .category-cta .button { background: var(--ink); color: #edf1ef; }
.category-cta .button:hover { opacity: .8; }
.category-footer .footer-main { max-width: var(--wide-width); }
.category-footer .footer-disclaimer { max-width: var(--wide-width); }
.category-footer .footer-bottom { max-width: var(--wide-width); }
.category-footer .footer-identity > p { max-width: 32ch; }

.category-overview { min-height: 100vh; background: #edf0ed; color: var(--ink); }
.category-overview-hero { width: min(var(--wide-width), calc(100% - 2 * var(--gutter))); margin: auto; padding-block: clamp(62px,8vw,116px) 36px; }
.category-overview-hero h1 { max-width: 12ch; margin: 0; font: 400 clamp(48px,7vw,92px)/.96 "Bodoni 72", "Times New Roman", serif; letter-spacing: -.055em; }
.category-overview-hero > p:last-child { max-width: 58ch; margin: 18px 0 0; color: #5e7176; font-size: 14px; line-height: 1.7; }
.category-overview-grid { width: min(var(--wide-width), calc(100% - 2 * var(--gutter))); margin: auto; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 34px 20px; padding-bottom: 90px; }
.overview-category-card figure { margin: 0; aspect-ratio: 16/9; overflow: hidden; background: #dcdedb; }
.overview-category-card { scroll-margin-top: 140px; }
.overview-category-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.16,1,.3,1); }
.overview-category-card:hover img { transform: scale(1.03); }
.overview-category-card .overview-meta { display: flex; justify-content: space-between; gap: 14px; margin-top: 11px; align-items: baseline; }
.overview-category-card h2 { margin: 0; font-size: 15px; font-weight: 600; }
.overview-category-card span { color: #648087; font-size: 10px; letter-spacing: .1em; }
.overview-category-card > a > p { max-width: 48ch; margin: 6px 0 0; color: #718084; font-size: 12px; font-weight: 400; line-height: 1.55; }

@media (max-width: 1200px) {
  .category-rail-inner { justify-content: flex-start; }
  .product-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 980px) {
  .category-rail::after { position: absolute; z-index: 1; top: 0; right: 0; bottom: 1px; width: 24px; background: linear-gradient(90deg, transparent, rgba(14,21,23,.98)); content: ""; pointer-events: none; }
  .theme-paper .category-rail::after { background: linear-gradient(90deg, transparent, rgba(238,241,239,.98)); }
  .theme-warm .category-rail::after { background: linear-gradient(90deg, transparent, rgba(233,228,218,.98)); }
}
@media (max-width: 980px) {
  .category-hero { gap: 32px; }
  .category-copy h1 { font-size: clamp(42px, 6vw, 62px); }
  .gallery-intro { grid-template-columns: 1fr .85fr; }
  .category-overview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .header-inner { width: calc(100% - 32px); height: auto; min-height: 0; grid-template-columns: 1fr auto; gap: 8px 14px; padding: 12px 0 9px; }
  .brand { width: 112px; }
  .header-cta { min-width: 0; padding: 10px 12px; font-size: 11px; }
  .main-nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; gap: 23px; width: 100%; overflow-x: auto; padding: 6px 1px; font-size: 11px; white-space: nowrap; scrollbar-width: none; }
  .main-nav::-webkit-scrollbar { display: none; }
  .category-rail { top: var(--header-height, 74px); }
  .category-rail-inner { min-height: 48px; gap: 16px; padding-right: 24px; }
  .category-rail a { min-height: 44px; display: inline-flex; align-items: center; padding: 8px 4px; font-size: 11px; }
  .category-hero { grid-template-columns: 1fr; gap: 20px; padding-block: 36px 22px; }
  .category-copy, .hero-media-group { grid-row: auto; grid-column: auto; padding: 0; }
  .hero-pair { gap: 8px; }
  .hero-pair-item { aspect-ratio: 1 / 1; }
  .hero-pair-item figcaption { inset: auto 7px 7px; padding: 5px; font-size: 8px; }
  .gallery-section { padding-top: 20px; }
  .gallery-intro, .decision-heading, .faq-section, .category-cta { grid-template-columns: 1fr; display: grid; gap: 13px; }
  .gallery-intro { margin-bottom: 18px; }
  .gallery-intro h2, .decision-heading h2, .faq-heading h2, .category-cta h2 { font-size: 34px; }
  .product-gallery { grid-template-columns: 1fr; gap: 22px; }
  .decision-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .decision-item { padding: 14px 12px 13px 0; }
  .decision-item + .decision-item { padding-left: 12px; }
  .decision-item:nth-child(3) { padding-left: 0; border-left: 0; }
  .decision-item:nth-child(n+3) { border-top: 1px solid rgba(255,255,255,.14); }
  .theme-paper .decision-item:nth-child(n+3), .theme-warm .decision-item:nth-child(n+3) { border-color: rgba(28,48,56,.16); }
  .faq-section { padding-block: 22px 62px; }
  .category-cta { margin-bottom: 62px; padding: 22px; }
  .category-overview-hero { padding-top: 42px; }
  .category-overview-grid { grid-template-columns: 1fr; gap: 25px; padding-bottom: 58px; }
  .category-footer .footer-main { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .category-footer .footer-identity { grid-column: 1/-1; }
}
@media (prefers-reduced-motion: reduce) {
  .product-reference img, .overview-category-card img { transition: none; }
}

.reference-filters {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 12px 18px;
  margin: 0 0 clamp(24px, 3vw, 38px);
  padding: 14px 0;
  border-block: 1px solid rgba(28,48,56,.16);
}
.reference-filter-primary { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; min-width: 0; }
.reference-filter-dropdown { position: relative; flex: 0 0 auto; }
.reference-filter-dropdown > summary {
  display: flex;
  min-height: 42px;
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  border: 1px solid rgba(28,48,56,.32);
  border-radius: 999px;
  color: #20343a;
  font-size: 13px;
  line-height: 1.2;
  list-style: none;
  cursor: pointer;
  transition: border-color .18s, background .18s, color .18s;
}
.reference-filter-dropdown > summary::-webkit-details-marker { display: none; }
.reference-filter-dropdown > summary::after {
  width: 0;
  height: 0;
  border: 4px solid transparent;
  border-top-color: currentColor;
  border-bottom: 0;
  content: "";
}
.reference-filter-dropdown > summary:hover, .reference-filter-dropdown[open] > summary {
  border-color: #20343a;
  background: rgba(28,48,56,.035);
}
.reference-filter-current { color: #006b85; font-size: 12px; }
.reference-filter-group.reference-filter-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 10;
  display: grid;
  width: max-content;
  min-width: 220px;
  max-width: min(320px, calc(100vw - 44px));
  gap: 10px;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(28,48,56,.16);
  border-radius: 10px;
  background: #f8f9f7;
  box-shadow: 0 14px 32px rgba(14,21,23,.14);
}
.reference-filter-menu legend { float: left; width: 100%; padding: 0 4px; color: #5f7277; font-size: 11px; font-weight: 600; }
.reference-filter-menu .reference-filter-options { clear: both; }
.reference-filter-options { display: grid; max-height: min(52vh, 320px); gap: 2px; overflow-y: auto; }
.reference-filter-empty { margin: 0; padding: 7px 4px 4px; color: #71878a; font-size: 12px; }
.reference-filter-options button {
  display: flex;
  width: 100%;
  min-height: 38px;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 8px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #20343a;
  font: inherit;
  font-size: 13px;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
  transition: color .18s, background .18s;
}
.reference-filter-options button:hover { background: rgba(28,48,56,.06); color: #006b85; }
.reference-filter-options button[aria-pressed="true"] { color: #006b85; font-weight: 600; }
.reference-filter-options button[aria-pressed="true"]::after { content: "✓"; }
.reference-filter-group.reference-filter-menu.reference-shape-filter-menu {
  width: min(392px, calc(100vw - 32px));
  min-width: min(392px, calc(100vw - 32px));
  max-width: min(392px, calc(100vw - 32px));
}
.reference-shape-filter-menu .reference-filter-options {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-height: min(56vh, 344px);
  gap: 4px;
}
.reference-shape-filter-menu .reference-filter-options > button[data-value=""] {
  grid-column: 1 / -1;
  min-height: 36px;
  padding: 8px 10px;
}
.reference-filter-options .reference-shape-option {
  position: relative;
  display: flex;
  min-height: 74px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 4px;
  border: 1px solid transparent;
  border-radius: 7px;
  text-align: center;
}
.reference-filter-options .reference-shape-option:hover,
.reference-filter-options .reference-shape-option[aria-pressed="true"] {
  border-color: rgba(0,107,133,.5);
  background: rgba(0,107,133,.055);
}
.reference-filter-options .reference-shape-option[aria-pressed="true"]::after {
  position: absolute;
  top: 4px;
  right: 6px;
  color: #006b85;
  font-size: 11px;
}
.reference-shape-option svg { display: block; width: 34px; height: 34px; overflow: visible; }
.reference-shape-option path { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.reference-shape-option .reference-shape-outline { stroke-width: 1.6; }
.reference-shape-option .reference-shape-facet { stroke-width: 1; opacity: .58; }
.reference-filter-options .reference-shape-option > span { max-width: 100%; font-size: 10px; line-height: 1.2; }
.reference-search, .reference-sort {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: 9px;
  padding: 0 13px;
  border: 1px solid rgba(28,48,56,.32);
  border-radius: 999px;
  color: #20343a;
  font-size: 12px;
}
.reference-search > span, .reference-sort > span { color: #4c6268; white-space: nowrap; }
.reference-search input, .reference-sort select {
  min-width: 78px;
  max-width: 180px;
  min-height: 32px;
  padding: 4px 22px 4px 2px;
  border: 0;
  background: transparent;
  color: #20343a;
  font: inherit;
  font-size: 13px;
}
.reference-sort select { appearance: none; background-image: linear-gradient(45deg,transparent 50%,#20343a 50%),linear-gradient(135deg,#20343a 50%,transparent 50%); background-position: calc(100% - 7px) 13px, calc(100% - 2px) 13px; background-repeat: no-repeat; background-size: 5px 5px; cursor: pointer; }
.reference-search input:focus, .reference-sort select:focus { outline: 0; }
.reference-search input::placeholder { color: #71878a; opacity: 1; }
.reference-result-count {
  grid-column: 2;
  justify-self: end;
  margin: 0;
  color: #4c6268;
  font-size: 12px;
  line-height: 1.4;
  text-align: right;
}
.reference-active-filters { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.reference-active-filters[hidden], .reference-filters [hidden], .reference-filter-group [hidden] { display: none !important; }
.reference-active-chip {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 10px;
  padding: 5px 11px;
  border: 0;
  border-radius: 999px;
  background: rgba(28,48,56,.06);
  color: #20343a;
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.reference-active-chip span[aria-hidden="true"] { color: #607378; font-size: 17px; line-height: 1; }
.reference-active-chip:hover { background: rgba(28,48,56,.11); }
.reference-active-filters > [data-reference-reset] {
  min-height: 34px;
  padding: 4px 7px;
  border: 0;
  background: transparent;
  color: #425f63;
  font: inherit;
  font-size: 12px;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.reference-filters :focus-visible {
  outline: 2px solid #087e9c;
  outline-offset: 3px;
}
.product-reference[hidden] { display: none !important; }
@media (max-width: 1200px) {
  .reference-filters { grid-template-columns: minmax(0,1fr); }
  .reference-result-count { grid-column: 1; justify-self: end; }
}
@media (max-width: 760px) {
  .reference-filters { gap: 10px; padding-block: 12px; }
  .reference-filter-primary { gap: 7px; }
  .reference-filter-dropdown > summary { min-height: 40px; gap: 8px; padding-inline: 11px; font-size: 12px; }
    .reference-filter-group.reference-filter-menu.reference-shape-filter-menu {
    width: min(340px, calc(100vw - 32px));
    min-width: min(320px, calc(100vw - 32px));
    max-width: min(340px, calc(100vw - 32px));
  }
  .reference-shape-filter-menu .reference-filter-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.reference-filter-group.reference-filter-menu { min-width: min(220px, calc(100vw - 44px)); }
  .reference-search, .reference-sort { min-height: 40px; gap: 6px; padding-inline: 10px; font-size: 11px; }
  .reference-search input, .reference-sort select { max-width: 135px; font-size: 12px; }
  .reference-result-count { grid-column: 1; justify-self: start; text-align: left; }
}