/*
 * Book Summary template — scoped overrides.
 * Loaded AFTER webflow-page-book-summary-template.css so these rules win.
 * Keep everything scoped under .section-books or .section-similiar-books.
 *
 * Root cause of every rule in this file:
 * The page CSS targets `.author-desc p` and `.book-small-summary p` and
 * `.strategy-box-item` — but production's rich text is FLAT text with <br>
 * line breaks (no <p> wrappers) because Webflow's CMS stored it that way.
 * Our RichTextBlock emits proper <p> tags, so the page's `p`-scoped rules
 * fire locally and override the inherited body styles that production
 * actually gets. These rules un-do that override so both render identically.
 */

/* Author bio — make the emitted <p> inherit the parent's typography so it
   matches production (16px, rgb(12,8,53), weight 400, line-height 1.5). */
.section-books .author-desc p,
.section-books .author-desc .payload-richtext p {
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  margin: 0;
}

/* Book short summary — same issue as author-desc. */
.section-books .book-small-summary p,
.section-books .book-small-summary .payload-richtext p {
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
  margin-bottom: 0;
}

/* Strategy box pill text — production color is rgb(12, 8, 53) (brand ink),
   not the default link blue. Pin explicitly. */
.section-books .strategy-box-item,
.section-books .strategy-box-item > div {
  color: rgb(12, 8, 53);
}

/* Similar Books — Next.js Image renders with large intrinsic width attributes
   that can overflow the grid cell on mobile. Force the image to fit the
   card's thumbnail area (production only sets height: 9.11956rem and lets
   width auto from aspect-ratio — we replicate that here, with max-width as
   an extra safety net). Also cap the book-box width so the grid cell itself
   never exceeds the container. */
.section-similiar-books .book-item,
.section-similiar-books .book-box,
.section-similiar-books .book-box_thumbnail,
.section-similiar-books .book-box_content {
  max-width: 100%;
  min-width: 0;
}
.section-similiar-books .book-image {
  width: auto !important;
  max-width: 100%;
  height: 9.11956rem;
  object-fit: contain;
}
/* Next's Image wraps the <img> — make its generated span shrink too. */
.section-similiar-books .book-box_thumbnail > span {
  max-width: 100%;
}

/* Similar book card links — production shows the title in the brand ink
   color and the category-desc in gray, with NO underline. In local these
   render as default blue-underlined browser links because `a:link` has
   higher specificity than the webflow-styleguide's generic `a { color:
   inherit }` rule. Pin both explicitly. */
.section-similiar-books a.book-box-title,
.section-similiar-books a.book-box-title:link,
.section-similiar-books a.book-box-title:visited,
.section-similiar-books a.book-box-title:hover,
.section-similiar-books a.book-box-title:active {
  color: rgb(12, 8, 53);
  text-decoration: none;
}
.section-similiar-books a.book-box-desc,
.section-similiar-books a.book-box-desc:link,
.section-similiar-books a.book-box-desc:visited,
.section-similiar-books a.book-box-desc:hover,
.section-similiar-books a.book-box-desc:active {
  text-decoration: none;
}