/* ==========================================================
   Grundzustand
========================================================== */

.mobile-menu-toggle{

    display:none;

    align-items:center;

    justify-content:center;

    width:44px;

    height:44px;

    background:none;

    border:none;

    color:var(--nk-text);

    font-size:2rem;

    cursor:pointer;

    padding:0;

}


/* ==========================================================
   HEADER
========================================================== */

/* Smartphones (Portrait) */

@media (max-width:768px){

    .site-header{

        padding:14px 0;

    }

    .site-header .wrap{

        display:flex;

        align-items:center;

        justify-content:space-between;

    }

    .desktop-nav{

        display:none;

    }

.mobile-menu-toggle{

    display:flex;

}

.site-header > .wrap > .dot{

    display:none !important;

}





}

/* Smartphones (Landscape) */

@media (max-width:900px) and (orientation:landscape){

    .site-header{

        padding:14px 0;

    }

    .site-header .wrap{

        display:flex;

        align-items:center;

        justify-content:space-between;

    }

    .desktop-nav{

        display:none;

    }

.mobile-menu-toggle{

    display:flex;

}

.menu-otter{

    height:42px;

}

.privacy-hero + .entry{

    max-width:900px;

    margin:0 auto;

    padding:0 24px;

}


}


/* Tablets (Portrait) */

@media (min-width:769px) and (max-width:1024px){

    .site-header{

        padding:14px 0;

    }

    .site-header .wrap{

        display:flex;

        align-items:center;

        justify-content:space-between;

    }

    .desktop-nav{

        display:none;

    }

.mobile-menu-toggle{

    display:flex;

}

.privacy-hero + .entry{

    max-width:900px;

    margin:0 auto;

    padding:0 24px;

}


}


/* Tablets (Landscape) */

@media (min-width:769px) and (max-width:1024px) and (orientation:landscape){

    .site-header{

        padding:14px 0;

    }

    .site-header .wrap{

        display:flex;

        align-items:center;

        justify-content:space-between;

    }

    .desktop-nav{

        display:none;

    }


.privacy-hero + .entry{

    max-width:900px;

    margin:0 auto;

    padding:0 24px;

}

.mobile-menu-toggle{

    display:flex;

}



}

/* Kleine Notebooks */

@media (min-width:1025px) and (max-width:1280px){

}

/* ==========================================================
   MOBILE MENU
========================================================== */

.mobile-menu{

    position:fixed;

    top:0;

    right:0;

    width:300px;

    height:100vh;

    display:none;

    flex-direction:column;

    gap:18px;

    background:var(--card);

    border-left:1px solid var(--border);

    padding:100px 24px 24px;

    overflow-y:auto;

    -webkit-overflow-scrolling:touch;

    z-index:1000;

}


.mobile-menu.open{

    display:flex;

}

.mobile-menu a{

    display:block;

    padding:12px 18px;

    border:1px solid var(--border);

    border-radius:12px;

    background:var(--card);

    color:var(--nk-text);

    text-decoration:none;

    font-weight:600;

    transition:.25s;

}

.mobile-overlay{

    position:fixed;

    inset:0;

    background:rgba(0,0,0,.45);

    display:none;

    z-index:900;

}

.mobile-overlay.open{

    display:block;

}

.mobile-menu-close{

    align-self:flex-end;

    width:44px;

    height:44px;

    margin:0 22px 12px 0;

    border:none;

    background:none;

    color:var(--nk-text);

    font-size:2rem;

    cursor:pointer;

}


/* ==========================================================
   HERO
========================================================== */

/* Smartphones (Portrait) */

@media (max-width:768px){

    .hero-text{

        padding:22px 0 35px;

    }

    .nk-hero-sub{

        font-size:1.1rem;

    }

    .lead{

        margin-top:12px;

    }

.privacy-hero h1{

    font-size:1.8rem;

    line-height:1.1;

}





}


/* Smartphones (Landscape) */

@media (max-width:900px) and (orientation:landscape){


.nk-banner{

    max-height:120px;

}

    .hero-text{

        padding:20px 0; 

    }

    .hero-text h1{

        font-size:2rem;

        line-height:1.15;

        margin-bottom:8px;

    }

    .nk-hero-sub{

        font-size:1rem;

    }

    .lead{

        font-size:1rem;

        margin-top:12px;

    }

}


/* ==========================================================
   KARTEN
========================================================== */

@media (max-width:768px){

    .intro-card{

        margin-top:40px;

        padding:20px;

    }

    .intro-card h2{

        margin-bottom:30px;

    }

    .feature{

        padding:20px;

    }

}


/* Tablets (Portrait) */

@media (min-width:769px) and (max-width:1024px){

.site-header > .wrap > .dot{

    display:none !important;

}

}

.entry{

    padding:0 28px;

}



/* ==========================================================
   FOOTER
========================================================== */

@media (max-width:768px){

    .site-footer{

        display:flex;

        flex-direction:column;

        align-items:center;

        gap:10px;

        text-align:center;

        padding:30px 20px;

    }

    .site-footer .dot{

        display:none;

    }

    .site-footer a{

        display:block;

    }




}

/* ==========================================================
   STARTSEITE
========================================================== */

@media (max-width:768px){

    .feedback-banner{

        margin:-5px auto 24px;

    }

}

/* ==========================================================
   ARCHIVE
========================================================== */

@media (max-width:768px){

    .search-row{

        flex-direction:column;
        align-items:stretch;
        gap:10px;

    }

    #count{

        text-align:right;

    }

}

/* ==========================================================
   FAQ Seite
========================================================== */

.feedback-banner{

    margin-top:32px;

}

.faq-page .feedback-banner{

    margin-top:32px;

}


/* ==========================================================
Datenschutz Querformat text Abstand
========================================================== */


@media (max-width:1024px){

    .privacy-page p,
    .privacy-page h2,
    .privacy-page h3,
    .privacy-page ul{

        padding-left:24px;
        padding-right:24px;

    }

}


/* ==========================================================
Allgemeine Überschriften auf kleinen Displays
========================================================== */

@media (max-width:768px){

    .hero-text h1{

        font-size:2.1rem;

        line-height:1.1;

    }

    .entry{

        padding:0 24px;

    }

}