/* Estilos base para width */
.w-0 { width: 0; }
.w-px { width: 1px; }
.w-0\.5 { width: 0.125rem; } /* 2px */
.w-1 { width: 0.25rem; } /* 4px */
.w-1\.5 { width: 0.375rem; } /* 6px */
.w-2 { width: 0.5rem; } /* 8px */
.w-2\.5 { width: 0.625rem; } /* 10px */
.w-3 { width: 0.75rem; } /* 12px */
.w-3\.5 { width: 0.875rem; } /* 14px */
.w-4 { width: 1rem; } /* 16px */
.w-5 { width: 1.25rem; } /* 20px */
.w-6 { width: 1.5rem; } /* 24px */
.w-7 { width: 1.75rem; } /* 28px */
.w-8 { width: 2rem; } /* 32px */
.w-9 { width: 2.25rem; } /* 36px */
.w-10 { width: 2.5rem; } /* 40px */
.w-11 { width: 2.75rem; } /* 44px */
.w-12 { width: 3rem; } /* 48px */
.w-14 { width: 3.5rem; } /* 56px */
.w-16 { width: 4rem; } /* 64px */
.w-20 { width: 5rem; } /* 80px */
.w-24 { width: 6rem; } /* 96px */
.w-28 { width: 7rem; } /* 112px */
.w-32 { width: 8rem; } /* 128px */
.w-36 { width: 9rem; } /* 144px */
.w-40 { width: 10rem; } /* 160px */
.w-44 { width: 11rem; } /* 176px */
.w-48 { width: 12rem; } /* 192px */
.w-52 { width: 13rem; } /* 208px */
.w-56 { width: 14rem; } /* 224px */
.w-60 { width: 15rem; } /* 240px */
.w-64 { width: 16rem; } /* 256px */
.w-72 { width: 18rem; } /* 288px */
.w-80 { width: 20rem; } /* 320px */
.w-96 { width: 24rem; } /* 384px */

/* Porcentajes */
.w-1\/2 { width: 50%; }
.w-1\/3 { width: 33.333333%; }
.w-2\/3 { width: 66.666667%; }
.w-1\/4 { width: 25%; }
.w-2\/4 { width: 50%; }
.w-3\/4 { width: 75%; }
.w-1\/5 { width: 20%; }
.w-2\/5 { width: 40%; }
.w-3\/5 { width: 60%; }
.w-4\/5 { width: 80%; }
.w-1\/6 { width: 16.666667%; }
.w-2\/6 { width: 33.333333%; }
.w-3\/6 { width: 50%; }
.w-4\/6 { width: 66.666667%; }
.w-5\/6 { width: 83.333333%; }
.w-1\/12 { width: 8.333333%; }
.w-2\/12 { width: 16.666667%; }
.w-3\/12 { width: 25%; }
.w-4\/12 { width: 33.333333%; }
.w-5\/12 { width: 41.666667%; }
.w-6\/12 { width: 50%; }
.w-7\/12 { width: 58.333333%; }
.w-8\/12 { width: 66.666667%; }
.w-9\/12 { width: 75%; }
.w-10\/12 { width: 83.333333%; }
.w-11\/12 { width: 91.666667%; }
.w-full { width: 100%; }
.w-screen { width: 100vw; }
.w-min { width: min-content; }
.w-max { width: max-content; }
.w-fit { width: fit-content; }

