/* Layout foundation 2.1-beta.2: três modos explícitos, sem 100vw ou clipping. */
.jj-container,.jj-container--content,.jj-container--wide{container-type:inline-size;width:calc(100% - (2 * var(--jj-space-5)));margin-inline:auto}
.jj-container--content{max-width:var(--jj-container-content)}
.jj-container,.jj-container--wide{max-width:var(--jj-container-wide)}
.jj-container--full{container-type:inline-size;width:100%;max-width:none;margin-inline:0}

/* Containers jj-* são terminais: alinhamentos nunca escapam de seus limites. */
.jj-container :where(.alignwide,.alignfull),.jj-container--content :where(.alignwide,.alignfull),.jj-container--wide :where(.alignwide,.alignfull),.jj-container--full :where(.alignwide,.alignfull){width:100%;max-width:100%;margin-inline:0}

/* Fallback útil fora de content-wrap: wide é limitado; full ocupa o pai. */
.alignwide{width:100%;max-width:var(--jj-container-wide);margin-inline:auto}
.alignfull{width:100%;max-width:none;margin-inline:0}

/* content-wrap é o shell de breakout e fornece 100cqw sem incluir scrollbar. */
.content-wrap{container-name:jj-page;container-type:inline-size;width:calc(100% - (2 * var(--jj-space-5)));max-width:none;margin-inline:auto;padding:var(--jj-space-10) 0}
.content-wrap>*{width:100%;max-width:var(--jj-container-wide);margin-inline:auto}
.content-wrap .entry-content{width:100%;max-width:var(--jj-container-content);margin-inline:auto}
.content-wrap article>.page-title{width:100%;max-width:var(--jj-container-content);margin-inline:auto}

/* Editorial: conteúdo 780; wide 1160; full até o shell com gutters seguros. */
.content-wrap:not(.is-wide):not(.is-full-width) .entry-content>.alignwide{width:min(100cqw,var(--jj-container-wide));max-width:none;margin-inline:calc((100% - min(100cqw,var(--jj-container-wide))) / 2)}
.content-wrap:not(.is-wide):not(.is-full-width) .entry-content>.alignfull{width:100cqw;max-width:none;margin-inline:calc((100% - 100cqw) / 2)}

/* Wide: corpo 1160; alignfull ainda pode usar todo o shell disponível. */
.content-wrap.is-wide .entry-content{max-width:var(--jj-container-wide)}
.content-wrap.is-wide .entry-content>.alignwide{width:100%;max-width:100%;margin-inline:0}
.content-wrap.is-wide .entry-content>.alignfull{width:100cqw;max-width:none;margin-inline:calc((100% - 100cqw) / 2)}

/* Full: nenhum gutter implícito; alignfull é idempotente e nunca excede o pai. */
.content-wrap.is-full-width{width:100%;max-width:none;padding:0}
.content-wrap.is-full-width>*{max-width:none;margin-inline:0}
.content-wrap.is-full-width .entry-content{width:100%;max-width:none;margin-inline:0}
.content-wrap.is-full-width .entry-content>.alignfull{width:100%;max-width:100%;margin-inline:0}
.content-wrap.is-full-width .entry-content>.alignwide{width:calc(100% - (2 * var(--jj-space-5)));max-width:var(--jj-container-wide);margin-inline:auto}

.jj-stack{display:flex;flex-direction:column;justify-content:flex-start}.jj-stack>*{margin-block:0}.jj-stack>*+*{margin-block-start:var(--jj-stack-space,var(--jj-space-5))}
.jj-cluster{display:flex;flex-wrap:wrap;gap:var(--jj-cluster-space,var(--jj-space-4));align-items:var(--jj-cluster-align,center)}
.jj-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--jj-grid-min,16rem)),1fr));gap:var(--jj-grid-gap,var(--jj-space-5))}
.jj-grid--2{--jj-grid-min:24rem}.jj-grid--3{--jj-grid-min:18rem}.jj-grid--4{--jj-grid-min:14rem}.jj-split{display:grid;gap:var(--jj-space-6);align-items:center}
@media(min-width:768px){.jj-container,.jj-container--content,.jj-container--wide{width:calc(100% - (2 * var(--jj-space-8)))}.content-wrap{width:calc(100% - (2 * var(--jj-space-8)))}.content-wrap.is-full-width .entry-content>.alignwide{width:calc(100% - (2 * var(--jj-space-8)))}.jj-split{grid-template-columns:repeat(2,minmax(0,1fr))}}
