/* ==========================================================================
   Dr. Rodrigo Godoy Ribeiro — Design Tokens
   Fonte única de verdade da marca. Cores extraídas do logotipo (bronze).
   ========================================================================== */

:root {
  /* ---- Marca / Bronze (do gradiente do logotipo) ---- */
  --rg-espresso:   #4A2814;
  --rg-bronze:     #6E3E20;   /* cor principal da marca */
  --rg-copper:     #A9714A;
  --rg-rose-gold:  #C89B72;

  /* ---- Neutros quentes ---- */
  --rg-ivory:      #F3ECE2;   /* fundo base */
  --rg-parchment:  #FBF7F1;   /* superfícies / cards */
  --rg-sand:       #EFE6D9;   /* superfície alternativa */
  --rg-graphite:   #171009;   /* fundo escuro / tinta forte */

  /* ---- Texto ---- */
  --rg-ink:        #241A12;   /* texto principal */
  --rg-ink-soft:   #6E6156;   /* texto secundário */
  --rg-ink-faint:  #9A8B7B;   /* legendas / apoio */

  /* ---- Linhas / bordas ---- */
  --rg-hairline:      rgba(74, 40, 20, 0.16);
  --rg-hairline-soft: rgba(74, 40, 20, 0.09);

  /* ---- Semânticas (separadas da cor de marca) ---- */
  --rg-success: #5B6E3A;
  --rg-warning: #B07A2E;
  --rg-danger:  #9A3B2E;
  --rg-info:    #4A6A72;

  /* ---- Papéis (tokens semânticos que os componentes usam) ---- */
  --rg-bg:            var(--rg-ivory);
  --rg-surface:       var(--rg-parchment);
  --rg-surface-2:     var(--rg-sand);
  --rg-text:          var(--rg-ink);
  --rg-text-muted:    var(--rg-ink-soft);
  --rg-accent:        var(--rg-bronze);
  --rg-accent-hover:  var(--rg-espresso);
  --rg-on-accent:     #F7F1EA;
  --rg-border:        var(--rg-hairline);

  /* ---- Tipografia ---- */
  --rg-font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --rg-font-body:    "Mulish", -apple-system, system-ui, "Segoe UI", sans-serif;

  --rg-text-xs:  0.75rem;   /* 12px — rótulos */
  --rg-text-sm:  0.875rem;  /* 14px */
  --rg-text-md:  1.0625rem; /* 17px — corpo */
  --rg-text-lg:  1.25rem;   /* 20px */
  --rg-text-xl:  1.75rem;   /* 28px */
  --rg-text-2xl: 2.5rem;    /* 40px */
  --rg-text-3xl: 3.5rem;    /* 56px — display */

  --rg-leading-tight: 1.05;
  --rg-leading-snug:  1.3;
  --rg-leading-body:  1.6;
  --rg-tracking-label: 0.24em;

  /* ---- Espaçamento (escala 4px) ---- */
  --rg-space-1: 4px;
  --rg-space-2: 8px;
  --rg-space-3: 12px;
  --rg-space-4: 16px;
  --rg-space-5: 24px;
  --rg-space-6: 32px;
  --rg-space-7: 48px;
  --rg-space-8: 64px;

  /* ---- Raio ---- */
  --rg-radius-sm:  3px;
  --rg-radius-md:  6px;
  --rg-radius-lg:  12px;
  --rg-radius-pill: 100px;

  /* ---- Elevação ---- */
  --rg-shadow-sm: 0 1px 2px rgba(74,40,20,0.08);
  --rg-shadow-md: 0 1px 0 rgba(74,40,20,0.04), 0 18px 40px -28px rgba(74,40,20,0.5);
  --rg-shadow-lg: 0 22px 44px -22px rgba(74,40,20,0.55), 0 2px 4px rgba(74,40,20,0.14);

  /* ---- Gradiente metálico (acabamento de assinatura) ---- */
  --rg-metal: linear-gradient(105deg, #5A3117 0%, #9C6A44 26%, #D2AA80 49%, #7E4E2E 71%, #452411 100%);
}

/* ============ Tema escuro ============ */
:root[data-theme="dark"],
.rg-dark {
  --rg-bg:         #150F0A;
  --rg-surface:    #20180F;
  --rg-surface-2:  #2A2015;
  --rg-text:       #F0E7DC;
  --rg-text-muted: #B3A493;
  --rg-ink-faint:  #7E7060;
  --rg-accent:       var(--rg-rose-gold);
  --rg-accent-hover: #DDB78F;
  --rg-on-accent:    #1A120B;
  --rg-border:     rgba(200,155,114,0.20);
  --rg-hairline:      rgba(200,155,114,0.20);
  --rg-hairline-soft: rgba(200,155,114,0.10);
}