/* =====================================================================
   REVISÃO DE VIDAS · GÁLATAS 2:20 · "Já não sou eu"
   Revisão de Vidas · Sara Nossa Terra Itapema · 27, 28 e 29/11/2026
   Tokens oficiais da edição (fechados para produção em 29/09/2026).
   Fontes (Google Fonts):
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Anton&family=Archivo:ital,wdth,wght@1,125,900&family=Space+Grotesk:wght@400;500;700&display=swap" rel="stylesheet">
   ===================================================================== */
:root{
  /* ---------- CORES (só quentes) ---------- */
  --r220-breu:#120B0A;       /* FUNDO DOMINANTE. Preto quente. 65% das peças de rua e capa */
  --r220-tijolo:#241614;     /* Superfícies: cards, campos de formulário, blocos do site. 8% */
  --r220-tijolo-2:#33201C;   /* Borda e divisória sobre tijolo */
  --r220-carmim:#D91F26;     /* VERMELHO PRINCIPAL. Símbolo, tarja, botão, blocos. Cor do sábado. 12% (somado ao carmim escuro) */
  --r220-carmim-escuro:#B5161D; /* Cor da sexta-feira. Botão pressionado, hover */
  --r220-escarlate:#F0301E;  /* Só acento: cor do domingo, "ao vivo", 1 detalhe por peça. 1% */
  --r220-vinho:#8A1219;      /* Profundidade: sombra de bloco, fecho de pulseira. NÃO é a cor da sexta. 2% */
  --r220-osso:#F5EDE3;       /* Texto sobre escuro, papel, camiseta clara. 12% */
  --r220-areia:#C9B29C;      /* Texto de apoio, legenda, rótulo */
  --r220-areia-2:#8F7C6C;    /* Texto terciário, placeholder */

  /* papéis (use estes nos componentes) */
  --r220-fundo:var(--r220-breu);
  --r220-superficie:var(--r220-tijolo);
  --r220-borda:var(--r220-tijolo-2);
  --r220-texto:var(--r220-osso);
  --r220-texto-apoio:var(--r220-areia);
  --r220-marca:var(--r220-carmim);
  --r220-acao:var(--r220-carmim);
  --r220-acao-hover:var(--r220-carmim-escuro);
  --r220-acento:var(--r220-escarlate);

  /* três dias, três frases: a cor vai do carmim ao escarlate */
  --r220-sexta:var(--r220-carmim-escuro);  /* 27/11 · "Fui crucificado" · #B5161D */
  --r220-sabado:var(--r220-carmim);        /* 28/11 · "Já não sou eu" · #D91F26 */
  --r220-domingo:var(--r220-escarlate);    /* 29/11 · "Cristo vive em mim" · #F0301E */

  /* ---------- DEGRADÊS (os únicos permitidos) ---------- */
  --r220-grad-dias:linear-gradient(90deg,#B5161D 0%,#D91F26 50%,#F0301E 100%);  /* carmim escuro > carmim > escarlate. Barra dos 3 dias, barra de vagas */
  --r220-grad-foto:linear-gradient(180deg,rgba(18,11,10,0) 35%,rgba(18,11,10,.55) 65%,rgba(18,11,10,.94) 100%); /* escurece a BASE da foto para o texto. Nunca pinta o rosto */
  --r220-grad-foto-lado:linear-gradient(90deg,rgba(18,11,10,.94) 0%,rgba(18,11,10,.6) 38%,rgba(18,11,10,0) 70%);
  --r220-grad-vinheta:radial-gradient(120% 90% at 50% 40%,rgba(18,11,10,0) 55%,rgba(18,11,10,.6) 100%);

  /* ---------- MALHA (textura de fundo com o símbolo) ---------- */
  /* opacidade máx. 5% sobre breu; passo mínimo 72 px; símbolo com 14 px de altura */
  --r220-malha:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='%23F5EDE3' fill-opacity='.045'%3E%3Cpath d='M34.6 29h2.8v14h-2.8zM31 32h3.1v2.8H31zM37.9 32H41v2.8h-3.1z'/%3E%3C/g%3E%3C/svg%3E");

  /* ---------- TIPOGRAFIA ---------- */
  --r220-display:'Archivo',Impact,sans-serif;   /* SEMPRE: font-style:italic; font-weight:900; font-stretch:125%; caixa alta */
  --r220-numero:'Anton',Impact,sans-serif;      /* datas, vagas, pulseira, ingresso. Reto, sem itálico */
  --r220-texto-fonte:'Space Grotesk',system-ui,sans-serif; /* 400/500/700; rótulo: 700, caixa alta, letter-spacing .28em */
  --r220-rotulo-espaco:.28em;
  --r220-display-entrelinha:.92;

  /* ---------- FORMA ---------- */
  --r220-raio:14px;          /* cards */
  --r220-raio-botao:999px;   /* botão pílula */
  --r220-tarja-inclinacao:0deg; /* tarja reta. Máximo permitido: 2deg. Uma por peça */

  /* ---------- LOGO: TAMANHOS MÍNIMOS (o par precisa de 7 px na tela / 2 mm impresso) ---------- */
  --r220-logo-principal-min:210px;    /* 60 mm impresso */
  --r220-logo-horizontal-min:245px;   /* 40 px de altura · 70 mm impresso. Cabeçalho do site: 48 a 56 px de altura */
  --r220-assinatura-min:190px;        /* 55 mm impresso */
  --r220-simbolo-min:24px;            /* abaixo disso: simbolo-mini.svg. Bordado abaixo de 40 mm: simbolo-mini */
}

/* utilitários prontos */
.r220-display{font-family:var(--r220-display);font-style:italic;font-weight:900;font-stretch:125%;font-variation-settings:"wdth" 125;text-transform:uppercase;line-height:var(--r220-display-entrelinha);letter-spacing:-.005em}
.r220-numero{font-family:var(--r220-numero);font-weight:400;line-height:.9}
.r220-rotulo{font-family:var(--r220-texto-fonte);font-weight:700;text-transform:uppercase;letter-spacing:var(--r220-rotulo-espaco);font-size:12px}
.r220-tarja{display:inline-flex;align-items:center;gap:.8em;background:var(--r220-carmim);color:var(--r220-osso);padding:.35em .8em;transform:rotate(var(--r220-tarja-inclinacao))}
.r220-malha{background-image:var(--r220-malha);background-size:72px 72px}
