.epresto.zeroWasteIndex .startView {
    
    width: clamp(320px, 80vw, 1200px);

    margin-left: auto;
    margin-right: auto;

    margin-top: 4vh;
    margin-bottom: 6vh;

    
}

@media (max-width: 120em) {
    .epresto.zeroWasteIndex .startView {
        margin-bottom: 8vh;        
    }
}

.epresto.zeroWasteIndex .startView section#introduction {
    
}

 .epresto.zeroWasteIndex .startView section p {
    font-size: 1.4em;
}

@media (max-width: 120em) {
    .epresto.zeroWasteIndex .startView section p {
        font-size: 1.0em;
    }
}

.epresto.zeroWasteIndex .startView section#introduction h1 {
    font-family: 'OpenSans-Bold';
    font-size: 1.4em;
    line-height: 1.4em;
    text-transform: unset;
    letter-spacing: unset;
    color: #000000;
    margin-bottom: 1em;
}

@media (max-width: 120em) {
    .epresto.zeroWasteIndex .startView section#introduction h1 {
        font-size: 1.0em;
    }
}

.epresto.zeroWasteIndex .startView h2 {
    font-size: 3em;
    color: #666666;
}

@media (max-width: 43em) {
    .epresto.zeroWasteIndex .startView h2 {
        font-size: 2.4em;
       
    }
}

@media (max-width: 26em) {
    .epresto.zeroWasteIndex .startView h2 {
        font-size: 2.0em;  
        
    }
}

.epresto.zeroWasteIndex .startView section#selection {
 
    display: grid;
    grid-template-areas:
        'repair rental'
        'unpackaged secondhand';
    gap: 5vh;
    margin-bottom: 5vh;    
}

@media (max-width: 82em) {
    .epresto.zeroWasteIndex .startView section#selection {
        gap: 3vh;
    }
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection {
        gap: 2vh;
    }
}

/* Kacheln */

.epresto.zeroWasteIndex .startView section#selection a {
    container-type: size; /* Erforderlich, damit cqh verwendet werden kann */

    position: relative; /* Chrome: Erforderlich, damit cqh verwendet werden kann */

    aspect-ratio: 1.91 / 1;
    background-repeat: no-repeat;
    background-size: contain;
    transition: transform 0.5s ease;
}

.epresto.zeroWasteIndex .startView section#selection a:hover{
    transform: scale(1.05);
}

    @media (max-width: 62em) {
        .epresto.zeroWasteIndex .startView section#selection a {
        aspect-ratio: 1;        
        background-size: auto 100%;
        background-position: bottom right;
    }
}

.epresto.zeroWasteIndex .startView section#selection a span {
    --main-label-font-size: 28.65cqh;    
    --sub-label-font-size: 16cqh;
   
    position: absolute;
    text-transform: uppercase;
    color: #ffffff;
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a span {
        --main-label-font-size: 18.65cqh;
        --sub-label-font-size: 14cqh;
    }
}

/* erstes span */
.epresto.zeroWasteIndex .startView section#selection a span:nth-child(1) {
    top: calc( 50cqh - var(--main-label-font-size) / 2 ); /* Default: vertical zentriert */
    left: 4cqw;
    height: calc(var(--main-label-font-size) * 0.9);

    font-family: 'saira-extra-condensed-v11-latin-900';
    font-size: var(--main-label-font-size);
    line-height: calc(var(--main-label-font-size) * 0.9);
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a span:nth-child(1) {
        top: 6.5cqh;       
    }
}

/* zweites span */
.epresto.zeroWasteIndex .startView section#selection a span:nth-child(2) {
    top: calc( 46cqh + var(--main-label-font-size) / 2 ); /* Default: unter Main Label */
    left: 4cqw;
    height: calc(var(--sub-label-font-size) * 0.9);

    font-family: 'saira-extra-condensed-v11-latin-300';
    font-size: var(--sub-label-font-size);
    line-height: calc(var(--sub-label-font-size) * 0.9);
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a span:nth-child(2) {       
        top: 24.5cqh;
    }
}

.epresto.zeroWasteIndex .startView section#selection a img {
    position: absolute;    
}

.epresto.zeroWasteIndex .startView section#selection a.repair {
    grid-area: repair;
    background-image: url(../Pix/TileRepairBackground.webp);
}

.epresto.zeroWasteIndex .startView section#selection a.repair span:nth-child(1){}

.epresto.zeroWasteIndex .startView section#selection a.repair span:nth-child(2) {}

.epresto.zeroWasteIndex .startView section#selection a.repair img {    
    height: 100cqh;
    top: 4cqw;
    right: 0;
   
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a.repair img {
        height: 70cqh;
        top: unset;
        bottom: 1cqw;
    }
}

.epresto.zeroWasteIndex .startView section#selection a.rental {
    grid-area: rental;
    background-image: url(../Pix/TileRentalBackground.webp);
}

.epresto.zeroWasteIndex .startView section#selection a.rental span:nth-child(1) {}

.epresto.zeroWasteIndex .startView section#selection a.rental span:nth-child(2) {}

.epresto.zeroWasteIndex .startView section#selection a.rental img{
    height: 90cqh;
    top: 3cqw;
    right: 0;
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a.rental img {
        height: 60cqh;
        top: unset;
        bottom: 3cqw;
    }
}

.epresto.zeroWasteIndex .startView section#selection a.secondhand {
    grid-area: secondhand;
    background-image: url(../Pix/TileSecondhandBackground.webp);
}

.epresto.zeroWasteIndex .startView section#selection a.secondhand span:nth-child(1) {
    top: 6.5cqh;
}

.epresto.zeroWasteIndex .startView section#selection a.secondhand span:nth-child(2) {
    top: 16.2cqh;
    left: 65.5cqw;
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a.secondhand span:nth-child(2) {
        top: 24.5cqh;
        left: 4cqw;
    }
}

.epresto.zeroWasteIndex .startView section#selection a.secondhand img{
    width: 85cqw;
    transform: rotate(-1.5deg);
    bottom: -7.5cqw;
    right: -5cqw;
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a.secondhand img {
        width: 100cqw;
        bottom: -3.5cqw;
    }
}

.epresto.zeroWasteIndex .startView section#selection a.unpackaged {
    grid-area: unpackaged;
    background-image: url(../Pix/TileUnpackagedBackground.webp);
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a.unpackaged {
        background-image: url(../Pix/TileUnpackagedBackgroundMobile.webp);
    }
}

.epresto.zeroWasteIndex .startView section#selection a.unpackaged span:nth-child(1) {
    top: 6.5cqh;
}

.epresto.zeroWasteIndex .startView section#selection a.unpackaged span:nth-child(2) {
    top: 31.5cqh;
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a.unpackaged span:nth-child(2) {
        top: 24.5cqh;
    }
}


.epresto.zeroWasteIndex .startView section#selection a.unpackaged img{
    height: 80cqh;
    bottom: -8cqw;
    right: -8cqw;
}

@media (max-width: 62em) {
    .epresto.zeroWasteIndex .startView section#selection a.unpackaged img {
        height: 50cqh;
        bottom: -5cqw;
        right: -0cqw;
    }
}