@media screen and (min-width: 1500px ) {
    header.dz-bank { height: 70vh; min-height: 500px; }
}


@media screen and (max-width: 1550px ) {
    header.dz-bank .intro-box { padding: 50px 220px 40px 100px; }
}

@media screen and (max-width: 1400px ) {
    /* Nav */
    nav.dz-bank { gap: 40px; align-items: flex-start; }
    nav.dz-bank ul { justify-content: flex-start; }
    nav.dz-bank ul li a { margin: 1rem 1rem 0 0; }

    /* Articles */
    section.image-right picture, section.image-left picture { max-width: 90%; }
    section.image-right video, section.image-left video { max-width: 90%; }


    /* Article 1 */
    .article-01 picture.header-image { width: 115%; }
    .content.grid { display: grid !important; } 
    .article-01 .after-intro .snippet-right { grid-row: 2 !important; }
    .content.grid .snippet { grid-row: 3 !important; margin: 2rem auto; }

    .article .infobox { width: 80%; margin: auto;  }
    .article .snippet { margin: auto; width: 100%; max-width: 100%; }

    .push-up { margin-top: -100px; }
}



@media screen and (max-width: 1300px ) {
    /* Nav */
    .dz-bank .logo { max-height: 1rem; }
    .hub nav.dz-bank ul { justify-content: center; gap: 0.25rem 0;}
    nav.dz-bank li { text-align: center;  }
    nav.dz-bank ul li a { text-transform: none; }

    .anchor a { position: absolute; left: 0px; top: -160px; }

    /* Hub */
    .hub .teaser-left, .hub .teaser-right { padding: 0 2rem; margin: auto; }

    /* Articles */
    .article-teaser .teaser-wrapper { width: 100%; }

    .modal .video { width: 75%; }
}


@media screen and (max-width: 1200px ) {
    /* Article 01 */
    header.dz-bank { min-height: auto; }
    header.dz-bank .intro-shadow { bottom: -5rem; }
    
    .dz-bank .content.after-intro { margin-top: calc(100px + 2rem); }
}



