.slanted-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.slanted-list li {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    transition: transform 0.3s ease;
}

.slant-0 { transform: translateX(0); }
.slant-1 { transform: translateX(10px); margin-top: 1.5rem; }
.slant-2 { transform: translateX(20px); margin-top: 1.5rem; }
.slant-3 { transform: translateX(30px); margin-top: 1.5rem; }
.slant-4 { transform: translateX(40px); margin-top: 1.5rem; }
.slant-5 { transform: translateX(50px); margin-top: 1.5rem; }
.slant-6 { transform: translateX(60px); margin-top: 1.5rem; }
.slant-7 { transform: translateX(70px); margin-top: 1.5rem; }
.slant-8 { transform: translateX(80px); margin-top: 1.5rem; }
.slant-9 { transform: translateX(120px); margin-top: 3rem; }

/* Force flex column on mobile for .container.d-flex */
@media (max-width: 991.98px) {
    .container.d-flex {
        flex-direction: column !important;
    }

    .container.d-flex>.flex-fill {
        width: 100% !important;
        max-width: 100% !important;
    }

    .slanted-list li {
        transform: translateX(0) !important;
        margin-top: 1rem !important;
    }

    .slant-9 {
        transform: translateX(0) !important;
        margin-top: 1rem !important;
    }
}

@media (max-width: 1024px) {

    .slanted-list li,
    .slant-9 {
        transform: translateX(0) !important;
        margin-top: 1rem !important;
    }
}

@media (max-width: 600px) {
    .slanted-list li {
        transform: translateX(0) !important;
        margin-top: 1rem !important;
    }

    .slant-9 {
        transform: translateX(0) !important;
        margin-top: 1rem !important;
    }
}