/* Guide-specific print overrides only
   All shared styles live in ../guide.css */

/* This guide needs SCALE=0.94 when regenerating (not the 0.97 default) —
   content is denser than other guides even after tightening below.
   node generate-pdf.js ../floral-foam/floral-foam.html 0.94 --cmyk */

/* Overlay wrappers track the image's effective width so SVG callouts stay aligned */
.illustration-wrapper--with-overlay { max-width: 180px; }

@media print {
  /* Inspiration image now sits in a 1-of-3 grid column — fill it fully */
  .illustration--inspiration { max-width: 100%; }

  /* Front page now carries Consider Your Arrangement Type + Prepare Foam and
     Plates — tighten spacing so it still holds to 1 page */
  .guide-page--front .guide-page__content { gap: 0.22rem; }
  .guide-page--front .guide-section { padding-top: 0.15rem; }
  .guide-page--front .guide-page__tagline { padding-top: 0.22rem; font-size: 0.78rem; }
  .guide-page--front .guide-section__intro { font-size: 0.72rem; margin-bottom: 0.28rem; line-height: 1.32; }
  .guide-page--front .guide-section__list { margin: 0.15rem 0 0.15rem 0.85rem; gap: 0.08rem; }
  .guide-page--front .guide-section__list li { font-size: 0.72rem; line-height: 1.3; }
  .guide-page--front .text-columns--2 { gap: 0.6rem; }
  .guide-page--front .materials__grid { gap: 0.12rem 0.22rem; }
  .guide-page--front .material-pill { font-size: 0.63rem; padding: 0.06rem 0.38rem; }
  .guide-page--front .step-grid { gap: 0.8rem; }
  .guide-page--front .step__text { font-size: 0.74rem; line-height: 1.32; }

  /* "Before You Begin" reads squished against the images below it — give it
     more breathing room (larger type, more line-height, more space after
     the general-tips list) and recover the vertical budget by trimming
     Prepare Foam and Plates' image row slightly. */
  #type-title ~ .guide-section__intro,
  #type-title ~ .text-columns--2 .guide-section__intro { font-size: 0.74rem; line-height: 1.36; margin-bottom: 0.3rem; }
  #type-title ~ .guide-section__list { margin: 0.2rem 0 0.18rem 0.85rem; gap: 0.1rem; }
  #type-title ~ .guide-section__list li { font-size: 0.74rem; line-height: 1.34; }

  .guide-page--back .guide-page__content  { gap: 0.5rem; }
  .guide-page--back .flower-grid          { gap: 0.45rem; }
  .guide-page--back .flower-tip           { font-size: 0.76rem; line-height: 1.4; }
  .guide-page--back .flower-tip--numbered { gap: 0.35rem; }
  .guide-page--back .flower-care          { padding-top: 0.4rem; }

  /* Prepare Foam and Plates (front) + Arrange Stems / Final Touches (back) —
     images are square PNGs/SVGs, so giving the wrapper aspect-ratio:1/1 and
     letting it fill the row's flex-allocated height (instead of object-fit
     letterboxing) keeps the SVG callout overlays pixel-aligned to the photo
     underneath while still maximizing size. min-height nudges each row
     taller to use leftover page space, tuned to the max that holds 2 pages. */
  .guide-page--front .step-grid > .step { min-height: 245px; }
  .guide-page--back .flower-grid > .flower-tip--numbered { min-height: 390px; }

  .guide-page--front .step-grid .illustration-wrapper,
  .guide-page--back .flower-grid .illustration-wrapper {
    flex: 1 1 0;
    min-height: 0;
    aspect-ratio: 1 / 1;
    height: 100%;
    width: auto;
    max-width: 220px;
    margin: 0 auto;
    display: flex;
  }
  .guide-page--front .step-grid .illustration-wrapper .illustration,
  .guide-page--back .flower-grid .illustration-wrapper .illustration {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }

  /* "As you finish up" tip — force it onto a single line rather than wrapping */
  .tips-callout__text--oneline { white-space: nowrap; }
}