/* =====================================================================
   LETO — padrões compartilhados das páginas internas.
   ===================================================================== */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Hero interno (foto + título + lede) */
.ipage-hero { position: relative; min-height: clamp(500px, 55vw, 715px); background: var(--leto-charcoal) var(--hero-img) center/cover no-repeat; display: flex; align-items: flex-end; }
.ipage-hero__scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,20,20,.5), rgba(20,20,20,.18) 42%, rgba(20,20,20,.55)); }
.ipage-hero__inner { position: relative; padding-bottom: clamp(2.5rem, 5vw, 76px); }
.ipage-hero__title { font-size: clamp(1.89rem, 1.17rem + 2.34vw, 50.4px); font-weight: 500; line-height: 1.0; color: #fff; max-width: 760px; letter-spacing: 0; }
.ipage-hero__lede { margin-top: 1.5rem; font-size: 18px; line-height: 1.2; color: #fff; max-width: 660px; }

/* Bloco 2 colunas (idx + título | corpo) */
.block-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem 3rem; padding-block: clamp(2.5rem, 1.5rem + 3vw, 72px); align-items: start; }
.block-2col__head { display: flex; align-items: baseline; gap: clamp(1rem, 3vw, 56px); }
.idx { font-size: 16.2px; font-weight: 500; opacity: .9; }
.idx--muted { opacity: .5; }

/* Numeração automática das seções do single-fundo: contador CSS escopado em .single-fundo.
   Cada `<span class="idx ..."></span>` vazio recebe automaticamente "01", "02", "03"... na
   ordem em que renderiza no DOM. Quando uma seção faz early-return, o número não é "queimado". */
.single-fundo { counter-reset: leto-secao; }
.single-fundo .idx { counter-increment: leto-secao; }
.single-fundo .idx::before { content: counter(leto-secao, decimal-leading-zero); }
.block-2col__head h2 { font-size: clamp(1.53rem, 1.08rem + 1.35vw, 32.4px); font-weight: 500; }
.block-2col__body p { font-size: 18px; line-height: 1.25; max-width: 532px; }
.block-2col__body p + p { margin-top: 1.2rem; }
.block-2col__aside { font-size: 16.2px; opacity: .8; }

@media (max-width: 900px) {
	.block-2col { grid-template-columns: 1fr; gap: 1.25rem; }
}
