.shop-intro { padding: 32px 0 42px; background: linear-gradient(90deg,#fffffff7 0%,#fffffff2 35%,#ffffffe0 52%,#ffffff45),url('../public/images/alpen-straight-spear-v6.webp') right 43% / cover; border-bottom: 1px solid var(--line); }
.shop-home { display: inline-block; margin-bottom: 25px; font-size: 12px; color: #8f6376; }
.shop-home:hover { color: var(--accent); text-decoration: underline; }
.shop-eyebrow { color: #9b7284; font-size: 10px; letter-spacing: 3px; margin-bottom: 13px; text-align: start; }
.shop-intro h1 { font: 500 48px/1.2 var(--serif); color: #403448; letter-spacing: -1.4px; }
.shop-lead { max-width: 520px; margin-top: 17px; color: #6c6170; font-size: 14px; line-height: 1.9; }
.shop-layout { display: grid; grid-template-columns: 205px minmax(0,1fr); gap: 34px; align-items: start; padding-block: 35px 50px; }
.shop-sidebar { position: sticky; top: 24px; }
.shop-sidebar h2 { font: 500 17px/1.5 var(--serif); padding: 0 10px 17px; color: #403448; }
.shop-categories { display: flex; flex-direction: column; gap: 4px; border-block: 1px solid var(--line); padding-block: 12px; }
.shop-categories button { display: flex; justify-content: space-between; align-items: center; gap: 10px; width: 100%; padding: 13px 12px; font-size: 12px; line-height: 1.55; text-align: start; border-radius: 3px; border-inline-start: 2px solid transparent; transition: background .2s,color .2s; }
.shop-category-count { font-size: 10px; color: #847384; font-variant-numeric: tabular-nums; }
.shop-categories button:hover { background: #f9f5f7; color: var(--accent); }
.shop-categories button[aria-pressed="true"] { color: var(--accent); background: #f5eaf0; border-inline-start-color: var(--accent); font-weight: 500; }
.shop-categories button[aria-pressed="true"] .shop-category-count { color: var(--accent); }
.shop-currency-note { padding: 18px 12px; font-size: 11px; line-height: 1.8; color: #8b7c8c; }
.shop-main { min-width: 0; }
.shop-toolbar { display: grid; grid-template-columns: minmax(0,1fr) 205px; gap: 18px; padding: 20px; background: #f7f5f8; border: 1px solid #e9e3eb; border-radius: 4px; }
.shop-toolbar label { display: flex; flex-direction: column; gap: 9px; min-width: 0; font-size: 11px; color: #736077; }
.shop-search>span { position: relative; }
.shop-search svg { position: absolute; width: 17px; height: 17px; top: 14px; inset-inline-start: 13px; color: #9b8899; pointer-events: none; }
.shop-search input, .shop-sort select, .shop-quantity select { width: 100%; border: 1px solid #dcd3df; border-radius: 3px; background: #fff; color: #403448; font: inherit; font-size: 12px; min-height: 44px; padding: 10px 12px; }
.shop-search input { padding-inline-start: 39px; }
.shop-search input::placeholder { color: #938494; }
.shop-search input:focus-visible, .shop-sort select:focus-visible, .shop-quantity select:focus-visible { outline: 2px solid #a87587; outline-offset: 2px; }
.shop-results { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px 16px; padding-block: 26px 18px; }
.shop-results h2 { font: 500 21px/1.5 var(--serif); color: #403448; }
#shop-count { font-size: 11px; color: #85728a; }
#shop-reset { margin-inline-start: auto; font-size: 11px; color: var(--accent); text-decoration: underline; text-underline-offset: 3px; padding: 8px 0; }
.shop-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.shop-card { display: flex; flex-direction: column; padding: 20px 18px 17px; min-width: 0; border: 1px solid #e6dfe9; border-radius: 5px; background: linear-gradient(140deg,#faf7fa,#fff 40%); box-shadow: 0 4px 15px #40324804; transition: border-color .2s,box-shadow .2s; }
.shop-card:hover { border-color: #c2a2b3; box-shadow: 0 6px 22px #4930480b; }
.shop-card-top { display: flex; gap: 14px; align-items: center; margin-bottom: 19px; }
.shop-item-icon { display: grid; place-items: center; flex: 0 0 64px; width: 64px; height: 64px; background: radial-gradient(ellipse at 50% 40%,#fff 20%,#f1e7ec 90%); border: 1px solid #e8dbe3; border-radius: 12px; box-shadow: inset 0 0 0 3px #fff8; }
.shop-item-icon img { object-fit: contain; image-rendering: pixelated; filter: drop-shadow(0 2px 2px #49304820); }
.shop-kind { color: #8a7187; font-size: 10px; line-height: 1.7; }
.shop-card h3 { font: 500 15px/1.6 var(--serif); color: #49384b; overflow-wrap: anywhere; }
.shop-description { margin: 10px 0 21px; color: #7c6f7f; font-size: 12px; line-height: 1.85; }
.shop-quantity { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; font-size: 11px; color: #78677b; }
.shop-quantity select { width: 115px; flex-shrink: 0; min-height: 38px; padding: 6px; }
.shop-price-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; justify-content: space-between; margin-top: auto; padding-top: 15px; border-top: 1px solid #eee7ee; }
.shop-price { font: 500 23px/1.4 var(--serif); color: var(--accent); white-space: nowrap; }
.shop-unit { max-width: 105px; color: #938195; font-size: 10px; line-height: 1.6; text-align: end; }
.shop-empty { grid-column: 1 / -1; padding: 50px 22px; text-align: center; border: 1px dashed #d7c9d7; border-radius: 4px; }
.shop-empty>span { font: 45px/1 var(--serif); color: #b093a6; }
.shop-empty h3 { margin: 16px 0 10px; font: 500 21px var(--serif); color: #503c52; }
.shop-empty p { font-size: 13px; line-height: 1.8; color: #86738a; }
.shop-empty button { margin-top: 22px; color: var(--accent); text-decoration: underline; }
html[dir="rtl"] .shop-intro { background-image: linear-gradient(270deg,#fffffff7 0%,#fffffff2 35%,#ffffffe0 52%,#ffffff45),url('../public/images/alpen-straight-spear-v6.webp'); }
html[lang="ar"] .shop-intro h1 { letter-spacing: 0; }
html[lang="ar"] .shop-description { font-size: 14px; }
html[lang="ar"] .shop-kind, html[lang="ar"] .shop-unit { font-size: 12px; }
@media(max-width:1100px) { .shop-layout { grid-template-columns: 185px minmax(0,1fr); gap: 24px; } .shop-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:760px) {
  .shop-layout { grid-template-columns: 1fr; gap: 18px; }
  .shop-sidebar { position: static; }
  .shop-sidebar h2 { padding-inline: 0; padding-bottom: 12px; }
  .shop-categories { flex-direction: row; flex-wrap: wrap; gap: 7px; padding-block: 12px; }
  .shop-categories button { width: auto; padding: 8px 10px; border: 1px solid #e6dfe9; font-size: 11px; }
  .shop-categories button[aria-pressed="true"] { border-color: #bc93a7; }
  .shop-currency-note { padding: 12px 0 0; }
}
@media(max-width:600px) {
  .shop-intro { padding: 26px 0 30px; }
  .shop-intro h1 { font-size: 36px; }
  .shop-lead { font-size: 13px; }
  .shop-layout { padding-block: 25px 32px; }
  .shop-toolbar { grid-template-columns: 1fr; padding: 16px; gap: 15px; }
  .shop-results h2 { font-size: 19px; }
}
@media(max-width:479px) { .shop-grid { grid-template-columns: 1fr; gap: 14px; } .shop-card { padding: 20px; } .shop-card-top { margin-bottom: 14px; } .shop-price-row { flex-wrap: nowrap; } .shop-card h3 { font-size: 17px; } }