/* ==========================================================================
   Organic — tokens del sistema de diseño de Tranqui.
   Fuente de verdad para colores y tipografía. Lo comparten el panel y el
   comprobante impreso, así que un cambio acá se propaga a los dos.
   ========================================================================== */

@font-face{
  font-family:'Caprasimo';font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/caprasimo-400-lat.woff2") format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Caprasimo';font-style:normal;font-weight:400;font-display:swap;
  src:url("fonts/caprasimo-400-ext.woff2") format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;
  src:url("fonts/figtree-400-lat.woff2") format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Figtree';font-style:normal;font-weight:400 700;font-display:swap;
  src:url("fonts/figtree-400-ext.woff2") format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  /* Monocromo. Tranqui no usa color: toda la jerarquía se resuelve con
     luminancia, peso tipográfico y superficie. */
  --color-black:#000000;
  --color-bg:#000000;
  --color-surface:#111111;
  --color-text:#f5f5f5;

  --color-neutral-100:#f5f5f5;
  --color-neutral-200:#dedede;
  --color-neutral-300:#bdbdbd;
  --color-neutral-400:#9a9a9a;
  --color-neutral-500:#757575;
  --color-neutral-600:#565656;
  --color-neutral-700:#3a3a3a;
  --color-neutral-800:#1c1c1c;
  --color-neutral-900:#111111;

  /* Los roles de acento quedan mapeados a la misma rampa gris: cualquier
     referencia vieja sigue funcionando y no vuelve a entrar color por ahí. */
  --color-accent:#f5f5f5;
  --color-accent-2:#bdbdbd;
  --color-accent-100:#f5f5f5;
  --color-accent-200:#dedede;
  --color-accent-300:#bdbdbd;
  --color-accent-400:#f5f5f5;
  --color-accent-500:#9a9a9a;
  --color-accent-600:#565656;
  --color-accent-700:#3a3a3a;
  --color-accent-800:#1c1c1c;
  --color-accent-900:#111111;
  --color-accent-2-100:#f5f5f5;
  --color-accent-2-200:#dedede;
  --color-accent-2-300:#bdbdbd;
  --color-accent-2-400:#9a9a9a;
  --color-accent-2-500:#757575;
  --color-accent-2-600:#565656;
  --color-accent-2-700:#3a3a3a;
  --color-accent-2-800:#1c1c1c;
  --color-accent-2-900:#1c1c1c;

  --font-heading:"Caprasimo",system-ui,sans-serif;
  --font-body:"Figtree",system-ui,sans-serif;
  --font-mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;

  --space-1:4.4px;
  --space-2:8.8px;
  --space-3:13.2px;
  --space-4:17.6px;
  --space-6:26.4px;
  --space-8:35.2px;

  --radius-sm:8px;
  --radius-md:16px;
  --radius-lg:28px;

  --shadow-sm:0 1px 2px rgba(0,0,0,.5);
  --shadow-md:0 3px 10px rgba(0,0,0,.55);
  --shadow-lg:0 12px 32px rgba(0,0,0,.6);
}
