.shelf{display:grid;grid-template-columns:1fr 1fr;gap:32px 48px;align-items:start}
.shelf .items{grid-template-columns:1fr}
.trio{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0;padding:0}
.trio figure{margin:0;display:flex;flex-direction:column}
.trio figure:last-child{grid-row:1/3}
.trio img{width:100%;aspect-ratio:1/1;object-fit:cover;border-bottom:6px solid var(--yellow)}
.trio figure:last-child img{aspect-ratio:auto;flex:1;min-height:0}
.trio figcaption{font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:15px;margin-top:8px}

.pair{display:grid;grid-template-columns:4fr 7fr;gap:48px;align-items:center}
.pair.flip{grid-template-columns:7fr 4fr}
.pair.flip .photo{order:2}
.pair .photo img{aspect-ratio:4/5;object-fit:cover}
.pair.wide .photo img{aspect-ratio:4/3}
.pair .items{grid-template-columns:1fr}
.pair p{margin:0 0 16px}
.pair .items{margin-bottom:20px}
.gift-note{border-left:4px solid var(--yellow);background:var(--black);color:#fff;padding:16px 18px;margin:0 0 20px}
.gift-note strong{font-family:Bitter,serif;color:var(--yellow)}
.gift-note a{color:#fff}

@media (max-width:900px){
  .shelf,.pair,.pair.flip{grid-template-columns:1fr;gap:24px}
  .pair.flip .photo{order:0}
  .pair .photo{max-width:420px}
}
@media (max-width:520px){
  .trio{gap:8px}
  .trio figcaption{font-size:13px}
}