/*
 * Tokens de design do CEOD PR 2026 — fonte única da paleta e da tipografia,
 * compartilhada pelas 4 páginas. Direção: restrained/editorial (referência
 * apple.com) — tipografia grande e confiante, muito espaço, sem glow, sem
 * gradiente decorativo, sem cartão-com-sombra-em-tudo. Seções alternam
 * fundo escuro (.on-dark) e claro (.on-light); os tokens de cor são
 * escopados por essas classes, não por :root global, porque a mesma página
 * usa os dois.
 */

:root {
    /* Marca — constantes, não mudam por seção */
    --verde-escuro: #0F5132;
    --verde-medio: #198754;
    --dourado: #C9A45C;
    --off-white: #F5F2E9;
    --branco: #FFFFFF;

    /* Tipografia: stack do sistema (SF Pro no Mac/iOS, Segoe UI no Windows) —
       nenhum font-face pra baixar, cada visitante vê a fonte nativa do
       próprio aparelho, igual ao efeito real do site da Apple. */
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

    /* Raio — dois valores, usados por papel, não em tudo igual */
    --raio-sm: 8px;
    --raio-lg: 20px;

    --transicao: 400ms cubic-bezier(.16, 1, .3, 1);
}

/* Seção com fundo escuro (verde quase-preto, nunca preto puro) */
.on-dark {
    --bg: #0A1811;
    --text: #F3EFE4;
    --text-dim: #92A199;
    --border: rgba(243, 239, 228, 0.12);
    --accent: #D9B370;
    --accent-strong: #E6C989;
    --link: #3ECB84;
    background: var(--bg);
    color: var(--text);
}

/* Seção com fundo claro */
.on-light {
    --bg: #FFFFFF;
    --text: #14241C;
    --text-dim: #5B6B61;
    --border: rgba(20, 36, 28, 0.10);
    --accent: #9C7A38;
    --accent-strong: #7C6029;
    --link: #147A45;
    background: var(--bg);
    color: var(--text);
}

/* Variante clara levemente crua, pra separar seções claras adjacentes */
.on-light.tint {
    --bg: var(--off-white);
}

* {
    box-sizing: border-box;
}

html {
    font-family: var(--font-sans);
}

body {
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    margin: 0;
}

h1, h2, h3 {
    font-weight: 600;
    letter-spacing: -0.015em;
    text-wrap: balance;
    margin: 0;
}

p { margin: 0; }

button, input, select, textarea {
    font-family: inherit;
}

/*
 * Estado inicial dos elementos revelados por scroll. Só entra em vigor
 * depois que o JS confirma que a Motion carregou e o usuário não pediu
 * "prefers-reduced-motion" (classe .motion-armed no <html>) — sem isso,
 * o conteúdo nunca fica invisível por causa de um script que falhou.
 */
.motion-armed [data-reveal] {
    opacity: 0;
    transform: translateY(14px);
}

.motion-armed [data-reveal-img] {
    opacity: 0;
    transform: scale(1.04);
}