/* Breakpoints responsivos */
@media (min-width: 576px) {

  /* Estilos base para width */
    .sm\:w-0 { width: 0; }
    .sm\:w-px { width: 1px; }
    .sm\:w-0\.5 { width: 0.125rem; } /* 2px */
    .sm\:w-1 { width: 0.25rem; } /* 4px */
    .sm\:w-1\.5 { width: 0.375rem; } /* 6px */
    .sm\:w-2 { width: 0.5rem; } /* 8px */
    .sm\:w-2\.5 { width: 0.625rem; } /* 10px */
    .sm\:w-3 { width: 0.75rem; } /* 12px */
    .sm\:w-3\.5 { width: 0.875rem; } /* 14px */
    .sm\:w-4 { width: 1rem; } /* 16px */
    .sm\:w-5 { width: 1.25rem; } /* 20px */
    .sm\:w-6 { width: 1.5rem; } /* 24px */
    .sm\:w-7 { width: 1.75rem; } /* 28px */
    .sm\:w-8 { width: 2rem; } /* 32px */
    .sm\:w-9 { width: 2.25rem; } /* 36px */
    .sm\:w-10 { width: 2.5rem; } /* 40px */
    .sm\:w-11 { width: 2.75rem; } /* 44px */
    .sm\:w-12 { width: 3rem; } /* 48px */
    .sm\:w-14 { width: 3.5rem; } /* 56px */
    .sm\:w-16 { width: 4rem; } /* 64px */
    .sm\:w-20 { width: 5rem; } /* 80px */
    .sm\:w-24 { width: 6rem; } /* 96px */
    .sm\:w-28 { width: 7rem; } /* 112px */
    .sm\:w-32 { width: 8rem; } /* 128px */
    .sm\:w-36 { width: 9rem; } /* 144px */
    .sm\:w-40 { width: 10rem; } /* 160px */
    .sm\:w-44 { width: 11rem; } /* 176px */
    .sm\:w-48 { width: 12rem; } /* 192px */
    .sm\:w-52 { width: 13rem; } /* 208px */
    .sm\:w-56 { width: 14rem; } /* 224px */
    .sm\:w-60 { width: 15rem; } /* 240px */
    .sm\:w-64 { width: 16rem; } /* 256px */
    .sm\:w-72 { width: 18rem; } /* 288px */
    .sm\:w-80 { width: 20rem; } /* 320px */
    .sm\:w-96 { width: 24rem; } /* 384px */

    /* Porcentajes */
    .sm\:w-1\/2 { width: 50%; }
    .sm\:w-1\/3 { width: 33.333333%; }
    .sm\:w-2\/3 { width: 66.666667%; }
    .sm\:w-1\/4 { width: 25%; }
    .sm\:w-2\/4 { width: 50%; }
    .sm\:w-3\/4 { width: 75%; }
    .sm\:w-1\/5 { width: 20%; }
    .sm\:w-2\/5 { width: 40%; }
    .sm\:w-3\/5 { width: 60%; }
    .sm\:w-4\/5 { width: 80%; }
    .sm\:w-1\/6 { width: 16.666667%; }
    .sm\:w-2\/6 { width: 33.333333%; }
    .sm\:w-3\/6 { width: 50%; }
    .sm\:w-4\/6 { width: 66.666667%; }
    .sm\:w-5\/6 { width: 83.333333%; }
    .sm\:w-1\/12 { width: 8.333333%; }
    .sm\:w-2\/12 { width: 16.666667%; }
    .sm\:w-3\/12 { width: 25%; }
    .sm\:w-4\/12 { width: 33.333333%; }
    .sm\:w-5\/12 { width: 41.666667%; }
    .sm\:w-6\/12 { width: 50%; }
    .sm\:w-7\/12 { width: 58.333333%; }
    .sm\:w-8\/12 { width: 66.666667%; }
    .sm\:w-9\/12 { width: 75%; }
    .sm\:w-10\/12 { width: 83.333333%; }
    .sm\:w-11\/12 { width: 91.666667%; }
    .sm\:w-full { width: 100%; }
    .sm\:w-screen { width: 100vw; }
    .sm\:w-min { width: min-content; }
    .sm\:w-max { width: max-content; }
    .sm\:w-fit { width: fit-content; }

}

