/* =========================================================================
   TESTE 09/10 — textura no fundo de «Não é um bot. É um vendedor que não dorme.»
   Pedido do dono, com a foto do grão da akrosconsultoria.com.br: «troque o
   fundo da seção por essa textura mas na cor cinza padrão. É só um teste»;
   depois «quero o grão muito fininho».

   A receita é a `.bg-grain` da consultoria (SVG feTurbulence fractalNoise,
   2 oitavas, ladrilho 140 px), com três trocas:
   - cinza: a luminância vira R=G=B (lá o ruído é colorido, verde/vermelho);
   - opaco e centrado no papel #F2F6F8 (feComponentTransfer, slope .45), para
     o fundo seguir o cinza padrão de claro.css — o da consultoria, com alfa
     de ruído, escurecia o papel para #E6E9EA;
   - frequência 1.2 (lá 0.8): o SVG é desenhado na resolução da tela, e o
     grão sai com 1 pixel do aparelho em 1x, 1,25x, 1,5x e 2x (medido:
     vizinho/desvio 1,05–1,18, desvio ≈8,7, média #F1F5F6). A 0.8 o grão
     engrossa em retina; a 2.0 some em tela 1x.
   A imagem PNG das versões anteriores era reamostrada em tela com escala
   (125%/150% do Windows) e virava borrão grosso.

   09/10, depois: «ainda tá com muita falha». O SVG deixava uma grade de pontos
   sem grão a cada 5 px (o nó do Perlin no centro do pixel); o grão agora vem
   de js/textura-teste.js (ruído branco num canvas na resolução da tela) e
   este SVG fica só para quem estiver sem JS.

   DESFAZER: apagar as duas linhas do teste no index.html.
   ========================================================================= */
/* 15/10, o dono: o cinza-quente #F6F6F4 no lugar do #F4F8FA (o SVG centra
   em 246/246/244; o grão do canvas está em js/textura-teste.js) */
#top #diferenciais.bloco.claro{
  background-color:#F6F6F4;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='matrix' values='.2126 .7152 .0722 0 0 .2126 .7152 .0722 0 0 .2126 .7152 .0722 0 0 0 0 0 0 1'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='.45' intercept='.7397'/%3E%3CfeFuncG type='linear' slope='.45' intercept='.7397'/%3E%3CfeFuncB type='linear' slope='.45' intercept='.7319'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:140px 140px;
}
/* «troque o fundo»: o mosaico de triângulos (::before, mosaico-marca.svg a .12)
   sai desta seção enquanto a textura estiver no lugar */
#top #diferenciais.bloco.claro::before{display:none}
/* o grão do canvas: um pixel do ladrilho = um pixel da tela, sem suavizar (o
   image-rendering é herdado: o conteúdo da seção volta ao normal) */
#top #diferenciais.bloco.claro.grao-vivo{image-rendering:pixelated}
#top #diferenciais.grao-vivo > *{image-rendering:auto}
