/* Casa Offices — base: variáveis, tipografia, botões, topo e hero */
:root {
  --vermelho: #b91c1c;
  --vermelho-escuro: #8f1414;
  --vermelho-claro: #fde8e6;
  --grafite: #2a2a2c;
  --grafite-2: #3c3c3f;
  --tinta: #151516;
  --creme: #f6f3ee;
  --branco: #ffffff;
  --linha: rgba(21, 21, 22, .12);
  --texto-suave: #5e5e63;
  --raio: 28px;
  --sombra: 0 24px 60px -24px rgba(21, 21, 22, .35);
  --titulo: 'Bricolage Grotesque', 'Inter', system-ui, sans-serif;
  --corpo: 'Inter', system-ui, sans-serif;
  --largura: 1200px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; font-family: var(--corpo); color: var(--tinta); background: var(--creme); line-height: 1.55; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3 { font-family: var(--titulo); line-height: 1.02; letter-spacing: -.025em; margin: 0; font-weight: 800; }
h2 { font-size: clamp(2.2rem, 5vw, 3.8rem); }
p { margin: 0; }
.miolo { width: min(var(--largura), 100% - 40px); margin-inline: auto; }
.secao { padding: clamp(64px, 9vw, 120px) 0; }
.etiqueta { display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--vermelho); margin-bottom: 18px; }
.etiqueta::before { content: ''; width: 22px; height: 2px; background: currentColor; border-radius: 2px; }
.escuro .etiqueta { color: #ff8f86; }
:focus-visible { outline: 3px solid var(--vermelho); outline-offset: 3px; border-radius: 8px; }

/* Botões */
.botao { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 15px 28px; border-radius: 999px; font: 600 1rem var(--corpo); text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: transform .2s, background .2s, color .2s, border-color .2s; }
.botao:hover { transform: translateY(-2px); }
.botao-vermelho { background: var(--vermelho); color: var(--branco); }
.botao-vermelho:hover { background: var(--vermelho-escuro); }
.botao-contorno { border-color: var(--grafite); color: var(--grafite); background: transparent; }
.botao-contorno:hover { background: var(--grafite); color: var(--branco); }
.botao-claro { background: var(--branco); color: var(--tinta); }
.botao-grande { padding: 18px 34px; font-size: 1.05rem; }


/* Topo */
.topo { position: sticky; top: 0; z-index: 50; background: rgba(246, 243, 238, .88); backdrop-filter: blur(14px); border-bottom: 2px solid var(--grafite); }
.topo-linha { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 10px 0; }
.marca img { height: 46px; width: auto; }
.menu { font-size: .95rem; font-weight: 500; }
.menu a { text-decoration: none; color: var(--grafite); position: relative; }
.menu a::after { content: ''; position: absolute; left: 0; bottom: -4px; height: 2px; width: 0; background: var(--vermelho); transition: width .25s; }
.menu a:hover::after { width: 100%; }
.topo-acoes { display: flex; align-items: center; gap: 10px; }
.topo .botao { padding: 11px 22px; font-size: .92rem; }