/* todasascoisascooperam.com — vertical-scroll-pinned-verse · claim-first
   Palette: sunrise-ochre-and-deep-teal. Ornament: pinned-verse-band.
   Folha de estilo exclusiva deste domínio; nenhuma regra é reaproveitada.

   FAIXA FIXA. A assinatura estrutural do site é a faixa com o versículo,
   presa ao topo durante a rolagem (position: sticky, sem JavaScript). Para
   respeitar o orçamento de CLS < 0.05, a faixa reserva a própria altura
   mínima desde a primeira pintura e nunca cobre conteúdo.

   FACES TIPOGRÁFICAS. A matriz designa Petrona (display) e Faustina (texto),
   auto-hospedadas e subconjuntadas. Nenhum arquivo de fonte acompanha esta
   build — a licença de cada artefato (redistribuição, atribuição, subsetting)
   é verificação pré-implantação ainda pendente —, então as pilhas de sistema
   abaixo aproximam o desenho pretendido. Nunca fontes por CDN. */

:root {
  --ocre: #d98e2b;
  --ocre-texto: #9a641c;   /* accessible on cream; --ocre stays for bands and rules */
  --ocre-claro: #f4c877;
  --ocre-etiqueta: #97660c;  /* label text on cream */
  --amanhecer: #faf3e6;
  --teal: #114b50;
  --teal-fundo: #0b3438;
  --grafite: #24312f;
  --lombada: 40rem;
  --exibicao: "Petrona", "Palatino", "Iowan Old Style", "Georgia", serif;
  --leitura: "Faustina", "Charter", "Cambria", Georgia, serif;
}

body {
  margin: 0;
  background: var(--amanhecer);
  color: var(--grafite);
  font-family: var(--leitura);
  font-size: clamp(1.02rem, 0.97rem + 0.3vw, 1.18rem);
  line-height: 1.66;
}

/* a faixa fixa com o versículo — altura reservada, jamais sobre o conteúdo */
.faixa-versiculo {
  position: sticky;
  top: 0;
  z-index: 5;
  min-height: 3.6rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.2rem 1.2rem;
  padding: 0.55rem clamp(0.9rem, 3vw, 2.2rem);
  background: var(--teal-fundo);
  color: var(--amanhecer);
  border-bottom: 3px solid var(--ocre);
  font-size: 0.92rem;
}
.faixa-versiculo .faixa-etiqueta {
  font-family: var(--exibicao);
  font-weight: 700;
  color: var(--ocre-claro);
  letter-spacing: 0.05em;
  white-space: nowrap;
}
.faixa-versiculo [data-scripture-slot] { flex: 1 1 14rem; min-width: 0; }
.faixa-versiculo .faixa-app { margin-left: auto; white-space: nowrap; }
.faixa-versiculo .faixa-app a { color: var(--ocre-claro); text-decoration-thickness: 0.08em; text-underline-offset: 0.16em; }

.rota {
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 1.4rem;
  padding: 0.8rem clamp(0.9rem, 3vw, 2.2rem);
  background: var(--teal);
  font-size: 0.83rem;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.rota a { color: #cfe3df; text-decoration: none; }
.rota a:hover, .rota a:focus { color: var(--ocre-claro); text-decoration: underline; }
.rota a[aria-current="page"] { color: var(--ocre-claro); font-weight: 700; }

.argumento { max-width: var(--lombada); margin: 0 auto; padding: clamp(1.8rem, 5vw, 3.4rem) 1.2rem 2.2rem; }

.argumento h1 {
  font-family: var(--exibicao);
  font-weight: 800;
  font-size: clamp(2rem, 1.35rem + 3.2vw, 3.7rem);
  line-height: 1.06;
  color: var(--teal);
  margin: 0 0 0.8rem;
}
.tese {
  font-size: clamp(1.12rem, 1.05rem + 0.5vw, 1.4rem);
  color: #4c5a57;
  border-bottom: 3px solid var(--ocre);
  padding-bottom: 1.1rem;
  margin: 0 0 1.6rem;
}
.argumento h2 {
  font-family: var(--exibicao);
  font-weight: 700;
  font-size: clamp(1.35rem, 1.12rem + 1.1vw, 1.95rem);
  color: var(--teal);
  margin: 2.3rem 0 0.7rem;
}
.argumento p { margin: 0 0 1.05rem; }
.argumento q { font-style: italic; }
.argumento q::before, .argumento q::after { color: var(--ocre-texto); font-style: normal; font-weight: 700; }

/* trecho: parada de leitura bíblica na descida */
.trecho {
  background: linear-gradient(115deg, #fdf7ec, #f8e8c9);
  border: 1px solid var(--ocre-claro);
  border-left: 0.5rem solid var(--ocre);
  border-radius: 2px;
  padding: 1rem 1.2rem;
  margin: 1.4rem 0;
}
.trecho .procedencia-trecho {
  display: block;
  font-family: var(--exibicao);
  font-size: 0.8rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #8a5f1d;
  margin-bottom: 0.35rem;
}

.confronto { display: grid; gap: 0.8rem; margin: 1.3rem 0; }
.confronto .trecho { margin: 0; }

.objecao {
  border-left: 4px solid var(--teal);
  padding-left: 1.05rem;
  color: #3c4a47;
  font-size: 0.99rem;
}

.fecho-argumento { margin-top: 2.2rem; font-family: var(--exibicao); }
.fecho-argumento a { color: var(--teal); text-decoration-color: var(--ocre); text-decoration-thickness: 0.12em; text-underline-offset: 0.18em; }

.selo {
  background: var(--teal-fundo);
  color: #b9cfcb;
  padding: 1.8rem 1.2rem 2.5rem;
  font-size: 0.84rem;
  line-height: 1.6;
}
.selo p { max-width: var(--lombada); margin: 0 auto 0.55rem; }