/* ==========================================================================
   TOKENS - Projeto Vida Milano
   Fonte única de cor, tipografia, espaço, raio, sombra e transição.
   Nenhum valor cru deve aparecer fora deste arquivo.
   ========================================================================== */

:root {

  /* --- Cor -----------------------------------------------------------------
     O laranja veio do avatar do Instagram (@projetovidamilano), amostrado do
     print em referencias/. Ele é acento e nunca fundo de texto corrido.
     Contraste conferido: tinta sobre papel 16,9:1 · laranja sobre tinta 5,9:1
     · tinta sobre laranja 5,9:1 · brasa sobre papel 5,4:1.
  --------------------------------------------------------------------------- */
  --cor-laranja: #ff5500;          /* marca */
  --cor-laranja-quente: #fe471d;   /* variante do ícone, usada em degradê de fita */
  --cor-brasa: #b33800;            /* laranja legível como texto sobre papel */
  --cor-tinta: #14100e;            /* preto quente, fundo das seções escuras */
  --cor-tinta-alta: #241c17;       /* superfície elevada dentro do escuro */
  --cor-papel: #f7f2eb;            /* fundo claro */
  --cor-papel-alto: #ede5da;       /* superfície elevada dentro do claro */
  --cor-areia: #d7cabb;            /* traço e borda sobre papel */
  --cor-texto-apoio: #5b5148;      /* secundário sobre papel */
  --cor-texto-apoio-claro: #b9afa4;/* secundário sobre tinta */
  --cor-borda-clara: rgba(247, 242, 235, 0.45); /* contorno sobre tinta */
  --cor-papel-meio: rgba(247, 242, 235, 0.62);  /* barra do cabeçalho, sob o desfoque */
  --cor-papel-firme: rgba(247, 242, 235, 0.88); /* mesma barra onde não há desfoque */
  --cor-branco: #ffffff;                        /* só no botão do ao vivo */
  --cor-hachura: rgba(255, 85, 0, 0.07);        /* risco do bloco reservado */
  --cor-halo-laranja: rgba(255, 85, 0, 0.28);   /* halo do pino no mapa */
  --veu-leve: rgba(20, 16, 14, 0.45);           /* véu sobre a foto de abertura */
  --veu-medio: rgba(20, 16, 14, 0.68);
  --veu-forte: rgba(20, 16, 14, 0.92);

  /* --- Tipografia ---------------------------------------------------------- */
  --fonte-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --fonte-texto: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --fonte-assinatura: "Ms Madi", "Segoe Script", cursive; /* só na assinatura dos pastores */

  --texto-xs: 0.8125rem;                              /* 13px, só rótulo */
  --texto-p: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);  /* 16 a 18px */
  --texto-p-grande: clamp(1.125rem, 1.05rem + 0.35vw, 1.375rem);
  --texto-t3: clamp(1.375rem, 1.25rem + 0.6vw, 1.75rem);
  --texto-t2: clamp(2.25rem, 1.7rem + 2.4vw, 4rem);
  --texto-t1: clamp(3.25rem, 2.1rem + 5.2vw, 7.5rem);
  --texto-numero: clamp(4rem, 2.4rem + 7vw, 10rem);   /* hora do culto */

  --entrelinha-apertada: 0.92;
  --entrelinha-titulo: 1.06;
  --entrelinha-texto: 1.62;
  --espacamento-rotulo: 0.16em;

  --medida-leitura: 64ch;

  /* --- Espaço (base 4px, ritmo de seção em múltiplo de 8) ------------------- */
  --e-1: 0.25rem;
  --e-2: 0.5rem;
  --e-3: 0.75rem;
  --e-4: 1rem;
  --e-6: 1.5rem;
  --e-8: 2rem;
  --e-12: 3rem;
  --e-16: 4rem;
  --e-24: 6rem;
  --e-32: 8rem;
  --secao-y: clamp(4rem, 2rem + 8vw, 10rem);
  --margem-lateral: clamp(1.25rem, 0.5rem + 3.5vw, 5rem);
  --largura-maxima: 84rem;
  --largura-barra: 64rem;   /* a pílula do cabeçalho é mais estreita que o conteúdo */

  /* --- Raio ---------------------------------------------------------------- */
  --raio-pequeno: 4px;
  --raio-medio: 12px;
  --raio-grande: 18px;
  --raio-pilula: 999px;

  /* --- Traço e sombra ------------------------------------------------------
     A elevação é resolvida por terreno de cor. O fio de 1px aparece apenas
     onde não há troca de fundo, nunca junto com ela.
  --------------------------------------------------------------------------- */
  --traco: 1px solid var(--cor-areia);
  --traco-claro: 1px solid rgba(247, 242, 235, 0.18);
  --sombra-foco: 0 0 0 3px var(--cor-papel), 0 0 0 6px var(--cor-brasa);
  --sombra-foco-escuro: 0 0 0 3px var(--cor-tinta), 0 0 0 6px var(--cor-laranja);

  /* --- Movimento ----------------------------------------------------------- */
  --t-micro: 180ms;
  --t-curta: 260ms;
  --t-media: 520ms;
  --t-longa: 760ms;
  --curva-saida: cubic-bezier(0.22, 0.9, 0.28, 1);   /* desacelera no fim */
  --curva-entrada: cubic-bezier(0.5, 0, 0.75, 0.2);  /* acelera no começo */
  --curva-suave: cubic-bezier(0.34, 0.02, 0.2, 1);

  /* --- Cabeçalho ----------------------------------------------------------- */
  --altura-cabecalho: 4.5rem;
}