/* ==========================================================================
   TOKENS — Novena de Finados (camada de CAMPANHA)
   Única fonte de identidade. Só duas famílias:
     · DM Serif Display — SOMENTE h1/h2 (títulos principais de seção)
     · Montserrat — todo o resto
   Paleta: off-white, bege e areia; faixas escuras (#222) onde a logo vive,
   porque o degradê dela (#463224 → #E6CAB7 → #463224) precisa de fundo escuro.
   Verde = ação, sempre e só nos botões.
   ========================================================================== */

:root {
  /* ---- cores da marca ---------------------------------------------------- */
  --c-ivory: #fbf8f2;
  --c-cream: #f5efe4;
  --c-sand: #ece2d0;
  --c-bone: #dfd2bb;
  --c-espresso: #2a201a;
  --c-bronze: #8a6a52;
  --c-bronze-deep: #6e513c;
  --c-night: #222222;        /* igual ao print da faixa                       */
  --c-night-2: #3a2e26;
  --c-logo-dark: #463224;
  --c-logo-light: #e6cab7;
  --c-logo-mute: #9f8a7b;

  --c-green: #22de70;
  --c-green-bright: #5cf19b;
  --c-green-deep: #0cc45c;

  /* ---- papéis ------------------------------------------------------------ */
  --paper: var(--c-ivory);
  --ink: var(--c-espresso);
  --ink-soft: color-mix(in srgb, var(--ink) 80%, transparent);
  --ink-mute: color-mix(in srgb, var(--ink) 62%, transparent);

  --ink-on-night: #fbf8f2;
  --ink-on-night-soft: color-mix(in srgb, #fbf8f2 82%, transparent);
  --ink-on-night-mute: color-mix(in srgb, #fbf8f2 62%, transparent);

  --line: color-mix(in srgb, var(--c-bronze) 24%, transparent);
  --focus: var(--c-bronze);

  /* ação */
  --action: var(--c-green);
  --action-hover: var(--c-green-bright);
  --action-deep: var(--c-green-deep);
  --action-ink: #052a15;
  --sh-action: 0 12px 30px color-mix(in srgb, var(--c-green-deep) 42%, transparent);

  /* ---- degradês de destaque ------------------------------------------------ */
  --grad-hl: linear-gradient(95deg, #7a4a28 0%, #c88c55 50%, #7a4a28 100%);
  --grad-hl-night: linear-gradient(95deg, #fff4e0 0%, #f3dcb6 45%, #f1cfba 100%);
  --metal: linear-gradient(90deg, #6b5242 0%, #e6cab7 52%, #9f8a7b 100%);
  --grad-chip: linear-gradient(135deg, #8a6a52 0%, #5a4231 100%);

  /* ---- tipografia -------------------------------------------------------- */
  --font: "Montserrat", "Montserrat Fallback", system-ui, sans-serif;
  --font-serif: "DM Serif Display", "DM Serif Fallback", Georgia, "Times New Roman", serif;

  --t-body: 1.0625rem;
  --t-small: 0.875rem;
  --t-lead: clamp(1.0625rem, 0.98rem + 0.4vw, 1.25rem);
  --t-h1: clamp(2.3rem, 1.2rem + 3.5vw, 3.9rem);
  --t-h2: clamp(2rem, 1.4rem + 2.6vw, 3.4rem);
  --t-h3: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);

  --w-regular: 400;
  --w-medium: 500;
  --w-semi: 600;
  --w-bold: 700;

  --lh-body: 1.7;
  --lh-title: 1.08;
  --track-tight: -0.012em;

  /* ---- espaço e forma ---------------------------------------------------- */
  --gutter: clamp(1.25rem, 5vw, 2rem);
  --shell: 70rem;
  --col: 40rem;
  --section-y: clamp(4.5rem, 3rem + 7vw, 8rem);

  --r-s: 0.5rem;
  --r-m: 0.5rem;
  --r-l: 0.625rem;
  --r-pill: 999px;

  --shadow-card: 0 1px 2px color-mix(in srgb, var(--c-espresso) 6%, transparent),
                 0 22px 44px -26px color-mix(in srgb, var(--c-espresso) 32%, transparent);

  /* movimento: mola pesada, nunca linear */
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur: 0.7s;
}