/* Core Solutions (built by scripts/build-core-solutions.mjs). The pages reuse
   the HYDRAMEM, Standard Products and catalog stylesheets; these rules only fit
   those patterns to the core solutions content. Every rule is scoped to a cs-
   class, so no other page changes. Hand-edited, no src twin. */

/* Text and picture: the copy takes the larger share (1.3fr to 1fr), as on the
   membranes text-and-image sections, so longer copy leaves no band of white
   beside the picture. Full width once the hero stacks, as on SSD. */
.mcat-hero__grid--media.cs-grid { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
@media (max-width: 860px) {
  .mcat-hero__grid--media.cs-grid { grid-template-columns: 1fr; }
  .cs-grid .mcat-figure--hero { max-width: none; }
}
/* Where a product's copy runs taller than its 3:2 picture, the picture takes
   the copy's height (cropped by object-fit, never past square), so no band of
   white opens beside the text. Side by side only. */
@media (min-width: 861px) {
  .mcat-hero__grid--media.cs-grid { container-type: inline-size; }
  .cs-grid > .mcat-figure--hero { align-self: stretch; max-height: calc((100cqw - 32px) / 2.3); }
  .cs-grid > .mcat-figure--hero img { height: 100%; }
}

/* Body copy at the site's regular weight (clamp 15 to 17px / 400 / 1.6, as
   Home's section leads); the catalog sheet leaves .mcat-lead at light. */
.cs-hero .mcat-lead, .cs-body .mcat-lead, .cs-cta .mcat-lead { font-weight: 400; }

/* Group pages: the group's overview under the range heading, as the lead
   paragraph of the RO hub's range intro, at the body copy measure. */
#mem-page#mem-page .cs-lead { max-width: 760px; margin: 16px 0 0; }
#mem-page#mem-page .cs-lead + .cs-lead { margin-top: 12px; }

/* Landing rail: the Home water solutions card carries the Home page card's
   full line, so the SSD card gets one more line of body (same footprint
   otherwise, the photo area unchanged). */
body.membrane-typography #mem-page#mem-page .cs-cards .memcard--sp { --mem-panel: clamp(344px, 24vw, 356px); height: clamp(516px, 40vw, 576px); }
body.membrane-typography #mem-page#mem-page .cs-cards .memcard--sp .memcard__body { -webkit-line-clamp: 7; }

/* Product range: the light blue boxes of the SSD and Instruments pages, one
   column per box up to three (four sit two by two), the brochure or product
   link at each box's foot so the buttons of a row line up. */
.mcat-feat.cs-feat--c1 { grid-template-columns: minmax(0, 760px); }
@media (min-width: 621px) {
  .mcat-feat.cs-feat--c2, .mcat-feat.cs-feat--c3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1081px) {
  .mcat-feat.cs-feat--c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.cs-feat > li { display: flex; flex-direction: column; }
.cs-feat .mcat-feat__body { font-size: clamp(15px, 1.4vw, 17px); font-weight: 400; line-height: 1.6; }
.cs-feat__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; padding-top: 18px; }
.mcat-feat__head + .cs-feat__actions { padding-top: 6px; }

/* A product with its own copy: the Instruments model section. */
.mcat-body .cs-model { padding-top: 36px; border-top: 1px solid #e8eff5; scroll-margin-top: 96px; }
.mcat-body > .cs-model:first-child { padding-top: 0; border-top: 0; }
.mcat-body #range { scroll-margin-top: 96px; }
.cs-model > .mcat-lead:last-of-type { margin-bottom: 0; }

/* The deck's wide strips (and the ZLD diagram) at their own ratio, in the
   catalog figure frame. */
.cs-wide img { width: 100%; height: auto; }
.cs-model .cs-wide { margin-top: 22px; }
.cs-wide--narrow { max-width: 720px; }
