* { box-sizing:border-box; }
html, body { margin:0; height:100%; background:#2a0c18; }
body { font:17px/1.55 Georgia, "Iowan Old Style", serif; color:#2a1218; }
a { color:inherit; }
.spine {
  position:fixed; left:0; top:0; bottom:0; width:52px; background:#14060c; color:#f3d7a1;
  writing-mode:vertical-rl; transform:rotate(180deg);
  display:flex; align-items:center; justify-content:center; gap:18px;
  letter-spacing:.18em; font:13px/1 "Avenir Next", sans-serif; text-transform:uppercase;
}
.spine a { color:#f3d7a1; text-decoration:none; }
.spine a.on { color:#fff; }
.track { margin-left:52px; display:flex; overflow-x:auto; height:100vh; scroll-snap-type:x mandatory; }
.stall {
  flex:0 0 76vw; scroll-snap-align:start; background:#f6efe4;
  margin:16px 10px; padding:26px 28px 32px; overflow:auto;
}
.stall h1 { margin:8px 0 12px; font-weight:560; font-size:clamp(1.8rem, 3vw, 2.7rem); letter-spacing:-.03em; line-height:1.08; }
.stall h2 { margin:20px 0 8px; font-size:1.25rem; }
.stall p { margin:0 0 12px; }
.stall img { width:100%; height:250px; object-fit:cover; display:block; margin:0 0 14px; }
.tag { margin:0; font:12px/1 "Avenir Next", sans-serif; letter-spacing:.16em; text-transform:uppercase; color:#8a3d55; }
@media (max-width:800px) {
  .spine { position:static; width:auto; height:auto; writing-mode:horizontal-tb; transform:none; flex-wrap:wrap; padding:10px 12px; gap:10px; }
  .track { margin:0; display:block; height:auto; }
  .stall { margin:12px; }
}