/* ============================================================
   ROUND 69 — client document "Sentinel - 25-09 - AJ" (25 Sep 2026).
   One block per section of the document, in its order. Scoped to
   body.sh-r69 so the approved stylesheets stay untouched.
   ============================================================ */

/* ---- §1 Gallery · loading size ----
   The gallery HTML is large (1,300+ tiles). While it streams in, the first
   masonry column is on the page before its siblings and, as a flex:1 item,
   stretched to the full grid width, so the first tiles painted huge and then
   snapped down when the other columns arrived. Each column now has a fixed
   basis (the same width SH.masonry computes: (grid - gaps) / columns) and
   never grows, so a lone column paints at its final width from the first
   frame. flex-shrink stays on so four server-dealt columns still fit while
   the script re-deals to three or two on narrower screens. */
body.sh-r69 .gal__grid > .gal__col{flex:0 1 calc((100% - 48px) / 4)}
body.sh-r69 .gal__grid[data-cols="3"] > .gal__col{flex-basis:calc((100% - 32px) / 3)}
@media (max-width:1200px){
  body.sh-r69 .gal__grid > .gal__col,
  body.sh-r69 .gal__grid[data-cols="3"] > .gal__col{flex-basis:calc((100% - 32px) / 3)}
}
@media (max-width:768px){
  body.sh-r69 .gal__grid > .gal__col,
  body.sh-r69 .gal__grid[data-cols="3"] > .gal__col{flex-basis:calc((100% - 12px) / 2)}
}

/* ---- §2 Plans · "Not Found" text centred in the results area ---- */
body.sh-r69 .pl__empty{text-align:center;width:100%;padding:24px 16px}

/* ---- §3 Home · testimonial photos ----
   home.css crops every review photo to the Figma 332/172 frame with cover,
   which cut the customers' heads off on the square and portrait photos the
   client supplied. The photo now keeps its own aspect ratio inside the same
   12px frame, so the whole picture is visible; the card grows to fit. */
body.sh-r69 .review-card__media img{aspect-ratio:auto;height:auto;object-fit:fill}

/* ---- §4 Home · Featured Article ----
   Heading capped at two lines, excerpt capped so the text column never
   outgrows the photo; both truncate with an ellipsis. The cards beside the
   feature: title two lines, excerpt held to the image frame (226px: date +
   two-line title + five 24px lines fill it). */
body.sh-r69 .blog__title,
body.sh-r69 .blog__desc,
body.sh-r69 .blog-card__ct,
body.sh-r69 .blog-card__cd{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis}
/* the serif's descenders sit below its 1.08 line box; the clip edge is the padding box, so a
   little bottom padding keeps ")" and "g" whole without moving the text */
body.sh-r69 .blog__title{-webkit-line-clamp:2;padding-bottom:.14em;margin-bottom:-.14em}
body.sh-r69 .blog__desc{-webkit-line-clamp:4}
body.sh-r69 .blog-card__ct{-webkit-line-clamp:2}
body.sh-r69 .blog-card__cd{-webkit-line-clamp:5}
@media (max-width:768px){
  body.sh-r69 .blog-card__cd{-webkit-line-clamp:4}
}
