/* ---------------------------------------------------------------------------
 * HD Custom Dev — Post Cards grid gutters
 *
 * Avada's Post Cards element derives BOTH the gutter between cards and the
 * negative margin that cancels that gutter at the grid's outer edge from one
 * custom property:
 *
 *     li  padding-inline : calc(var(--awb-pc-column-space) /  2)
 *     ul  margin-inline  : calc(var(--awb-pc-column-space) / -2)
 *
 * so setting that single property changes the space between cards while the
 * outer edges of the grid stay exactly where they are. That matters here: the
 * home page is signed off, and its full-width desktop row must land on the
 * same pixels it already does.
 *
 * WHY THERE WAS NO GUTTER
 * The news grid is configured as ONE column, and Avada zeroes its column space
 * accordingly — correct, since a single column has no gutter to draw. But
 * between 641px and 1024px Avada's own stylesheet forces every Post Cards
 * column to `var(--awb-columns-medium, 50%)`, and this grid leaves its medium
 * column count unset, so the 50% fallback applies and the grid quietly becomes
 * two across — still carrying zero column space. That is why the two articles
 * sat flush against each other.
 *
 * 30px is the padding the section already carries on its outside edges
 * (.fusion-fullwidth has padding-inline: 30px), so the space between two
 * articles now reads the same as the space beside them.
 *
 * WHY THE WIDTH LINE IS NEEDED
 * This grid carries `fusion-grid-flex-grow`, which makes the wrapper a flex
 * container, so the <ul> is a flex ITEM. A negative margin does not stretch a
 * flex item the way it stretches a block: the list would simply shift 15px
 * left and end 30px short of the section's right edge. Growing it by exactly
 * one gutter puts the right-hand card back on the section edge - and the
 * max-width has to move with the width, because Avada caps this same list at
 * `max-width: 100%`, which otherwise clamps it straight back to 925px and
 * leaves the right edge short. Avada's own rule for that cap carries five
 * classes and is printed after this file, so the override needs a sixth class
 * to win on specificity rather than on source order - hence the otherwise
 * redundant .fusion-grid-archive in the selector. The grid with three columns
 * further up the page is a plain block and needs none of this, which is why
 * Avada gets away without it.
 *
 * Below 641px the grid is one across again and this band no longer applies;
 * above 1024px the grid is one across by its own setting and is untouched.
 * ------------------------------------------------------------------------- */

@media only screen and (min-width: 641px) and (max-width: 1024px) {

	.home .fusion-post-cards.fusion-grid-columns-1 {
		--awb-pc-column-space: 30px;
	}

	.home .fusion-post-cards.fusion-grid-archive.fusion-grid-columns-1.fusion-grid-flex-grow > .fusion-grid {
		width: calc(100% + var(--awb-pc-column-space));
		max-width: calc(100% + var(--awb-pc-column-space));
	}
}