/* P7 the product slot: cover on a mat, price, particulars, supplements, preview sheets, price note. */
.product .standfirst { margin-top: 12px; }
.pr-head { margin-bottom: 20px; }
.mat { background: var(--newsprint-deep); padding: 28px 14%; display: grid; place-items: center; }
.cover, .sh-img img { background: var(--newsprint); outline: 1px solid rgb(23 21 18 / 0.12); outline-offset: -1px; box-shadow: 0 8px 24px rgb(23 21 18 / 0.1); }
.cover { width: 100%; max-width: 400px; aspect-ratio: 480 / 621; height: auto; }
.pr-price { margin-top: 20px; }
.price { font-size: var(--fs-fig); font-weight: 800; line-height: 1; color: var(--ledger-red); font-variation-settings: "opsz" 72; }
.price-s { font-style: italic; margin: 8px 0 18px; max-width: 34ch; }
.pr-part { margin-top: 36px; }
.pr-part h3 { margin-bottom: 14px; }
.parts > div { display: grid; grid-template-columns: 6.25rem 1fr; gap: 12px; padding: 10px 0; border-top: 1px solid var(--rule); line-height: 1.4; }
.parts > div:last-child { border-bottom: 1px solid var(--rule); }
.parts dt { font-weight: 600; font-size: var(--fs-label); letter-spacing: 0.12em; color: var(--ink-soft); padding-top: 0.2em; }
.supp { counter-reset: s; }
.supp li { counter-increment: s; position: relative; padding: 11px 0 11px 2.5rem; border-top: 1px solid var(--rule); line-height: 1.4; }
.supp li:last-child { border-bottom: 1px solid var(--rule); }
.supp li::before { content: counter(s); position: absolute; left: 0; top: 7px; width: 1.75rem; text-align: right; color: var(--ledger-red); font-weight: 800; font-size: 1.5rem; font-variant-numeric: tabular-nums lining-nums; line-height: 1.2; }
.pr-turn { margin-top: 48px; }
.pr-turn h3 { margin-bottom: 16px; }
.sheets { display: grid; grid-template-columns: 1fr 1fr; gap: 20px var(--gap); }
.sheet { display: block; width: 100%; padding: 0; background: none; border: 0; text-align: left; }
.sh-img { position: relative; display: block; aspect-ratio: 720 / 932; }
.sh-img img { width: 100%; height: 100%; object-fit: cover; }
.sh-cap { display: block; margin-top: 8px; font-style: italic; font-size: var(--fs-cap); line-height: 1.3; }
.pr-turn .caption { margin-top: 18px; }
.pr-note { margin-top: 40px; padding: 18px 18px; background: var(--newsprint-deep); border: 1px solid var(--ink); font-style: italic; font-size: 1rem; line-height: 1.45; }
.miss img { display: none; }
.miss::after, .mat.miss::after {
  content: "Page to come"; display: grid; place-items: center; width: 100%; aspect-ratio: 720 / 932; border: 1px solid var(--rule);
  background: var(--newsprint); font-style: italic; color: var(--ink-soft); font-size: var(--fs-cap);
}
.mat.miss::after { max-width: 400px; aspect-ratio: 480 / 621; }
@media (max-width: 767px) {
  .parts > div:nth-child(4), .parts > div:nth-child(5), .parts > div:nth-child(6) { display: none; }
  .mat { padding: 20px 18%; }
  .pr-turn { margin-top: 36px; }
  .pr-note { margin-top: 28px; }
}
@media (hover: hover) and (pointer: fine) { .sheet:hover .sh-cap { text-decoration: underline; text-decoration-color: var(--ink); text-underline-offset: 3px; } }
.sheet:active .sh-img img { opacity: 0.85; }
@media (min-width: 1024px) {
  .product { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: start; }
  .product > * { grid-column: 1 / -1; }
  .pr-head { margin-bottom: 48px; }
  .pr-cover { grid-column: 1 / 5; grid-row: 3; }
  .mat { padding: 36px; }
  .pr-part { grid-column: 5 / 9; grid-row: 3; margin-top: 0; position: relative; padding-left: 0; }
  .pr-supp { grid-column: 9 / 13; }
  .pr-supp .col-rule { left: calc(var(--gap) / -2); }
  .pr-part:not(.pr-supp) { padding-left: 12px; }
  .pr-supp { padding-left: 12px; }
  .pr-turn { grid-row: 4; margin-top: 80px; }
  .sheets { grid-template-columns: repeat(4, 1fr); gap: var(--gap); }
  .pr-note { grid-column: 3 / 11; text-align: center; margin-top: 64px; font-size: 1.125rem; padding: 24px 32px; }
}
