/* =========================================================
   Personaliza Tudo — Design tokens (compartilhados por site, comunidade e painel)
   Paleta derivada da logo: ouro mostarda #C8890E sobre creme #F7F0E7
   Tema claro é o padrão; escuro é opcional (html[data-theme="dark"]).
   ========================================================= */
:root {
  /* Marca */
  --gold-50:  #FBF4E4;
  --gold-100: #F4E3BC;
  --gold-200: #EACB86;
  --gold-300: #DDAE4E;
  --gold-400: #D19A26;
  --gold-500: #C8890E;   /* cor da logo */
  --gold-600: #A86F08;
  --gold-700: #845607;
  --gold-800: #5E3E08;

  /* Neutros quentes complementares */
  --cream:     #F7F0E7;  /* fundo da logo */
  --ivory:     #FBF8F3;
  --sand:      #EDE3D4;
  --taupe:     #B9AD9C;
  --stone:     #7C7266;
  --espresso:  #2A221B;
  --ink:       #16120E;

  /* Acentos complementares (usar com parcimônia) */
  --bronze:    #8C5A2B;
  --sage:      #7D8B74;  /* verde oliva suave — selos "novidade" */
  --wine:      #8E3B3B;  /* vinho — selos "promoção" */
  --whatsapp:  #1FAF5A;

  /* Semânticos — tema claro */
  --bg:           var(--ivory);
  --bg-alt:       var(--cream);
  --surface:      #FFFFFF;
  --surface-2:    #F3ECE1;
  --text:         var(--ink);
  --text-soft:    #4A4038;
  --text-muted:   var(--stone);
  --line:         rgba(42, 34, 27, .10);
  --line-strong:  rgba(42, 34, 27, .20);
  --accent:       var(--gold-500);
  --accent-hover: var(--gold-600);
  --accent-ink:   #FFFFFF;
  --accent-soft:  var(--gold-50);
  --glass:        rgba(251, 248, 243, .72);
  --glass-border: rgba(255, 255, 255, .55);
  --shadow-sm:    0 1px 2px rgba(22,18,14,.06), 0 1px 1px rgba(22,18,14,.04);
  --shadow-md:    0 10px 30px -12px rgba(22,18,14,.18);
  --shadow-lg:    0 30px 80px -30px rgba(22,18,14,.35);
  --gold-gradient: linear-gradient(135deg, #E9C77B 0%, #C8890E 45%, #8C5A12 100%);

  --ok:    #2F7D4F;
  --erro:  #B3261E;
  --aviso: #B7791F;
  --info:  #2B6CB0;

  /* Tipografia */
  --font-display: "Cormorant Garamond", "Times New Roman", serif;
  /* Números (preços, totais, contadores): arredondada e legível, algarismos alinhados */
  --font-num: "Manrope", "Inter", -apple-system, "SF Pro Rounded", sans-serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  --fs-xs: .75rem; --fs-sm: .875rem; --fs-md: 1rem; --fs-lg: 1.125rem; --fs-xl: 1.375rem;
  --fs-2xl: clamp(1.6rem, 1.2rem + 1.5vw, 2.25rem);
  --fs-3xl: clamp(2.2rem, 1.4rem + 3vw, 3.75rem);
  --fs-hero: clamp(2.8rem, 1.2rem + 6vw, 6.5rem);
  --tracking-tight: -0.022em;
  --tracking-wide: .18em;

  /* Espaço, raio, movimento */
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-5: 1.5rem;
  --space-6: 2rem; --space-7: 3rem; --space-8: 4.5rem; --space-9: 7rem; --space-10: 10rem;
  --radius-sm: 8px; --radius-md: 14px; --radius-lg: 22px; --radius-xl: 32px; --radius-pill: 999px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur-fast: 180ms; --dur: 420ms; --dur-slow: 900ms;
  --container: 1240px;
  --gutter: clamp(16px, 4vw, 40px);
  --header-h: 56px;
}

html[data-theme="dark"] {
  --bg:           #0F0D0B;
  --bg-alt:       #161310;
  --surface:      #1C1814;
  --surface-2:    #241F1A;
  --text:         #F4EDE3;
  --text-soft:    #D6CBBB;
  --text-muted:   #9C9184;
  --line:         rgba(244, 237, 227, .10);
  --line-strong:  rgba(244, 237, 227, .20);
  --accent:       #DDAE4E;
  --accent-hover: #EACB86;
  --accent-ink:   #16120E;
  --accent-soft:  rgba(221, 174, 78, .12);
  --glass:        rgba(20, 17, 14, .72);
  --glass-border: rgba(255, 255, 255, .08);
  --shadow-md:    0 10px 30px -12px rgba(0,0,0,.6);
  --shadow-lg:    0 30px 80px -30px rgba(0,0,0,.8);
  color-scheme: dark;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; }
}