@media (min-width: 1200px) {

    /* ========================================
                    Hero
                    [START]
    ========================================= */

    body.home {
        --page-width: 80%;
    }

    .frontpage-hero__inner {
        flex-direction: row;
        column-gap: 4%;
        width: 90%;
        margin-bottom: 7.5rem;
        margin-left: auto;
        margin-right: auto;
        padding-top: 1rem;
        padding-bottom: 2.5rem;
    }

    .frontpage-hero__left {
        width: 50%;
        height: auto;
        margin-top: 0;
        padding: 0;
        border: none;
        border-radius: 0;
        backdrop-filter: none;
        background-color: transparent;
    }

    .frontpage-hero__top {
        margin-top: auto;
    }

    .frontpage-hero__title {
        text-shadow: none;
        font-size: 1.75rem;
        color: var(--color-on-background);
    }

    .frontpage-hero__text {
        font-size: .875rem;
        color: var(--color-on-background);
    }

    .frontpage-hero__button--workplace {
        height: fit-content;
        margin-top: auto;
        margin-bottom: auto;
        padding: 0;
        box-shadow: none;
        color: var(--color-primary);
        background-color: transparent;
    }

    .frontpage-hero__button--workplace:hover {
        background-color: transparent;
    }

    .frontpage-hero__services-title {
        text-shadow: none;
        color: var(--color-primary);
    }
    
    .frontpage-hero__right {
        position: relative;
        display: flex;
        width: 50%;
        height: auto;
    }

    @keyframes frontpage-hero-img {
        from {
            opacity: 0;
            transform: translateX(-40px);
        }
        to {
            opacity: 100%;
            transform: translateX(0);
        }
    }

    .l-frontpage-hero__img {
        position: relative;
        height: 90%;
        margin-top: auto;
        /* margin-bottom: 5%; */
        filter: drop-shadow(0 0 12px rgb(0, 0, 0, 24%));
        overflow: visible;
        animation: frontpage-hero-img 3s ease both;
    }

    @keyframes frontpage-hero-img-backdrop {
        from {
            opacity: 0;
            transform: translate(-40px, -50%);
        }
        to {
            opacity: 100%;
            transform: translate(40px, -50%);
        }
    }

    .l-frontpage-hero__img::after {
        /* content: ''; */
        position: absolute;
        top: 50%;
        transform: translate(40px, -50%);
        z-index: -1;
        display: block;
        width: calc(100% + 20px);
        height: calc(100% + 80px);
        border-radius: 50%;
        box-shadow: 4px 4px 8px 8px rgb(0, 0, 0, 12%);
        background-color: var(--color-primary);
        animation: frontpage-hero-img-backdrop 3s ease both;
    }

    .frontpage-hero__img {
        filter: none;
        transform: none;
    }

    .frontpage-hero-service-card__header {
        font-size: 2rem;
    }

    /* ========================================
                    Hero
                    [END]
    ========================================= */




    /* ========================================
                    USP
                    [START]
    ========================================= */

    .frontpage-usp__inner {
        flex-direction: row;
        column-gap: 2.5rem;
    }

    .frontpage-usp__card {
        width: calc(100% / 3);
        opacity: 0;
        transform: translateY(6.25rem);
    }

    .frontpage-usp__card {
        animation: frontpage-usp 1.6s ease both;
        animation-delay: .6s;
    }

    .frontpage-usp__card:nth-of-type(2) {
        animation-delay: 1.2s;
    }

    .frontpage-usp__card:nth-of-type(3) {
        animation-delay: 1.8s;
    }

    .frontpage-usp__card.animated-item.visible {
        animation: frontpage-usp 1.6s ease both;
    }

    .frontpage-usp__card.animated-item.visible:nth-of-type(2) {
        animation-delay: .6s;
    }

    .frontpage-usp__card.animated-item.visible:nth-of-type(3) {
        animation-delay: 1.4s;
    }

    @keyframes frontpage-usp {
        to {
            opacity: 100%;
            transform: translateY(0);
        }
    }

    /* ========================================
                    USP
                    [END]
    ========================================= */




    /* ========================================
                    Video
                    [START]
    ========================================= */

    .frontpage-video {
        display: none;
    }

    /* ========================================
                    Video
                    [END]
    ========================================= */




    /* ========================================
                    Banner
                    [START]
    ========================================= */

    .frontpage-banner__inner {
        flex-direction: row;
        flex-wrap: wrap;
        column-gap: 2.5rem;
        align-items: center;
    }

    .frontpage-banner__button {
        opacity: 0;
        filter: blur(3px);
        transform: scale(.8);
    }

    .frontpage-banner__button.animated-item.visible {
        animation: frontpage-banner-button 1s ease both;
        animation-delay: .8s;
    }

    .frontpage-banner__button.animated-item.visible:nth-of-type(2) {
        animation-delay: 1.4s;
    }

    @keyframes frontpage-banner-button {
        to {
            opacity: 100%;
            filter: blur(0px);
            transform: scale(1);
        }
    }

    /* ========================================
                    Banner
                    [END]
    ========================================= */




    /* ========================================
                    Flyer
                    [START]
    ========================================= */

    .frontpage-flyer__inner {
        flex-direction: row;
        align-items: center;
        column-gap: 2.5rem;
    }

    @keyframes frontpage-flyer {
        to {
            opacity: 100%;
            filter: blur(0px);
            transform: translateX(0) rotate(-2.5deg);
        }
    }

    .frontpage-flyer .flyer {
        display: block;
        width: min(25rem, 100%);
        margin-left: auto;
        margin-right: auto;
        opacity: 0%;
        filter: blur(3px);
        transform: translateX(calc(100% + min(25rem, 100%))) rotate(1deg);
    }
    
    .frontpage-flyer.animated-item.visible .flyer {
        animation: frontpage-flyer 1.4s ease both;
        animation-delay: .2s;
    }

    .frontpage-flyer .flyer__content {
        height: 20rem;
        box-shadow: inset 0px 8px 8px 2px #0000000a;
        overflow: hidden;
    }
    
    .frontpage-flyer .flyer__placeholder {
        display: flex !important;
    }
    
    .frontpage-flyer .flyer__section {
        display: none;
    }

    /* ========================================
                    Flyer
                    [END]
    ========================================= */




    /* ========================================
                    Partner
                    [START]
    ========================================= */
    
    .frontpage-partner__inner {
        flex-direction: row;
        align-items: center;
        column-gap: 2.5rem;
    }

    .frontpage-partner-info__bullet {
        opacity: 0;
        transform: translateY(-2.5rem);
    }

    .frontpage-partner-info__bullet.animated-item.visible {
        animation: frontpage-partner 1.2s ease both;
        animation-delay: .2s;
    }

    .frontpage-partner-info__bullet.animated-item.visible:nth-of-type(2) {
        animation-delay: .8s;
    }

    .frontpage-partner-info__bullet.animated-item.visible:nth-of-type(3) {
        animation-delay: 1.4s;
    }

    @keyframes frontpage-partner {
        to {
            opacity: 100%;
            transform: translateY(0);
        }
    }
    
    .frontpage-partner__info {
        width: 50%;
    }

    .frontpage-partner-visual__img {
        height: 400px;
    }

    /* ========================================
                    Partner
                    [END]
    ========================================= */




    /* ========================================
                    Software
                    [START]
    ========================================= */

    .frontpage-software__inner {
        flex-direction: row;
        column-gap: 5rem;
    }

    .frontpage-software__visual {
        width: 40%;
        max-width: 100%;
    }

    .frontpage-software__content {
        width: 60%;
    }
    
    /* ========================================
                    Software
                    [END]
    ========================================= */




    /* ========================================
                    Reviews
                    [START]
    ========================================= */

    .frontpage-reviews-slider__item {
        flex-basis: calc(100% / 3);
        flex-shrink: 1;
    }

    /* ========================================
                    Reviews
                    [END]
    ========================================= */




    /* ========================================
                    Contact
                    [START]
    ========================================= */

    .frontpage-contact__inner {
        flex-direction: row;
        column-gap: 5rem;
    }

    /* ========================================
                    Contact
                    [END]
    ========================================= */

}


@media (min-width: 1600px) {

    .frontpage-hero__title {
        font-size: 2.25rem;
    }

    .frontpage-hero__text {
        font-size: 1rem;
    }

    .frontpage-hero-service-card__header {
        font-size: 2.5rem;
    }
}