/* ============================================================
   Design Tokens — Roberta Rocco / 7Healings Identity
   Source: docs/design/visual-identity.md
   ============================================================ */

:root {
  /* ---- BACKGROUNDS (dark theme — verde profundo) ---- */
  --color-bg-primary: #071D19;
  --color-bg-secondary: #0E2823;
  --color-bg-cream: #F5F1E3;
  --color-bg-ivory: #FAF8F3;
  --color-bg-warm: #1A332B;
  --color-surface: rgba(255, 255, 255, 0.035);
  --color-surface-hover: rgba(200, 169, 106, 0.08);
  --color-surface-light: #FFFFFF;

  /* ---- TEXT (claros para fundo escuro) ---- */
  --color-text-primary: #F5F2ED;
  --color-text-secondary: #D9CBB5;
  --color-text-muted: #A0927B;
  --color-text-soft: #C8A96A;
  --color-text-on-accent: #FFFFFF;
  --color-text-on-light: #2A2520;

  /* ---- ACCENT (verde sage — identidade principal) ---- */
  --color-accent: #3D4F3A;
  --color-accent-light: #6B7F5A;
  --color-accent-dark: #1F2A1D;
  --color-accent-deep: #071D19;

  /* ---- DETAIL GOLD (acentos editoriais — eyebrows, números, italics) ---- */
  --color-detail: #C8A96A;
  --color-detail-light: #F4CC86;
  --color-detail-dark: #B8915F;

  /* ---- WARM ACCENT (taupe — alternativa terrosa, uso pontual) ---- */
  --color-warm-accent: #8B7355;
  --color-warm-accent-dark: #5C4D3A;

  /* ---- GOLD (selos/premium real) ---- */
  --color-gold: #D4AF37;
  --color-gold-light: #F4CC86;
  --color-bronze: #B8915F;

  /* ---- SAGE aliases (mantidos para compat — apontam para accent) ---- */
  --color-sage: var(--color-accent-light);
  --color-sage-dark: var(--color-accent);
  --color-sage-deep: var(--color-accent-deep);

  /* ---- BORDERS (gold-tinted para visibilidade em dark bg) ---- */
  --color-border-subtle: rgba(200, 169, 106, 0.18);
  --color-border-medium: rgba(200, 169, 106, 0.32);
  --color-border-strong: rgba(200, 169, 106, 0.55);

  /* ---- SHADOWS (escuras, profundas) ---- */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.20);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.30);
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.40);
  --shadow-cta: 0 8px 32px rgba(0, 0, 0, 0.45);

  /* ---- ACENTOS PONTUAIS ---- */
  --color-navy: #1A2332;
  --color-peach: #FFBC7D;

  /* ---- TYPOGRAPHY ---- */
  --font-display: "The Seasons", "Playfair Display", Georgia, "Times New Roman", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-script: "Dancing Script", "Brush Script MT", cursive;

  /* Font sizes (fluid) */
  --text-display: clamp(2.4rem, 5vw, 3.5rem);
  --text-h1: clamp(2rem, 4vw, 3rem);
  --text-h2: clamp(1.5rem, 3vw, 2rem);
  --text-h3: 1.4rem;
  --text-body-lg: 1.125rem;
  --text-body: 1rem;
  --text-sm: 0.875rem;
  --text-xs: 0.75rem;

  /* Line heights */
  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;

  /* Font weights */
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ---- SPACING (4/8 scale, base unit 20px) ---- */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 20px;
  --space-lg: 32px;
  --space-xl: 48px;
  --space-2xl: 80px;
  --space-3xl: 120px;

  /* ---- LAYOUT ---- */
  --container-max: 1280px;
  --container-narrow: 780px;

  /* ---- RADIUS ---- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 999px;

  /* ---- MOTION ---- */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-base: 300ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-spring: 500ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ---- Z-INDEX ---- */
  --z-nav: 100;
  --z-fab: 999;
  --z-overlay: 998;
  --z-modal: 1000;
}

/* ---- RESPONSIVE TOKEN OVERRIDES ---- */
@media (max-width: 1024px) {
  :root {
    --container-max: 1024px;
  }
}

@media (max-width: 767px) {
  :root {
    --container-max: 100%;
    --space-2xl: 56px;
    --space-3xl: 80px;
  }
}

/* ---- REDUCED MOTION ---- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0ms;
    --transition-base: 0ms;
    --transition-spring: 0ms;
  }
}