/* =========================================================================
   print.css — applied only when printing / exporting to PDF.
   (index.html loads this with media="print")

   "Export PDF" is the browser's own print-to-PDF, so this file is what
   turns the moodboard into something a vendor can be handed on paper:
   navigation and buttons gone, one section per page, and nothing split
   across a page boundary mid-photo.
   ========================================================================= */

@page {
  size: A4;
  margin: 14mm 12mm;
}

@media print {
  html, body { background: #fff !important; }

  html { scroll-behavior: auto; }

  .topbar, .no-print, .skip-link, .nav-toggle { display: none !important; }

  .hero, .section-inner { max-width: 100% !important; padding: 0 0 18px 0 !important; }
  .section-inner { scroll-margin-top: 0; }

  /* Long sections may flow onto another page, but a card or a photo must
     never be sliced in half by the break. */
  .section-inner { page-break-inside: auto; break-inside: auto; }
  .gallery-item, .info-card, .style-card, .shot-group-card, .palette-chip,
  .mini-gallery-item, .swatch-row {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  section, .section-tint { page-break-after: always; break-after: page; }
  footer, .section-tint:last-of-type, section:last-of-type { page-break-after: auto; break-after: auto; }

  /* On screen these are tall portrait crops; on A4 that wastes most of the
     page, so they print shorter and wider. Grid only — the hero is a feature
     image and prints at its own proportions, uncropped. */
  .gallery-grid .gallery-item img, .gallery-grid .img-placeholder {
    aspect-ratio: 4 / 3 !important;
    max-height: 82mm;
  }
  .hero-image-wrap .gallery-item img {
    aspect-ratio: auto !important;
    width: auto !important;
    height: auto !important;
    max-width: 100%;
    max-height: 96mm;
  }
  .card-img { max-height: 60mm; }

  /* The shot list collapses on screen; in a PDF it must always be there. */
  .shotlist-grid { display: grid !important; }
  .shotlist-toggle, .shotlist-closed-msg { display: none !important; }

  a[href^="#"]::after { content: ""; }

  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}