/* ============================================================
   BhaktiMeShakti — CLS fix
   Desktop CLS 0.924 -> expected <0.1

   THE CAUSE

   main.css applies content-visibility:auto to cards, slides and
   several sections, with contain-intrinsic-size as a height guess:

     .grid>.card { content-visibility:auto; contain-intrinsic-size:auto 320px }
     .slide      { content-visibility:auto; contain-intrinsic-size:auto 320px }
     .author-posts,.related,.site-foot
                 { content-visibility:auto; contain-intrinsic-size:auto 600px }

   content-visibility:auto tells the browser to skip rendering
   off-screen elements and use the guessed height instead. When the
   element finally renders and its real height differs, everything
   below it jumps. That jump is layout shift.

   The guess is 320px. Measured against the actual card:

     mobile, 1 column    ~309px   ->  11px out   (no visible shift)
     tablet, 2 columns   ~286px   ->  34px out
     desktop, 3 columns  ~246px   ->  74px out
     desktop, 4 columns  ~216px   -> 104px out

   That is exactly the reported split: CLS 0 on mobile, 0.924 on
   desktop. The homepage stacks many cards, so the error compounds.

   THE FIX

   Cards and slides sit at or near the top of the page, so they are
   rendered almost immediately and skipping them saves nothing. The
   containment is removed for those, which eliminates the guess and
   therefore the shift.

   It is kept for the footer and related-posts blocks, which are far
   enough down that they are genuinely skipped, and a wrong guess
   there does not move anything already on screen.

   Loaded by wp-content/mu-plugins/bms-cls-fix.php, which enqueues
   it as a dependent of the bms-main handle so it always comes after
   the theme stylesheet.
   ============================================================ */

/* Cards — the main offender. Many per page, all guessed wrong on
   desktop, and all near enough to the fold to render anyway. */
.grid > .card {
	content-visibility: visible;
	contain-intrinsic-size: none;
}

/* Slides — the homepage hero carousel is the first thing painted,
   so deferring it was never going to help. */
.slide {
	content-visibility: visible;
	contain-intrinsic-size: none;
}

/* Author archive listing — same card geometry, same wrong guess. */
.author-posts {
	content-visibility: visible;
	contain-intrinsic-size: none;
}

/*
 * Footer and related posts keep their containment: both sit well
 * below the fold on every page, so they are genuinely skipped and
 * a wrong guess cannot shift anything the reader can see.
 *
 * The guess is raised from 600px to 720px to match the four-column
 * footer as it actually renders on desktop.
 */
.site-foot {
	contain-intrinsic-size: auto 720px;
}

.related {
	contain-intrinsic-size: auto 640px;
}

/*
 * AdSense slots.
 *
 * main.css already reserves 280px, which is right for a standard
 * responsive unit. The reservation is restated here so that removing
 * containment above cannot leave an ad slot collapsing on load —
 * an ad that arrives into zero reserved height is the other classic
 * source of a large CLS score.
 */
.adsbygoogle {
	min-block-size: 280px;
	contain: layout;
}

@media (max-width: 40rem) {
	.adsbygoogle {
		min-block-size: 250px;
	}
}

/*
 * Anchor, vignette and fixed-position ad formats are overlays. They
 * do not occupy layout space, so reserving height for them would
 * leave a permanent gap. This mirrors the rule already in main.css
 * and must stay after the block above to win.
 */
.adsbygoogle[data-anchor-status],
.adsbygoogle[data-vignette-loaded],
ins.adsbygoogle[data-ad-format="auto"][data-full-width-responsive="true"][style*="position: fixed"] {
	min-block-size: 0;
	margin-block: 0;
	contain: none;
}
