/* Max Width 1399px
------------------------------------*/
@media all and (max-width: 1399px) {
    .automation-integration ul {
        gap: 5rem;
    }
    .automation-integration ul li {
        flex-basis: calc(50% - 2.5rem)
    }
}


/* Max Width 1199px
------------------------------------*/
@media all and (max-width: 1199px) {
    .automation-integration .col-lg-6 {
        padding: 6rem;
    }
    .automation-integration ul {
        gap: 4rem;
        justify-content: space-between;
    }
    .automation-integration ul li {
        flex-basis: calc(50% - 3rem);
    }
}


/* Max Width 991px
------------------------------------*/
@media all and (max-width: 991px) {
    #header .row,
    #super-header .row {
        justify-content: space-between;
    }
    #header .row > div,
    #super-header .row > div {
        width: fit-content;
    }
    .hero-overlay .container {
        padding-top: 12rem;
        padding-bottom: 12rem;
    }
    .about-section .col-lg-2 {
        padding-right: 0;
        padding-bottom: 4rem;
    }
    .about-section .col-lg-10 {
        border-top: 1px solid var(--black);
        padding-top: 4rem;
        border-left: none;
        padding-left: calc(var(--bs-gutter-x) * .5) !important;
    }
    .automation-integration .purple-gradient::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: calc(-50vw + 50%);
        left: 0;
        background: var(--purple-gradient);
        z-index: 0;
    }
    .automation-integration .t5-bg::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: calc(-50vw + 50%);
        background-color: var(--tint5);
        z-index: -2;
    }
    .automation-integration .purple-gradient img {
        z-index: 1;
    }
    .automation-integration .purple-gradient div {
        z-index: 1;
    }
    .automation-integration .col-lg-6 {
        padding: 8rem;
    }
    .details-list img {
        margin-left: 0;
        margin-bottom: 2rem;
    }
    .details-list p {
        width: 100%;
    }
    .services ul li {
        flex-basis: calc(50% - 0.75rem);
    }
    .banner .button {
        margin-left: 0;
        margin-right: auto;
        margin-top: 2rem;
    }
    .bwpackaging img {
        margin-left: 0;
        margin-right: auto;
        margin-bottom: 4rem;
    }
    .contact-footer .row {
        gap: 8rem;
    }
    form {
        padding-right: 0;
    }
    section#footer .footer-sitemap .row {
        gap: 4rem;
    }
    section#footer .footer-sitemap .col-lg-6:last-of-type {
        text-align: left;
    }
    section#footer .footer-legal .row {
        justify-content: space-between;
    }
    section#footer .footer-legal .row > div {
        width: fit-content;
    }
}


/* Max Width 767px
------------------------------------*/
@media all and (max-width: 767px) {
    #super-header {
        padding-right: calc(1.5rem * .5);
        padding-left: calc(1.5rem * .5);
    }
    #super-header .row > div:first-of-type img {
        height: 14px !important;
        object-fit: contain;
        max-width: unset;
    }
    #super-header .col-lg-6:last-of-type a:not(.mobile-only) {
        display: none;
    }
    #super-header .col-lg-6:last-of-type .mobile-only {
        display: block;
        font-size: 1.4rem;
    }
    #header .button {
        padding: 16px;
    }
    h1 {
        font-size: 5.6rem;
        line-height: 6.4rem;
    }
    h2 {
        font-size: 4rem;
        line-height: 4.8rem;
    }
    h3 {
        font-size: 3.6rem;
        line-height: 4rem;
    }
    section#footer .footer-legal .row {
        gap: 1rem;
    }
}


/* Max Width 575px
------------------------------------*/
@media all and (max-width: 575px) {
    section#main .container {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .automation-integration .container {
        padding-right: calc(var(--bs-gutter-x) * .5) !important;
        padding-left: calc(var(--bs-gutter-x) * .5) !important;
    }
    .automation-integration ul {
        flex-direction: column;
    }
    .automation-integration ul li {
        flex-basis: 100%;
    }
    .services ul li {
        flex-basis: 100%;
        padding: 2rem 2rem 6rem;
    }
    .services ul li >* {
        width: 100%;
    }
    .services ul li:last-of-type {
        display: none;
    }
    section#footer .footer-legal ul {
        flex-wrap: wrap;
    }
}