/* Portrait and Landscape */
@media (max-width: 1024px) {
    .support-logo {
        width: 15vw;
    }
    body {
        font-size: 1em;
    }

    .cemetik-post-list {
        font-size: 1em;
    }

    #cemetik-hero-container {
        flex-direction: column; /* sloupec */
        align-items: center;
        height: auto;
    }

    /* animace nad textem */
    #cemetik-hero-anim-container {
        order: -1; /* jde nahoru */
        display: flex;
        justify-content: center;
        width: 100%;
        margin: 1rem 0;
    }
    #cemetik-hero-anim-container canvas {
        width: min(80vw, 420px); /* responzivní šířka */
        height: auto;
    }

    #cemetik-hero-text-container {
        width: 100%;
        padding: 2rem 1.25rem;
        align-items: center;
        text-align: center;
    }

    #cemetik-hero-text-container span {
        font-size: clamp(5rem, 13vw, 8rem);
        line-height: 0.9;
        padding: 0em 0;
    }

    /* Tři „hero-line“ odkazy – plná šířka, menší písmo */
    .hero-line1,
    .hero-line2,
    .hero-line3 {
        width: 50vw !important;
        margin-left: 0;
        height: auto;
        padding: 0.5em !important;
        mask: none;
        text-align: left;
    }

    .hero-line3 {
        mask: linear-gradient(-35deg, #0000 1.5em, #000 0);
    }
}

@media only screen and (max-width: 700px) {
    .cemetik-post-list {
        flex-direction: column;
        gap: 0.5em;
        font-size: 1em;
    }

    .cemetik-post-list-title h2 {
        transform: none;
    }

    .cemetik-post-list-title {
        min-height: 2em;
    }

    .cemetik-text {
        flex-direction: column;
        align-items: stretch;
    }

    .cemetik-text-title {
        height: 2em;
    }

    .cemetik-text-title h2 {
        transform: none;
    }

    nav {
        display: none;
    }

    #c {
        width: 75vw !important;
        height: auto !important;
        aspect-ratio: 1 / 1;
    }

    .cemetik-info {
        font-size: 1em;
    }

    #mobile-menu {
        display: block;
    }
}

@media (max-width: 600px) {
    .hero-line1,
    .hero-line2,
    .hero-line3 {
        width: 16em !important;
    }

    form {
        flex-direction: column;
    }

    input {
        width: 100%;
    }
}

@media (max-width: 500px) {
    .hero-line1,
    .hero-line2,
    .hero-line3 {
        width: 12.5em !important;
    }

    #cemetik-hero-text-container span {
        font-size: 4em;
    }

    #cemetik-hero-anim-container {
        margin: 0;
        margin-top: -1em;
    }

    .support-logo {
        width: 20vw;
    }

    .toggle-big {
        display: none;
    }

    .toggle-small {
        display: block;
    }
}

/* Portrait */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
}

/* Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
}