@media (min-width: 768px) {
    .md\:w-0 { width: 0; }
    .md\:w-px { width: 1px; }
    .md\:w-0\.5 { width: 0.125rem; } /* 2px */
    .md\:w-1 { width: 0.25rem; } /* 4px */
    .md\:w-1\.5 { width: 0.375rem; } /* 6px */
    .md\:w-2 { width: 0.5rem; } /* 8px */
    .md\:w-2\.5 { width: 0.625rem; } /* 10px */
    .md\:w-3 { width: 0.75rem; } /* 12px */
    .md\:w-3\.5 { width: 0.875rem; } /* 14px */
    .md\:w-4 { width: 1rem; } /* 16px */
    .md\:w-5 { width: 1.25rem; } /* 20px */
    .md\:w-6 { width: 1.5rem; } /* 24px */
    .md\:w-7 { width: 1.75rem; } /* 28px */
    .md\:w-8 { width: 2rem; } /* 32px */
    .md\:w-9 { width: 2.25rem; } /* 36px */
    .md\:w-10 { width: 2.5rem; } /* 40px */
    .md\:w-11 { width: 2.75rem; } /* 44px */
    .md\:w-12 { width: 3rem; } /* 48px */
    .md\:w-14 { width: 3.5rem; } /* 56px */
    .md\:w-16 { width: 4rem; } /* 64px */
    .md\:w-20 { width: 5rem; } /* 80px */
    .md\:w-24 { width: 6rem; } /* 96px */
    .md\:w-28 { width: 7rem; } /* 112px */
    .md\:w-32 { width: 8rem; } /* 128px */
    .md\:w-36 { width: 9rem; } /* 144px */
    .md\:w-40 { width: 10rem; } /* 160px */
    .md\:w-44 { width: 11rem; } /* 176px */
    .md\:w-48 { width: 12rem; } /* 192px */
    .md\:w-52 { width: 13rem; } /* 208px */
    .md\:w-56 { width: 14rem; } /* 224px */
    .md\:w-60 { width: 15rem; } /* 240px */
    .md\:w-64 { width: 16rem; } /* 256px */
    .md\:w-72 { width: 18rem; } /* 288px */
    .md\:w-80 { width: 20rem; } /* 320px */
    .md\:w-96 { width: 24rem; } /* 384px */

    /* Porcentajes */
    .md\:w-1\/2 { width: 50%; }
    .md\:w-1\/3 { width: 33.333333%; }
    .md\:w-2\/3 { width: 66.666667%; }
    .md\:w-1\/4 { width: 25%; }
    .md\:w-2\/4 { width: 50%; }
    .md\:w-3\/4 { width: 75%; }
    .md\:w-1\/5 { width: 20%; }
    .md\:w-2\/5 { width: 40%; }
    .md\:w-3\/5 { width: 60%; }
    .md\:w-4\/5 { width: 80%; }
    .md\:w-1\/6 { width: 16.666667%; }
    .md\:w-2\/6 { width: 33.333333%; }
    .md\:w-3\/6 { width: 50%; }
    .md\:w-4\/6 { width: 66.666667%; }
    .md\:w-5\/6 { width: 83.333333%; }
    .md\:w-1\/12 { width: 8.333333%; }
    .md\:w-2\/12 { width: 16.666667%; }
    .md\:w-3\/12 { width: 25%; }
    .md\:w-4\/12 { width: 33.333333%; }
    .md\:w-5\/12 { width: 41.666667%; }
    .md\:w-6\/12 { width: 50%; }
    .md\:w-7\/12 { width: 58.333333%; }
    .md\:w-8\/12 { width: 66.666667%; }
    .md\:w-9\/12 { width: 75%; }
    .md\:w-10\/12 { width: 83.333333%; }
    .md\:w-11\/12 { width: 91.666667%; }
    .md\:w-full { width: 100%; }
    .md\:w-screen { width: 100vw; }
    .md\:w-min { width: min-content; }
    .md\:w-max { width: max-content; }
    .md\:w-fit { width: fit-content; }

}


