/* Mobile-first shop: server-rendered products, progressive browsing controls. */
.shop-hero .scene-image { height: 320px; }
.shop-collection { padding-block: 52px 32px; scroll-margin-top: 24px; }
.shop-intro { display: grid; gap: 25px; margin-bottom: 35px; }
.shop-intro h2 { font-size: clamp(40px, 7vw, 68px); }
.shop-intro > p { max-width: 380px; color: #645545; font-size: 14px; margin: 0; }
.shop-tools[hidden], .shop-card[hidden], .shop-empty[hidden], [data-shop-more][hidden] { display: none; }
.shop-types { display: flex; overflow-x: auto; gap: 22px; border-bottom: 1px solid #cfc3b5; padding: 0 0 4px; }
.shop-types button { flex: 0 0 auto; border: 0; background: transparent; color: #645545; font: inherit; font-size: 13px; padding: 12px 0; min-height: 48px; cursor: pointer; border-bottom: 2px solid transparent; }
.shop-types button[aria-pressed="true"] { color: #30271f; border-bottom-color: #30271f; }
.shop-types button span { font-size: 10px; margin-left: 5px; }
.shop-fields { display: grid; gap: 15px; margin-top: 22px; }
.shop-fields label { display: grid; gap: 6px; font-size: 11px; letter-spacing: .03em; min-width: 0; }
.shop-fields input, .shop-fields select { width: 100%; min-height: 48px; border: 1px solid #b8a995; border-radius: 0; padding: 11px 13px; background: transparent; color: #30271f; font: inherit; font-size: 16px; }
.shop-fields input::placeholder { color: #786955; }
.shop-fields input:focus-visible, .shop-fields select:focus-visible, .shop-card summary:focus-visible { outline: 2px solid #645545; outline-offset: 4px; }
.shop-result-line { display: flex; justify-content: space-between; gap: 18px; padding-block: 24px; font-size: 11px; color: #645545; }
.shop-result-line p { margin: 0; }
.shop-grid { display: grid; gap: 34px 16px; align-items: start; }
.shop-card { min-width: 0; scroll-margin-top: 24px; }
.shop-card summary { cursor: pointer; list-style: none; }
.shop-card summary::-webkit-details-marker { display: none; }
.shop-card summary::marker { content: ''; }
.shop-product-link { display: block; text-decoration: none; }
.shop-card-image { position: relative; overflow: hidden; background: #e8dfd2; aspect-ratio: 3 / 2; }
.shop-card-image img { width: 100%; height: 100%; object-fit: contain; transition: transform .4s ease; }
.shop-card--filter .shop-card-image img { object-fit: cover; }
.shop-badge { position: absolute; left: 10px; bottom: 10px; background: #f5f1e9; padding: 4px 8px; font-size: 9px; letter-spacing: .04em; }
.shop-card-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 15px; }
.shop-card-heading h3 { font-size: 28px; line-height: 1.06; }
.shop-card-heading > span { font-size: 19px; }
.shop-card .shop-card-meta { color: #645545; font-size: 11px; margin: 8px 0; }
.shop-card-action { font-size: 11px; border-bottom: 1px solid #b8a995; padding-bottom: 3px; }
.shop-card-detail { padding-top: 24px; font-size: 14px; }
.shop-card-detail .catalog-link { font-size: 11px; gap: 12px; }
.shop-concept-note { font-size: 12px; line-height: 1.7; color: #645545; }
.shop-button { display: inline-flex; align-items: center; justify-content: center; gap: 32px; min-height: 48px; padding: 13px 26px; font: inherit; font-size: 13px; color: #30271f; background: transparent; border: 1px solid #79654e; cursor: pointer; }
.shop-button:hover { background: #30271f; color: #fff4e3; }
.shop-more { display: flex; justify-content: center; margin-block: 42px 28px; }
.shop-collection-note { margin: 0 auto !important; max-width: 660px; text-align: center; font-size: 12px; color: #645545; }
.shop-empty { text-align: center; padding-block: 55px; }
.shop-empty > p { margin-block: 20px; font-size: 14px; }
.shop-endnote { padding-block: 68px 78px; border-top: 1px solid #cfc3b5; }
.shop-endnote > p:not(.catalog-eyebrow) { font: 54px/.98 'Cormorant Garamond', Georgia, serif; letter-spacing: -.04em; margin-block: 25px; }
.shop-dialog { width: min(1120px, calc(100% - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 0; background: #f5f1e9; color: #30271f; overflow: auto; }
.shop-dialog::backdrop { background: rgba(25,19,14,.78); }
.shop-dialog:not([open]) { display: none; }
.shop-dialog-close { position: sticky; float: right; top: 12px; margin: 12px 12px -60px 0; z-index: 2; display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #b8a995; border-radius: 50%; background: #f5f1e9; color: #30271f; font: 30px/1 'Jost', sans-serif; cursor: pointer; }
.shop-dialog-layout { display: grid; }
.shop-dialog-visual { background: #e8dfd2; }
.shop-dialog-visual img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; }
.shop-dialog-copy { padding: 30px 24px; }
.shop-dialog-copy h2 { font-size: clamp(40px, 7vw, 64px); margin-block: 20px; }
.shop-dialog-copy > p[data-shop-detail-story] { font-size: 15px; margin-block: 24px; }
.shop-detail-number { font-size: 11px; letter-spacing: .08em; }
.shop-dialog-copy .catalog-link { display: flex; margin-top: 14px; gap: 20px; }
body.shop-dialog-open { overflow: hidden; }
@media (min-width: 370px) {
  .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shop-card-heading { gap: 5px; }
  .shop-card-heading h3 { font-size: 24px; }
  .shop-card-heading > span { font-size: 15px; }
}
@media (min-width: 600px) {
  .shop-fields { grid-template-columns: minmax(0, 1fr) minmax(200px, .65fr); gap: 24px; }
  .shop-card-heading h3 { font-size: 30px; }
  .shop-card-image { aspect-ratio: 3 / 2; }
}
@media (min-width: 900px) {
  .shop-hero .scene-image { height: 100%; }
  .shop-hero { min-height: 670px; }
  .shop-collection { padding-block: 70px 55px; }
  .shop-intro { grid-template-columns: 1fr 380px; align-items: end; margin-bottom: 42px; }
  .shop-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 28px; }
  .shop-fields { grid-template-columns: 1fr 320px; }
  .shop-types { gap: 36px; }
  .shop-types button { font-size: 15px; }
  .shop-badge { left: 16px; bottom: 16px; }
  .shop-dialog-layout { grid-template-columns: 1.2fr 1fr; align-items: center; }
  .shop-dialog-copy { padding: 50px 38px; }
  .shop-endnote { display: grid; grid-template-columns: 1fr 2fr 1fr; align-items: end; gap: 35px; padding-block: 80px; }
  .shop-endnote > p:not(.catalog-eyebrow) { font-size: 70px; margin: 0; }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .shop-card summary:hover img, .shop-product-link:hover img { transform: scale(1.025); }
}
@media (prefers-reduced-motion: reduce) { .shop-card-image img { transition: none; } }
