/* ============================================================================
   Design tokens — Tecnisa
   Valores extraídos do site em produção e registrados em
   docs-tecnicos/00-design-system-referencia.md, seções 1.1 a 1.4.

   A paleta é deliberadamente monocromática, com o vermelho da marca como único
   acento cromático. Não introduzir cor nova sem validação do cliente.
   ========================================================================== */

:root {
  /* ---- cor: valores do design system ---- */
  --color-brand-red: #D50214;
  --color-text-on-dark: #FFFFFF;
  --color-bg-page: #F5F5F5;
  --color-bg-section-dark: #000000;
  --color-text-muted: #BABABA;
  --color-field-border: #E7E6E6;
  --color-field-placeholder: #818182;
  --color-disabled-bg: #E7E6E6;
  --color-disabled-text: #818182;

  /* ---- cor: derivados, não estão no design system ----
     São estados que a referência não documenta (hover, corpo de texto sobre
     fundo claro, linhas). Mantidos dentro da mesma família monocromática. */
  --color-brand-red-hover: #B00110;
  --color-text-body: #3A3A3C;
  --color-text-soft: #6B6B6E;
  --color-rule: #E2E1DE;
  --color-surface: #FFFFFF;

  /* ---- tipografia ----
     Calibri não existe em macOS nem em Linux; Carlito é a alternativa aberta
     com as mesmas métricas e cai no lugar sem alterar quebras de linha. */
  --font-base: Calibri, Carlito, Arial, Helvetica, sans-serif;

  --fs-h1: 52px;
  --lh-h1: 52px;
  --ls-h1: -2.08px;
  --fs-h2: 32px;
  --lh-h2: 44.8px;
  --fs-body: 16px;
  --fs-field: 20px;
  --fs-cta: 26px;
  --fs-small: 13px;

  --fw-light: 300;
  --fw-regular: 400;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* ---- forma ----
     Raio zero é traço de identidade, consistente em todo o domínio Tecnisa. */
  --radius: 0;
  --cta-padding: 15px 30px;
  --cta-border-width: 1.6px;

  /* ---- layout ---- */
  --container-max: 1140px;
  --gutter: 40px;
  --header-h: 72px;
  --channels-h: 62px;

  /* ---- profundidade ---- */
  --z-hero-media: 0;
  --z-hero-veil: 1;
  --z-hero-content: 2;
  --z-hero-ctrl: 3;
  --z-header: 40;
  --z-channels: 50;
  --z-skip: 60;
}

/* Breakpoints do Bootstrap 5, confirmados nas custom properties do site.
   Media query não lê custom property, então ficam registrados aqui como
   referência e repetidos literalmente em main.css:

     sm   576px
     md   768px      ← corte para coluna única
     lg   992px
     xl  1200px
     xxl 1400px                                                            */

@media (max-width: 767.98px) {
  :root {
    --fs-h1: 34px;
    --lh-h1: 34px;
    --ls-h1: -1.3px;
    --fs-h2: 21px;
    --lh-h2: 29px;
    --fs-field: 17px;
    --fs-cta: 20px;
    --gutter: 20px;
    --header-h: 64px;
    --channels-h: 64px;
  }
}