/* House shelves: a darker storefront hero and two scales of category card. */
.hsh-home-hero {
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(205px,.63fr);
  gap:clamp(20px,4vw,48px);
  align-items:center;
  padding:clamp(20px,3.7vw,48px);
  background:#291a26;
  color:#fff9fc;
  border-radius:24px;
}
.hsh-home-hero .hsh-lede { color:#f0dbe8; }
.hsh-home-hero a { color:#ffb2d0; }
.hsh-home-hero .hsh-find { border-color:#d68bad; }
.hsh-home-hero .hsh-find button { background:#ba084f; color:white; }
.hsh-home-hero .hsh-strip { margin-bottom:0; }
.hsh-shelf-links {
  padding:14px 16px;
  border:1px solid #735168;
  background:#392435;
  border-radius:14px;
}
.hsh-shelf-links p { margin:0; color:#ffe6f1; font:700 1.1rem/1.4 var(--hsh-head); }
.hsh-shelf-links a {
  display:flex;
  align-items:center;
  min-height:44px;
  font-weight:650;
}
.hsh-shelf-links a + a { border-top:1px solid #735168; }
#categories .hsh-aisle img { border-bottom:1px solid var(--hsh-rule); }
#categories .hsh-aisle em { margin-top:auto; }
#why .ob-entries { gap:10px; }
#why .ob-entries li { padding:.8rem .9rem; border:1px solid var(--hsh-rule); border-radius:10px; background:var(--hsh-panel); }
#guide .ob-guide-layout { grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); }
.hsh-feature { background:var(--hsh-panel); }
.hsh-feature .ob-feature-copy > a { display:inline-flex; min-height:44px; align-items:center; font-weight:700; }
.hsh-style-edit { border-top:1px solid var(--hsh-rule); margin-top:12px; padding-top:20px; }
.hsh-style-edit h3 { margin:0 0 .35rem; font-size:clamp(1.35rem,3vw,1.85rem); }
.hsh-style-edit > p { color:var(--hsh-soft); font:400 .95rem/1.5 var(--hsh-body); }
.hsh-style-wall {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,.8fr);
  grid-template-rows:repeat(2,minmax(282px,auto));
  gap:12px;
  list-style:none;
  margin:0;
  padding:0;
}
.hsh-style-wall > li { margin:0; min-width:0; display:flex; flex-direction:column; }
.hsh-style-wall li:nth-child(-n+2) { grid-row:span 2; }
.hsh-look-tile {
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:152px;
  overflow:hidden;
  border:1px solid var(--hsh-rule);
  border-radius:12px;
  background:var(--hsh-paper);
  color:var(--hsh-ink);
  text-decoration:none;
}
.hsh-look-tile img { flex:1; min-height:0; width:100%; height:0; object-fit:cover; object-position:center 34%; }
.hsh-style-wall li:nth-child(3) img { object-position:center 57%; }
.hsh-look-caption { display:flex; flex-wrap:wrap; justify-content:space-between; gap:0 8px; padding:9px 11px; font-size:.9rem; z-index:1; background:var(--hsh-paper); }
.hsh-look-caption > span { color:var(--hsh-pink-ink); text-decoration:underline; }
.hsh-look-tile:focus-visible { outline-offset:3px; }
@media(hover:hover) and (pointer:fine){
  .hsh-look-tile,.hsh-aisle { transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
  .hsh-look-tile img { transition:transform .28s ease; }
  .hsh-look-tile:hover,.hsh-aisle:hover { transform:translateY(-4px); box-shadow:0 8px 20px #24101d24; border-color:var(--hsh-pink-ink); }
  .hsh-look-tile:hover img { transform:scale(1.035); }
}
@media(prefers-reduced-motion:reduce){
  .hsh-look-tile,.hsh-aisle,.hsh-look-tile img { transition:none; }
  .hsh-look-tile:hover,.hsh-aisle:hover,.hsh-look-tile:hover img { transform:none; }
}
@media(min-width:720px) and (max-width:1099px){
  #categories .hsh-aisles { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media(min-width:1100px){
  #categories .hsh-aisles { grid-template-columns:repeat(12,minmax(0,1fr)); gap:12px; }
  #categories .hsh-aisles li { grid-column:span 2; }
  #categories .hsh-aisles li:nth-child(-n+4) { grid-column:span 3; }
}
@media(max-width:760px){
  .hsh-home-hero { grid-template-columns:minmax(0,1fr); gap:12px; border-radius:16px; }
  .hsh-shelf-links { display:flex; flex-wrap:wrap; column-gap:14px; padding:8px 10px 4px; }
  .hsh-shelf-links p { width:100%; font-size:.98rem; }
  .hsh-shelf-links a + a { border-top:0; }
  #guide .ob-guide-layout { grid-template-columns:minmax(0,1fr); }
  .hsh-style-wall { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:auto; gap:8px; }
  .hsh-style-wall li:nth-child(-n+2) { grid-row:auto; }
  .hsh-look-tile img { flex:none; height:auto; aspect-ratio:2/3; }
  .hsh-look-caption { font-size:.82rem; padding:7px 8px; }

}

.ob-look-products { padding:8px 2px 2px; }
.ob-look-products > p { margin:0 0 6px; font-size:.82rem; font-weight:700; }
.ob-look-products > div {
  display:grid;
  grid-template-columns:repeat(auto-fill,54px);
  gap:5px;
}
.ob-look-products a {
  display:block;
  min-width:0;
  aspect-ratio:1;
  padding:2px;
  overflow:hidden;
  border:1px solid var(--hsh-rule);
  border-radius:8px;
  background:#fff;
}
.ob-look-products img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.ob-look-products a:hover, .ob-look-products a:focus-visible { border-color:var(--hsh-pink-ink); }
.ob-look-products a:focus-visible { outline:2px solid var(--hsh-pink-ink); outline-offset:2px; }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .ob-look-products img { transition:transform .18s ease; }
  .ob-look-products a:hover img { transform:scale(1.06); }
}
@media (max-width:760px) { .hsh-look-tile { flex:none; min-height:0; } }
@media (max-width:760px) { .ob-look-products > div { grid-template-columns:repeat(auto-fill,44px); } }