/* ══════════════════════════════════════════════════════════════
   RP ADVISORY — DESIGN SYSTEM (tokens)
   Fonte única de verdade. Importado ANTES de style.css / admin.css.
   Nada de valor hardcoded nos arquivos de página a partir daqui.
   ══════════════════════════════════════════════════════════════ */
:root {

  /* ───────────────── COR ───────────────── */
  /* Marca */
  --color-brand:          #1B3A6B;             /* azul-marinho — a cor da marca */
  --color-brand-dark:     #142C52;             /* hover / profundidade */
  --color-brand-light:    #2C548A;             /* ~10% mais clara — detalhes/foco */
  --color-brand-pale:     rgba(27, 58, 107, .07);

  /* Tinta profunda (seções escuras, títulos) */
  --color-ink:            #0E1E3A;             /* marinho profundo */
  --color-ink-2:          #0A1730;             /* fim do gradiente marinho→escuro */
  --color-ink-surface:    #15294A;             /* superfície elevada em fundo escuro (cards admin) */

  /* Superfícies claras */
  --color-bg-primary:     #FFFFFF;
  --color-bg-secondary:   #F3F6FB;             /* seções alternadas */
  --color-bg-tertiary:    #FAFCFE;

  /* Texto */
  --color-text-primary:   #2C3A54;             /* corpo */
  --color-text-secondary: #5E6B81;             /* suporte (consolida 6B7689/6E7889) */
  --color-text-hint:      #93A0B4;             /* placeholders, captions */

  /* Linhas / prata */
  --color-border:         #E2E8F1;
  --color-border-strong:  #C3CDDC;             /* foco, scrollbar, destaque */
  --color-silver:         #9AA4B5;

  /* Semânticas */
  --color-success:        #2E9E6B;
  --color-warning:        #C2912B;
  --color-danger:         #D2453C;
  --color-on-brand:       #FFFFFF;

  /* Texto/linhas sobre fundo escuro */
  --color-on-ink:         #FFFFFF;
  --color-on-ink-soft:    rgba(255, 255, 255, .74);
  --color-on-ink-mute:    rgba(255, 255, 255, .62);
  --color-on-ink-faint:   rgba(255, 255, 255, .50);
  --color-on-ink-line:    rgba(255, 255, 255, .12);
  --color-on-ink-fill:    rgba(255, 255, 255, .06);
  --color-on-ink-edge:    rgba(255, 255, 255, .22);   /* contorno do globo */
  --color-field-focus:    rgba(255, 255, 255, .09);   /* fundo de input em foco (sobre escuro) */
  --color-scrim:          rgba(14, 30, 58, .55);       /* overlay de modal */

  /* ───────────────── TIPOGRAFIA ───────────────── */
  /* Família única Inter — variação pelo PESO conforme o tipo de texto */
  --font-titulo: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-corpo:  'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Escala fluida */
  --text-display:  clamp(2.5rem, 1.6rem + 3.6vw, 4.25rem);   /* hero */
  --text-headline: clamp(1.9rem, 1.4rem + 2.1vw, 3rem);      /* títulos de seção */
  --text-title:    clamp(1.15rem, 1.05rem + .5vw, 1.4rem);   /* cards / sub-títulos */
  --text-subhead:  clamp(1.05rem, 1rem + .4vw, 1.2rem);
  --text-lead:     clamp(1.05rem, 1rem + .35vw, 1.18rem);    /* parágrafos de destaque */
  --text-body:     1rem;        /* 16px */
  --text-small:    .875rem;     /* 14px */
  --text-caption:  .8125rem;    /* 13px */
  --text-label:    .6875rem;    /* 11px */
  --text-logo:     1.45rem;     /* wordmark "RP" (one-off de marca) */
  --text-stat:     2.25rem;     /* números grandes do painel admin */

  --font-w-regular:  400;
  --font-w-medium:   500;
  --font-w-semibold: 600;
  --font-w-bold:     700;
  --font-w-black:    800;

  --leading-display: 1.08;
  --leading-heading: 1.18;
  --leading-snug:    1.4;
  --leading-body:    1.7;
  --leading-relaxed: 1.9;

  --tracking-display: -0.03em;
  --tracking-tight:   -0.01em;
  --tracking-normal:  0;
  --tracking-loose:   0.02em;          /* tracking sutil de UI (botões, labels) */
  --tracking-label:   0.18em;
  --tracking-wide:    0.24em;

  /* ───────────────── ESPAÇO (base 8) ───────────────── */
  --space-1:  0.25rem;   /* 4  */
  --space-2:  0.5rem;    /* 8  */
  --space-3:  0.75rem;   /* 12 */
  --space-4:  1rem;      /* 16 */
  --space-5:  1.25rem;   /* 20 */
  --space-6:  1.5rem;    /* 24 */
  --space-8:  2rem;      /* 32 */
  --space-10: 2.5rem;    /* 40 */
  --space-12: 3rem;      /* 48 */
  --space-16: 4rem;      /* 64 */
  --space-20: 5rem;      /* 80 */
  --space-24: 6rem;      /* 96 */
  --space-32: 8rem;      /* 128 */

  /* Semânticos */
  --section-padding-y:   clamp(4rem, 2rem + 7vw, 8.5rem);
  --container-max:       1200px;
  --container-padding-x: clamp(1.25rem, .5rem + 3vw, 3rem);
  --card-padding:        clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem);
  --grid-gap:            clamp(1rem, .6rem + 1.4vw, 2rem);
  --nav-height:          72px;

  /* ───────────────── FORMA ───────────────── */
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   18px;
  --radius-pill: 999px;

  /* Sombras — tonalizadas no marinho (nunca preto puro) */
  --shadow-sm:    0 1px 3px rgba(14, 30, 58, .08), 0 1px 2px rgba(14, 30, 58, .05);
  --shadow-md:    0 8px 24px -10px rgba(14, 30, 58, .16), 0 3px 8px rgba(14, 30, 58, .06);
  --shadow-lg:    0 26px 60px -22px rgba(14, 30, 58, .30), 0 10px 22px -12px rgba(14, 30, 58, .12);
  --shadow-brand: 0 14px 34px -10px rgba(27, 58, 107, .34);

  /* ───────────────── MOVIMENTO ───────────────── */
  --ease-smooth: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out:    cubic-bezier(0.0, 0.0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --duration-fast: 150ms;
  --duration-mid:  300ms;
  --duration-slow: 600ms;

  /* ───────────────── GRADIENTES & GRAIN (sóbrio) ───────────────── */
  --gradient-ink:      linear-gradient(155deg, #1B3A6B 0%, #0E1E3A 58%, #0A1730 100%);
  --gradient-ink-soft: linear-gradient(180deg, #0E1E3A 0%, #0A1730 100%);
  --gradient-light:    linear-gradient(180deg, #FFFFFF 0%, #F3F6FB 100%);
  --gradient-nav:      linear-gradient(100deg, #0B172E 0%, #1B3A6B 125%);  /* menu marinho em degradê */

  /* Textura grain (feTurbulence inline, sem peso de rede) */
  --grain-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  --grain-opacity: 0.30;        /* opacidade da camada; com soft-light fica discreto/sóbrio */

  /* ═══════ ALIASES de compatibilidade (style.css legado não quebra) ═══════ */
  --cor-primaria:      var(--color-brand);
  --cor-primaria-hov:  var(--color-brand-dark);
  --cor-primaria-pale: var(--color-brand-pale);
  --cor-escura:        var(--color-ink);
  --cor-fundo:         var(--color-bg-primary);
  --cor-fundo-alt:     var(--color-bg-secondary);
  --cor-texto:         var(--color-text-primary);
  --cor-muted:         var(--color-text-secondary);
  --cor-borda:         var(--color-border);
  --cor-prata:         var(--color-silver);
  --cor-prata-esc:     var(--color-text-secondary);
  --fonte-display:     var(--font-titulo);
  --fonte-corpo:       var(--font-corpo);
  --max-w:             var(--container-max);
  --px:                var(--container-padding-x);
  --radius:            var(--radius-md);
  --ease:              var(--ease-smooth);
}
