/* v57: preserve the larger tablet book, with clearance for its transformed edges. */
@media screen and (min-width: 900px) and (max-width: 1500px) and (orientation: landscape) and (min-height: 501px) and (pointer: coarse) {
  body[data-page="index"] main .cover-grid {
    grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.16fr);
    gap: clamp(18px, 2.5vw, 38px);
    align-items: center;
  }
  body[data-page="index"] main .cover-portrait.hero-magazine {
    width: 100%;
    max-width: none;
    margin: 0;
    align-self: center;
  }
  body[data-page="index"] main .hero-magazine .magazine-stage {
    aspect-ratio: 1.04;
    overflow: visible;
  }
  body[data-page="index"] main .hero-magazine .magazine-book {
    left: 0;
    top: 11%;
    width: 100%;
    --page-w: 50cqw;
  }
  body[data-page="index"] main .cover-copy { min-width: 0; }
}

/* Keep printed slices aligned with the existing 98%-wide phone book. */
@media screen and (max-width: 760px) {
  body[data-page="index"] main .hero-magazine .magazine-book { --page-w: 49cqw; }
}
/* Compact landscape phones remain phones after rotation. Tablet windows
   taller than 500px keep their caption and feature-reader control. */
@media screen and (orientation: landscape) and (max-width: 1000px) and (max-height: 500px) {
  html body[data-page="index"] main .hero-magazine > .magazine-caption,
  html body[data-page="index"] main .hero-magazine .magazine-controls {
    display: none !important;
    visibility: hidden !important;
  }
}

/* Reserve a small buffer below the moving paper on every captioned layout. */
body[data-page="index"] main .hero-magazine > .magazine-caption {
  margin-block-start: 12px;
}
