/* =====================================================================
   OFICINA ONLINE · BISCOITOS FUNCIONAIS COM CHÁS
   Paleta da oficina. Todo o desenho vem de css/lp-oficina.css.

   O tema pede duas coisas ao mesmo tempo: forno (farinha, aveia,
   manteiga) e chá (erva, infusão). A paleta pega as duas pontas do
   manual — o creme que ele chama de "fundo principal", o taupe da
   farinha e o verde-menta do chá, que é o que faz o CTA saltar.
   Ilustração: assets/ilustracoes/ervilha--biscoitos.svg — a folhagem
   do manual (pág. 12) recolorida com duas cores desta mesma paleta.

   CONTRASTE MEDIDO
   charcoal como texto sobre  creme 11.76:1 · taupe 9.41:1 ·
                              palha 12.12:1 · menta 6.39:1 · branco 13.52:1
   charcoal-suave  sobre      creme 5.07:1 · palha 5.22:1 · branco 5.83:1
                              (NÃO usar sobre taupe — 4.06:1)
   menta como texto           só sobre charcoal (6.39:1). Sobre branco
                              2.12:1, creme 1.84:1, taupe 1.47:1 — nos
                              fundos claros ele é chapa, nunca letra.
   ===================================================================== */

:root{
  --p-fundo : var(--ft-creme);          /* 2281 C  · chapa base            */
  --p-quente: var(--ft-taupe);          /* 5807 C  · chapa quente          */
  --p-forte : var(--ft-verde-menta);    /* 2218 C  · CTA, acento           */
  --p-luz   : var(--ft-amarelo-palha);  /* 0131 C  · grifo e realce        */
  --p-tinta : var(--ft-charcoal);       /* 7519 C  · texto e chapa escura  */
}

/* O taupe é a única chapa desta paleta que reprova com o texto
   secundário (4.06:1), então sobre ele o corpo vai em charcoal cheio.
   A regra vale só pro texto que encosta NA chapa — dentro da .virada
   o fundo é charcoal, e ali o charcoal sumiria. */
.t-quente > .wrap > .cab > .lead{color:var(--tx)}

/* O manual não tem ilustração de biscoito. A folhagem da vagem (pág. 12)
   é o motivo que mais conversa com o chá, então ela entra espelhada:
   as folhas ficam na parte visível e a vagem sai de quadro pela borda. */
.hero .ilu{transform:scaleX(-1);left:-16%;top:22%;width:min(42%,470px)}
.receitas .ilu{transform:scaleX(-1);right:-14%;bottom:-20%;width:min(38%,430px)}