/* =========================================================
   Dr. Bernard Giancristoforo — Design Tokens
   Tema: claro (único). Paleta "Marca" — derivada do logo BG.
   Navy #152C4C · Dourado #AC884E · Creme #FAF5F0
   ========================================================= */
:root {
  /* ---- Cor: rampas (amostradas do logo vetorizado) ---- */
  --navy-900: #0B1A2E;   /* blocos escuros profundos */
  --navy-800: #152C4C;   /* PRIMÁRIA — cor do monograma e do texto */
  --navy-700: #1F3A61;   /* superfície escura, hover em fundo escuro */
  --navy-600: #2C4A73;

  --gold-700: #7A5D2F;   /* dourado escurecido — ÚNICO seguro p/ texto sobre claro */
  --gold-600: #8C6C3A;
  --gold-500: #AC884E;   /* SECUNDÁRIA — cor do traço do logo. Ornamento sobre claro */
  --gold-300: #C9A868;   /* texto dourado sobre navy */
  --gold-200: #D8BC8A;   /* texto dourado sobre navy, alto contraste */

  --cream:    #FAF5F0;   /* fundo — off-white do logo */
  --cream-2:  #F1EAE2;   /* superfície 2, faixas */
  --white:    #FFFFFF;

  /* ---- Cor: papéis semânticos (tema claro) ---- */
  --bg:            var(--cream);
  --bg-alt:        var(--cream-2);
  --bg-invert:     var(--navy-800);
  --surface:       var(--white);
  --text:          var(--navy-800);      /* 12.95:1 sobre --bg — AAA */
  --text-soft:     #3E4A5C;              /*  8.29:1 sobre --bg — AAA */
  --text-mute:     #4C5567;              /*  6.92:1 sobre --bg — AA  */
  --text-on-dark:      var(--cream);     /* 12.95:1 sobre --navy-800 — AAA */
  --text-soft-on-dark: #A9B4C4;          /*  6.69:1 sobre --navy-800 — AA  */
  --brand:         var(--navy-800);
  --brand-hover:   var(--navy-700);
  --accent:        var(--gold-500);      /* ORNAMENTO sobre claro — nunca texto */
  --accent-text:   var(--gold-700);      /*  5.64:1 sobre --bg — AA. Texto dourado */
  --accent-on-dark:var(--gold-200);      /*  7.67:1 sobre --navy-800 — AAA */
  --line:          rgba(21, 44, 76, .14);
  --line-strong:   rgba(21, 44, 76, .28);
  --line-gold:     rgba(172, 136, 78, .45);
  --line-on-dark:  rgba(250, 245, 240, .18);
  --focus:         var(--navy-800);
  --focus-on-dark: var(--gold-200);

  /* ---- Tipografia ---- */
  --font-display: 'Bodoni Moda', 'Didot', Georgia, serif;
  --font-sans:    'Karla', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  --fs-h1:    clamp(2.35rem, 1.5rem + 3.7vw, 4.25rem);
  --fs-h2:    clamp(2rem, 1.35rem + 2.6vw, 3.5rem);
  --fs-h3:    clamp(1.3rem, 1.15rem + 0.7vw, 1.75rem);
  --fs-lead:  clamp(1.125rem, 1.03rem + 0.42vw, 1.375rem);
  --fs-body:  clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --fs-small: clamp(0.875rem, 0.85rem + 0.1vw, 0.9375rem);
  --fs-label: 0.75rem;

  --lh-tight: 1.04;  --lh-head: 1.05;  --lh-sub: 1.2;
  --lh-lead:  1.55;  --lh-body: 1.65;

  --ls-h1: -0.012em;  --ls-h2: -0.010em;
  --ls-h3: -0.004em;  --ls-label: 0.08em;

  /* ---- Espaçamento (escala 4px) ---- */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.5rem;  --sp-6: 2rem;    --sp-7: 3rem;    --sp-8: 4rem;
  --sp-9: 6rem;    --sp-10: 8rem;
  --section-y: clamp(4.5rem, 9vw, 8.5rem);
  --container: 1240px;
  --gutter: clamp(1.25rem, 4vw, 2.5rem);
  --measure: 62ch;                  /* largura máx. de texto corrido */

  /* ---- Raio ---- */
  --r-xs: 2px;   --r-sm: 6px;   --r-md: 12px;  --r-lg: 18px;  --r-pill: 999px;

  /* ---- Sombra (fria, baixa opacidade) ---- */
  --sh-0: none;
  --sh-1: 0 1px 2px rgba(11,26,46,.05), 0 2px 8px rgba(11,26,46,.04);
  --sh-2: 0 2px 6px rgba(11,26,46,.06), 0 12px 28px rgba(11,26,46,.07);
  --sh-3: 0 8px 20px rgba(11,26,46,.09), 0 24px 56px rgba(11,26,46,.10);
  --sh-focus: 0 0 0 3px rgba(21,44,76,.26);

  /* ---- Easing / duração ---- */
  --ease-out:    cubic-bezier(.22, .61, .36, 1);
  --ease-soft:   cubic-bezier(.33, 1, .68, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur-1: 140ms;  --dur-2: 240ms;  --dur-3: 420ms;  --dur-4: 700ms;

  /* ---- Camadas ---- */
  --z-header: 100;  --z-menu: 110;  --z-float: 90;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 1ms; --dur-2: 1ms; --dur-3: 1ms; --dur-4: 1ms; }
}

@media (prefers-contrast: more) {
  :root { --line: rgba(21,44,76,.34); --text-soft: var(--text); }
}
