:root{
  --jpm-yellow:#ECC545;
  --jpm-orange:#CC654B;
  --jpm-purple:#510B44;
  --jpm-purple-2:#621545;
  --jpm-ink:#231821;
  --jpm-text:#4C3C47;
  --jpm-muted:#786A73;
  --jpm-cream:#FBF8F3;
  --jpm-cream-2:#F3EFE9;
  --jpm-white:#FFFFFF;
  --jpm-line:#E7DFE3;
  --jpm-arc:linear-gradient(100deg,var(--jpm-yellow) 0%,var(--jpm-orange) 48%,var(--jpm-purple) 100%);
  --jpm-arc-soft:linear-gradient(120deg,rgba(236,197,69,.26),rgba(204,101,75,.15) 45%,rgba(81,11,68,.16));
  --shadow-sm:0 14px 34px -24px rgba(81,11,68,.38);
  --shadow-md:0 28px 72px -42px rgba(81,11,68,.46);
  --shadow-lg:0 48px 120px -58px rgba(81,11,68,.56);
  --radius-sm:12px;
  --radius-md:20px;
  --radius-lg:30px;
  --radius-xl:42px;
  --ease-enter:cubic-bezier(.22,1,.36,1);
  --ease-state:cubic-bezier(.4,0,.2,1);
  --motion-micro:180ms;
  --motion-menu:240ms;
  --motion-content:440ms;
  --motion-hero:760ms;
  --wrap:min(1920px,calc(100% - 72px));

/* ============================================================
   D1 · Capa semantica de la Directriz de Diseno Dinamico v1.1
   ------------------------------------------------------------
   Los --motion-micro/menu/content/hero heredados NO se tocan:
   sostienen el baseline aprobado. Aqui se anade el vocabulario
   de la seccion 10 para el trabajo nuevo, mas escala de espaciado
   y sistema de velos.
   ============================================================ */
  --motion-fast:160ms;
  --motion-ui:240ms;
  --motion-reveal:560ms;
  --motion-editorial:800ms;

  --space-3xs:4px;
  --space-2xs:8px;
  --space-xs:12px;
  --space-sm:18px;
  --space-md:28px;
  --space-lg:44px;
  --space-xl:68px;
  --space-2xl:104px;
  --space-3xl:152px;

  --veil-ink:rgba(18,4,15,.72);
  --veil-ink-soft:rgba(18,4,15,.34);
  --veil-bottom:linear-gradient(180deg,rgba(18,4,15,0) 34%,rgba(18,4,15,.80) 100%);
  --veil-top:linear-gradient(180deg,rgba(18,4,15,.74) 0%,rgba(18,4,15,0) 54%);
  --veil-left:linear-gradient(90deg,rgba(18,4,15,.82) 0%,rgba(18,4,15,.32) 44%,rgba(18,4,15,0) 74%);
  --veil-cream-bottom:linear-gradient(180deg,rgba(251,248,243,0) 0%,rgba(251,248,243,.92) 62%,var(--jpm-cream) 100%);

/* ── Desplegable de navegacion · una sola verdad ──────────────
   El panel es ciruela profundo con transparencia CONTENIDA: 6%
   basta para que se lea como cristal sin que el fondo entre a
   competir con el texto. Medido sobre el color base:

     marfil #FBF8F3 sobre ciruela #3F0835   15.2 : 1
     vino  #510B44 sobre marfil  #FBF8F3    13.3 : 1

   Los dos muy por encima del 4.5:1 exigido, y el primero es el
   estado NORMAL: los items se leen sin pasar el raton por encima.
   ------------------------------------------------------------ */
  --nav-panel-bg:rgba(63,8,53,.94);
  --nav-panel-borde:rgba(251,248,243,.22);
  --nav-panel-radio:18px;
  --nav-panel-sombra:0 26px 64px -30px rgba(0,0,0,.75);
  --nav-panel-ancho:310px;
  --nav-panel-padding:10px;
  --nav-panel-gap:2px;
  --nav-item-radio:10px;
  --nav-item-padding:11px 12px;
  --nav-texto:#FBF8F3;
  --nav-texto-activo:var(--jpm-purple);
  --nav-fondo-activo:var(--jpm-cream);
}