@media (min-width: 992px) {
    .lg\:w-0 { width: 0; }
    .lg\:w-px { width: 1px; }
    .lg\:w-0\.5 { width: 0.125rem; } /* 2px */
    .lg\:w-1 { width: 0.25rem; } /* 4px */
    .lg\:w-1\.5 { width: 0.375rem; } /* 6px */
    .lg\:w-2 { width: 0.5rem; } /* 8px */
    .lg\:w-2\.5 { width: 0.625rem; } /* 10px */
    .lg\:w-3 { width: 0.75rem; } /* 12px */
    .lg\:w-3\.5 { width: 0.875rem; } /* 14px */
    .lg\:w-4 { width: 1rem; } /* 16px */
    .lg\:w-5 { width: 1.25rem; } /* 20px */
    .lg\:w-6 { width: 1.5rem; } /* 24px */
    .lg\:w-7 { width: 1.75rem; } /* 28px */
    .lg\:w-8 { width: 2rem; } /* 32px */
    .lg\:w-9 { width: 2.25rem; } /* 36px */
    .lg\:w-10 { width: 2.5rem; } /* 40px */
    .lg\:w-11 { width: 2.75rem; } /* 44px */
    .lg\:w-12 { width: 3rem; } /* 48px */
    .lg\:w-14 { width: 3.5rem; } /* 56px */
    .lg\:w-16 { width: 4rem; } /* 64px */
    .lg\:w-20 { width: 5rem; } /* 80px */
    .lg\:w-24 { width: 6rem; } /* 96px */
    .lg\:w-28 { width: 7rem; } /* 112px */
    .lg\:w-32 { width: 8rem; } /* 128px */
    .lg\:w-36 { width: 9rem; } /* 144px */
    .lg\:w-40 { width: 10rem; } /* 160px */
    .lg\:w-44 { width: 11rem; } /* 176px */
    .lg\:w-48 { width: 12rem; } /* 192px */
    .lg\:w-52 { width: 13rem; } /* 208px */
    .lg\:w-56 { width: 14rem; } /* 224px */
    .lg\:w-60 { width: 15rem; } /* 240px */
    .lg\:w-64 { width: 16rem; } /* 256px */
    .lg\:w-72 { width: 18rem; } /* 288px */
    .lg\:w-80 { width: 20rem; } /* 320px */
    .lg\:w-96 { width: 24rem; } /* 384px */

    /* Porcentajes */
    .lg\:w-1\/2 { width: 50%; }
    .lg\:w-1\/3 { width: 33.333333%; }
    .lg\:w-2\/3 { width: 66.666667%; }
    .lg\:w-1\/4 { width: 25%; }
    .lg\:w-2\/4 { width: 50%; }
    .lg\:w-3\/4 { width: 75%; }
    .lg\:w-1\/5 { width: 20%; }
    .lg\:w-2\/5 { width: 40%; }
    .lg\:w-3\/5 { width: 60%; }
    .lg\:w-4\/5 { width: 80%; }
    .lg\:w-1\/6 { width: 16.666667%; }
    .lg\:w-2\/6 { width: 33.333333%; }
    .lg\:w-3\/6 { width: 50%; }
    .lg\:w-4\/6 { width: 66.666667%; }
    .lg\:w-5\/6 { width: 83.333333%; }
    .lg\:w-1\/12 { width: 8.333333%; }
    .lg\:w-2\/12 { width: 16.666667%; }
    .lg\:w-3\/12 { width: 25%; }
    .lg\:w-4\/12 { width: 33.333333%; }
    .lg\:w-5\/12 { width: 41.666667%; }
    .lg\:w-6\/12 { width: 50%; }
    .lg\:w-7\/12 { width: 58.333333%; }
    .lg\:w-8\/12 { width: 66.666667%; }
    .lg\:w-9\/12 { width: 75%; }
    .lg\:w-10\/12 { width: 83.333333%; }
    .lg\:w-11\/12 { width: 91.666667%; }
    .lg\:w-full { width: 100%; }
    .lg\:w-screen { width: 100vw; }
    .lg\:w-min { width: min-content; }
    .lg\:w-max { width: max-content; }
    .lg\:w-fit { width: fit-content; }

}


