/* Jono Books: an additional layer over the existing Twenty Twenty-Five CSS. */
:root {
  --jb-polish-ink: #23353d;
  --jb-polish-secondary: #4a6066;
  --jb-polish-ocean: #176c79;
}

/* Core title hierarchy: the first three words carry the title; the rest
   becomes an actual visual subtitle rather than an equally bold second line. */
.jb-book-title-split .jb-book-title-main {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1em;
  font-weight: 700;
  line-height: 1.17;
  letter-spacing: -0.025em;
  color: var(--jb-polish-ink);
}
.jb-book-title-split .jb-book-title-subtitle {
  display: block;
  margin-top: .3em;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: .68em;
  font-weight: 400;
  line-height: 1.34;
  letter-spacing: 0;
  color: var(--jb-polish-secondary);
  text-wrap: pretty;
}
.jb-book-title-split a,
.jb-book-title-split a:hover { text-decoration: none !important; }
.jb-book-title-split a:hover .jb-book-title-main,
.jb-book-title-split a:hover .jb-book-title-subtitle { color: var(--jb-polish-ocean); }

/* Archive/catalogue: keep the two cards together instead of stretching each
   across half an ultra-wide display. */
body.home .woocommerce ul.products,
body.post-type-archive-product .woocommerce ul.products,
body.woocommerce-shop .woocommerce ul.products,
.wp-block-woocommerce-product-collection ul.wc-block-product-template,
.wp-block-woocommerce-product-collection ul.wp-block-post-template {
  max-width: 1140px;
  margin-right: auto !important;
  margin-left: auto !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title.jb-book-title-split,
.woocommerce ul.products li.product .wp-block-post-title.jb-book-title-split,
.wp-block-woocommerce-product-collection .wp-block-post-title.jb-book-title-split,
.wc-block-grid__product-title.jb-book-title-split {
  font-size: clamp(1.28rem, 1.6vw, 1.62rem) !important;
  line-height: 1.18 !important;
  margin: 0 auto 10px;
  max-width: 27ch;
}
.woocommerce ul.products li.product .jb-book-title-subtitle,
.wp-block-woocommerce-product-collection .jb-book-title-subtitle,
.wc-block-grid__product-title .jb-book-title-subtitle { font-size: .68em; }

/* A slightly smaller cover and less whitespace make the catalogue read like a
   bookshop, not giant software-product tiles. */
.woocommerce ul.products li.product img,
.wp-block-woocommerce-product-collection .wc-block-components-product-image img,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-image img,
.wc-block-grid__product-image img {
  max-height: 205px !important;
  margin-bottom: 14px !important;
}
.woocommerce ul.products li.product,
.wp-block-woocommerce-product-collection li.wc-block-product,
.wp-block-woocommerce-product-collection li.wp-block-post {
  padding: clamp(15px, 1.8vw, 22px) !important;
}
.woocommerce ul.products li.product .price,
.wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price {
  margin: 9px 0 12px !important;
}

/* These catalogue buttons go to the book page; they are not purchases. */
.woocommerce ul.products li.product a.button,
.wp-block-woocommerce-product-collection .wp-block-button__link {
  border-radius: 5px !important;
  padding: 10px 18px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

/* Single product: separate title from subtitle and improve paragraph contrast. */
body.single-product .woocommerce div.product .product_title.jb-book-title-split,
body.single-product h1.wp-block-post-title.jb-book-title-split,
body.single-product h1.wp-block-woocommerce-product-title.jb-book-title-split {
  font-size: clamp(1.72rem, 2.4vw, 2.3rem) !important;
  max-width: 25ch;
  margin-bottom: 12px !important;
  line-height: 1.12 !important;
}
body.single-product .jb-book-title-split .jb-book-title-subtitle {
  font-size: .64em;
  line-height: 1.28;
  margin-top: .25em;
}
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-Tabs-panel,
.woocommerce div.product .woocommerce-Tabs-panel p {
  color: var(--jb-polish-secondary);
  line-height: 1.58;
}
.woocommerce div.product .woocommerce-product-details__short-description {
  max-width: 65ch;
}
.woocommerce div.product form.cart .variations {
  margin-bottom: 9px;
}

/* Related-book cards must be wide enough to fit real book titles. */
.woocommerce div.product .related ul.products,
.woocommerce div.product .upsells ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 260px)) !important;
  gap: 18px !important;
  justify-content: start;
  max-width: none;
}
.woocommerce div.product .related ul.products li.product,
.woocommerce div.product .upsells ul.products li.product {
  box-sizing: border-box;
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  min-width: 0;
}
.woocommerce div.product .related ul.products li.product img,
.woocommerce div.product .upsells ul.products li.product img {
  max-height: 160px !important;
}
.woocommerce div.product .related .jb-book-title-split,
.woocommerce div.product .upsells .jb-book-title-split {
  font-size: 1.18rem !important;
  max-width: none;
}

@media (max-width: 699px) {
  .woocommerce ul.products li.product .woocommerce-loop-product__title.jb-book-title-split,
  .wp-block-woocommerce-product-collection .wp-block-post-title.jb-book-title-split {
    font-size: 1.18rem !important;
  }
  body.single-product .woocommerce div.product .product_title.jb-book-title-split,
  body.single-product h1.wp-block-post-title.jb-book-title-split {
    font-size: clamp(1.55rem, 6vw, 2rem) !important;
  }
  .woocommerce div.product .related ul.products,
  .woocommerce div.product .upsells ul.products {
    grid-template-columns: minmax(0, 1fr) !important;
    max-width: 280px;
  }
}

/* The full-width footer rule feels rather heavy beneath a two-book catalogue. */
.wp-site-blocks > footer .wp-block-separator,
footer.wp-block-template-part .wp-block-separator {
  width: min(420px, 85%) !important;
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-color: #cbd7d4 !important;
  opacity: .65;
}