/* ==========================================

   Neuroklar Main Theme 1.1
   ========================================== */

:root{

  --accent:#d8832f;
  --bg:#0e1015;
  --bg2:#121826;

  --card:#171c27;
  --card-hover:#1d2331;

  --text:#eef2fb;
  --muted:#a4adc0;

  --input-bg:#171c2b;
  --input-text:#ffffff;

  --border:rgba(255,255,255,.08);

  --brand:#7a5cff;
  --brand2:#5ea0ff;

  --radius:18px;
  --wrap:1100px;
}

/* Light Theme */

[data-theme="light"]{
  --bg:#f4f5f8;
  --bg2:#e7eaf2;

  --card:#ffffff;
  --card-hover:#f8f9fc;

  --text:#1d2433;
  --muted:#5c677d;

  --input-bg:#ffffff;
  --input-text:var(--text);

  --border:rgba(0,0,0,.10);
}

/* Reset */

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

img.podcast-cover{
    width:100% !important;
    max-width:250px !important;
    height:250px !important;

    object-fit:cover !important;

    display:block !important;

    border-radius:12px !important;

    margin-bottom:1rem !important;
}


.latest-layout{
    display:flex;
    gap:2rem;
    align-items:flex-start;
}

.latest-feature .podcast-cover{
    width:250px !important;
    height:250px !important;
    flex-shrink:0;
}

.latest-content{
    flex:1;
}

.latest-content audio{
    width:100%;
}
.latest-feature{
    max-width:700px;
    margin:0 auto;
}

.latest-feature audio{
    width:85%;
    display:block;
    margin:1rem auto 0 auto;
}


.impressum-container{
    max-width: 900px;
    margin: 0 auto;
    padding: 2rem;
}

.impressum-container h1,
.impressum-container h2{
    text-align:center;
}

.impressum-container address,
.impressum-container p{
    text-align:left;
}

.stats{
    margin:20px 0;
    opacity:.8;
}

.episode-card{

    display:flex;
    gap:20px;

    background:var(--card);

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

    border-radius:18px;

    padding:20px;

    margin-bottom:24px;
}

.episode-cover{

    width:200px;
    height:200px;

    object-fit:cover;

    border-radius:12px;

    flex-shrink:0;
}

.episode-content{
    flex:1;
}

.episode-rubrik{

    display:inline-block;

    padding:4px 10px;

    border-radius:999px;

    color:white;

    font-size:.8rem;

    margin-bottom:10px;
}

.rubrik-standard{
    background:#5b3b87;
    color:#fff;
}

.rubrik-denkt{
    background:#2a5177;
    color:#fff;
}

.rubrik-erinnert{
    background:#2d7b7c;
    color:#fff;
}

.rubrik-kopf{
    background:#abb68d;
    color:#1a1a1a;
}

.rubrik-sonderfolge{
    background:#752411;
    color:#fff;
}
.episode-title{
    color:var(--text);
    font-size:1.4rem;
    font-weight:700;
    margin-bottom:10px;
}

.episode-meta{
    color:var(--muted);
    opacity:.7;
    margin-bottom:12px;
}

.part-player{
    color:var(--text);
    margin-top:15px;
}

.part-player audio{
    width:100%;
}

details summary{
    color:var(--text);
    cursor:pointer;
    font-weight:600;
}

@media (max-width:768px){

    .episode-card{
        flex-direction:column;
    }

    .episode-cover{
        width:100%;
        height:auto;
    }
}

.summary-preview{
    color:var(--muted);
    margin-top:12px;
    line-height:1.6;
}

.full-description{
    color:var(--muted);
    margin-top:12px;
    line-height:1.7;
}


@media (max-width:768px){
    .impressum-container{
        padding:1.25rem;
    }
}
@media (max-width:768px){

    .latest-layout{
        flex-direction:column;
        align-items:center;
    }

    .latest-content{
        width:100%;
    }
}

html{
  scroll-behavior:smooth;
}

body{
  min-height:100vh;

  color:var(--text);

  font-family:
    system-ui,
    -apple-system,
    Segoe UI,
    Roboto,
    Arial,
    sans-serif;

  background:
    radial-gradient(
      circle at top right,
      rgba(122,92,255,.15),
      transparent 40%
    ),
    radial-gradient(
      circle at top left,
      rgba(94,160,255,.10),
      transparent 35%
    ),
    linear-gradient(
      180deg,
      var(--bg),
      var(--bg2)
    );
}

