/* ============================================================
   ADVOCACIA FG — Design System (private banking / wealth)
   Tokens: cor, tipografia, espaçamento, sombras, motion
   ============================================================ */

:root {
  /* --- Cor: azul-marinho profundo + dourado champanhe + creme --- */
  --navy-900: #071322;   /* fundo mais profundo */
  --navy-800: #0A1A2F;   /* fundo base (hero, footer) */
  --navy-700: #102A47;   /* superfícies elevadas */
  --navy-600: #16385C;   /* bordas/hairlines em dark */
  --navy-500: #1E4670;   /* hover em superfícies dark */

  --gold-600: #A67C34;   /* dourado profundo (texto sobre creme) */
  --gold-500: #C6A15B;   /* dourado champanhe principal */
  --gold-400: #D4AF37;   /* dourado brilhante (acento fino) */
  --gold-200: #E8D6A8;   /* dourado claro (detalhe sobre navy) */

  --cream-50:  #FBF9F4;  /* off-white / marfim base claro */
  --cream-100: #F5F1E8;  /* creme suave */
  --cream-200: #ECE5D6;  /* creme bordas */

  --graphite-900: #14181D;
  --graphite-700: #2A3038;
  --graphite-500: #4A525C; /* texto secundário sobre claro */
  --graphite-300: #8A929C;
  --graphite-100: #C9CFD6;

  /* --- Semânticos (tema DARK sofisticado é o padrão) --- */
  --bg:            var(--navy-800);
  --bg-deep:       var(--navy-900);
  --surface:       var(--navy-700);
  --surface-hover: var(--navy-500);
  --hairline:      rgba(198, 161, 91, 0.16);  /* linha dourada discreta */
  --hairline-soft: rgba(233, 214, 168, 0.10);

  --text:          #EEF1F5;               /* off-white de leitura */
  --text-muted:    rgba(238, 241, 245, 0.68);
  --text-faint:    rgba(238, 241, 245, 0.44);
  --accent:        var(--gold-500);
  --accent-bright: var(--gold-400);
  --on-accent:     var(--navy-900);

  /* seção clara (marfim) — para blocos de respiro premium */
  --light-bg:      var(--cream-50);
  --light-surface: #FFFFFF;
  --light-text:    var(--graphite-900);
  --light-muted:   var(--graphite-500);
  --light-hairline: rgba(10, 26, 47, 0.10);

  /* WhatsApp (usado só no FAB e micro-acentos de CTA) */
  --wa-green: #25D366;
  --wa-green-deep: #128C7E;

  /* --- Tipografia --- */
  --font-serif: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  --font-sans:  "Hanken Grotesk", "DM Sans", system-ui, -apple-system, sans-serif;

  /* escala fluida (clamp) */
  --step--1: clamp(0.82rem, 0.79rem + 0.12vw, 0.9rem);
  --step-0:  clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --step-1:  clamp(1.2rem, 1.12rem + 0.4vw, 1.45rem);
  --step-2:  clamp(1.5rem, 1.35rem + 0.75vw, 2rem);
  --step-3:  clamp(1.95rem, 1.7rem + 1.25vw, 2.85rem);
  --step-4:  clamp(2.4rem, 2rem + 2vw, 3.9rem);
  --step-5:  clamp(2.9rem, 2.2rem + 3.4vw, 5.2rem);

  /* --- Espaçamento (escala de 4px) --- */
  --sp-1: 0.25rem;  --sp-2: 0.5rem;   --sp-3: 0.75rem;
  --sp-4: 1rem;     --sp-5: 1.5rem;   --sp-6: 2rem;
  --sp-7: 3rem;     --sp-8: 4rem;     --sp-9: 6rem;
  --sp-10: 8rem;

  --maxw: 1180px;
  --maxw-narrow: 760px;

  /* --- Raios (sóbrios, nada de bolha) --- */
  --r-xs: 3px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;

  /* --- Sombras (profundidade discreta) --- */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.24);
  --shadow-md: 0 10px 30px -12px rgba(0,0,0,0.55);
  --shadow-lg: 0 30px 70px -28px rgba(0,0,0,0.65);
  --shadow-gold: 0 12px 40px -14px rgba(198,161,91,0.32);

  /* --- Motion --- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-1: 0.28s;
  --dur-2: 0.5s;
  --dur-3: 0.9s;
}
