/* Blocos exclusivos da página inicial. Tudo que se repete em outra página
   está em componentes.css. */

/* ============ Abertura ============ */
.abertura {
  position: relative;
  overflow: hidden;
  background: var(--fundo-abertura);
  padding: var(--abertura-respiro);
  /* Mesma correção do topo: no celular a navbar tem ~148 px e o respiro do
     export (118 px) deixava "TISOI, BELLUNO" escondido atrás dela. */
  padding-top: max(var(--abertura-respiro-topo), calc(var(--altura-navbar) + var(--espaco-5)));
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: var(--abertura-espaco);
}
/* Anéis concêntricos e moldura dourada: decoração, sem elemento no HTML */
.abertura::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: var(--padrao-aneis);
}
.abertura::after {
  content: ''; position: absolute; inset: var(--abertura-moldura); pointer-events: none;
  border: var(--linha-fina) solid var(--cor-ouro-moldura);
}
.abertura > * { position: relative; z-index: 1; }
.abertura__rotulo {
  margin: 0;
  font-size: var(--texto-abertura-rotulo);
  letter-spacing: var(--tracking-abertura);
  text-transform: uppercase;
  color: var(--cor-ouro-claro);
}
.abertura__brasao {
  width: var(--abertura-brasao); height: auto;
  filter: drop-shadow(var(--sombra-brasao));
}
.abertura__nome {
  margin: 0;
  font-family: var(--fonte-marca);
  font-weight: 700;
  font-size: var(--texto-h1);
  line-height: 1.05;
  letter-spacing: var(--tracking-nome);
  color: var(--cor-texto-invertido);
}
.abertura__filete { width: var(--abertura-filete); height: var(--linha-fina); background: var(--cor-ouro); border: 0; margin: 0; }
.abertura__frase {
  margin: 0;
  font-style: italic; font-weight: 300;
  font-size: var(--texto-citacao);
  line-height: 1.45;
  color: var(--cor-invertido-86);
  max-width: 21em;
  text-wrap: pretty;
}

/* ============ Origem ============ */
.origem__titulo { margin-bottom: var(--espaco-titulo); }
.origem__bloco {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(18.75rem, 100%), 1fr));
  gap: var(--espaco-bloco);
}
.origem__bloco--topo {
  align-items: center;
  margin-bottom: var(--espaco-bloco-grande);
  padding-bottom: var(--espaco-bloco-grande);
  border-bottom: var(--linha-fina) solid var(--cor-linha);
}
.origem__bloco--topo .foto { aspect-ratio: 4 / 3; }
.origem__texto { display: flex; flex-direction: column; gap: var(--espaco-5); }
.origem__lateral { display: flex; flex-direction: column; gap: var(--espaco-4-5); }
.origem__lateral .foto { height: var(--altura-foto-raizes); }
.origem__resumo { grid-template-columns: repeat(auto-fit, minmax(min(8.75rem, 100%), 1fr)); gap: var(--espaco-3); }
.origem__resumo .ficha { padding: var(--espaco-4-5); }

.dez-filhos { margin-top: var(--espaco-bloco-grande); border-top: var(--linha-fina) solid var(--cor-linha); padding-top: var(--espaco-titulo); }
.dez-filhos .secao__intro { max-width: 44em; margin-bottom: var(--espaco-chamada); }
.dez-filhos__listas {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
  gap: var(--espaco-lista);
  align-items: start;
}
.dez-filhos__subtitulo {
  font-size: var(--texto-ficha);
  letter-spacing: var(--espacamento-caixa-alta);
  text-transform: uppercase;
  color: var(--cor-azul-noite);
  margin: 0 0 var(--espaco-4);
  font-weight: 400;
}
.dez-filhos__italia { grid-template-columns: repeat(auto-fit, minmax(min(11.25rem, 100%), 1fr)); }
.dez-filhos__brasil { grid-template-columns: repeat(auto-fit, minmax(min(14.375rem, 100%), 1fr)); }

/* ============ Chamada da árvore ============ */
.chamada-arvore .secao__intro { margin-bottom: var(--espaco-titulo); }