/* Camada responsiva dos blocos — carregada no FRONT e no EDITOR.

   Vive em arquivo proprio de proposito. Quando estas regras moravam no
   style.css, valiam so no front: o editor carrega os arquivos de
   add_editor_style, nao a folha do tema. No mobile o front empilhava e o canvas
   nao, e o P3 (paridade editor/front) reprovava hero e producto-hero-2 com
   ~36% e ~54% — divergencia que eu mesmo tinha criado ao consertar o mobile.
   O prototipo do Claude Design concentra o responsivo num <style> global
   mirando por atributo; os arquivos de secao entregues aos autores de bloco
   so trazem o inline (desktop). Estas regras portam aquilo, escopado aos
   nossos blocos, que usam classe de verdade. `grid-template-columns` num
   elemento que nao e grid e ignorado, entao aplicar no container e seguro. */

@media (max-width: 1120px) {

	[class*="dicarvalho-"] {
		grid-template-columns: 1fr !important;
	}

	/* Texto em colunas (`columns: 3`) vira coluna única.
	 *
	 * `auto`, e nao `1`. As duas rendem uma coluna so — a diferenca e que `1`
	 * ainda torna o elemento um container de MULTICOLUNA (um contexto de
	 * fragmentacao), e este seletor atinge todo elemento de bloco da pagina.
	 * A regra quer desligar coluna, nao ligar uma; `auto` faz exatamente isso.
	 *
	 * NAO e o conserto de bug nenhum, e nao cite este comentario como se fosse.
	 * A troca nasceu de uma investigacao do pin da galeria no iPhone 16 em que o
	 * WebKit do Playwright acusou `columns: 1` de matar `position: sticky`. O
	 * Safari REAL do iOS 26.5, medido no Simulator, refutou: sticky dentro de
	 * `columns: 1` gruda, e as alturas sao iguais com e sem (98px nos dois). A
	 * divergencia era do build do Playwright. O defeito do iPhone 16 segue sem
	 * explicacao.
	 *
	 * Fica porque e o valor certo para a intencao da regra, e porque e
	 * comprovadamente inerte: Chromium, 3.664 elementos em 6 paginas, zero
	 * diferenca de geometria; Safari real, alturas identicas. */
	[class*="dicarvalho-"] {
		columns: auto !important;
	}

	/* Sticky em coluna estreita prende conteúdo fora da tela.
	 *
	 * A lista é explícita porque CSS não seleciona por VALOR de propriedade:
	 * não há como dizer "solte quem for sticky". O seletor cego que morava
	 * aqui (`[class*="dicarvalho-"]`) zerava junto os `absolute`/`relative`
	 * que sustentam imagem de fundo, overlay e gradiente — 137 elementos em 8
	 * telas, medido em 2026-08-03, com o overlay de TODO hero colapsando para
	 * 0px. Bloco novo que use sticky entra nesta lista; `bin/verificar-hero-
	 * mobile.mjs` pega o esquecimento pelo lado do hero.
	 *
	 * NEM O PALCO DA GALERIA NEM O PIN DA TIMELINE ENTRAM — sao as excecoes.
	 *
	 * Ele estava nesta lista por ser sticky, pela regra mecanica acima. Mas o
	 * palco nao e um trecho de coluna que gruda: e o proprio mecanismo da secao.
	 * Solto, o `.is-horizontal` do view.js continuava dando 2510px de altura a
	 * secao e continuava deslizando a trilha na horizontal, sem nada segurar o
	 * quadro — medido em 390x844: o palco descia a -879px e depois a -1757px, os
	 * cards passavam voando no topo e sobravam ~1800px de preto ate o fim da
	 * secao. Nem fixado nem rolagem nativa: um hibrido quebrado.
	 *
	 * Com o sticky de volta o quadro para a 97px do topo e a trilha percorre as
	 * obras, que e o comportamento que o bloco descreve no proprio CSS. O palco
	 * mede `100vh - header` (747px num telefone de 844) e o card 557px, entao ele
	 * cabe por construcao — nao ha o "conteudo preso fora da tela" que esta lista
	 * existe para evitar. */
	.dicarvalho-tipo-25__summary,
	.dicarvalho-biografia__heading,
	.dicarvalho-biografia__imagem,
	.dicarvalho-producto-hero__conteudo,
	.dicarvalho-producto-hero-2__content {
		position: static !important;
	}

	/* Tipografia fluida do design. Só nos blocos: o header/rodapé do tema já
	   têm o próprio tratamento acima. */
	[class*="dicarvalho-"] h1 {
		font-size: clamp(42px, 12vw, 64px) !important;
		line-height: 1.04 !important;
	}

	[class*="dicarvalho-"] h2 {
		font-size: clamp(30px, 8.5vw, 42px) !important;
	}
}