/* Banner */

.nk-banner{
  display:block;
  width:100%;
  max-height:170px;
  object-fit:contain;

  background:#2C1559;

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




/* Navigation */

.site-header{
  position:sticky;
  top:0;
  z-index:50;

  backdrop-filter:blur(12px);

  background:rgba(10,12,18,.65);

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

[data-theme="light"] .site-header{
  background:rgba(255,255,255,.80);
}

.wrap{
  width:min(var(--wrap),95%);
  margin:auto;
}

.site-header .wrap{
  display:flex;
  justify-content:center;
  align-items:center;

  gap:10px;

  padding:12px;

  flex-wrap:wrap;
}

.site-header a{
  text-decoration:none;

  color:var(--text);

  font-size:.95rem;
  font-weight:600;

  padding:8px 14px;

  border-radius:12px;

  background:var(--card);

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

  transition:.25s;
}

.site-header a:hover{
  border-color:var(--brand);
  transform:translateY(-1px);
}

/* Otter */

.menu-otter{
  height:60px;
  width:auto;

  transition:.25s;
}

.menu-otter:hover{
  transform:scale(1.05);
}

/* Theme Button */

.theme-toggle{
  border:none;

  background:var(--card);

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

  color:var(--text);

  border-radius:12px;

  width:42px;
  height:42px;

  cursor:pointer;
}

/* Hero */

.hero-text{
  padding:60px 0;
}

.hero-text h1{
  text-align:center;

  font-size:clamp(3rem,6vw,5rem);

  margin-bottom: 12px;
}

.nk-hero-sub{
  text-align:center;

  font-size:1.25rem;

  color:var(--muted);
}

.lead{
  text-align:center;

  margin-top:20px;

  font-size:1.2rem;

  font-weight:600;
}

/* Karten */

.intro-card,
.feature,
.quote-box{

  background:var(--card);

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

  border-radius:var(--radius);

  box-shadow:
    0 15px 50px rgba(0,0,0,.25);

  padding:28px;
}

.intro-card{
  max-width:900px;
  margin:20px auto 50px;
}

.intro-card h2{
  text-align:center;
  margin-bottom:20px;
}

.intro-card p{
  color:var(--muted);
  margin-bottom:16px;
}

/* Buttons */

.hero-actions{
  display:flex;
  gap:16px;
  justify-content:center;
  margin-top:30px;
  flex-wrap:wrap;
}

.cta{
  padding:14px 22px;
  border-radius:12px;
  text-decoration:none;
  font-weight:700;

  background:
    linear-gradient(
      90deg,
      var(--brand),
      var(--brand2)
    );

  color:#fff;
}

.cta.secondary{
  background:var(--card);
  color:var(--text);
  border:1px solid var(--border);
}

/* Prinzipien */

.principles{
  display:grid;

  grid-template-columns:
    repeat(auto-fit,minmax(220px,1fr));

  gap:16px;

  margin-top: 24px;
}

.principle{
  background:rgba(255,255,255,.03);

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

  border-radius:14px;

  padding:18px;
}

.principle strong{
  display:block;
  margin-bottom:8px;
}

/* Features */

.feature-grid{
  display:grid;

  grid-template-columns:
    repeat(auto-fit,minmax(280px,1fr));

  gap:24px;

  margin:40px auto;

  width:min(var(--wrap),95%);
}

.entry.is-hidden{
    display:none !important;
}

.feature{
  transition:.25s;
}

.feature{

    overflow:hidden;

}

.feature:hover{
  transform:translateY(-4px);
  background:var(--card-hover);
}

.feature h3{
  margin-bottom:14px;
}

.feature p{
  color:var(--muted);
}

.feature a{
  display:inline-block;
  margin-top:14px;

  color:var(--brand2);

  text-decoration:none;
}

.latest-content h3{
    font-size:1rem;
}

.feedback-banner{
    max-width:700px;
    margin: 3rem auto;
    padding:1rem 1.5rem;

    text-align:center;

    background:rgba(255,255,255,0.03);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:12px;

    color:#d8dbe5;
    font-size:0.95rem;
}

.feedback-banner a{
    color:#5ea1ff;
    font-weight:600;
    text-decoration:none;
}

.feedback-banner a:hover{
    text-decoration:underline;
}

[data-theme="light"] .feedback-banner{
    color: var(--text);
    background: rgba(0,0,0,0.03);
    border: 1px solid rgba(0,0,0,0.08);
}

[data-theme="light"] .feedback-banner a{
    color: #2563eb;
}

/* FAQ */

.faq-page{
  max-width:900px;
  margin:0 auto 70px;
}

.faq-intro,
.faq-section{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:0 15px 50px rgba(0,0,0,.20);
}

.faq-intro{
  padding:24px 28px;
  margin-bottom:28px;
  color:var(--muted);
  line-height:1.7;
}

.faq-intro > p + p{
  margin-top:12px;
}

.faq-page .feedback-banner{
  margin:24px 0 0;
  max-width:none;
}

.faq-section{
  padding:30px;
  margin-top:24px;
}

.faq-section > h2{
  padding-bottom:16px;
  margin-bottom:4px;
  border-bottom:1px solid var(--border);
  font-size:clamp(1.45rem,3vw,1.8rem);
}

.faq-item{
  padding:24px 0;
}

.faq-item + .faq-item{
  border-top:1px solid var(--border);
}

.faq-item:last-child{
  padding-bottom:0;
}

.faq-item h3{
  margin-bottom:12px;
  font-size:1.08rem;
  line-height:1.4;
}

.faq-item p,
.faq-item li{
  color:var(--muted);
  line-height:1.7;
}

.faq-item p + p,
.faq-item p + ul,
.faq-item p + ol,
.faq-item ul + p,
.faq-item ol + p{
  margin-top:12px;
}

.faq-item ul,
.faq-item ol{
  padding-left:1.35rem;
}

.faq-item li + li{
  margin-top:6px;
}

.faq-item a{
  color:var(--brand2);
}

@media (max-width:768px){
  .faq-page{
    width:min(var(--wrap),92%);
  }

  .faq-intro,
  .faq-section{
    padding:22px 20px;
  }

  .faq-section{
    margin-top:18px;
  }

  .faq-item{
    padding:20px 0;
  }
}

/* Audio */

audio{
  width:100%;
  margin-top:16px;
}

/* Zitat */

.quote-box{
  margin:50px auto;

  max-width:850px;

  text-align:center;

  font-size:1.25rem;

  color:var(--muted);
}

/* Footer */

.site-footer{
  text-align:center;

  margin-top:70px;

  padding:30px;

  color:var(--muted);

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

.site-footer a{
  color:var(--brand2);
  text-decoration:none;
}

/* Suchfeld wie Stream-Archiv */

.searchbox{
  display:flex;
  gap:8px;
  align-items:center;
  background:#171a22;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:6px 10px;
}

.searchbox input{
  appearance:none;
  border:0;
  outline:0;
  background:transparent;
  color:#e7ebf3;
  width:18ch;
}

.searchbox input::placeholder{
  color:#9aa3b2;
}

.searchbox button{
  border:0;
  background:transparent;
  color:#9aa3b2;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}

.search-count{
  color:#9aa3b2;
  font-size:.9rem;
}

.search-row{
    display:flex;
    align-items:center;
    gap:12px;

    max-width:1100px;
    margin:30px auto;
}

.search-row input{
    flex:1;
}

#count{
    white-space:nowrap;
    color:var(--muted);
}

.search-box{
	flex:1;

    padding:14px 18px;

    background:var(--card);

    color:var(--text);

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

    border-radius:14px;

    font-size:1rem;

    outline:none;
}

.search-box::placeholder{
    color:var(--muted);
}

.rubrik-filter{
    display:flex;
    flex-wrap:wrap;

    justify-content:flex-start;

    gap:10px;

    margin:0;
}


.rubrik-btn{

    border:none;

    background:var(--card);

    color:var(--text);

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

    border-radius:999px;

    padding:8px 14px;

    cursor:pointer;

    transition:.2s;
}

.rubrik-btn:hover{
    transform:translateY(-1px);
}

.rubrik-btn.active{

    box-shadow:
        0 0 0 2px rgba(255,255,255,.6);

    transform:translateY(-1px);
}

.rubrik-btn.rubrik-standard{
    background:#5b3b87;
    color:#fff;
}

.rubrik-btn.rubrik-denkt{
    background:#2a5177;
    color:#fff;
}

.rubrik-btn.rubrik-erinnert{
    background:#2d7b7c;
    color:#fff;
}

.rubrik-btn.rubrik-kopf{
    background:#abb68d;
    color:#1a1a1a;
}

.rubrik-btn.rubrik-sonderfolge{
    background:#752411;
    color:#fff;
}

.rubrik-info{

    display:flex;
    align-items:center;
    justify-content:center;

    width:22px;
    height:22px;

    border-radius:50%;

    border:2px solid var(--brand2);

    color:var(--brand2);

    font-size:.8rem;
    font-weight:700;

    cursor:pointer;

    flex-shrink:0;
}


.rubrik-info{
    position:relative;
}

.rubrik-tooltip{

    display:none;

    position:absolute;

    top:30px;
    right:0;

    width:360px;

    padding:14px;

    border-radius:12px;

    background:var(--card);

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

    color:var(--text);

    text-align:left;

    z-index:999;
}

.rubrik-info:hover .rubrik-tooltip{
    display:block;
}


.rubrik-row{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:12px;

    margin-bottom:25px;
}


.contact-banner{
    max-width:700px;

    margin:0 auto 2rem auto;

    padding:1rem 1.5rem;

    text-align:center;

    background:rgba(255,255,255,.03);

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

    border-radius:12px;
}

.contact-banner a{
    color:var(--brand2);
    text-decoration:none;
    font-weight:600;
}

.contact-banner a:hover{
    text-decoration:underline;
}


/* Podcast Cover */

.podcast-cover{
    width:100%;
    aspect-ratio:1/1;

    object-fit:cover;

    border-radius:12px;

    display:block;

    margin-bottom:1rem;
}

.entry audio{
    width:100%;
    margin-top:1rem;
}

.entry-meta{
    display:block;
    margin-bottom:1rem;
    opacity:.8;
}

/* Podcast Cover */

.podcast-cover{
    width:100%;
    aspect-ratio:1/1;

    object-fit:cover;

    border-radius:12px;

    display:block;

    margin-bottom:1rem;
}

.entry audio{
    width:100%;
    margin-top:1rem;
}

.entry-meta{
    display:block;
    margin-bottom:1rem;
    opacity:.8;
}

.stats{
    margin:25px 0 15px;
    opacity:.8;
}

.episode-card{
    display:flex;
    gap:20px;

    margin-bottom:24px;
    padding:20px;

    border-radius:18px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);
}

.episode-cover{
    width:140px;
    height:140px;

    object-fit:cover;

    border-radius:12px;

    flex-shrink:0;
}

.episode-content{
    flex:1;
    color:var(--text);
}



.episode-rubrik{
    display:inline-block;

    padding:4px 10px;

    border-radius:999px;

    background:#7c4dff;

    color:white;

    font-size:.8rem;

    margin-bottom:10px;
}

.episode-title{
    color:var(--text);
    font-size:1.4rem;
    font-weight:700;
    margin-bottom:10px;
}

.episode-meta{
    color:var(--muted);
    margin-bottom:12px;
}

.part-player{
    color:var(--text);
    margin-top:15px;
}

.part-player audio{
    color:var(--text);
    width:100%;
}

.loading{
    text-align:center;
    padding:40px;
}


.rubrik-standard{
    background:#3e285c;
    color:#fff;
}
/* Neuroklar */

.rubrik-denkt{
    background:#2a5177;
    color:#fff;
}
/* Neuroklar denkt */

.rubrik-erinnert{
    background:#2d7b7c;
    color:#fff;
}
/* Neuroklar erinnert sich */

.rubrik-kopf{
    background:#abb68d;
    color:#1a1a1a;
}
/* Neuroklar für immer im Kopf */

.rubrik-sonderfolge{
    background:#752411;
    color:#fff;
}
/* Neuroklar Sonderfolge */



/* ==========================================================
   Screenreader
========================================================== */

.sr-only{

    position:absolute;

    width:1px;
    height:1px;

    padding:0;
    margin:-1px;

    overflow:hidden;

    clip:rect(0,0,0,0);

    white-space:nowrap;

    border:0;

}



/* ==========================================================
   Podcast Rubrikfilter Mobile
========================================================== */

@media (max-width:768px){

    .rubrik-filter{

        justify-content:center;

    }

 }

@media (max-width:768px){

    .rubrik-info{
        display:none;
    }

}



/* ==========================================================
Anpassung Datenschutz Test Handy Hochkant
========================================================== */



.privacy-hero + .entry{

    max-width:900px;

    margin:0 auto;

    padding:0 24px;

}