/* Sebastian Tasch — Ratgeber / Editorial-Stylesheet (geteilt) */
:root{
  --ink:#13233F; --navy:#13233F;
  --text:#27344B; --muted:#5C6A82; --muted-2:#8A96AC;
  --azure:#2B5FB3; --azure-2:#3E72C9; --azure-dk:#21487F;
  --gold:#B8893B;
  --bg:#FFFFFF; --bg-soft:#F6F8FC; --bg-tint:#EEF2F8;
  --line:#E6EAF1; --white:#fff;
  --shadow-sm:0 16px 38px -22px rgba(19,35,63,.22);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{font-family:'Manrope',system-ui,sans-serif;color:var(--text);background:var(--bg);line-height:1.5;-webkit-font-smoothing:antialiased;}
a{color:var(--azure-dk);text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{max-width:1100px;margin:0 auto;padding:0 24px;}
h1,h2,h3,h4{font-family:'Sora','Manrope',sans-serif;color:var(--navy);line-height:1.18;letter-spacing:-.01em;}
.skip{position:absolute;left:-999px;top:0;z-index:300;background:var(--navy);color:#fff;padding:10px 16px;border-radius:0 0 8px 0;font-weight:600;}
.skip:focus{left:0;}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--azure);outline-offset:3px;border-radius:4px;}

/* NAV */
.nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:66px;}
.brand{display:flex;align-items:center;gap:11px;}
.brand-logo{background:none;box-shadow:none;display:flex;align-items:center;justify-content:center;}
.brand-logo svg{width:42px;height:42px;}
.brand-t{font-family:'Sora';font-weight:700;font-size:15px;color:var(--navy);line-height:1.15;}
.brand-t span{display:block;font-family:'Manrope';font-size:11px;font-weight:600;color:var(--muted-2);}
.nav-links{display:flex;gap:26px;align-items:center;list-style:none;}
.nav-links a{font-size:14.5px;font-weight:600;color:var(--text);}
.nav-links a:hover{color:var(--azure);text-decoration:none;}
.btn{display:inline-flex;align-items:center;gap:8px;font-family:'Manrope';font-weight:700;font-size:15px;border-radius:12px;border:none;cursor:pointer;text-decoration:none;}
.btn:hover{text-decoration:none;}
.btn-primary{background:var(--azure-dk);color:#fff;padding:13px 24px;}
.btn-primary:hover{background:var(--navy);}
.btn-outline{background:#fff;color:var(--azure-dk);padding:12px 22px;border:1.6px solid #cfd9ec;}
.btn-outline:hover{border-color:var(--azure);background:var(--bg-tint);}
.nav-cta{padding:10px 18px;font-size:14px;}
.burger{display:none;background:none;border:none;cursor:pointer;padding:8px;}
.burger span{display:block;width:23px;height:2px;background:var(--navy);margin:5px 0;border-radius:2px;}

/* BREADCRUMB */
.crumb{font-size:13px;color:var(--muted);padding:18px 0 0;}
.crumb a{color:var(--muted);}
.crumb a:hover{color:var(--azure);}
.crumb span{color:var(--navy);}

/* ARTICLE LAYOUT */
.article{padding:14px 0 70px;}
.article-grid{display:grid;grid-template-columns:minmax(0,720px) 1fr;gap:54px;align-items:start;}
.art-head{margin:18px 0 26px;}
.eyebrow{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--azure);margin-bottom:14px;}
.art-head h1{font-size:clamp(1.9rem,3.6vw,2.7rem);margin-bottom:16px;}
.art-lead{font-size:1.18rem;color:var(--muted);line-height:1.6;}
.art-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted-2);margin-top:16px;padding-top:16px;border-top:1px solid var(--line);}

/* PROSE */
.prose{font-size:1.06rem;line-height:1.75;color:var(--text);}
.prose > h2{font-size:1.5rem;margin:38px 0 14px;color:var(--navy);}
.prose > h3{font-size:1.18rem;margin:26px 0 10px;color:var(--navy);}
.prose p{margin-bottom:16px;}
.prose ul,.prose ol{margin:0 0 18px 22px;}
.prose li{margin-bottom:8px;}
.prose strong{color:var(--navy);}
.prose a{font-weight:600;text-decoration:underline;text-underline-offset:2px;}

/* QUICK ANSWER */
.kurz{background:var(--bg-tint);border:1px solid var(--line);border-left:4px solid var(--azure);border-radius:12px;padding:22px 24px;margin:0 0 30px;}
.kurz h2{font-size:1.05rem;margin:0 0 8px;color:var(--navy);}
.kurz p{margin:0;color:var(--text);font-size:1.02rem;}

/* CALLOUT / TIP */
.callout{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin:24px 0;box-shadow:var(--shadow-sm);}
.callout .ct{font-weight:700;color:var(--navy);font-family:'Sora';margin-bottom:6px;display:flex;align-items:center;gap:8px;}
.callout.tip{border-left:4px solid var(--gold);}
.callout.local{border-left:4px solid var(--azure);background:var(--bg-soft);}

/* TABLE */
.tbl{width:100%;border-collapse:collapse;margin:20px 0;font-size:.98rem;}
.tbl th,.tbl td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);}
.tbl th{background:var(--bg-soft);color:var(--navy);font-weight:700;font-size:.9rem;}
.tbl td:last-child,.tbl th:last-child{text-align:right;}
.tbl tr:last-child td{border-bottom:none;}

