/* Bookcase pages: stacked shelves instead of sideways-scrolling rows.
   Loaded after css/site.css. Reuses the existing bookcase look. */
.case{max-width:680px;margin-inline:auto}
.bc-scroll{overflow:visible;padding-top:22px}
.bc-row{width:auto;min-width:0;flex-wrap:wrap;justify-content:flex-start;row-gap:46px;padding:0 14px 10px}
.bc-row::before{display:none}
.bk,.filler,.decor{position:relative}
/* one plank segment under every item, so each wrapped line is its own shelf */
.bk::after,.filler::after,.decor::after{content:"";position:absolute;left:-13px;right:-13px;top:var(--h);height:15px;border-radius:2px;
  background:linear-gradient(#C8A978,#A6875A);box-shadow:0 7px 10px -4px rgba(60,40,20,.45);z-index:0;pointer-events:none}
.bk .cover,.bk .tag{z-index:1}
.bk .tag{position:relative}
.scroll-hint{display:none!important}
.case-foot{margin:24px auto 0;max-width:680px;color:var(--ink-2)}
@media (max-width:520px){.bc-row{justify-content:center;column-gap:18px}}
/* header dropdowns */
.nav .dd{position:relative}
.nav .dd-t{font:600 14px/1 var(--body);color:var(--ink);background:none;border:0;border-bottom:1.5px solid transparent;padding:6px 16px 6px 0;cursor:pointer;position:relative}
.nav .dd-t::after{content:"";position:absolute;right:2px;top:50%;width:5px;height:5px;margin-top:-4px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.nav .dd-t:hover,.nav .dd.is-current .dd-t{border-color:var(--gold)}
.nav .dd-menu a{display:block;white-space:nowrap}
@media (min-width:861px){
  .nav{gap:20px}
  .nav .dd-menu{display:none;position:absolute;left:-14px;top:100%;min-width:230px;padding:8px;background:var(--cream);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 30px rgba(60,40,20,.16);z-index:50}
  .nav .dd:hover .dd-menu,.nav .dd:focus-within .dd-menu,.nav .dd.open .dd-menu{display:block}
  .nav .dd-menu a{padding:11px 12px;border-radius:8px;border:0;font-size:14px}
  .nav .dd-menu a:hover{background:var(--cashmere)}
  .nav .dd-menu a[aria-current="page"]{color:var(--gold-ink);background:var(--paper)}
}
@media (min-width:861px) and (max-width:1040px){.nav{gap:15px}.nav a,.nav .dd-t{font-size:13.5px}}
@media (max-width:860px){
  .nav .dd-t{display:block;width:100%;text-align:left;padding:14px 0 6px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);border-bottom:0;cursor:default}
  .nav .dd-t::after{display:none}
  .nav .dd-menu a{padding-left:14px}
}
/* shop hub: each tile is a little bookcase */
.hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:26px}
.hub-card{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:14px 14px 20px;
  box-shadow:0 10px 26px rgba(60,40,20,.10);transition:transform .25s ease,box-shadow .25s ease}
.hub-card:hover,.hub-card:focus-visible{transform:translateY(-5px);box-shadow:0 18px 36px rgba(60,40,20,.18)}
.hub-case{display:block;border-radius:12px;padding:20px 14px 0;background:linear-gradient(180deg,#E9DEC3,#DCCBA5);box-shadow:inset 0 6px 14px rgba(60,40,20,.18),inset 0 0 0 5px #C4AE80}
.hub-books{display:flex;align-items:flex-end;justify-content:center;gap:9px;height:128px;position:relative;padding-bottom:0}
.hub-books::after{content:"";position:absolute;left:-14px;right:-14px;bottom:-14px;height:14px;background:linear-gradient(#C8A978,#A6875A);border-radius:2px;box-shadow:0 5px 8px -3px rgba(60,40,20,.45)}
.hub-books .mb{height:118px;width:auto;max-width:31%;object-fit:cover;border-radius:2px 4px 4px 2px;box-shadow:0 4px 8px rgba(30,20,10,.3);position:relative;z-index:1;background:#fff}
.hub-books .mb:nth-child(2){height:126px}
.hub-case::after{content:"";display:block;height:14px}
.hub-title{font:600 20px/1.2 var(--display);color:var(--pine);margin:20px 6px 4px}
.hub-sub{font:500 14px/1.5 var(--body);color:var(--ink-2);margin:0 6px;flex:1}
.hub-go{font:700 13px/1 var(--body);color:var(--gold-ink);margin:14px 6px 0}
.hub-card:hover .hub-go{text-decoration:underline}