/*
 * theme.css — identidade visual do projeto.
 * ÚNICO arquivo que deve mudar para reaproveitar este esqueleto em outro
 * cliente/projeto: troque os valores abaixo, nunca as regras de styles.css.
 */
:root {
  /* Cores de marca — extraídas por amostragem de pixel das logos oficiais */
  --color-terracota: #BE5625;   /* Selos institucionais Ditolvo */
  --color-accent: #E67F0D;      /* CTAs, hover, destaques New Studio Paulista */
  --color-slate: #5F6E72;       /* Textos secundários, ícones — escurecido de #8F9EA2 (2.7:1, falhava AA como
                                    texto) para atingir >=5:1 sobre --color-bg e branco, mantendo a família
                                    cinza-azulada original */
  --color-ink: #2B2B2A;         /* Texto principal */
  --color-bg: #FAFAF9;          /* Fundo padrão das seções claras */
  --color-bg-alt: #F1EFEC;      /* Fundo alternado entre seções */
  --color-white: #FFFFFF;
  --color-accent-rgb: 230, 127, 13;   /* canais RGB de --color-accent, para uso em rgba() (ex.: sombras translúcidas) */
  --color-slate-rgb: 95, 110, 114;    /* canais RGB de --color-slate, para uso em rgba() (ex.: régua de fases do hero) */
  --color-accent-cta: #A65C09;        /* versão escurecida de --color-accent — usar SEMPRE que houver texto sobre esta
                                          cor (botões, texto ativo), pois #E67F0D com texto branco mede 2.84:1 (falha
                                          WCAG AA, mínimo 4.5:1); #A65C09 com branco mede ~5.05:1. --color-accent original
                                          continua disponível para usos não-textuais (sombras, ícones) onde a razão de
                                          contraste não se aplica. */
  --color-whatsapp: #25D366;          /* verde oficial do WhatsApp — não é cor de marca, mas mesma regra: só existe aqui */
  --color-whatsapp-rgb: 37, 211, 102; /* canais RGB de --color-whatsapp, para uso em rgba() */
  --color-white-rgb: 255, 255, 255;   /* canais RGB de --color-white, para uso em rgba() (ex.: divisor translúcido no rodapé escuro) */

  /* Tipografia */
  --font-heading: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  /* Espaçamento e forma */
  --radius-base: 12px;
  --radius-pill: 999px;
  --shadow-card: 0 8px 24px rgba(43, 43, 42, 0.08);
  --section-padding-y: 96px;
  --container-max: 1140px;
}

@media (max-width: 768px) {
  :root {
    --section-padding-y: 56px;
  }
}
