/* ==========================================================================
   Belas Mensagens 2026 — Design Tokens
   Fonte única: design-system/MASTER.md (§2–§6)
   Componentes consomem SOMENTE tokens (nunca hex cru).
   ========================================================================== */

:root {
  /* --- Brand: escala rosa coesa (vermelho histórico #C3141B / rosa #E8566F) --- */
  --c-rose-50:  #FFF1F4;
  --c-rose-100: #FFE0E7;
  --c-rose-200: #FBC3D0;
  --c-rose-300: #F299AE;
  --c-rose-400: #E86A88;
  --c-rose-500: #DC4368;   /* Primary */
  --c-rose-600: #C22B52;   /* Primary hover */
  --c-rose-700: #9E1F41;   /* Primary active / texto sobre claro */
  --c-rose-800: #7C1733;
  --c-rose-900: #5A0F24;

  /* --- Accent / CTA: coral âmbar quente --- */
  --c-coral-400: #FB923C;
  --c-coral-500: #F97316;  /* CTA */
  --c-coral-600: #EA6C0B;

  /* --- Superfícies "paper" quentes --- */
  --c-paper:     #FDFBF9;  /* fundo do site */
  --c-surface:   #FFFFFF;  /* cards */
  --c-surface-2: #FBF4F1;  /* superfície sutil / hover */

  /* --- Texto --- */
  --c-text:      #2A2230;  /* plum-charcoal — AAA sobre paper */
  --c-text-soft: #4A4255;
  --c-muted:     #6B6577;  /* AA sobre paper */
  --c-on-rose:   #FFFFFF;  /* texto sobre primary */

  /* --- Bordas e linhas --- */
  --c-border:        #EFE4E8;
  --c-border-strong: #E2D2D8;

  /* --- Feedback --- */
  --c-success:  #1E9E5A;
  --c-warning:  #C77700;
  --c-danger:   #D13438;
  --c-whatsapp: #25D366;   /* fixo de marca */

  /* --- Foco (acessibilidade) --- */
  --c-focus: #1D6FE0;      /* ring azul de alto contraste em qualquer fundo */

  /* --- Accent contextual padrão (sobrescrito por [data-tema]) --- */
  --tema-accent: var(--c-rose-500);
  --tema-bg: var(--c-surface);

  /* ====================== Tipografia ====================== */
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-ui:      "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Escala modular 1.250 (Major Third), base 16px, fluida com clamp */
  --fs-xs:   0.75rem;   /* 12 — legendas */
  --fs-sm:   0.875rem;  /* 14 — meta, chips */
  --fs-base: 1rem;      /* 16 — corpo (mínimo mobile) */
  --fs-md:   1.125rem;  /* 18 — corpo destacado */
  --fs-lg:   clamp(1.125rem, 1rem + 0.6vw, 1.375rem); /* texto da frase */
  --fs-xl:   clamp(1.375rem, 1.1rem + 1.2vw, 1.75rem);
  --fs-2xl:  clamp(1.75rem, 1.3rem + 2vw, 2.5rem);    /* H1 página */
  --fs-3xl:  clamp(2.25rem, 1.6rem + 3vw, 3.25rem);   /* hero home */

  --lh-tight: 1.2;
  --lh-snug:  1.35;
  --lh-body:  1.7;   /* corpo: 1.5–1.75 */
  --lh-quote: 1.55;

  --tracking-tight: -0.01em;

  /* ====================== Espaçamento (base-4) ====================== */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px; --sp-9: 96px;

  /* ====================== Raio ====================== */
  --r-sm: 8px; --r-md: 12px; --r-lg: 20px; --r-xl: 28px; --r-pill: 999px;

  /* ====================== Sombras quentes (tinta rosa) ====================== */
  --sh-1: 0 1px 2px rgba(90, 15, 36, 0.06);
  --sh-2: 0 4px 16px rgba(90, 15, 36, 0.08);
  --sh-3: 0 12px 32px rgba(90, 15, 36, 0.12);

  /* ====================== Containers ====================== */
  --w-prose:   680px;   /* leitura/frase (money page) */
  --w-content: 1080px;  /* grids */
  --w-wide:    1280px;  /* home/hero */
  --header-h:  60px;

  /* ====================== Z-index (sem números mágicos) ====================== */
  --z-base: 1; --z-dropdown: 10; --z-sticky: 20; --z-header: 30;
  --z-overlay: 40; --z-drawer: 50; --z-modal: 60; --z-toast: 70;

  /* ====================== Motion ====================== */
  --ease: cubic-bezier(.2, .7, .3, 1);
  --dur-fast: 150ms; --dur: 220ms; --dur-slow: 320ms;
}

/* ====================== Temas contextuais por categoria ======================
   Aplicados via [data-tema] no card/página. accent tinge barra/ícones/fundo,
   NUNCA o texto da frase (mantém contraste). */
[data-tema="aniversario"]  { --tema-accent: #F2A93B; --tema-bg: #FFF7EA; } /* celebração âmbar */
[data-tema="amor"]         { --tema-accent: #DC4368; --tema-bg: #FFF1F4; } /* rosa marca */
[data-tema="luto"]         { --tema-accent: #6B7280; --tema-bg: #F4F5F7; } /* cinza sóbrio */
[data-tema="bom-dia"]      { --tema-accent: #F59E0B; --tema-bg: #FFFBEB; } /* sol manhã */
[data-tema="boa-noite"]    { --tema-accent: #5B6BB5; --tema-bg: #EEF0FA; } /* índigo calmo */
[data-tema="fe"]           { --tema-accent: #7C8B5A; --tema-bg: #F4F6EE; } /* oliva serena */
[data-tema="motivacional"] { --tema-accent: #0E9488; --tema-bg: #EAF6F4; } /* teal energia */
[data-tema="amizade"]      { --tema-accent: #E8722C; --tema-bg: #FFF3EA; } /* laranja caloroso */

/* ====================== Reduced motion ====================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}