/* INLINE CTA BOX */
.cta-box{background:var(--navy);color:#e7edf7;border-radius:16px;padding:26px 28px;margin:30px 0;}
.cta-box h3{color:#fff;font-size:1.2rem;margin-bottom:8px;}
.cta-box p{color:#bcc8de;margin-bottom:16px;font-size:.98rem;}
.cta-box .btn-primary{background:#fff;color:var(--navy);}
.cta-box .btn-primary:hover{background:var(--bg-tint);}

/* FAQ */
.faq{margin:34px 0 10px;}
.faq h2{font-size:1.5rem;margin-bottom:14px;}
.faq details{border:1px solid var(--line);border-radius:12px;margin-bottom:12px;background:#fff;overflow:hidden;}
.faq summary{cursor:pointer;padding:16px 20px;font-weight:700;color:var(--navy);font-family:'Sora';font-size:1.02rem;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:'+';color:var(--azure);font-size:1.4rem;font-weight:400;line-height:1;}
.faq details[open] summary::after{content:'–';}
.faq details[open] summary{border-bottom:1px solid var(--line);}
.faq .faq-a{padding:14px 20px 18px;color:var(--text);font-size:1rem;line-height:1.7;}
.faq .faq-a p{margin-bottom:10px;}

/* RECAP */
.recap{background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:24px 26px;margin:32px 0;}
.recap h2{font-size:1.2rem;margin-bottom:12px;}
.recap ul{list-style:none;display:grid;gap:10px;}
.recap li{display:flex;gap:12px;align-items:flex-start;font-size:1rem;}
.recap .ck{flex-shrink:0;width:22px;height:22px;border-radius:7px;background:var(--azure);display:flex;align-items:center;justify-content:center;color:#fff;margin-top:1px;font-size:13px;}

/* SIDEBAR / AUTHOR */
.aside{position:sticky;top:90px;display:flex;flex-direction:column;gap:20px;}
.author{border:1px solid var(--line);border-radius:16px;padding:22px;background:#fff;box-shadow:var(--shadow-sm);}
.author img{width:100%;border-radius:12px;aspect-ratio:1/1;object-fit:cover;object-position:50% 18%;margin-bottom:14px;}
.author .an{font-family:'Sora';font-weight:700;color:var(--navy);font-size:1.05rem;}
.author .ar{font-size:13px;color:var(--muted);margin-bottom:14px;}
.author .btn{width:100%;justify-content:center;}
.author .ph{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13.5px;color:var(--navy);font-weight:600;}
.related{border:1px solid var(--line);border-radius:16px;padding:22px;background:#fff;}
.related h3{font-size:1rem;margin-bottom:12px;color:var(--navy);}
.related ul{list-style:none;display:grid;gap:10px;}
.related a{font-size:.95rem;color:var(--text);font-weight:600;display:flex;gap:8px;}
.related a:hover{color:var(--azure);text-decoration:none;}
.related a::before{content:'→';color:var(--azure);}

/* HUB */
.hub-head{background:var(--bg-soft);border-bottom:1px solid var(--line);padding:46px 0 40px;text-align:center;}
.hub-head h1{font-size:clamp(2rem,4vw,2.8rem);margin-bottom:14px;}
.hub-head p{font-size:1.12rem;color:var(--muted);max-width:620px;margin:0 auto;}
.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:40px 0 12px;}
.hub-grid:last-of-type{padding-bottom:70px;}
.hub-sec{grid-column:span 3;margin:30px 0 -4px;}
.hub-sec:first-child{margin-top:0;}
.hub-sec h2{font-size:1.3rem;color:var(--navy);margin-bottom:4px;}
.hub-sec p{font-size:.95rem;color:var(--muted);}
.hub-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;padding:26px;background:#fff;transition:transform .25s,box-shadow .25s;}
.hub-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);text-decoration:none;}
.hub-card .cat{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--azure);margin-bottom:12px;}
.hub-card h2{font-size:1.18rem;margin-bottom:10px;color:var(--navy);}
.hub-card p{font-size:.95rem;color:var(--muted);line-height:1.6;flex:1;}
.hub-card .more{margin-top:16px;font-weight:700;color:var(--azure);font-size:.95rem;}
.hub-card.feat{grid-column:span 3;background:var(--navy);color:#e7edf7;border:none;}
.hub-card.feat h2{color:#fff;font-size:1.5rem;} .hub-card.feat p{color:#bcc8de;} .hub-card.feat .cat{color:#8fb3ec;} .hub-card.feat .more{color:#fff;}

/* FOOTER */
footer{background:var(--bg-soft);border-top:1px solid var(--line);color:var(--muted);padding:46px 0 32px;margin-top:30px;}
.foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-start;}
.foot p{font-size:13px;max-width:430px;margin-top:12px;line-height:1.6;}
.foot .disc{font-size:12px;margin-top:12px;display:flex;align-items:center;gap:8px;}
.foot .disc img{width:16px;height:16px;border-radius:3px;}
.foot-links{display:flex;gap:22px;flex-wrap:wrap;}
.foot-links a{font-size:13px;color:var(--muted);}
.foot-links a:hover{color:var(--azure);}
.disclaimer{font-size:12px;color:var(--muted-2);border-top:1px solid var(--line);margin-top:26px;padding-top:18px;line-height:1.6;}

@media (max-width:900px){
  .article-grid{grid-template-columns:1fr;gap:30px;}
  .aside{position:static;flex-direction:row;flex-wrap:wrap;}
  .author,.related{flex:1;min-width:260px;}
  .hub-grid{grid-template-columns:1fr;} .hub-card.feat{grid-column:span 1;} .hub-sec{grid-column:span 1;}
  .nav-links{display:none;} .burger{display:block;}
}
@media (max-width:560px){
  .author{max-width:none;} .art-lead{font-size:1.06rem;}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto;} .hub-card{transition:none;}}