/* Marca — Palmetto Prestige Stone & Flooring. ARQUIVO ISOLADO DA IDENTIDADE (site.css só usa as variáveis).
   04/11/2026: logo aprovado (kit 06-identidade-visual/logo-thiago/). Tokens aproximados das tintas do logo:
   dourado #C09A49, grafite #2A2A2A e creme #F6F1E7 (versões para fundo escuro). Antes: cores do uniforme
   (#C9A253 / #121212), provisórias.
   Decisão (agência, 04/11): o topo e as superfícies escuras continuam em #121212 ("preto do uniforme"), mais escuro
   que o grafite do logo, porque o logo creme e dourado ganha contraste e o botão dourado se destaca mais
   (creme 16,64:1 e dourado 7,10:1 sobre #121212, contra 12,75 e 5,44 sobre #2A2A2A). O grafite fica para texto,
   títulos, botão em fundo claro e detalhes, como as letras do logo sobre branco.
   Contrastes (WCAG 2.x): grafite/branco 14,35 · grafite/creme 12,75 · branco sobre grafite (botão claro) 14,35 ·
   #121212 sobre dourado #C09A49 (botão em fundo escuro) 7,10, hover sobre #D4BA82 9,94 · dourado claro #D4BA82 sobre
   #121212 9,94, sobre #0A0A0A 10,51, sobre #1C1C1C 9,04 · dourado escuro #725A27 (links em fundo claro) sobre branco
   6,55 e sobre creme 5,82 · #4F4A42 (texto secundário) sobre creme 7,80 · grafite sobre #D4BA82 7,62 ·
   #C9C2B4 sobre preto profundo 11,18.
   Dourado #C09A49 NUNCA é texto sobre fundo claro (2,6:1): só fundo de botão em contexto escuro e detalhe decorativo.
   #D4BA82 e #725A27 são o dourado do logo com o mesmo matiz (41°) e a mesma saturação (49%), só mais claro/escuro. */

/* Títulos: Montserrat (a fonte mais próxima das letras do logo, conferência do kit). Texto corrido: Inter (site.css).
   Montserrat variável, só latin, @fontsource-variable/montserrat 5.3.0 (OFL 1.1, LICENSE-montserrat.txt). */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/montserrat-latin-variable.woff2') format('woff2');
}

:root {
  --c-char: #2A2A2A;       /* grafite do logo: títulos, texto, botão em fundo claro, detalhes escuros */
  --c-dark: #121212;       /* fundo escuro: topo, base do herói da home, texto do botão dourado, hover do botão claro */
  --c-char-900: #0A0A0A;   /* preto profundo: rodapé, barra fixa */
  --c-char-800: #1C1C1C;   /* painel do menu */
  --c-char-700: #2A2A2A;   /* subtítulo, legendas (= grafite do logo) */
  --c-bronze: #C09A49;     /* dourado do logo: botão em contexto escuro, detalhes (nunca texto em claro) */
  --c-bronze-300: #D4BA82; /* dourado claro: texto/detalhe sobre escuro, hover do botão dourado */
  --c-bronze-700: #725A27; /* dourado escuro: links e destaques em fundo claro */
  --c-gray: #E5DCC9;       /* linhas */
  --c-gray-100: #F6F1E7;   /* creme do logo: seções alternadas, herói interno */
  --c-silver: #C9C2B4;     /* texto secundário sobre preto profundo */
  --c-text: #2A2A2A;
  --c-muted: #4F4A42;      /* texto secundário em claro */
  --c-line: #E5DCC9;
  --c-white: #FFFFFF;
  --rgb-char: 18, 18, 18;  /* = --c-dark, para rgba() das camadas escuras e sombras */

  --font-head: 'Montserrat', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;

  --grad-brand: linear-gradient(135deg, #0A0A0A 0%, #121212 55%, #2A2A2A 100%);
  --grad-deep: linear-gradient(160deg, #0A0A0A 0%, #121212 60%, #1C1C1C 100%);
}

/* Logo (imagem) no topo e no rodapé: tamanhos em site.css (.brand .logo, .f-logo .logo). */

/* Nome em texto (modo 'text' de brand.mjs; fora de uso desde o logo aprovado, mantido como reserva). */
.brandmark { display: inline-flex; flex-direction: column; justify-content: center; line-height: 1; color: var(--c-bronze-300); font-family: var(--font-head); text-transform: uppercase; }
.brandmark .bm-1 { font-weight: 800; letter-spacing: .14em; font-size: 1.02rem; }
.brandmark .bm-2 { font-weight: 600; letter-spacing: .22em; font-size: .62rem; margin-top: 5px; color: #E8E2D4; }
.brandmark-footer .bm-1 { font-size: 1.15rem; }
.brandmark-footer .bm-2 { font-size: .7rem; }
@media (max-width: 479.98px) { .brandmark .bm-1 { font-size: .92rem; letter-spacing: .08em; } .brandmark .bm-2 { font-size: .58rem; letter-spacing: .15em; } }
@media (max-width: 359.98px) { .brandmark .bm-1 { font-size: .8rem; letter-spacing: .05em; } .brandmark .bm-2 { font-size: .5rem; letter-spacing: .1em; } }
@media (min-width: 1024px) { .brandmark-header .bm-1 { font-size: 1.12rem; } .brandmark-header .bm-2 { font-size: .68rem; } }