/* Compact browsing on phones, while retaining full details in product sheets. */
@media (max-width: 640px) {
  .catalog-filters { gap: .55rem; padding: .65rem; margin-bottom: 1rem; border-radius: 1rem; min-width: 0; }
  .filter-group { display: block; min-width: 0; }
  .filter-group > p { margin-bottom: .3rem; font-size: .75rem; }
  .filter-group .category-scroll { display: flex; flex-wrap: nowrap; gap: .4rem; overflow-x: auto; overscroll-behavior-x: contain; width: 100%; padding: .15rem 0 .4rem; scrollbar-width: thin; }
  .filter-group .category-scroll button { flex: 0 0 auto; width: auto; min-height: 2.75rem; height: auto; white-space: nowrap; padding: .45rem .7rem; font-size: .875rem; }
  .brand-filter-group { padding-top: .5rem; }
  .filter-summary { min-height: 1.75rem; padding: 0; }
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
  .product-card { border-radius: .7rem; }
  .product-card-body { padding: .7rem .6rem; }
  .product-brand { font-size: .75rem; letter-spacing: 0; overflow-wrap: anywhere; }
  .product-card h3 { font-size: 1rem; line-height: 1.35; min-height: 0; overflow-wrap: anywhere; margin-bottom: .5rem; }
  .product-benefit { display: none; }
  .product-card-footer { gap: .35rem; }
  .product-card-footer > strong { font-size: 1.05rem; }
  .product-card-footer > div { display: flex; flex-direction: column; gap: .25rem; }
  .product-card-footer button { width: 100%; min-width: 0; min-height: 2.75rem; padding: .4rem .15rem; font-size: .875rem; white-space: normal; gap: .15rem; }
  .product-card-footer svg { flex-shrink: 0; width: .85rem; }
  .product-stock { font-size: .75rem; overflow-wrap: anywhere; }
  .image-detail-hint { display: none; }
  .product-meta { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; min-width: 0; }
  .product-meta > span:first-child { max-width: 100%; white-space: normal; overflow-wrap: anywhere; font-size: .75rem; letter-spacing: .025em; }
  .product-meta .time-badge { max-width: 100%; white-space: normal; font-size: .75rem; padding: .3rem .45rem; }
  .founder-portrait { --figure-height: min(78vw, 320px); height: calc(var(--figure-height) + 65px); min-width: 0; }
  /* Normalize visible figure heights using the originals' transparent bounds. */
  .founder-portrait-blue img { height: calc(var(--figure-height) * 1280 / 899); width: auto; bottom: calc(var(--figure-height) * -268 / 899); transform: translateX(-50%); }
  .founder-portrait-pink img { height: calc(var(--figure-height) * 1080 / 990); width: auto; bottom: calc(var(--figure-height) * -26 / 990); transform: translateX(-50%); }
  .founder-portrait:before { width: 100%; height: 100%; bottom: 0; transform: translateX(-50%); }
  .founder-portrait-blue .founder-sticker { top: 1rem; bottom: auto; left: 50%; right: auto; transform: translateX(-50%) rotate(-5deg); max-width: calc(100% - 1rem); padding: .5rem .6rem; font-size: .75rem; white-space: nowrap; }
  .founder-portrait-pink .founder-sticker { top: auto; bottom: 7%; left: 0; right: auto; transform: rotate(7deg); padding: .48rem .62rem; font-size: .6rem; }
}