/* ---------------------------------------------------------------------------
   Design tokens do Projeto Dorcas
   Extraídos do site de referência (Wix) em 2026-07-31.
   Fonte: design/docs/design-system.md
   --------------------------------------------------------------------------- */

:root
{
    /* --- Cores de marca ------------------------------------------------- */
    --c-green: #0C763C;          /* primária: faixas, botões, destaques      */
    --c-green-dark: #095A2D;     /* hover/estado ativo (derivado)            */
    --c-green-light: #E7F1EA;    /* fundo suave (derivado)                   */

    --c-blue: #1091C7;           /* secundária: cards de impacto, ícones     */
    --c-blue-dark: #0C7099;      /* hover (derivado)                         */
    --c-blue-light: #E4F2F8;     /* fundo suave (derivado)                   */

    --c-gold: #E8AD21;           /* acento: chamadas de doação               */
    --c-gold-dark: #C08F16;      /* hover (derivado)                         */

    --c-navy: #092E6E;           /* institucional, usado em textos de apoio  */

    /* --- Neutros -------------------------------------------------------- */
    --c-bg: #FAFAFA;             /* fundo padrão das páginas                 */
    --c-bg-alt: #EFEEE7;         /* fundo de seções alternadas (off-white)   */
    --c-surface: #FFFFFF;        /* cards, header, rodapé claro              */
    --c-text: #333333;           /* texto corrente                           */
    --c-footer: #333333;         /* fundo do rodapé (cinza escuro no design) */
    --c-text-muted: #666666;
    --c-text-soft: #999999;
    --c-border: #CCCCCC;
    --c-on-dark: #FFFFFF;        /* texto sobre verde/azul/foto              */
    --c-danger: #B3261E;         /* erro de formulário                       */

    /* --- Tipografia ------------------------------------------------------ */
    /* Títulos: Nunito Sans (SIL OFL, auto-hospedada em /fnt)                */
    /* Corpo:   Roboto (já auto-hospedada no site atual)                     */
    --f-head: 'Nunito Sans', system-ui, -apple-system, sans-serif;
    --f-body: 'Roboto', system-ui, -apple-system, sans-serif;

    --fw-body: 400;
    --fw-medium: 500;
    --fw-bold: 700;
    --fw-black: 800;             /* peso dos títulos no design de referência */

    /* Escala tipográfica (desktop). Mobile em @media abaixo.               */
    --fs-h1: 2.75rem;            /* 44px / 1.4  / 800                        */
    --fs-h2: 2.125rem;           /* 34px / 1.3  / 800                        */
    --fs-h3: 1.5625rem;          /* 25px / 1.34 / 700                        */
    --fs-h4: 1.25rem;            /* 20px / 1.4  / 700                        */
    --fs-lead: 1.25rem;          /* 20px / 1.6                               */
    --fs-body: 1.125rem;         /* 18px / 1.67                              */
    --fs-small: 0.875rem;        /* 14px / 1.79                              */

    --lh-tight: 1.3;
    --lh-head: 1.4;
    --lh-body: 1.67;
    --lh-loose: 1.79;

    /* --- Espaçamento (escala de 4px) ------------------------------------ */
    --sp-1: 0.25rem;
    --sp-2: 0.5rem;
    --sp-3: 0.75rem;
    --sp-4: 1rem;
    --sp-5: 1.5rem;
    --sp-6: 2rem;
    --sp-7: 3rem;
    --sp-8: 4rem;
    --sp-9: 6rem;

    --section-y: var(--sp-9);        /* respiro vertical entre seções        */
    --section-y-sm: var(--sp-7);

    /* --- Layout ---------------------------------------------------------- */
    --container: 980px;          /* largura de conteúdo do design original   */
    --container-wide: 1200px;    /* seções de largura estendida              */
    --gutter: var(--sp-4);

    /* --- Formas ---------------------------------------------------------- */
    --r-card: 30px;              /* cards (impacto, conteúdo)                */
    --r-card-lg: 60px;
    --r-pill: 100px;             /* botões                                   */
    --r-sm: 8px;                 /* inputs, tags                             */

    /* --- Sombras --------------------------------------------------------- */
    --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 1px 4px rgba(0, 0, 0, 0.6);
    --shadow-soft: 0 0 14px rgba(0, 0, 0, 0.2);

    /* --- Movimento ------------------------------------------------------- */
    --t-fast: 120ms ease;
    --t-base: 200ms ease;

    /* --- Cabeçalho fixo ---------------------------------------------------- */
    --header-h: 72px;

    /* --- Camadas --------------------------------------------------------- */
    --z-header: 100;
    --z-menu: 200;
    --z-modal: 300;
    --z-totop: 90;
}

@media (max-width: 768px)
{
    :root
    {
        --fs-h1: 2rem;           /* 32px                                     */
        --fs-h2: 1.625rem;       /* 26px                                     */
        --fs-h3: 1.375rem;       /* 22px                                     */
        --fs-h4: 1.125rem;       /* 18px                                     */
        --fs-lead: 1.125rem;
        --fs-body: 1rem;

        --section-y: var(--sp-7);
        --section-y-sm: var(--sp-6);
        --gutter: var(--sp-5);

        --r-card: 24px;
    }
}

@media (prefers-reduced-motion: reduce)
{
    :root
    {
        --t-fast: 0ms;
        --t-base: 0ms;
    }
}
