/*
 * Layout styles — brand-templated for engagement isjac.
 *
 * Source: vendor/zysys/wp-runtime/assets/css/layout.css.template
 * Built:  wp-content/zysys-generated/isjac/css/layout.css
 *
 * The template substitutes isjac at composer install. To change
 * a rule, edit this template and re-run `composer install` (or
 * `composer update`) in the consumer repo.
 *
 * Naming convention: <brand>-<class> per ADR-002.
 */

/* ---------- Page edge gutters ---------- *
 * Every page child inherits horizontal breathing room from the container.
 * Alignfull blocks escape via negative-margin trick below; alignwide
 * inherits and constrains to its own max-width. Default child blocks
 * sit inside these gutters at the prose width set above.
 *
 * Gutters scale: 16px on mobile → 24px tablet → 32px desktop. Below 16px,
 * touch targets crash into the screen edge. */
.entry-content {
	padding-left:  clamp(1rem, 4vw, 2rem);
	padding-right: clamp(1rem, 4vw, 2rem);
}

/* ---------- Full-bleed (alignfull) ---------- *
 * Bleed past the container's gutters AND any ancestor max-width by
 * computing a negative margin that re-centers on viewport. */
.entry-content > .alignfull {
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* ---------- Wide alignment (alignwide) ---------- *
 * Constrains to 1140px max; padding inherited from .entry-content above. */
.entry-content > .alignwide {
	max-width: 1140px;
	margin-left: auto;
	margin-right: auto;
}

/* Default content width — prose paragraphs, lists, basic blocks. */
.entry-content > :not(.alignwide):not(.alignfull) {
	max-width: var(--isjac-content-prose);
	margin-left: auto;
	margin-right: auto;
}

/* No top margin between consecutive sections — each section block
 * already owns its own padding. Stacking margins on top of paddings was
 * producing 240px+ gaps (hero padding-bottom + this margin + group
 * padding-top), which read as broken layout, not breathing room.
 *
 * Specifically null margin-top so a child section's padding-top is the
 * single source of inter-section vertical space. */
.entry-content > .alignfull + .alignwide,
.entry-content > .alignwide  + .alignwide,
.entry-content > .alignwide  + .alignfull,
.entry-content > .alignfull  + .alignfull {
	margin-top: 0;
}

.entry-content > .alignwide + .wp-block-separator {
	margin-top: 0;
	margin-bottom: 0;
}

/* ---------- Inverted band utility ---------- *
 * `.isjac-band--invert` paints a Group block with the navy brand-deep
 * surface and inverts all child text/links/buttons to the paper palette.
 * Used by the homepage bottom join-or-give band (T-120) and any future
 * full-bleed CTA band that needs the navy treatment without the
 * hero-only top-padding compensation that `.is-style-isjac-hero` carries.
 *
 * Why a utility, not a block style: bands appear in multiple post types
 * and themes; a class is portable across editors and Kadence versions. */
.isjac-band--invert {
	background-color: var(--isjac-color-brand-deep);
	color: var(--isjac-color-paper);
	padding-top:    var(--isjac-space-7);
	padding-bottom: var(--isjac-space-7);
}
.isjac-band--invert :is(h1, h2, h3, h4, p, a) {
	color: var(--isjac-color-paper);
}

/* ---------- Separators ---------- */
.wp-block-separator {
	border: 0;
	border-top: 1px solid var(--isjac-border-default);     /* rule */
	max-width: 1140px;
	margin-left: auto;
	margin-right: auto;
}
