/* ==========================================================================
   Método con IA · sistema de marca (identidad C, "Petróleo y lima")
   Decisión 2026-09-23. Fuente única de colores, tipografías y componentes
   para la guía (PDF), metodoconia.com y las plantillas de vídeo.
   Guía de uso: marca/README.md
   ========================================================================== */

@font-face { font-family: "Instrument Serif"; src: url("/fuentes/InstrumentSerif-Regular.woff2") format("woff2"); font-display: swap; font-weight: 400; font-style: normal; }
@font-face { font-family: "Instrument Serif"; src: url("/fuentes/InstrumentSerif-Italic.woff2") format("woff2"); font-display: swap; font-weight: 400; font-style: italic; }
@font-face { font-family: "Instrument Sans"; src: url("/fuentes/InstrumentSans-Variable.woff2") format("woff2"); font-display: swap; font-weight: 400 700; font-style: normal; }
@font-face { font-family: "Instrument Sans"; src: url("/fuentes/InstrumentSans-Italic-Variable.woff2") format("woff2"); font-display: swap; font-weight: 400 700; font-style: italic; }

:root {
  /* Colores de marca */
  --mci-petroleo: #0E3B43;   /* principal: títulos, fondos de portada, texto fuerte */
  --mci-papel:    #F3F1EC;   /* fondo cálido */
  --mci-lima:     #D7F264;   /* único acento: solo sobre petróleo, o como resaltado */
  --mci-salvia:   #56706F;   /* texto secundario */
  --mci-bruma:    #E4EAE6;   /* fondos de cajas y cabeceras de tabla */
  --mci-linea:    #D3DBD6;
  --mci-tinta:    #1D2B2D;   /* texto corrido */

  /* Semáforo (solo para recomendaciones) */
  --mci-verde: #3C8D5A;
  --mci-ambar: #D29A2C;
  --mci-rojo:  #C0493A;

  /* Tipografía */
  --mci-f-titulo: "Instrument Serif", Georgia, serif;
  --mci-f-texto:  "Instrument Sans", "Segoe UI", Arial, sans-serif;
}

/* Signo de marca: los tres puntos de evidencia (●●○) */
.mci-puntos { display: inline-flex; gap: 0.28em; vertical-align: middle; }
.mci-puntos b { width: 0.62em; height: 0.62em; border-radius: 50%; background: currentColor; display: inline-block; }
.mci-puntos b.v { background: transparent; box-shadow: inset 0 0 0 0.11em currentColor; }

/* Resaltado de marca (palabra clave) */
.mci-resaltado { background: var(--mci-lima); color: var(--mci-petroleo); padding: 0 0.2em; }