/* Museum store, at the bottom of the homepage (inside .store-page). Builds on style.css; one wooden board per row. */
.store-page main{background:var(--paper)}
.store-top{padding-block:clamp(40px,6vw,80px) 0;border-bottom:1px solid var(--rule)}
.store-top>.wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,4vw,56px);align-items:end}
.store-top h2{font-size:clamp(38px,5.4vw,68px);line-height:1.02}
.store-top p:not(.eyebrow){margin:16px 0 0;max-width:60ch;color:var(--ink-2);font-size:18px}
.till{display:flex;flex-direction:column;align-items:flex-end;gap:10px;padding:18px 20px;background:var(--card);border:1px solid var(--rule-2)}
.till .btn{min-width:200px}
.linkish{background:none;border:0;padding:0;font:400 15px/1.3 var(--body);color:var(--ink-2);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.linkish:hover{color:var(--barn)}
.aisles{margin-top:clamp(28px,4vw,44px);border-top:1px solid var(--rule-2)}
.aisles .wrap{display:flex;flex-wrap:wrap;gap:4px 26px;padding-block:14px}
.aisles a{font:400 14px/1.4 var(--body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--ink);padding:6px 0;border-bottom:1px solid transparent}
.aisles a:hover{border-bottom-color:currentColor}

.aisle{padding-block:clamp(48px,7vw,96px) clamp(20px,3vw,40px);scroll-margin-top:60px}
.aisle+.aisle{border-top:1px solid var(--rule-2)}
.aisle-head{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:8px 28px;align-items:baseline}
.aisle-head h3{font-size:clamp(30px,3.6vw,46px);line-height:1.05}
.aisle-head p{margin:0;color:var(--ink-2);font-size:17px;max-width:62ch}

.store-page .shelf{--g:clamp(22px,3vw,44px);--pich:clamp(180px,17vw,230px);grid-template-columns:repeat(4,minmax(0,1fr));row-gap:clamp(56px,6vw,80px)}
.store-page .shelf::before{display:none}
.store-page .item{text-align:left;align-items:stretch}
.store-page .item .pic{height:var(--pich);margin-bottom:30px}
.store-page .item .pic::after{display:block;left:calc(var(--g) / -2);right:calc(var(--g) / -2)}
.store-page .item:first-child .pic::after{left:-12px}
.store-page .item .pic>img{max-width:92%}
.store-page .item .pic>img.plain{max-width:86%}
.store-page .item .pic>img.print{max-width:84%}
.store-page .item h4{font:400 22px/1.1 var(--fell);margin:6px 0 0}
.store-page .item h4 small{font:400 15px/1 var(--body);color:var(--muted)}
.store-page .item p{font-size:16px;line-height:1.4;margin:6px 0 0}
.store-page .item p.by{font-style:italic;margin-top:2px}
.item .note{color:var(--barn)!important}
.item .sku{font:400 13px/1.4 var(--type)!important;color:var(--muted)!important;margin-top:10px!important}
.card-list{margin:10px 0 0;padding-left:20px;font-size:15px;line-height:1.45;color:var(--ink-2);columns:2;column-gap:24px}
.buyrow{margin-top:auto;padding-top:16px;display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 14px}
.store-page .item .price{margin-top:0}
.buy{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;flex:1 1 180px}
.buy .opt{flex-basis:100%;font:400 12.5px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:-4px}
.buy select{flex:1 1 100%;min-height:46px;padding:0 12px;font:400 16px/1 var(--body);color:var(--ink);background:#fbf7ec;border:1.5px solid var(--ink-2);border-radius:0}
.buy .add{flex:1 1 auto;min-height:46px}

/* postcards: six cards side by side on one long board */
.item.wide{grid-column:span 3}
.pic.cards{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;align-items:end!important;padding-inline:4px}
.pic.cards img{width:100%;height:auto;border:4px solid #f9f5ea;box-shadow:0 6px 10px -4px rgba(0,0,0,.4);position:relative;z-index:1}
.pic.cards img:nth-child(odd){transform:rotate(-2deg)}
.pic.cards img:nth-child(even){transform:rotate(1.5deg) translateY(-6px)}

.consign{padding-block:clamp(44px,6vw,72px);border-top:1px solid var(--rule)}
.consign .wrap{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:8px 28px;align-items:baseline}
.consign h3{font-size:clamp(26px,3vw,36px)}
.consign p{margin:0;font-size:17px;color:var(--ink-2)}

.cart-float{position:fixed;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));z-index:40}
.cart-float .btn{box-shadow:0 10px 22px -10px rgba(40,25,10,.7)}

@media (max-width:1100px){
  .store-page .shelf{grid-template-columns:repeat(3,minmax(0,1fr))}
  .item.wide{grid-column:span 2}
  .pic.cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .store-page .item.wide .pic{height:auto;min-height:var(--pich)}
}
@media (max-width:760px){
  .store-top>.wrap,.aisle-head,.consign .wrap{grid-template-columns:1fr}
  .till{align-items:stretch}
  .till .btn{min-width:0}
  .store-page .shelf{grid-template-columns:repeat(2,minmax(0,1fr));--g:18px;--pich:170px}
  .item.wide{grid-column:1/-1}
  .card-list{columns:1}
  .buy{flex-basis:100%}
}
@media (max-width:420px){
  .store-page .shelf{grid-template-columns:1fr;--pich:210px}
  .store-page .item .pic::after{left:-12px!important;right:-12px!important}
}
.store-page .item p{max-width:none}
.store-page .item.wide>p{max-width:62ch}
.store-page section.store-top{padding-top:clamp(36px,5vw,64px)}
.store-page section.aisle{padding-top:clamp(44px,5vw,72px);padding-bottom:clamp(28px,3vw,44px)}

/* on the homepage: the store starts with a rule, like the other sections */
.store-page .store-top{border-top:1px solid var(--rule)}
.consign h3{font:400 clamp(26px,3vw,36px)/1.1 var(--fell)}