@media screen and (max-width: 1100px ) {
    /* Header */
    .dz-bank h1 { font-size: 2.25rem; }
    .dz-bank h2 { font-size: 1.75rem;}
    .dz-bank h3 { font-size: 1.25rem;}

    /* Articles */ 
    .article-teaser { padding: 100px 4rem 50px; webkit-clip-path: url(#teaser-clip-path-2); clip-path: url(#teaser-clip-path-2); }
    .teaser-flex .teaser { width: calc((100% - 2rem) / 2); }
    .teaser-flex .teaser:last-of-type { width: 100%; display: flex; flex-flow: row; gap: 2rem; align-items: stretch; }
    .teaser-flex .teaser:last-of-type > * { width: calc((100% - 2rem) / 2); }
    .teaser-flex .teaser:last-of-type .teaser-description { margin: 0; }
    .teaser-flex .teaser:last-of-type figure.teaser-image { align-self: stretch; display: flex; }

    .quote-box { padding: 50px 110px 50px; }

    .arrow-left svg, .arrow-right svg { width: 20px; }
    .arrow-right { padding: 8px 10px 8px 35px; }
    .arrow-left { padding: 8px 35px 8px 10px; }
}


@media screen and (max-width: 1050px ) {
    .hub .teaser-description, .hub .teaser-grid { grid-template-columns: repeat(2, 1fr) }
    .hub .footer-flex footer .flex { display:flex; flex-flow: column; }
    .article-02 video#header-video { object-position: 45%; }

    /* Article 01 */
    header.dz-bank { height: 65vh; }
    .article-01 picture.header-image { width: 100%; }
    header.dz-bank .intro-shadow { bottom: -8rem; }    
    .dz-bank .content.after-intro { margin-top: calc(100px + 5rem) !important; }
}


@media screen and (max-width: 900px ) {
    /* Header */
    header.dz-bank .intro-box { padding: 4rem 13rem 2.5rem 3rem; }
    
    .anchor a { position: absolute; left: 0px; top: -190px; }
    
    /* Hub */
    .hub .teaser-description, .hub .teaser-image { width: 100%; max-width: 690px; }

    .hub .teaser-left .teaser-image, .hub .teaser-left .teaser-description { align-self: flex-start; }
    .hub .teaser-right .teaser-image, .hub .teaser-right .teaser-description { align-self: flex-end; }


    .hub .teaser-left a.cta, .hub .teaser-right a.cta { flex-flow: column; }
    .hub .teaser-description { align-self: flex-start; max-width: 400px; margin: 0; }

    /* Articles */
    .quote { width: 110%; margin: 50px 0 100px -5%; }
    .quote-image { bottom: -65px; left: auto; right: 50px; }
    .quote-box { padding: 60px 100px 70px; }

    .article-teaser .teaser-wrapper { padding: 0 2rem; margin: auto; }
    .article-teaser .teaser-wrapper > a.cta { grid-column: 1; grid-row: 3; align-self: center; justify-self: center; margin-bottom: 0; margin-top: 2rem; }
    .teaser-flex { flex-flow: column; gap: 5rem; grid-column: 1; }
    .teaser-flex .teaser, .teaser-flex .teaser:last-of-type { width: 100%; display: flex; flex-flow: column; gap: 2rem; }
    .teaser-flex .teaser-image, .teaser-flex .teaser:last-of-type .teaser-image { max-width: 75%; width: 100%; }
    .teaser-flex .teaser-description, .teaser-flex .teaser:last-of-type .teaser-description { max-width: 400px; width: 100%; margin: 0; }
    
    .teaser-flex .teaser:nth-of-type(2n) { align-items: flex-end; }
    .teaser-flex .teaser:nth-of-type(2n) .teaser-description { text-align: right; }
    .teaser-flex .teaser:nth-of-type(2n) button { margin: 2.5rem 0 0 auto; }
}


@media screen and (max-width: 850px ) {
    .article-teaser { padding: 100px 0 50px; }
    .article-teaser .teaser-wrapper { max-width: 690px; padding: 0 2rem; }
    
    .push-up { margin-top: -50px; }
}


@media screen and (max-width: 768px ) {
    /* Header */
    .dz-bank h1, header.dz-bank .intro-box * { max-width: calc(100vw - 4rem); }
    header.dz-bank .intro-box { aspect-ratio: auto; }

    .anchor a { position: absolute; left: 0px; top: -170px; }

    /* Nav */
    nav.dz-bank { padding: 15px 20px; }

    /* Articles */
    .quote { width: 100%; margin: 100px 0 130px 0; }
    .quote-image { bottom: -85px; }
    section.image-right picture, section.image-left picture { max-width: 100%; }
    section.image-right video, section.image-left video { max-width: 100%; }
    .dz-bank .content { margin: 60px auto; }
    .article-teaser { padding: 100px 0 50px; margin-top: -280px; }

    .snippet a, .modal .video { width: 100%; }

    /* FAZ Header Reset */
    .header-asv { position: absolute; top: 52px;}
    nav.dz-bank { padding: calc(52px + 15px) 40px 15px; height: 91px; }
}


@media screen and (max-width: 600px ) {
    .hub .teaser-grid { grid-template-columns: repeat(1, 1fr)}
    .mobil { display: block !important; }
    /* Header */
    .hub header.dz-bank .intro-box { padding: 4rem 3rem 2.5rem 3rem; }
    header.dz-bank::before { content: ""; width: 390px; height: 300px; background: radial-gradient(circle, rgba(231, 237, 219, 0.8) 0%, rgba(209,220,190,0) 80%); position: absolute; right: -120px; top: -90px; } 
    nav.dz-bank { gap: 0; }
    
    .anchor a { position: absolute; left: 0px; top: -170px; }
    
    /* Nav */
    .dz-bank .logo.mobil { display: block; }
    .logo.mobil { position: absolute; right: 20px; top: 100px; }

    /* Hub */    
    .hub .teaser-image, .hub .teaser-description { max-width: 100%;}
    .hub .teaser-right a.cta .teaser-description { text-align: left; }
    .hub .teaser-right a.cta button { margin-left: auto; margin-left: 0; }


 
    /* Articles */
    section.image-right picture, section.image-left picture { max-width: 130%; }
    section.image-left { left: -15%; position: relative; }
    section.image-right { right: -15%; position: relative; }

    .quote { width: 110%; margin: 40px 0 100px -5%; }
    .quote-box { webkit-clip-path: url(#quote-clip-path-2); clip-path: url(#quote-clip-path-2); padding: 40px 40px 70px; }


    /* Article 1 */
    .content.info-1 .infobox-1, .content.info-1 .infobox-1 img { max-width: 100%; width: auto; }
    .teaser-flex .teaser-image, .teaser-flex .teaser:last-of-type .teaser-image { width: 100%; max-width: 100%; }
    .teaser-flex .teaser:nth-of-type(2n) .teaser-description { text-align: left; }
    .teaser-flex .teaser:nth-of-type(2n) { align-items: flex-start; }
    .teaser-flex .teaser:nth-of-type(2n) button { margin: 2.5rem auto 0 0; }

}

@media screen and (max-width: 500px ) {
    /* Header */
    header.dz-bank .intro-box { padding: 2.5rem 10rem 2rem 3rem; }
    .dz-bank h1 { font-size: 1.75rem; }
    header.dz-bank::before { width: 450px; height: 250px; right: -140px; background: radial-gradient(circle, rgba(231, 237, 219, 0.8) 0%, rgba(209,220,190,0) 60%); }
    header.dz-bank { height: 75vh; min-height: auto; }
    header.dz-bank .intro-box { gap: 0.5rem; }
    header.dz-bank .intro-box p { width: calc(100vw - 40px); }
    header.dz-bank .intro-box .scroll { display: none; }

    .article-01 video#header-video { object-position: 80%; }
    .article-02 video#header-video { object-position: 50%; }

    /* Nav */
    nav.dz-bank ul { gap: 0.15rem 0.75rem; }
    nav.dz-bank ul li a { margin: 0; font-size: 0.9rem; }
    
    /* Articles */
    .quote-box { padding: 40px 45px 60px 30px; }

    /* Content */
    .dz-bank h2 { font-size: 1.5rem; }
    
  body{
    -webkit-text-size-adjust: 100%;
  }
}

@media screen and (max-width: 450px ) {
    .content.info-1 .infobox-1, .content.info-1 .infobox-1 img { width: 100%; }
    .article .infobox-1 { padding: 0; }
    section.image-left { left: -5%; position: relative; }
    section.image-right { right: -5%; position: relative; }

    .logo.mobil { top: 125px; }
    header.dz-bank::before { top: -20px; height: 250px; background: radial-gradient(circle, rgba(231, 237, 219, 0.8) 0%, rgba(209,220,190,0) 50%); }
}

@media screen and (max-width: 400px ) {
    /* Articles */
    .quote { width: 120%; margin: 100px 0 130px -7.5%; }
    .quote-box { webkit-clip-path: url(#quote-clip-path-3); clip-path: url(#quote-clip-path-3); padding: 40px 2rem 90px; }
}


@media screen and (max-width: 360px ) {
    /* Header */
    .logo.mobil { top: 150px; }
    header.dz-bank::before { width: 350px; height: 200px; right: -100px; top: 30px; }
}