/* ════════ css/variables.css ════════ */

:root {
  /* PALETA DE COLORES */
  --color-rust: #9d3b15;       
  --color-orange: #b85a2b;     
  --color-sand: #e7cfbc;       
  --color-bone: #f3eee5;       
  --color-taupe: #a89b8a;      
  --color-charcoal: #23201d;   
  --color-espresso: #312924;   

  /* ASIGNACIÓN FUNCIONAL */
  --bg: var(--color-bone);
  --bg-soft: var(--color-sand);
  --text: var(--color-charcoal);
  --text-dim: var(--color-espresso);
  
  --muted: rgba(35, 32, 29, .58);
  --muted-strong: rgba(35, 32, 29, .78);
  --line: rgba(168, 155, 138, 0.3);       
  --line-strong: rgba(157, 59, 21, 0.2);  
  --line-dark: rgba(35, 32, 29, .12);
  --soft: rgba(35, 32, 29, .08);
  
  --accent: var(--color-orange);
  --accent-deep: var(--color-rust);

  /* TIPOGRAFÍAS CON FALLBACKS DE SEGURIDAD */
  /* Si Adobe Fonts falla, usa sans-serif modernas en lugar de las feas por defecto */
  --font-brand: 'ofelia-display', 'Outfit', sans-serif;
  --font-title1: 'acumin-pro', 'Inter', sans-serif;
  --font-title2: 'neue-haas-grotesk-display', 'Inter', sans-serif;
  --font-title3: 'eurostile-extended', 'Syncopate', sans-serif;
  --font-body: 'neue-haas-grotesk-text', 'Inter', sans-serif;

  /* ANIMACIONES */
  --ease: cubic-bezier(.16,1,.3,1);
  --ease-power: cubic-bezier(.7,0,.2,1);
}