@media (min-width: 1200px) {
    .xl\:w-0 { width: 0; }
    .xl\:w-px { width: 1px; }
    .xl\:w-0\.5 { width: 0.125rem; } /* 2px */
    .xl\:w-1 { width: 0.25rem; } /* 4px */
    .xl\:w-1\.5 { width: 0.375rem; } /* 6px */
    .xl\:w-2 { width: 0.5rem; } /* 8px */
    .xl\:w-2\.5 { width: 0.625rem; } /* 10px */
    .xl\:w-3 { width: 0.75rem; } /* 12px */
    .xl\:w-3\.5 { width: 0.875rem; } /* 14px */
    .xl\:w-4 { width: 1rem; } /* 16px */
    .xl\:w-5 { width: 1.25rem; } /* 20px */
    .xl\:w-6 { width: 1.5rem; } /* 24px */
    .xl\:w-7 { width: 1.75rem; } /* 28px */
    .xl\:w-8 { width: 2rem; } /* 32px */
    .xl\:w-9 { width: 2.25rem; } /* 36px */
    .xl\:w-10 { width: 2.5rem; } /* 40px */
    .xl\:w-11 { width: 2.75rem; } /* 44px */
    .xl\:w-12 { width: 3rem; } /* 48px */
    .xl\:w-14 { width: 3.5rem; } /* 56px */
    .xl\:w-16 { width: 4rem; } /* 64px */
    .xl\:w-20 { width: 5rem; } /* 80px */
    .xl\:w-24 { width: 6rem; } /* 96px */
    .xl\:w-28 { width: 7rem; } /* 112px */
    .xl\:w-32 { width: 8rem; } /* 128px */
    .xl\:w-36 { width: 9rem; } /* 144px */
    .xl\:w-40 { width: 10rem; } /* 160px */
    .xl\:w-44 { width: 11rem; } /* 176px */
    .xl\:w-48 { width: 12rem; } /* 192px */
    .xl\:w-52 { width: 13rem; } /* 208px */
    .xl\:w-56 { width: 14rem; } /* 224px */
    .xl\:w-60 { width: 15rem; } /* 240px */
    .xl\:w-64 { width: 16rem; } /* 256px */
    .xl\:w-72 { width: 18rem; } /* 288px */
    .xl\:w-80 { width: 20rem; } /* 320px */
    .xl\:w-96 { width: 24rem; } /* 384px */

    /* Porcentajes */
    .xl\:w-1\/2 { width: 50%; }
    .xl\:w-1\/3 { width: 33.333333%; }
    .xl\:w-2\/3 { width: 66.666667%; }
    .xl\:w-1\/4 { width: 25%; }
    .xl\:w-2\/4 { width: 50%; }
    .xl\:w-3\/4 { width: 75%; }
    .xl\:w-1\/5 { width: 20%; }
    .xl\:w-2\/5 { width: 40%; }
    .xl\:w-3\/5 { width: 60%; }
    .xl\:w-4\/5 { width: 80%; }
    .xl\:w-1\/6 { width: 16.666667%; }
    .xl\:w-2\/6 { width: 33.333333%; }
    .xl\:w-3\/6 { width: 50%; }
    .xl\:w-4\/6 { width: 66.666667%; }
    .xl\:w-5\/6 { width: 83.333333%; }
    .xl\:w-1\/12 { width: 8.333333%; }
    .xl\:w-2\/12 { width: 16.666667%; }
    .xl\:w-3\/12 { width: 25%; }
    .xl\:w-4\/12 { width: 33.333333%; }
    .xl\:w-5\/12 { width: 41.666667%; }
    .xl\:w-6\/12 { width: 50%; }
    .xl\:w-7\/12 { width: 58.333333%; }
    .xl\:w-8\/12 { width: 66.666667%; }
    .xl\:w-9\/12 { width: 75%; }
    .xl\:w-10\/12 { width: 83.333333%; }
    .xl\:w-11\/12 { width: 91.666667%; }
    .xl\:w-full { width: 100%; }
    .xl\:w-screen { width: 100vw; }
    .xl\:w-min { width: min-content; }
    .xl\:w-max { width: max-content; }
    .xl\:w-fit { width: fit-content; }

}