/* ===== Fontes auto-hospedadas ===== */
@font-face{
  font-family:'Libre Franklin';
  font-weight:500;
  font-style:normal;
  font-display:swap;
  src:url('../fonts/LibreFranklin-Medium.ttf') format('truetype');
}
@font-face{
  font-family:'Libre Franklin';
  font-weight:700;
  font-style:normal;
  font-display:swap;
  src:url('../fonts/LibreFranklin-Bold.ttf') format('truetype');
}
@font-face{
  font-family:'Libre Franklin';
  font-weight:900;
  font-style:normal;
  font-display:swap;
  src:url('../fonts/LibreFranklin-Black.ttf') format('truetype');
}
@font-face{
  font-family:'Open Sans';
  font-weight:400;
  font-style:normal;
  font-display:swap;
  src:url('../fonts/OpenSans-Regular.ttf') format('truetype');
}
@font-face{
  font-family:'Open Sans';
  font-weight:600;
  font-style:normal;
  font-display:swap;
  src:url('../fonts/OpenSans-SemiBold.ttf') format('truetype');
}
@font-face{
  font-family:'Open Sans';
  font-weight:700;
  font-style:normal;
  font-display:swap;
  src:url('../fonts/OpenSans-Bold.ttf') format('truetype');
}

/* ===== Tokens de marca =====
   Amarelo e verde da identidade real da Faces & Vozes (facesevozes.org.br).
   Nomes de variável neutros de propósito: a página do Recovery Day carrega um
   segundo arquivo (recovery-day-theme.css) que redefine estes mesmos nomes
   para os tons roxos/índigo daquela campanha — só ali. */
:root{
  /* marca — Faces & Vozes (amarelo + verde) */
  --marca-600:#FC9F00;        /* amarelo — usado nos títulos, links de nav ativos e detalhes */
  --marca-700:#0CB75B;        /* verde — cor de ação: botões, links, ícones */
  --escuro-marca:#0E3B23;     /* verde-floresta profundo — fundo de seções escuras/rodapé */
  --escuro-marca-glow:#1F6B41; /* verde mais vivo, usado no brilho do degradê do hero escuro */
  --marca-suave:#FFC24D;      /* dourado — texto/detalhes sobre fundo escuro (contraste com o verde) */
  --marca-suave-hover:#FFD37A; /* dourado mais claro, hover do botão --btn-on-dark */
  --marca-tint:#EAF6ED;       /* verde bem claro — fundo de selos/pills/tags */
  --texto-em-escuro:#E4D7B0;  /* texto secundário sobre fundo escuro (dourado claro) */
  --texto-em-escuro-medio:#C9BA88;  /* texto terciário sobre fundo escuro (rodapé) */
  --texto-em-escuro-fraco:#9CA895;  /* texto mais apagado sobre fundo escuro (linha fina do rodapé) */

  /* roxo "de sinalização" do item Recovery Day no menu — fixo em toda página,
     não faz parte do tema que troca por página (por isso não é redefinido
     em recovery-day-theme.css) */
  --recovery-day-roxo:#61407F;
  --recovery-day-roxo-tint:#F1ECF6;

  /* neutros com leve viés de verde */
  --tinta:#22291F;
  --grafite:#5B655F;
  --fumaca:#8B948E;
  --linha:#DCE8DF;
  --papel:#FAFCF9;
  --creme:#F1F7EE;
  --branco:#FFFFFF;

  /* semântico (separado do accent) */
  --sucesso:#2E7D5B;
  --sucesso-bg:#E7F4EE;
  --erro:#B23A3A;
  --erro-bg:#FBEAEA;

  /* papéis */
  --bg:var(--papel);
  --superficie:var(--branco);
  --texto:var(--tinta);
  --texto-suave:var(--grafite);
  --accent:var(--marca-600);
  --accent-forte:var(--marca-700);

  --sombra:0 1px 2px rgba(14,59,35,0.06), 0 12px 32px rgba(14,59,35,0.08);
  --raio:14px;
  --raio-sm:8px;

  --largura-conteudo:1120px;
  --largura-leitura:680px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--texto);
  font-family:'Open Sans',Arial,sans-serif;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:'Libre Franklin',Arial,sans-serif;
  font-weight:900;
  letter-spacing:-0.01em;
  text-wrap:balance;
  color:var(--texto);
  margin:0 0 .5em;
}
h1{font-size:clamp(2.1rem,4.2vw,3.4rem);line-height:1.08;}
h2{font-size:clamp(1.6rem,2.6vw,2.3rem);line-height:1.15;}
h3{font-size:1.3rem;line-height:1.3;font-weight:700;}
p{margin:0 0 1em;}
a{color:var(--accent-forte);text-decoration:none;}
img{max-width:100%;display:block;}
ul{margin:0;padding:0;}
.container{max-width:var(--largura-conteudo);margin:0 auto;padding:0 24px;}
.prose{max-width:var(--largura-leitura);}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Open Sans',sans-serif;font-weight:700;font-size:12.5px;
  letter-spacing:0.12em;text-transform:uppercase;color:var(--accent-forte);
}
.eyebrow::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--accent-forte);}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}

:focus-visible{outline:3px solid var(--accent-forte);outline-offset:2px;border-radius:4px;}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important;transition-duration:0.001ms !important;}
}
