/* Ecommerce Portal (Multiple Vendor): buyer-side marketplace pages — store pages (R5). Design tokens only (tokens.css),
   one column at 390 px, two areas from 720 px. */
.store-banner { margin: 0 0 1rem; border-radius: var(--radius-lg, 12px); overflow: hidden; background: var(--bg-muted); }
.store-banner img { display: block; width: 100%; height: auto; max-height: 320px; object-fit: cover; }
.store-head { display: grid; grid-template-columns: auto 1fr; gap: .75rem 1rem; align-items: center; }
.store-head h1 { margin: 0; overflow-wrap: anywhere; }
.store-logo { width: 72px; height: 72px; border-radius: 50%; overflow: hidden; border: 1px solid var(--border); background: var(--surface); }
.store-logo img { width: 100%; height: 100%; object-fit: cover; }
.store-follow { grid-column: 1 / -1; }
.store-block { margin: 1.5rem 0; }
.store-slides { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; gap: .75rem; }
.store-slides figure { margin: 0; scroll-snap-align: start; }
.store-slides img { display: block; width: 100%; height: auto; border-radius: var(--radius, 8px); }
.store-slides figcaption { padding: .25rem 0; color: var(--text-muted); }
.store-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; list-style: none; padding: 0; margin: 0; }
.store-tiles li { padding: .75rem; border: 1px solid var(--border); border-radius: var(--radius, 8px); background: var(--surface); overflow-wrap: anywhere; }
@media (min-width: 720px) {
  .store-head { grid-template-columns: auto 1fr auto; }
  .store-follow { grid-column: auto; }
  .store-logo { width: 96px; height: 96px; }
  .store-slides { grid-auto-columns: 80%; }
  .store-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* Product pages and cards (R6.1). */
.product-layout { display: grid; gap: 1.25rem; }
.product-pictures { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; gap: .5rem; }
.product-pictures figure { margin: 0; scroll-snap-align: start; }
.product-pictures img { display: block; width: 100%; height: auto; border-radius: var(--radius, 8px); background: var(--bg-muted); }
.product-main h1 { margin-top: 0; overflow-wrap: anywhere; }
.offer-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .75rem; }
.offer { padding: .75rem; border: 1px solid var(--border); border-radius: var(--radius, 8px); background: var(--surface); }
.offer[data-orderable="0"] { opacity: .75; }
.offer p { margin: .25rem 0; overflow-wrap: anywhere; }
.offer-price strong { font-size: 1.25rem; }
.spec-list { display: grid; gap: .25rem; margin: 0; }
.spec-list > div { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: .5rem; padding: .375rem 0; border-bottom: 1px solid var(--border); }
.spec-list dt { color: var(--text-muted); }
.spec-list dd { margin: 0; overflow-wrap: anywhere; }
.product-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; list-style: none; padding: 0; margin: 0; }
.product-cards a { display: grid; gap: .25rem; color: inherit; text-decoration: none; }
.product-cards img { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--radius, 8px); background: var(--bg-muted); }
.product-card-title { overflow-wrap: anywhere; }
.product-card-price { font-weight: 600; }
@media (min-width: 720px) {
  .product-layout { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .product-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}