/* D3: a gathered, bound edge and visible folded sheets on both closed covers.
   D2's scale, contact shadow, open spread and reader are retained.
   Closed-cover rotations are reduced by 75% for a nearly straight presentation. */
#brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-volume {
  transform:scale(1.08) rotateX(1deg) rotateY(-2deg) rotateZ(-.2deg);
}
#brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-volume::before {
  inset:1px -6px -4px 0;
  background:#fcfcf9;
  box-shadow:0 1px 0 rgba(20,24,31,.16);
}
#brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-volume::after {
  inset:3px -5px -5px 0;
  background:#f9f9f5;
  box-shadow:0 1px 0 rgba(20,24,31,.15);
}
/* The leaves meet at the fold, rather than looking like offset photo prints. */
#brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-sheets::before {
  content:"";
  position:absolute;
  left:-5px;
  top:0;
  bottom:-5px;
  width:7px;
  z-index:2;
  border-radius:4px 0 0 4px;
  background:linear-gradient(to right,#e0e1de 0,#fafaf7 28%,#fdfdfa 55%,#d9dad7 100%);
  box-shadow:inset 1px 0 0 rgba(20,24,31,.12);
  pointer-events:none;
}
/* Fine fore-edge lines suggest the thin folded stock of a twelve-page brochure. */
#brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-sheets::after {
  content:"";
  position:absolute;
  top:2px;
  bottom:-4px;
  right:-6px;
  width:6px;
  z-index:0;
  background:repeating-linear-gradient(to right,#fdfdfa 0 1.5px,#dfe0db 1.5px 2px);
  pointer-events:none;
}
#brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-leaf::before {
  width:17px;
  background:linear-gradient(to right,rgba(20,24,31,.13) 0,rgba(255,255,255,.16) 3px,rgba(20,24,31,.025) 6px,rgba(20,24,31,.095) 8px,rgba(255,255,255,.06) 9px,transparent 17px);
}
/* Paper below the cover converges at the binding and is exposed at the fore-edge. */
#brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-leaf::after {
  content:"";
  position:absolute;
  left:1px;
  right:-5px;
  top:100%;
  height:5px;
  z-index:0;
  background:repeating-linear-gradient(to bottom,#fdfdfa 0 1.5px,#dedfd9 1.5px 2px);
  clip-path:polygon(0 0,100% 0,100% 100%,0 65%);
  pointer-events:none;
}
@media(max-width:700px) {
  #brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-volume {
    transform:scale(.985) rotateX(.75deg) rotateY(-1.75deg) rotateZ(-.15deg);
  }
  #brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-volume::before { inset:1px -4px -3px 0; }
  #brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-volume::after { inset:2px -3px -4px 0; }
  #brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-sheets::before { left:-3px; width:5px; bottom:-4px; border-radius:3px 0 0 3px; }
  #brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-sheets::after { right:-4px; width:4px; bottom:-3px; }
  #brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-leaf::before { width:12px; background:linear-gradient(to right,rgba(20,24,31,.13),rgba(255,255,255,.14) 2px,rgba(20,24,31,.025) 4px,rgba(20,24,31,.085) 6px,transparent 12px); }
  #brochure .work-book:is([data-pages="1"],[data-pages="12"]) .work-book-leaf::after { right:-3px; height:4px; }
}