/* =====================================================================
   Brandschutz Jäger – Artikel-Design
   Wird von Astroid automatisch geladen (custom.css).
   Alle Artikel mit <div class="bsj-article"> nutzen dieses Design.
   ===================================================================== */

.bsj-article{
  --bsj-red:#C4183C; --bsj-red-dark:#9e1230; --bsj-red-soft:#fdecef;
  --bsj-ink:#1f2933; --bsj-muted:#52606d; --bsj-line:#e4e7eb; --bsj-bg:#f7f8fa;
  font-family:inherit;
  color:var(--bsj-ink); line-height:1.7; max-width:860px; margin:0 auto;
}
.bsj-article *{box-sizing:border-box;}
.bsj-article h2{
  font-size:1.6rem; line-height:1.25; margin:2.4rem 0 1rem; color:var(--bsj-ink);
  padding-left:.85rem; border-left:5px solid var(--bsj-red); font-weight:700;
}
.bsj-article h3{font-size:1.2rem; margin:1.6rem 0 .6rem; color:var(--bsj-red-dark); font-weight:700;}
.bsj-article p{margin:.7rem 0; color:var(--bsj-muted);}
.bsj-article strong{color:var(--bsj-ink);}
.bsj-article a{color:var(--bsj-red); text-decoration:none; border-bottom:1px solid rgba(196,24,60,.35);}
.bsj-article a:hover{color:var(--bsj-red-dark); border-bottom-color:var(--bsj-red-dark);}

.bsj-article .bsj-lead{font-size:1.18rem; line-height:1.65; color:var(--bsj-ink); margin:0 0 1.6rem;}

.bsj-article .bsj-tldr{
  background:linear-gradient(135deg,#fff,var(--bsj-red-soft));
  border:1px solid var(--bsj-line); border-radius:14px; padding:1.4rem 1.6rem; margin:1.8rem 0;
  box-shadow:0 6px 20px rgba(31,41,51,.06);
}
.bsj-article .bsj-tldr h2{border:0; padding:0; margin:0 0 .8rem; font-size:1.05rem; text-transform:uppercase; letter-spacing:.06em; color:var(--bsj-red-dark);}
.bsj-article .bsj-tldr ul{list-style:none; margin:0; padding:0;}
.bsj-article .bsj-tldr li{position:relative; padding:.35rem 0 .35rem 2rem; color:var(--bsj-ink);}
.bsj-article .bsj-tldr li::before{
  content:""; position:absolute; left:0; top:.55rem; width:18px; height:18px; border-radius:50%;
  background:var(--bsj-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/12px no-repeat;
}

.bsj-article ul.bsj-list{list-style:none; margin:1rem 0; padding:0;}
.bsj-article ul.bsj-list li{position:relative; padding:.3rem 0 .3rem 1.6rem; color:var(--bsj-muted);}
.bsj-article ul.bsj-list li::before{content:""; position:absolute; left:.2rem; top:.85rem; width:7px; height:7px; border-radius:50%; background:var(--bsj-red);}

.bsj-article .bsj-callout{display:flex; gap:.9rem; align-items:flex-start; border-radius:12px; padding:1.1rem 1.3rem; margin:1.5rem 0; font-size:.98rem;}
.bsj-article .bsj-callout svg{flex:0 0 22px; margin-top:.15rem;}
.bsj-article .bsj-callout p{margin:0; color:inherit;}
.bsj-article .bsj-callout--info{background:#eef4fb; border:1px solid #d3e3f3; color:#234e7d;}
.bsj-article .bsj-callout--warn{background:#fff6e9; border:1px solid #f5dbab; color:#8a5a06;}

.bsj-article .bsj-faq{border:1px solid var(--bsj-line); border-radius:10px; margin:.7rem 0; overflow:hidden; background:#fff;}
.bsj-article .bsj-faq summary{cursor:pointer; padding:.95rem 1.2rem; font-weight:600; color:var(--bsj-ink); list-style:none; position:relative; padding-right:2.6rem;}
.bsj-article .bsj-faq summary::-webkit-details-marker{display:none;}
.bsj-article .bsj-faq summary::after{content:"+"; position:absolute; right:1.1rem; top:50%; transform:translateY(-50%); font-size:1.4rem; color:var(--bsj-red); font-weight:400;}
.bsj-article .bsj-faq[open] summary::after{content:"\2013";}
.bsj-article .bsj-faq[open] summary{background:var(--bsj-red-soft);}
.bsj-article .bsj-faq .bsj-faq-body{padding:.4rem 1.2rem 1.1rem;}
.bsj-article .bsj-faq .bsj-faq-body p{margin:.3rem 0;}

.bsj-article .bsj-cta{
  background:var(--bsj-ink); color:#fff; border-radius:16px; padding:1.8rem 2rem; margin:2.4rem 0 1.5rem;
  box-shadow:0 10px 30px rgba(31,41,51,.18);
}
.bsj-article .bsj-cta h2{color:#fff; border:0; padding:0; margin:0 0 .5rem; font-size:1.35rem;}
.bsj-article .bsj-cta p{color:#cfd6dd; margin:.4rem 0 1.2rem;}
.bsj-article .bsj-cta a.bsj-btn{
  display:inline-block; background:var(--bsj-red); color:#fff; border:0; border-radius:8px;
  padding:.8rem 1.6rem; font-weight:700; text-decoration:none; box-shadow:0 6px 18px rgba(196,24,60,.4);
}
.bsj-article .bsj-cta a.bsj-btn:hover{background:var(--bsj-red-dark);}

.bsj-article .bsj-note{font-size:.85rem; color:#8c97a3; border-top:1px solid var(--bsj-line); margin-top:2rem; padding-top:1rem;}

@media(max-width:600px){
  .bsj-article h2{font-size:1.35rem;}
  .bsj-article .bsj-lead{font-size:1.08rem;}
}
