/* ============================================================
   Jackie Melo — Design Tokens (contrato visual da marca)
   "Joalheria editorial sobre pele": ouro é fio/borda/luz, nunca preenchimento.
   Cores derivadas do logo real. Ver _plano/01-DIRECAO-DE-ARTE.md
   ============================================================ */

:root {
  /* ---- Superfícies escuras — PONTUAIS (grafite suave, nunca preto chapado) ---- */
  --ink-900: #0B0B0B; /* raro */
  --ink-800: #17130E; /* dark de acento (suave) */
  --ink-700: #2A2218; /* grafite suave (sidebar admin) */

  /* ---- Superfícies claras (predominantes — 70-80% do site) ---- */
  /* Clareadas a pedido do Dan (2026-07-22): menos bege/cinza, mais luz. */
  --paper-50: #FCFBF8; /* fundo principal (era #FAF7F2) */
  --paper-100: #FAF6F0; /* bege premium clareado (era #F6F0E7) */
  --paper-200: #EFE8DC; /* bege médio clareado (era #E8DCCB) */
  --paper-0: #FFFFFF;   /* branco quente */

  /* ---- Aliases semânticos (design system claro) ---- */
  --color-bg: #FCFBF8;
  --color-bg-soft: #FAF6F0;
  --color-white: #FFFFFF;
  /* Texto escurecido a pedido do Dan (2026-07-22): títulos quase pretos,
     subtítulos/textos bem escuros (mais legíveis, melhor contraste AA). */
  --color-text: #111111;        /* títulos (era #1C1C1C) */
  --color-muted: #35302A;       /* subtítulos/leads/corpo (era #6F665C — estava claro) */
  --color-muted-2: #6A6157;     /* cinza elegante — tier mais claro (era #A49A8F) */
  --color-gold: #C9A24A;
  --color-gold-light: #E5C878;
  --color-gold-dark: #8A6A25;
  --color-border: #E7DED2;
  --color-dark: #17130E;
  --color-cream: #FFFDF8;       /* branco aquecido para superfícies premium */
  --color-graphite: #2A2723;    /* grafite elegante (alternativa ao preto) */
  --gold-soft: #E7BE4E;         /* dourado QUEIMADO para realces/quadradinhos (era #F2E4B8 pálido) — mais contrastado */

  /* ---- Ouro ---- */
  --gold-300: #F9E176; /* brilho/specular */
  --gold-500: #D5B15C; /* base */
  --gold-600: #C9A24A; /* borda/link */
  --gold-800: #AB751A; /* sombra */
  --gold-900: #9A5C03; /* sombra profunda */
  --gold-ink: #6E4E12; /* dourado-TEXTO sobre fundo claro — contraste WCAG AA (~5.4:1) */
  --gold-dark: var(--gold-ink); /* alias p/ dourado de TEXTO (era usado sem estar definido → herdava preto) */
  --gold-light: #E9CC84; /* dourado-TEXTO/acento sobre fundo ESCURO (contraste AA ~8:1) — era usado sem estar definido → herdava cor escura */
  --gold-line: rgba(201, 162, 74, .70);
  --gold-foil: linear-gradient(100deg, #9A5C03, #D5B15C 40%, #F9E176 50%, #C9A24A 60%, #9A5C03);

  /* ---- Texto ---- */
  --text-on-dark: #F6F0E7;
  --text-on-dark-muted: rgba(246, 240, 231, .78);
  --text-on-light: #110E0B;         /* títulos sobre fundo claro — quase preto (era #1A1714) */
  --text-on-light-muted: #35302A;   /* subtítulos/leads sobre fundo claro — bem escuro (era #5A524A) */
  --border-soft: #E7DED2;

  /* ---- Estados ---- */
  --error: #B42318;
  --success: #2E7D32;
  --warning: #B7791F;

  /* ---- Tipografia premium (Cormorant Garamond editorial + Inter) ---- */
  --font-display: "Cormorant Garamond", "Playfair Display", Georgia, "Times New Roman", serif;
  --font-text: "Inter", "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Títulos leves e elegantes — Cormorant respira melhor; nada "gigante/grosso" */
  --fs-hero:   clamp(2.6rem, 3.6vw + 1rem, 3.9rem);   /* ~42px → ~62px */
  --fs-h1:     clamp(2.1rem, 2.6vw + .6rem, 3.1rem);  /* ~34px → ~50px */
  --fs-h2:     clamp(1.7rem, 1.8vw + .6rem, 2.5rem);  /* ~28px → ~40px */
  --fs-h3:     clamp(1.2rem, 1vw + .6rem, 1.6rem);
  --fs-body:   clamp(1rem, .25vw + .95rem, 1.1rem);
  --fs-small:  .875rem;
  --fs-eyebrow: .75rem;

  --lh-tight: 1.12;
  --lh-snug: 1.3;
  --lh-body: 1.7;
  --track-display: -.01em; /* kerning menos fechado = menos "pesado" */
  --track-eyebrow: .2em;

  /* ---- Espaçamento (base 4px, escala não-linear) ---- */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;  --sp-4: 1rem;
  --sp-5: 1.25rem; --sp-6: 1.5rem;  --sp-8: 2rem;    --sp-10: 2.5rem;
  --sp-12: 3rem;   --sp-16: 4rem;   --sp-24: 6rem;   --sp-32: 8rem;
  --section-y: clamp(4rem, 10vw, 8rem);
  --container: 1200px;
  --container-narrow: 760px;

  /* ---- Raio (premium: cantos generosos nos cards) ---- */
  --r-xs: 6px; --r-sm: 10px; --r-md: 16px; --r-lg: 24px; --r-xl: 28px; --r-pill: 999px;

  /* ---- Sombra (delicada, quente-neutra — design claro premium) ---- */
  --sh-1: 0 1px 2px rgba(138,106,37,.05), 0 1px 3px rgba(28,28,28,.04);
  --sh-2: 0 14px 34px rgba(31,24,14,.08), 0 3px 8px rgba(31,24,14,.04);
  --sh-3: 0 22px 56px rgba(31,24,14,.11), 0 8px 18px rgba(31,24,14,.06);
  --sh-gold: 0 16px 36px rgba(201,162,74,.26);
  --ring-focus: 0 0 0 3px rgba(201,162,74,.40);
  --glass-bg: rgba(255,255,255,.62);
  --glass-border: rgba(255,255,255,.7);

  /* ---- Movimento ---- */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  --dur-1: 160ms; --dur-2: 280ms; --dur-3: 480ms; --dur-reveal: 640ms;

  --header-h: 96px;
}
