/* ==========================================================================
   GODS CALENDAR — tokens
   Base: design.md (programa.design + Azul da ONU) + roseta da marca gods.
   ========================================================================== */

:root {
  /* --- Primária: Azul da ONU ------------------------------------------- */
  --color-primary:       #0B87B6;
  /* mesmo azul, um passo mais escuro: é o único que aguenta texto branco
     por cima (4,85:1). O --color-primary segue para traço, ponto e tinta. */
  --color-primary-strong: #0A7AA4;
  --color-primary-dark:  #123B59;
  --color-primary-light: #7FCBE3;
  --color-primary-pale:  #EAF5F8;
  --color-accent:        #D85F4B;
  --color-accent-pale:   #FAECE8;

  /* --- Neutros quentes -------------------------------------------------- */
  --color-neutral-0:   #FFFFFF;
  --color-neutral-50:  #FBFAF6;
  --color-neutral-100: #F5F3ED;
  --color-neutral-200: #E4E6E5;
  --color-neutral-300: #A8B0B4;
  --color-neutral-400: #5F6B71;  /* 4,95:1 no papel — o #66737A parava em 4,41 */
  /* Accessible small text on the approved cream surfaces. */
  --color-text-muted:  #606D74;
  --color-neutral-600: #344650;
  --color-neutral-700: #20343F;
  --color-neutral-800: #102833;

  /* --- Funcionais ------------------------------------------------------- */
  --color-success: #198754;
  --color-warning: #FFC107;
  --color-danger:  #FF427B;

  /* --- Roseta da marca (acentos por categoria/timeline) ------------------ */
  --brand-azul:    #244366;
  --brand-ciano:   #00A5C6;
  --brand-verde:   #009640;
  --brand-amarelo: #FBB907;
  --brand-laranja: #F28F2C;
  --brand-vermelho:#DC1E2A;
  --brand-rosa:    #E6185F;

  /* --- Cores oficiais dos 17 ODS da ONU ---------------------------------- */
  --ods-01: #E5243B;
  --ods-02: #DDA63A;
  --ods-03: #4C9F38;
  --ods-04: #C5192D;
  --ods-05: #FF3A21;
  --ods-06: #26BDE2;
  --ods-07: #FCC30B;
  --ods-08: #A21942;
  --ods-09: #FD6925;
  --ods-10: #DD1367;
  --ods-11: #FD9D24;
  --ods-12: #BF8B2E;
  --ods-13: #3F7E44;
  --ods-14: #0A97D9;
  --ods-15: #56C02B;
  --ods-16: #00689D;
  --ods-17: #19486A;

  /* --- Tipografia ------------------------------------------------------- */
  --font-display: "Poppins", system-ui, sans-serif;
  --font-body: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "Poppins", system-ui, sans-serif;

  --text-xxxxl: 80px;
  --text-xxxl:  60px;
  --text-xxl:   44px;
  --text-xl:    36px;
  --text-l:     24px;
  --text-m:     20px;
  --text-s:     16px;
  --text-xs:    14px;
  --text-xxs:   12px;

  /* --- Espaçamento ------------------------------------------------------ */
  --space-4:  4px;
  --space-8:  8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-60: 60px;
  --space-80: 80px;
  --space-120: 120px;

  --header-height: 72px;
  --container-2xl: 1260px;   /* = largura de conteúdo da referência */
  --container-main: 915px;   /* coluna principal */
  --container-aside: 320px;  /* coluna lateral */
  --gutter: 16px;

  /* --- Raio ------------------------------------------------------------- */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   14px;
  --radius-pill: 50rem;

  /* --- Sombra ----------------------------------------------------------- */
  --shadow-button: 0 1px 2px rgba(18,59,89,.12), 0 0 0 1px rgba(18,59,89,.08);
  --shadow-card:   0 12px 36px rgba(18,59,89,.08);
  --shadow-lg:     0 24px 64px rgba(18,59,89,.16);

  /* --- Movimento -------------------------------------------------------- */
  --ease-out: cubic-bezier(.23,1,.32,1);   /* ease-out forte; a "decelerate" era fraca */
  --ease-chegada: cubic-bezier(.16,1,.3,1); /* desaceleração longa: chegada confiante */
  --ease-in-out: cubic-bezier(.4,0,.2,1);
  --toc-height: 52px;   /* tira do índice, que gruda abaixo do cabeçalho */
  --duration: .15s;
  --duration-slow: .4s;
}

@media (min-width: 768px) { :root { --gutter: 24px; } }