.shop-shelf,
.shop-detail {
  max-width: 1320px;
  margin: 0 auto;
  padding: 76px 6% 100px;
}

.shop-shelf-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 30px;
  padding-bottom: 22px;
  border-bottom: 1px solid #b49a6848;
}

.shop-shelf-heading .eyebrow { margin-bottom: 10px; }
.shop-shelf-heading h2 { margin: 0; font-size: clamp(2.5rem, 4.5vw, 4rem); }

.shop-item-count {
  padding-bottom: 7px;
  color: #b49a68;
  font-size: .68rem;
  letter-spacing: .16em;
  white-space: nowrap;
}

.shop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 340px));
  gap: 28px;
  align-items: start;
}

.shop-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #b49a6850;
  background: linear-gradient(145deg, #211c14, #12100d 75%);
  box-shadow: 0 16px 38px #0006;
  transition: transform .24s ease, border-color .24s ease, box-shadow .24s ease;
}

.shop-card:hover,
.shop-card:focus-visible {
  transform: translateY(-5px);
  border-color: #b49a68;
  box-shadow: 0 22px 45px #0009, 0 0 22px #b49a6818;
}

.shop-card-image {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  padding: 14px;
  background: #0d0b09;
}

.shop-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}

.preorder-art {
  isolation: isolate;
  background: radial-gradient(ellipse at 50% 52%, #b49a6822, transparent 58%), linear-gradient(145deg, #17130e, #090807);
}

.preorder-shirt-mark {
  display: grid;
  place-items: center;
  width: 76%;
  aspect-ratio: 1;
  border: 1px solid #b49a6848;
  border-radius: 50%;
  color: #d2b57c;
  background: radial-gradient(circle, #b49a6815, transparent 68%);
  transition: opacity .3s ease, transform .3s ease;
}

.preorder-shirt-mark svg { width: 58%; height: 58%; }
.preorder-product-image { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: contain !important; padding: 0; background: #100e0b; }
.preorder-badge { border-color: #d4ad6e; color: #f3d99f; background: #291d0dcc; }
.shop-card-badge.preorder-badge { z-index: 2; }
.preorder-date { color: #f0d9a8; font-size: .76rem; line-height: 1.5; }
.preorder-card .shop-card-title { font-size: 1.65rem; }
.preorder-card[aria-disabled="true"] { cursor: not-allowed; opacity: .68; pointer-events: none; }
.presale-overlay-open { overflow: hidden; }
.shop-presale-callout { display: flex; align-items: center; gap: 16px; margin: 0 0 24px; color: #f0d9a8; font-size: .85rem; letter-spacing: .04em; }
.shop-presale-callout .shop-card-badge { position: static; flex: 0 0 auto; }
.presale-closed { max-width: 36rem; margin: 80px auto; color: #f0d9a8; font-size: 1.25rem; line-height: 1.6; text-align: center; }

.presale-overlay[hidden] { display: none; }
.presale-overlay { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 24px; }
.presale-backdrop { position: absolute; inset: 0; background: #080705e8; backdrop-filter: blur(8px); animation: presale-fade .28s ease both; }
.presale-dialog { position: relative; width: min(100%, 620px); padding: clamp(18px, 3.4vw, 42px); border: 1px solid #b49a68a6; outline: 1px solid #b49a6830; outline-offset: 7px; color: #eee4d3; background: radial-gradient(ellipse at 50% 0, #80612c2b, transparent 58%), linear-gradient(145deg, #211a11, #100e0b 72%); box-shadow: 0 32px 100px #000b, inset 0 0 50px #0006; text-align: center; animation: presale-rise .38s cubic-bezier(.2,.8,.2,1) both; }
.presale-dialog { max-height: calc(100dvh - 32px); overflow-y: auto; }
.presale-promo-image { display: block; width: min(100%, 23vh, 220px); max-height: 23vh; margin: 12px auto; border: 1px solid #b49a685e; object-fit: contain; box-shadow: 0 12px 32px #0007; }
.presale-dialog h2 { max-width: 16ch; margin: 10px auto; color: #f2e6d1; font: 400 clamp(1.7rem, 4vw, 2.7rem)/1.04 var(--serif); }
.presale-dialog p { margin: 9px 0; color: #c3b9a8; font-size: .9rem; line-height: 1.55; }
.presale-dialog .presale-deadline { margin-top: 12px; color: #f0d9a8; font-size: .82rem; letter-spacing: .04em; }
.presale-countdown { min-height: 1.3em; color: #d2b57c !important; font-size: .73rem !important; letter-spacing: .14em; text-transform: uppercase; }
.presale-cta { margin-top: 6px; }
.presale-close { position: absolute; top: 12px; right: 14px; width: 44px; height: 44px; border: 1px solid #b49a685e; border-radius: 50%; color: #eee4d3; background: #100e0b; font: 300 2rem/1 sans-serif; cursor: pointer; }
.presale-close:hover, .presale-close:focus-visible { border-color: #e2c78f; color: #e2c78f; }
@keyframes presale-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes presale-rise { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

.shop-card:hover .shop-card-image img { transform: scale(1.035); }

.shop-card-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  padding: 5px 10px;
  border: 1px solid #b49a68a0;
  background: #100e0bd9;
  color: #d6bd8c;
  font-size: .62rem;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.shop-card-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 23px 24px 25px;
}

.shop-card-category {
  margin-bottom: 10px;
  color: #b49a68;
  font-size: .62rem;
  letter-spacing: .16em;
}

.shop-card-title {
  margin-bottom: 7px;
  color: #eee4d3;
  font: 400 1.85rem/1.05 var(--serif);
}

.shop-card-subtitle {
  min-height: 3.5em;
  color: #b3aa9a;
  font-size: .8rem;
  line-height: 1.55;
}

.shop-card-price {
  margin-top: 15px;
  color: #eee4d3;
  font-size: .9rem;
  letter-spacing: .03em;
}

.shop-card-link {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 19px;
  padding-top: 14px;
  border-top: 1px solid #b49a6848;
  color: #d2b57c;
  font-size: .75rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.shop-card-link span { font-size: 1.15rem; }

.shop-detail { max-width: 1180px; padding-top: 46px; }

.shop-back-link {
  display: inline-block;
  margin: 0 0 22px;
  padding-bottom: 5px;
  border-bottom: 1px solid #b49a685e;
  color: #d2b57c;
  font-size: .8rem;
  letter-spacing: .06em;
}

.shop-back-link:hover { color: #f0d9a8; border-color: #f0d9a8; }

.shop-product-panel {
  min-height: 390px;
  padding: clamp(18px, 3vw, 40px);
  border: 1px solid #b49a685e;
  outline: 1px solid #b49a6824;
  outline-offset: 6px;
  background: radial-gradient(ellipse at 18% 50%, #6b51251e, transparent 60%), linear-gradient(115deg, #211c14, #12100d 72%);
  box-shadow: 0 22px 55px #0007, inset 0 0 45px #0004;
}

#product-component-1792099565261 { min-height: 300px; }

.shop-checkout-note {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
  margin: 28px auto 0;
  color: #b3aa9a;
  font-size: .72rem;
  letter-spacing: .08em;
  text-align: center;
}

.shop-checkout-note span { color: #b49a68; }

@media (max-width: 800px) {
  .shop-shelf,
  .shop-detail { padding: 55px 6% 75px; }
  .shop-shelf-heading { align-items: start; flex-direction: column; gap: 12px; }
  .shop-item-count { padding-bottom: 0; }
  .shop-grid { grid-template-columns: minmax(0, 1fr); }
  .shop-card { width: min(100%, 430px); }
  .shop-card-copy { padding: 19px 20px 21px; }
  .shop-detail { padding-top: 34px; }
  .shop-product-panel { min-height: 320px; padding: 14px; outline-offset: 3px; }
  #product-component-1792099565261 { min-height: 260px; }
  .shop-presale-callout { align-items: flex-start; flex-direction: column; gap: 10px; }
  .presale-overlay { padding: 22px; }
  .presale-dialog { padding: 44px 22px 22px; }
  .presale-promo-image { width: min(100%, 22vh, 190px); max-height: 22vh; margin: 10px auto; }
  .presale-dialog h2 { font-size: clamp(1.65rem, 5vw, 2.35rem); }
}

@media (max-height: 700px) {
  .presale-dialog { padding-top: 38px; padding-bottom: 18px; }
  .presale-promo-image { width: min(100%, 18vh, 160px); max-height: 18vh; margin: 8px auto; }
  .presale-dialog h2 { margin: 8px auto; font-size: clamp(1.5rem, 3.8vw, 2.25rem); }
  .presale-dialog p { margin: 7px 0; }
  .presale-dialog .presale-deadline { margin-top: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  .presale-backdrop, .presale-dialog { animation: none; }
}
