@media (max-width: 560px) {

    h1 {
        font-size: 2.4rem;
    }
    h2 {
        font-size: 2rem;
    }
    h3 {
        font-size: 1.6rem;
    }
    h4 {
        font-size: 1.25rem;
    }
    h5 {
        font-size: 1.1rem;
    }
    h6 {
        font-size: 0.95rem;
    }
    p {
        font-size: 1rem;
        line-height: 1.7;
    }
    /* ---- Landing Page ---- */
    #landing {
        height: 80vh;
    }
    #main-title {
        margin-top: 0;
    }
    /* ---- Scroll Cue ---- */
    .scroll-cue {
        width: 20%;
        height: 20%;
        margin-top: 0;
    }
    #landing .scroll-cue {
        margin-top: 5px;
    }
    /* ---- Introduction ---- */
    #introduction {
        margin: 0;
    }
    #introduction h3 {
        line-height: 1.2;
    }
    /* ---- Services ---- */
    #services .bg-title span {
        font-size: 12vw;
        transform: translateY(100%);
    }
    .service-slider {
        min-width: 0;
        width: 100%;
        min-height: 260px;
        height: 400px;
        border-radius: 1rem;
    }
    .service {
        padding: 1.5rem 1.75rem;
        gap: 0.5rem;
    }
    .service-left p, .service-right p {
        padding-left: 1.75rem;
        padding-right: 1.75rem;
        font-size: 0.65rem;
    }
    .slider-handle {
        width: 32px;
    }
    .slider-handle-knob {
        width: 36px;
        height: 36px;
        box-shadow: 0 6px 16px rgba(15, 23, 42, 0.45);
    }
    .slider-handle-icon {
        font-size: 0.7rem;
    }
    .service-label {
        top: 1.25rem;
        font-size: 0.8rem;
        letter-spacing: 0.15em;
    }
    .service-label-left {
        left: calc(0.7rem - var(--label-left-progress) * 0.1rem);
        top: calc(
                1rem + (50% - 1rem) * var(--label-left-progress)
        );
        transform:
                rotate(calc(var(--label-left-progress) * -90deg));
    }
    .service-label-right {
        right: calc(1rem - var(--label-right-progress) * 3rem);
        top: calc(1rem + (50% - 2rem) * var(--label-right-progress));
        transform:
                rotate(calc(var(--label-right-progress) * 90deg));
    }

    /* ---- Block Quote ---- */
    .quote-block {
        max-width: 80%;
        margin: 10% 0 0 0;
        padding-right: 3%;
        box-sizing: border-box;
    }
    .quote-block blockquote {
        width: 100%;
        font-size: 1rem;
        padding: 0;
    }
    .quote-block blockquote::before {
        left: -30px;
        font-size: 3rem;
    }
    .quote-block blockquote::after {
        right: -20px;
        bottom: -30px;
        font-size: 3rem;
    }

    /* ---- Projekte ---- */
    #clients .bg-title span {
        font-size: 12vw;
        transform: translateY(100%) translateX(-1%);
    }
    .client-faeze {
        flex-direction: column;
        align-items: flex-start;
    }
    .client-faeze-images,
    .client-faeze-text {
        width: 100%;
    }
    .client-faeze-images {
        margin-bottom: 6vh;
    }
    .client-faeze-text p {
        max-width: 100%;
    }

    /* ---- Team ---- */
    #about {
        margin-bottom: 65%;
    }
    #about .bg-title span {
        font-size: 12vw;
        opacity: 0.7;
        transform: translateY(90%);
        letter-spacing: 1rem;
    }
    #team-container {
        grid-template-columns: repeat(1, 1fr);
        gap: 10%;
        margin: 0;
    }
    .team-member h2 {
        font-size: 1.2rem;
        font-weight: 700;
        margin-bottom: 0;
    }

    /* ---- Kontakt ---- */
    #contact .bg-title span {
        font-size: 12vw;
        opacity: 0.7;
        transform: translateY(90%);
        letter-spacing: 0.9rem;
    }

    /* ---- Leistungen Carousel ---- */
    #carousel-3d {
    }
    .content__general {
        height: 50vh;
    }
    .container1 {
        width: 100%;
        overflow: hidden;
    }
    .container-carrossel {
        --widthItem: 65%;
        --heightItem: 50%;
    }
}