/* Ramos Empreendimentos — tokens
   Origem: logo (#000/#FFF puros) + conteúdo (relatório de conclusão de obra industrial).
   Monocromático por natureza da marca, não por preferência aplicada. */

:root {
  /* ---- Superfície (concreto) ---- */
  --preto:        #000000;  /* da logo, exato */
  --grafite:      #111111;  /* placa preta com respiro do preto absoluto */
  --carvao:       #1C1C1C;
  --concreto-900: #3A3A3A;
  --concreto-700: #6B6B6B;
  --concreto-500: #9A9A9A;
  --concreto-300: #C9C6C2;  /* leve quebra de saturação: cimento, não cinza-tela */
  --concreto-200: #DEDBD6;
  --concreto-100: #EDEAE5;
  --concreto-50:  #F6F4F1;
  --branco:       #FFFFFF;  /* da logo, exato */

  /* ---- Papéis ---- */
  --bg:            var(--concreto-50);
  --bg-alt:        var(--concreto-100);
  --bg-placa:      var(--preto);      /* hero, CTA, rodapé — o fundo nativo da marca */
  --texto:         var(--preto);
  --texto-2:       var(--concreto-900);
  --texto-3:       var(--concreto-700);
  --texto-inv:     var(--branco);
  --texto-inv-2:   rgba(255,255,255,.72);
  --texto-inv-3:   rgba(255,255,255,.48);
  --linha:         rgba(0,0,0,.14);   /* o filete de 1px, no lugar do acento colorido */
  --linha-forte:   rgba(0,0,0,.30);
  --linha-inv:     rgba(255,255,255,.18);
  --linha-inv-forte: rgba(255,255,255,.38);

  /* ---- Tipografia ---- */
  --f-display: 'Archivo', 'Archivo Expanded', system-ui, -apple-system, 'Helvetica Neue', sans-serif;
  --f-texto:   'Archivo', system-ui, -apple-system, 'Helvetica Neue', sans-serif;
  --f-dado:    'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* escala fluida — display em caixa-alta, entrelinha travada */
  --t-hero:  clamp(2.4rem, 5.6vw, 5.1rem);
  --t-h1:    clamp(2.1rem, 5vw, 4.1rem);
  --t-h2:    clamp(1.5rem, 3.4vw, 2.9rem);   /* piso menor: palavra longa em caixa-alta a 320px */
  --t-h3:    clamp(1.18rem, 1.7vw, 1.5rem);
  --t-dado:  clamp(2.1rem, 4.4vw, 3.4rem);   /* números do relatório */
  --t-corpo: clamp(1rem, 1.06vw, 1.09rem);
  --t-peq:   .875rem;
  --t-rotulo: .69rem;   /* mono caixa-alta, tracking largo */

  --lh-display: .94;
  --lh-titulo: 1.06;
  --lh-corpo: 1.62;
  --tr-display: -.022em;
  --tr-rotulo: .19em;
  --tr-wordmark: .26em;  /* medido no wordmark da logo */

  /* ---- Ritmo ---- */
  --e-1: .25rem;  --e-2: .5rem;   --e-3: .75rem;  --e-4: 1rem;
  --e-5: 1.5rem;  --e-6: 2rem;    --e-7: 3rem;    --e-8: 4rem;
  --e-9: 6rem;    --e-10: 8rem;   --e-11: 11rem;
  --secao-y: clamp(4.5rem, 9vw, 9rem);
  --gut: clamp(1.25rem, 4vw, 3.5rem);
  --max: 1280px;
  --max-texto: 62ch;

  /* ---- Forma ---- */
  --raio: 0;                 /* a marca é ângulo reto e chanfro */
  --chanfro: 18px;           /* do corte diagonal da perna do R */
  --ponto: 0.28em;           /* diâmetro do ponto do "RE." usado como marcador */
  --dur: .55s;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* O ponto da marca como marcador de fim de título */
.ponto::after {
  content: '';
  display: inline-block;
  width: var(--ponto); height: var(--ponto);
  border-radius: 50%;
  background: currentColor;
  margin-left: .18em;
  vertical-align: baseline;
}

/* Rótulo em mono caixa-alta — o "eyebrow" do relatório */
.rotulo {
  font-family: var(--f-dado);
  font-size: var(--t-rotulo);
  letter-spacing: var(--tr-rotulo);
  text-transform: uppercase;
  color: var(--texto-3);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: .001s; }
}