.container {
    grid-template-rows: var(--header-height) 1fr var(--footer-height-short);
    row-gap: 145px;
}

.grey-koop-logo {
    background-image: url("/hlaseni-skody//javax.faces.resource/img/triada-koop.svg.xhtml;jsessionid=YgL2FDArkkdFv6rDCD30CQgTfoLuIkMQGvFoji6u.ext-74");
    background-position: left -70rem bottom -8rem;
    background-repeat: no-repeat;
    background-size: 100rem;
    background-attachment: fixed;
}

@media (min-width: 1351px) {
    .grey-koop-logo {
        background-image: url("/hlaseni-skody//javax.faces.resource/img/triada-koop.svg.xhtml;jsessionid=YgL2FDArkkdFv6rDCD30CQgTfoLuIkMQGvFoji6u.ext-74"), url("/hlaseni-skody//javax.faces.resource/img/triada-koop.svg.xhtml;jsessionid=YgL2FDArkkdFv6rDCD30CQgTfoLuIkMQGvFoji6u.ext-74");
        background-position: right -86rem top -48rem, left -70rem bottom -8rem;
        background-repeat: no-repeat, no-repeat;
        background-size: 100rem, 100rem;
        background-attachment: scroll, fixed;
    }
}

.grey-cpp-logo {
    background-image: url("/hlaseni-skody//javax.faces.resource/img/triada-cpp.svg.xhtml;jsessionid=YgL2FDArkkdFv6rDCD30CQgTfoLuIkMQGvFoji6u.ext-74");
    background-position: left -10rem bottom -12rem;
    background-repeat: no-repeat;
    background-size: 50rem;
    background-attachment: fixed;
}

@media (min-width: 1351px) {
    .grey-cpp-logo {
        background-image: url("/hlaseni-skody//javax.faces.resource/img/triada-cpp.svg.xhtml;jsessionid=YgL2FDArkkdFv6rDCD30CQgTfoLuIkMQGvFoji6u.ext-74"), url("/hlaseni-skody//javax.faces.resource/img/triada-cpp.svg.xhtml;jsessionid=YgL2FDArkkdFv6rDCD30CQgTfoLuIkMQGvFoji6u.ext-74");
        background-position: right -42rem top 1rem, left -15rem bottom -12rem;
        background-repeat: no-repeat, no-repeat;
        background-size: 50rem, 50rem;
        background-attachment: scroll, fixed;
    }
}

.intro-left {
    grid-column: 1 / span 6;
    grid-row: 2;
    background-color: transparent;
    color: white;
    padding: var(--padding-block);
}

.intro-right {
    grid-column: 7 / span 6;
    grid-row: 2;
    padding: var(--padding-block);
}

.header {
    grid-column: 1 / span 12;
    grid-row: 1;
    height: 0;
    padding-bottom: 0;
}

.footer {
    grid-column: 1 / span 12;
    grid-row: 3;
}

#stripe_header {
    display: none;
}

.header-contact {
    display: none;
}

.logo {
    position: absolute;
    top: 0;
}

.footer-gradient {
    background: var(--color-main);
}

.intro-left-background {
    background: linear-gradient(133.7deg, var(--color-main-light) 9.6%, var(--color-main-dark) 75.08%);
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: 50%;
    z-index: -2;
}

@media (max-width: 1351px) {
    .container {
        grid-template-rows: var(--header-height) auto 1fr var(--footer-height-short);
        row-gap: var(--padding-block);
        height: 100vh;
    }

    .intro-left-background {
        display: none;
    }

    .intro-left {
        grid-column: 1 / span 12;
        grid-row: 2;
        border-image: linear-gradient(133.7deg, var(--color-main-light) 9.6%, var(--color-main-dark) 75.08%) fill 0 / auto / 200px 200px 0 100vw;
        padding: 4rem;
    }

    .intro-right {
        grid-column: 1 / span 12;
        grid-row: 3;
        padding: 4rem;
    }

    .footer {
        grid-row: 4;
    }
}

@media (max-width: 767px) {
    .container {
        grid-template-rows: var(--header-height) auto 1fr var(--footer-height-short);
        row-gap: 0;
    }

    .intro-subtitle {
        font-size: 1.563rem;
    }

    .intro-left {
        padding: 2rem 0;
    }

    .intro-right {
        padding: 2rem 0;
    }

    .intro-btn {
        width: 100%;
    }
}

@media (max-width: 360px) {
    .container {
        grid-template-rows: var(--header-height) auto 1fr var(--footer-height-long);
    }

    .text-h1 {
        font-size: 2.5rem !important;
        line-height: 3.125rem;
    }

    .text-h2 {
        font-size: 1.563rem !important;
        line-height: 1.875rem;
    }
}