/* ============================================================
   base.css — reset, tipografia, utilitários de página
   Depende de: tokens.css
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;}
html{
  scroll-behavior:smooth;
  /* impede o iOS de aumentar a fonte sozinho ao girar o aparelho */
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} }

body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font-body); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  /* palavras longas (e-mail, URL) quebram em vez de esticar a página */
  overflow-wrap:break-word;
}

img{max-width:100%;}
/* títulos em Archivo, peso 700 */
h1,h2,h3,h4{font-family:var(--font-display); font-weight:700; margin:0; text-wrap:balance; color:inherit;}
p{margin:0;}
a{color:inherit;}
button{font-family:inherit;}
::selection{background:var(--accent-soft); color:var(--accent-strong);}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}

/* ---------- estrutura de página ---------- */
.container{max-width:1220px; margin-inline:auto; padding-inline:clamp(1.25rem,4vw,3rem);}
/* As seções usam o fundo da página (--bg); só o hero tem foto própria.
   Quem somos, Fundiária e Consultoria ganham faixa branca (--bg-white),
   definida em sections.css. */
.section{padding-block:clamp(4.25rem,8vw,7rem); scroll-margin-top:calc(var(--header-h) + 10px);}

/* ---------- títulos de seção ---------- */
.eyebrow{
  font-family:var(--font-label);
  font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--clay);
  margin:0 0 .9rem;
}
/* A Archivo é larga e pesada em 700: letras um pouco mais juntas e
   entrelinha mais curta deixam o título compacto */
h2.title{font-size:clamp(1.9rem,1.2rem + 2.6vw,2.7rem); line-height:1.15; letter-spacing:-.02em;}
h2.title em{font-style:italic; color:var(--accent);}
.lede{max-width:46ch; color:var(--ink-soft); font-size:1.05rem;}

/* ---------- ícones ---------- */
.ic{ width:24px; height:24px; stroke:currentColor; stroke-width:1.6; fill:none; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

/* ---------- animação de entrada (ver js/modules/reveal.js) ---------- */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease; }
.reveal.is-visible{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion:reduce){ .reveal{ transition:none; opacity:1; transform:none; } }
