/* The approved Wabi catalogue: scoped to its existing view and category routes. */
.shop-page { max-width:1440px; margin:0 auto; padding:40px 40px 72px; }
.shop-page .shop-heading { margin-bottom:24px; }
/* Brief: retain the small corporate-red editorial label. */
.shop-page .shop-lead { display:block; margin:0 0 12px; color:var(--wabi-accent); font-size:12px; font-weight:600; line-height:1.5; letter-spacing:.12em; text-transform:uppercase; }
.shop-page h1 { font-family:'Clash Display',sans-serif; font-size:clamp(32px,3.5vw,50px); font-weight:500; line-height:1.1; letter-spacing:-.035em; margin:0; }
.shop-page .shop-intro { max-width:65ch; margin:16px 0 0; font-size:16px; line-height:1.65; color:var(--wabi-gray); }
.shop-page .shop-categories { display:inline-flex; flex-wrap:wrap; gap:4px; padding:4px; margin:24px 0 0; border:1px solid var(--wabi-border); background:var(--wabi-surface); max-width:100%; } /* taste-skill-ignore: Existing functional category selector. */
.shop-page .shop-categories a { display:flex; align-items:center; justify-content:center; min-height:44px; padding:10px 20px; font-size:14px; line-height:1.4; font-weight:500; text-decoration:none; color:var(--wabi-gray); text-align:center; transition:color .15s,background-color .15s; }
.shop-page .shop-categories a:hover { color:var(--wabi-accent); background:var(--wabi-bg); }
.shop-page .shop-categories a[aria-current='page'] { color:var(--wabi-surface); background:var(--wabi-black); }
.shop-page .shop-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:20px; }
.shop-page .shop-results-count { font-size:14px; color:var(--wabi-gray); margin:0; }
.shop-page .shop-toolbar-controls { display:flex; align-items:center; gap:10px; }
.shop-page .shop-sort-select { min-width:220px; min-height:44px; font-size:14px; background:var(--wabi-surface); }
.shop-page #mobile-filter-btn { display:none; min-height:44px; font-size:12px; }
.shop-page .shop-layout { display:grid; grid-template-columns:244px minmax(0,1fr); gap:28px; align-items:start; }
.shop-page .shop-sidebar { position:sticky; top:88px; background:var(--wabi-surface); border:1px solid var(--wabi-border); padding:20px; } /* taste-skill-ignore: Existing filter form boundary. */
.shop-page .shop-mobile-filter-header,.shop-page .shop-mobile-filter-actions { display:none; }
.shop-page .wabi-label { font-size:13px; text-transform:none; letter-spacing:0; }
.shop-page .size-pill { min-height:44px; min-width:44px; font-size:12px; padding:8px 10px; background:var(--wabi-surface); }
.shop-page .size-pill.active { background:var(--wabi-black); color:var(--wabi-surface); border-color:var(--wabi-black); }
.shop-page .shop-sidebar .field-group + .field-group { padding-top:8px; border-top:1px solid var(--wabi-border); } /* taste-skill-ignore: Existing form-field groups, not decorative section rules. */
.shop-page #clear-filters { min-height:44px; font-size:12px; white-space:normal; }
.shop-page .shop-color-option { display:flex; align-items:center; gap:12px; width:100%; min-height:44px; padding:7px 10px; border:1px solid var(--wabi-border); color:var(--wabi-black); background:var(--wabi-surface); font:inherit; font-size:13px; text-align:left; cursor:pointer; transition:border-color .15s,color .15s; } /* taste-skill-ignore: Toggle field with a visible hit area. */
.shop-page .shop-color-option:hover { border-color:var(--wabi-accent); color:var(--wabi-accent); }
.shop-page .shop-color-option.active { border-color:var(--wabi-black); font-weight:600; }
.shop-page .shop-color-option.active::after { content:''; width:6px; height:11px; margin-left:auto; margin-right:4px; border:solid var(--wabi-accent); border-width:0 2px 2px 0; transform:rotate(45deg); }
.shop-page .shop-color-dot { display:flex; flex-shrink:0; width:24px; height:24px; border:1px solid var(--wabi-gray); border-radius:50%; overflow:hidden; } /* taste-skill-ignore: White CMS swatches need a visible boundary. */
.shop-page .shop-color-dot span { flex:1; }
.shop-page .shop-color-dot.is-unknown { align-items:center; justify-content:center; color:var(--wabi-gray); font-size:12px; }
.shop-page .shop-active-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.shop-page .shop-active-filters:empty { display:none; }
.shop-page .shop-filter-chip { font:inherit; font-size:13px; border:1px solid var(--wabi-border); background:var(--wabi-surface); padding:8px 12px; min-height:44px; cursor:pointer; overflow-wrap:anywhere; max-width:100%; } /* taste-skill-ignore: Existing removable filter controls. */
.shop-page #shop-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:32px 20px; align-items:stretch; background:transparent; }
.shop-page .product-card { min-width:0; height:100%; display:flex; flex-direction:column; background:transparent; cursor:default; overflow:visible; }
.shop-page .product-card-img-wrap { display:block; position:relative; flex-shrink:0; aspect-ratio:4/5; color:inherit; }
.shop-page .product-card-info { flex:1; min-width:0; padding:14px 0 0; display:grid; grid-template-rows:minmax(18px,auto) 1fr auto minmax(38px,auto) auto; gap:6px; }
.shop-page .shop-card-collection { margin:0; font-size:12px; line-height:1.5; color:var(--wabi-gray); overflow-wrap:anywhere; }
.shop-page .product-card-name { margin:0 0 4px; font-size:20px; font-weight:500; line-height:1.25; letter-spacing:-.025em; overflow-wrap:anywhere; }
.shop-page .shop-card-name-link { color:inherit; text-decoration:none; }
.shop-page .shop-card-name-link:hover { color:var(--wabi-accent); text-decoration:underline; text-underline-offset:4px; }
.shop-page .product-card-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; font-size:15px; line-height:1.5; }
.shop-page .product-card-price-compare { margin:0; color:var(--wabi-gray); }
.shop-page .shop-card-summary { margin:0; color:var(--wabi-gray); font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.shop-page .shop-card-cta { display:flex; align-items:center; justify-content:center; min-height:44px; margin-top:6px; font-size:12px; letter-spacing:.08em; }
.shop-page .shop-card-badges { position:absolute; top:10px; left:10px; right:10px; display:flex; align-items:start; flex-wrap:wrap; gap:6px; pointer-events:none; }
.shop-page .shop-card-badge { padding:5px 8px; font-size:11px; font-weight:600; line-height:1.3; letter-spacing:.06em; text-transform:uppercase; color:var(--wabi-surface); background:var(--wabi-black); }
.shop-page .shop-card-badge.is-sale { background:var(--wabi-accent); }
.shop-page .shop-inline-custom { grid-column:1/-1; margin:0; padding:24px; }
.shop-page :is(a,button,input,select):focus-visible,.shop-page .shop-sidebar:focus-visible { outline:2px solid var(--wabi-accent); outline-offset:3px; }
body:has(.shop-page .shop-sidebar.open) { overflow:hidden; }
.shop-page:has(.shop-sidebar.open) { animation:none!important; transform:none!important; }
@media(min-width:981px) { .shop-page .shop-sidebar { max-height:calc(100dvh - 112px); overflow-y:auto; overscroll-behavior:contain; } }
@media(max-width:980px) {
  .shop-page { padding:28px 24px 56px; }
  .shop-page .shop-heading { margin-bottom:18px; }
  .shop-page .shop-layout { grid-template-columns:minmax(0,1fr); }
  .shop-page #shop-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .shop-page #mobile-filter-btn { display:inline-flex; }
  .shop-page .shop-sidebar { position:fixed; top:0; left:0; bottom:0; display:flex; flex-direction:column; width:min(100vw,380px); height:100dvh; padding:16px; overflow:hidden; z-index:11000; transform:translateX(-105%); transition:transform .2s ease; }
  .shop-page .shop-sidebar.open { transform:translateX(0); }
  .shop-page #shop-filter-overlay { z-index:10500!important; }
  .shop-page .shop-filter-fields { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding:0 4px; }
  .shop-page .shop-mobile-filter-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--wabi-border); flex-shrink:0; } /* taste-skill-ignore: Existing modal header boundary. */
  .shop-page .shop-mobile-filter-actions { display:flex; gap:10px; margin-top:18px; padding-top:16px; border-top:1px solid var(--wabi-border); flex-shrink:0; } /* taste-skill-ignore: Existing fixed modal actions. */
  .shop-page .shop-mobile-filter-actions .btn,.shop-page #mobile-filter-close { font-size:12px; white-space:normal; min-height:44px; }
  .shop-page #clear-filters { display:none; }
}
@media(max-width:640px) {
  .shop-page { padding:24px 16px 48px; }
  .shop-page .shop-lead { margin-bottom:10px; }
  .shop-page h1 { font-size:32px; }
  .shop-page .shop-intro { margin-top:12px; font-size:14px; line-height:1.6; }
  .shop-page #category-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); width:100%; margin-top:20px; }
  .shop-page .shop-categories a { font-size:13px; padding:8px; min-width:0; }
  .shop-page .shop-toolbar { gap:10px; margin-bottom:16px; }
  .shop-page .shop-toolbar-controls { width:100%; gap:8px; }
  .shop-page .shop-sort-wrap { flex:1; min-width:0; }
  .shop-page .shop-sort-select { width:100%; min-width:0; padding-left:12px; }
  .shop-page #shop-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px 12px; }
  .shop-page .product-card-info { padding-top:12px; gap:5px; }
  .shop-page .product-card-name { font-size:17px; line-height:1.3; }
  .shop-page .product-card-price { font-size:14px; }
  .shop-page .shop-card-collection { font-size:12px; }
  .shop-page .shop-card-cta { padding-left:8px; padding-right:8px; }
  .shop-page .shop-card-badges { top:8px; left:8px; right:8px; }
  .shop-page .shop-card-badge { padding:4px 6px; }
  .shop-page .shop-inline-custom { padding:20px 16px; }
}
@media(prefers-reduced-motion:reduce) { .shop-page * { transition:none!important; } }