/* ---------- variables ---------- */


@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');



:root {

    /* tipo */
    --tipo-general: 'Open Sans', sans-serif;
    --tipo-titulos: 'Inter', serif;

    /* colores */
    --c-azul-oscuro: #192c4c;
    --c-azul-oscuro-2: #233E77;
    --c-menta-opaco: #009ba9;
    --c-azul-claro: #4abdc9;
    --c-gris-oscuro: #424242;
    --c-gris-oscuro-sec: #495057;
    --c-gris-claro: #ced4da;
    --c-gris-azul: #64748b;
    --c-gris-medio: #757575;
    --c-gris-extra-claro: #f1f1f1;
    --c-productos-1: #29c76f;
    --c-productos-2: #ff9f42;
    --c-productos-3: #ea5455;
    --c-negro: #000;
    --c-blanco: #fff;
    --c-gris-extra-claro: #f5f5f5;

    --transition-all: all 0.4s ease;
    --transition-larga: all 0.8s ease;

    --boxshadow-hover: 0 0 10px 0 rgba(0, 0, 0, 0.08);

    /*degradados*/
    --deg-1: linear-gradient(180deg, var(--c-azul-oscuro-2) 0%, var(--c-azul-oscuro) 100%);
    --deg-2: linear-gradient(180deg, var(--c-menta-opaco) 0%, var(--c-azul-oscuro-2) 100%);
    --deg-3: linear-gradient(270deg, var(--c-menta-opaco) 0%, var(--c-azul-oscuro-2) 100%);
}