/* =============================================================================
   Seu Imaginário — tokens de identidade
   Fonte única de cor, tipografia, ritmo e movimento.

   Regra do projeto: nenhum hex novo entra em outro CSS. Se um componente precisa
   de uma cor, ele consome um token --si-*. Paleta extraída do logo oficial
   (portal/static/brand/source/logo-seu-imaginario-2026-horizontal.png).
   Contraste de cada par verificado em WCAG 2.1 AA — ver
   docs/superpowers/plans/2026-09-23-identidade-visual-logo-oficial.md §3.2.
   ============================================================================= */

@font-face { font-family: Fraunces; src: url('../fonts/fraunces.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: Manrope; src: url('../fonts/manrope.woff2') format('woff2'); font-weight: 200 800; font-style: normal; font-display: swap; }

:root {
  /* --- base e superfícies ------------------------------------------------- */
  --si-noite: #0B0611;            /* fundo canônico (preto de tinta do selo) */
  --si-carvao: #140B1E;           /* nav, faixas, rodapé */
  --si-ameixa: #24102F;           /* superfície elevada no escuro */
  --si-roxo: #3F0261;             /* profundidade, gradiente, borda interna */

  /* --- ametista: ação ----------------------------------------------------- */
  --si-violeta: #A527D8;          /* ação primária */
  --si-violeta-medio: #8B1FC4;    /* fundo de botão com texto branco (6,79:1) */
  --si-violeta-claro: #C97BF0;    /* hover, link e foco no escuro */
  --si-violeta-texto: #7B1FBF;    /* ametista legível sobre papel (7,18:1) */

  /* --- metais: moldura e assinatura --------------------------------------- */
  --si-ouro-claro: #F4D89A;
  --si-ouro: #D9A94E;
  --si-bronze: #875D1F;           /* o ouro só vira bronze sobre fundo claro */

  /* --- joias: estados ----------------------------------------------------- */
  --si-esmeralda: #1E7A44;
  --si-esmeralda-claro: #63C489;
  --si-esmeralda-suave: #E9F3EC;  /* fundo de confirmação */
  --si-esmeralda-papel: #F1F5EC;  /* superfície clara com o verde dos cristais */
  --si-rubi: #A50725;
  --si-rubi-claro: #E86A7C;       /* rubi legível no escuro (6,47:1) */
  --si-rubi-suave: #F9E7E7;       /* fundo de alerta (rubi sobre ele: 6,4:1) */
  --si-azul-noite: #01295A;
  --si-ambar: #B4721B;
  --si-ambar-suave: #FBF0DA;
  --si-ambar-texto: #6E4410;

  /* --- tinta e papel ------------------------------------------------------ */
  --si-marfim: #F7EFDD;
  --si-pergaminho: #FFF9EF;
  --si-pergaminho-2: #F7F0E3;     /* superfície clara secundária (faixas alternadas) */
  --si-tinta: #24182A;
  --si-tinta-suave: #5E5568;      /* 6,74:1 sobre pergaminho */
  --si-neblina: #C7B6D6;          /* 10,58:1 sobre noite */
  --si-linha-clara: #E4D9C8;      /* borda sobre papel */

  /* --- gradientes e sombras ----------------------------------------------- */
  --si-ouro-metal: linear-gradient(135deg, #F4D89A 0%, #D9A94E 46%, #875D1F 100%);
  --si-violeta-metal: linear-gradient(140deg, #A527D8 0%, #7B1FBF 55%, #3F0261 100%);
  --si-vidro: linear-gradient(150deg, rgba(255,255,255,.10), rgba(0,0,0,.28));
  --si-sombra: 0 24px 70px rgba(10, 5, 14, .35);
  --si-sombra-suave: 0 18px 45px rgba(8, 4, 12, .22);
  --si-filete: rgba(244, 216, 154, .16);

  /* --- tipografia --------------------------------------------------------- */
  --si-display: Fraunces, Georgia, "Times New Roman", serif;
  --si-body: Manrope, "Segoe UI", system-ui, -apple-system, sans-serif;
  --si-fs-display: clamp(2.9rem, 6.2vw, 5.6rem);
  --si-fs-h1: clamp(2.4rem, 4.6vw, 3.6rem);
  --si-fs-h2: clamp(1.8rem, 3.2vw, 2.6rem);
  --si-fs-h3: clamp(1.25rem, 2vw, 1.5rem);
  --si-fs-body: 1rem;
  --si-fs-small: .86rem;
  --si-fs-micro: .74rem;

  /* --- ritmo, forma e movimento ------------------------------------------- */
  --si-section: clamp(64px, 9vw, 120px);
  --si-radius: 20px;
  --si-radius-panel: 28px;
  --si-radius-pill: 999px;
  --si-ease: cubic-bezier(.2, .8, .2, 1);
  --si-tempo: 220ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --si-tempo: 0ms; }
}