:root {
  /* === COLORES BASE === */
  --color-primario: #151562; /* Azul oscuro de marca */
  --color-secundario: #e74c56; /* Rojo salmón de marca */
  --color-gris-claro: #d9d9e9; /* Gris claro para bordes normales */
  --color-gris-focus: #b3b3c0; /* Gris más oscuro para focus */
  --color-blanco-puro: #ffffff; /* Blanco puro */
  --color-blanco-fondo: #F5FAFF; /* Blanco sucio para fondos */
  --color-gris-separador: #e0e0e0; /* Gris muy claro, estilo Jotform */
  
  
  /* === COLORES ESPECIALES === */
--color-rating-estrella: #f4a02f; /* Color de estrellas (tipo favorito) */

/* === PALETA EXTENDIDA NOVUAGENCIA — ARMÓNICA === */

/* Grises/Azules premium para texto — versión azul marca NovuAgencia */
--color-texto-principal: #151562;   /* Azul primario — textos fuertes y títulos */
--color-texto-secundario: #3A3A84;  /* Azul grisáceo medio — párrafos y labels */
--color-texto-terciario: #6A6AA5;   /* Azul claro/grisado — textos secundarios suaves */

/* Éxito / Confirmación / Precios */
--color-verde-suave: #4CAF7A;        /* Verde moderno, elegante */
--color-verde-fuerte: #2E8B57;       /* Verde más profundo */
--color-verde-clarito: #DBF7EB;      /* Fondo verde suave para alertas */

/* Advertencias / Errores */
--color-rojo-error: #D64545;         /* Rojo elegante (no agresivo) */
--color-rojo-claro: #F9D5D5;         /* Fondo rojo suave */
--color-naranja-alerta: #F4A259;     /* Avisos suaves */

/* Amarillo / Oro (premium y moderno) */
--color-amarillo-premium: #F4C542;   /* Amarillo refinado (mejor que mostaza) */
--color-oro-premium: #D4A857;        /* Dorado elegante */
--color-champagne: #EAD7B5;          /* Champagne hermoso */

/* Tonos metálicos */
--color-plateado: #C8CCD4;           /* Plateado limpio y moderno */
--color-plata-claro: #E5E7EB;        /* Gris–plata para fondos */


/* Variantes suaves para cajas */
--color-box-suave: #FAFAFC;
--color-box-azul-suave: #E8ECF7;

/* Hovers */
--color-hover-suave: rgba(0,0,0,0.06);
--color-hover-azul: rgba(21,21,98,0.08);
--color-hover-secundario: rgba(231,76,86,0.12);


  /* === TIPOGRAFÍA === */
  --fuente-principal: 'Plus Jakarta Sans', sans-serif;

  /* === BORDES === */
  --radio-bordes: 4px;

  /* === BOTONES === */
  --color-btn-primario: var(--color-secundario); /* Color fondo botón principal */
  --color-btn-hover: var(--color-primario); /* Color fondo botón hover */

  /* === INPUTS Y SELECTS === */
  --color-input-border: var(--color-gris-claro); /* Borde normal */
  --color-input-focus: var(--color-gris-focus); /* Borde al focus */

  /* === OTROS === */
  --transition-general: all 0.3s ease;
}
