/* ============================================================
   variables.css
   Design tokens globales del sitio Miranda López.
   Sistema visual: carbón, marfil, beige arena, dorado champaña y gris piedra.
   ============================================================ */

:root {
  /* Paleta Miranda López */
  --carbon: #1f1f21;
  --marfil: #f5f1ea;
  --beige-arena: #d9c7b6;
  --dorado: #b38a4a;
  --gris-piedra: #7a7a7a;
  --blanco: #ffffff;
  --texto: #262426;
  --texto-suave: #625f5c;

  /* Alias del sistema anterior para mantener compatibilidad modular */
  --verde: var(--dorado);
  --marino: var(--carbon);
  --salvia: var(--beige-arena);
  --crema: var(--marfil);

  /* Tipografía */
  --font-display: 'Playfair Display', serif;
  --font-body: 'Poppins', sans-serif;

  /* Espaciado de sección */
  --section-pad: 7rem 5%;

  /* Bordes y radios */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;

  /* Transiciones */
  --transition: .3s ease;

  /* Sombras */
  --shadow-soft: 0 18px 50px rgba(31, 31, 33, .08);
  --shadow-strong: 0 22px 70px rgba(31, 31, 33, .18);
}