/* Marca Simplicity sobre la base avenir (L3-E34). Generado por tools/marca-css.py: solo color y fuente.
   Paleta del manual: negro #000, taupe #57514A, azul #008DFF, gris #E3E3E3, blanco. Tipografia: Figtree. */
@font-face{font-family:"Figtree";font-style:normal;font-weight:300;font-display:swap;src:url("/fonts/figtree-light.woff2") format("woff2");}
@font-face{font-family:"Figtree";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/figtree-regular.woff2") format("woff2");}
@font-face{font-family:"Figtree";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/figtree-medium.woff2") format("woff2");}
@font-face{font-family:"Figtree";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/figtree-semibold.woff2") format("woff2");}
@font-face{font-family:"Figtree";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/figtree-bold.woff2") format("woff2");}
/* html body: avenir redefine sus variables en body dentro de las media queries */
:root:root, html body{
  --_🎨-color--base---base--light-100: #ffffff;
  --_🎨-color--base---base--dark-100: #000000;
  --_🎨-color--base---colors--accent: #008dff;
  --_🎨-color--base---base--dark-8: #00000014;
  --_🎨-color--base---base--dark-16: #00000029;
  --_🎨-color--base---colors--color5: #57514a;
  --_🎨-color--base---colors--color4: #e3e3e3;
  --_🎨-color--base---colors--color3: #e3e3e3;
  --_🎨-color--base---colors--color2: #e3e3e3;
  --_🎨-color--base---colors--color1: #e3e3e3;
  --_🎨-color--base---base--dark-88: #000000e0;
  --_🎨-color--base---base--dark-64: #000000a3;
  --_🎨-color--base---base--dark-48: #0000007a;
  --_🎨-color--base---base--dark-32: #00000052;
  --_🎨-color--base---base--dark-6: #0000000f;
  --_🎨-color--base---base--dark-4: #0000000a;
  --_🎨-color--base---base--dark-0: #00000000;
  --_🎨-color--base---base--light-88: #ffffffe0;
  --_🎨-color--base---base--light-64: #ffffffa3;
  --_🎨-color--base---base--light-48: #ffffff7a;
  --_🎨-color--base---base--light-32: #ffffff52;
  --_🎨-color--base---base--light-24: #ffffff3d;
  --_🎨-color--base---base--light-16: #ffffff29;
  --_🎨-color--base---base--light-8: #ffffff14;
  --_🎨-color--base---base--light-6: #ffffff0f;
  --_🎨-color--base---base--light-4: #ffffff0a;
  --_🎨-color--base---base--light-0: #ffffff00;
  --_🎨-color--base---lift--dark: #3d3935;
  --_🎨-color--base---depth--light: #e3e3e3;
  --_🎨-color--base---depth--dark: #000000;
  --_🎨-color--base---colors--accent-2: #007ec5;
  --_🔠-typography---font--body: "Figtree", system-ui, sans-serif;
  --_🔠-typography---font--button: "Figtree", system-ui, sans-serif;
  --_🔠-typography---font--heading-alternative: "Figtree", system-ui, sans-serif;
  --_🔠-typography---font--heading-main: "Figtree", system-ui, sans-serif;
  --_🔠-typography---font--label: "Figtree", system-ui, sans-serif;
}
/* avenir gira 180 grados el contenedor del video del hero porque su archivo venia invertido.
   Se deja el giro (ubica el boton play/pausa abajo a la derecha) y se contra-gira solo el video: uno derecho, como el del cliente o el que suba el panel, se ve derecho. */
.video_home-a.video_home-a > video{transform:rotate(180deg);}