/* =====================================================================
   ¡Soy Carmen! — tokens de marca.

   Fuente única de color, tipografía, radios y sombras. Lo usan el sitio
   público, el panel y los iconos. Ningún color se escribe a mano fuera
   de aquí: si la marca cambia, cambia este archivo y nada más.

   Paleta entregada por diseño (2026-08-31).
   ===================================================================== */

@import url('fuentes.css');

:root{
  /* --- marca --- */
  --brand:            #BC5A38;   /* terracota: CTA, botones, marca */
  --brand-hover:      #A44827;
  --brand-tint:       #F6E2DA;
  --brand-claro:      #E3A98F;   /* acento de marca sobre fondo oscuro */

  --vino:             #6E2E42;   /* acento secundario */
  --vino-hover:       #5A2334;
  --vino-tint:        #EFDDE3;
  --vino-oscuro:      #3D1B2A;   /* fondo del pie */
  --vino-claro:       #E7D6DC;   /* texto sobre el pie */
  --vino-claro-tenue: #C9A8B4;

  --salvia:           #5C8577;   /* apoyo frío: etiquetas, estados */
  --salvia-tint:      #DFEAE5;
  --salvia-oscuro:    #3A5F52;

  --dorado:           #DCA23D;   /* solo en el gráfico decorativo */
  --dorado-tint:      #F8ECD6;

  /* --- texto y superficies --- */
  --tinta:            #2B211D;   /* títulos */
  --texto:            #3A2E2B;   /* cuerpo */
  --texto-2:          #6B5A55;
  --texto-tenue:      #766460;   /* 5.6:1 sobre blanco, 5.1:1 sobre ámbar (contraste mínimo 4.5) */
  --fondo:            #FFFFFF;
  --panel:            #F6F4F2;   /* tarjeta neutra */
  --borde:            #E2D5C8;

  /* --- estados --- */
  --ok:               var(--salvia-oscuro);
  --ok-bg:            var(--salvia-tint);
  --aviso:            #8A5A1E;
  --aviso-bg:         var(--dorado-tint);
  --error:            #8C2F2F;
  --error-bg:         #F7E4E1;
  --info:             var(--vino);
  --info-bg:          var(--vino-tint);

  /* tokens que consumen los iconos (heredan la marca) */
  --success:          var(--salvia);
  --warning:          var(--dorado);

  /* --- forma --- */
  --r-sm:  10px;   /* inputs y botones */
  --r:     14px;   /* tarjetas */
  --r-lg:  20px;   /* paneles */

  --sh-tarjeta: 0 2px 12px rgba(74,31,50,.06);
  --sh-cta:     0 6px 20px rgba(200,90,52,.25);
  --sh-hover:   0 20px 36px rgba(43,33,29,.16);
  --sh-panel:   0 12px 32px rgba(43,33,29,.18);

  --t: .25s ease;
  --ease-out: cubic-bezier(.22,1,.36,1);

  /* --- tipografía --- */
  --display: 'Bricolage Grotesque', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --texto-fuente: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}