/* Frontrunner-Themenseiten: ergaenzt style.css / mobile.css */
.breadcrumbs{padding-top:var(--s8)}
.breadcrumbs ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--s2);font-size:var(--text-xs);color:var(--muted)}
.breadcrumbs li+li::before{content:"/";margin-right:var(--s2);color:var(--line)}
.breadcrumbs a{color:var(--muted);text-decoration:none;border-bottom:1px solid transparent}
.breadcrumbs a:hover{color:var(--ink);border-color:var(--accent)}
.breadcrumbs [aria-current]{color:var(--ink);font-weight:500}
.topic-hero{padding-block:var(--s12) var(--s8)}.topic-hero h1,.topic-hero .topic-lead{max-width:960px}
.topic-hero h1{font-size:clamp(2.6rem,5.2vw,4.8rem);line-height:1.02;letter-spacing:-.05em;margin-block:var(--s6)}
.topic-lead{font-size:var(--text-lg);line-height:1.55;color:var(--muted);max-width:64ch}
.topic-lead strong{color:var(--ink);font-weight:700}
.topic-hero .hero-actions{display:flex;gap:var(--s6);align-items:center;margin-top:var(--s8);flex-wrap:wrap}
.topic-page .intro-answer{padding-top:var(--s10)}
.topic-page .steps{padding-block:var(--s16)}
.topic-page .difference{padding-block:var(--s16)}
.topic-benefits{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--s10)}
.topic-benefits article{grid-template-columns:40px minmax(0,1fr)!important;gap:var(--s5)!important}
.topic-benefits h3{font-size:1.35rem!important}
.topic-page .compare{padding-block:var(--s8) var(--s16)}
.topic-table{min-width:560px}
.topic-case{grid-template-columns:1fr!important;max-width:760px}
.topic-page .cases{padding-block:var(--s8) var(--s16)}
.related{padding-block:var(--s8) var(--s20)}
.related-title{font-size:var(--text-xl);margin-bottom:var(--s6)}
.related-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4)}
.related-list a{position:relative;display:flex;flex-direction:column;gap:var(--s2);height:100%;padding:var(--s6);padding-right:var(--s12);background:var(--surface);border:1px solid var(--line);border-radius:12px;color:var(--ink);text-decoration:none;transition:border-color .2s,transform .2s}
.related-list a:hover{border-color:var(--accent);transform:translateY(-2px)}
.related-kicker{font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);font-weight:700}
.related-list strong{font-size:1.25rem;letter-spacing:-.02em}
.related-desc{font-size:var(--text-sm);color:var(--muted)}
.related-arrow{position:absolute;right:var(--s6);top:var(--s6);color:var(--accent);font-size:1.2rem}
.topic-footer{flex-wrap:wrap}
.footer-topics{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5)}
.footer-topics a{color:var(--muted)}
.footer-topics a:hover{color:var(--ink)}
.home-topics{padding-block:var(--s4) var(--s16)}
@media(max-width:850px){
 .topic-hero{padding-top:var(--s8)}
 .topic-benefits{grid-template-columns:1fr}
 .related-list{grid-template-columns:1fr}
 .topic-page .faq{grid-template-columns:1fr;gap:var(--s8)}
}
@media(max-width:580px){
 .topic-hero h1{font-size:clamp(2.3rem,10vw,3.2rem)}
 .topic-lead{font-size:var(--text-base)}
 .topic-hero h1 br{display:none}
 .topic-hero h1 .orange{display:block}
}
/* Welle 2: Praxisbeispiele, USPs, Quellen */
.topic-source{margin-top:var(--s5);font-size:var(--text-sm)}
.examples{padding-block:var(--s10) var(--s8)}
.example{display:grid;grid-template-columns:1.45fr 1fr;gap:var(--s10);align-items:center;margin:0 0 var(--s12)}
.example-flip{grid-template-columns:1fr 1.45fr}.example-flip .example-media{order:2}
.example-media{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px -40px #39221140}
.example-media img{display:block;width:100%;height:auto}
.example figcaption h3{font-size:var(--text-xl);margin-block:var(--s3) var(--s3);letter-spacing:-.02em}
.example figcaption p{color:var(--muted);margin-bottom:var(--s5);max-width:46ch}
.usps{background:var(--ink);color:#f4f3ee;padding-block:var(--s16)}
.usps h2{color:#fff;margin-block:var(--s5) var(--s10)}
.usps .eyebrow{color:var(--accent)}
.usp-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:var(--s4)}
.usp-list li{border:1px solid #ffffff22;border-radius:12px;padding:var(--s6);background:#ffffff08}
.usp-list li.usp-key{background:var(--accent);border-color:var(--accent)}
.usp-list li.usp-key .usp-n,.usp-list li.usp-key p{color:#fff}
.usp-n{display:block;color:var(--accent);font-weight:700;font-size:var(--text-sm);margin-bottom:var(--s6)}
.usp-list h3{font-size:1.15rem;color:#fff;margin-bottom:var(--s3);letter-spacing:-.01em}
.usp-list p{font-size:var(--text-sm);color:#d6d4cc;line-height:1.5}
.footer-topics{display:grid;grid-template-columns:repeat(3,auto);gap:var(--s2) var(--s10)}
.footer-topics div{display:flex;flex-direction:column;gap:var(--s2)}
.footer-topics strong{color:var(--ink);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase}
@media(max-width:1150px){.usp-list{grid-template-columns:repeat(3,1fr)}}
@media(max-width:850px){.example,.example-flip{grid-template-columns:1fr;gap:var(--s5)}.example-flip .example-media{order:0}.usp-list{grid-template-columns:1fr 1fr}.footer-topics{grid-template-columns:1fr 1fr}}
@media(max-width:580px){.usp-list{grid-template-columns:1fr}.footer-topics{grid-template-columns:1fr}}
