@font-face{font-family:"Syne";src:url(/assets/fonts/syne.woff2) format("woff2");font-weight:400 800;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(/assets/fonts/sourceserif.woff2) format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:"Source Serif 4";src:url(/assets/fonts/sourceserif-italic.woff2) format("woff2");font-weight:200 900;font-style:italic;font-display:swap}

:root{
  --paper:#fffdf8;--sand:#f4ede1;--line:#e6dccb;--ink:#1d1a24;--soft:#57515f;
  --beere:#8e1b4f;--beere-d:#6c1239;--petrol:#123c4a;--petrol-d:#0c2c37;--safran:#f0a202;
  --f-head:"Syne","Trebuchet MS",Arial,sans-serif;
  --f-text:"Source Serif 4",Georgia,"Times New Roman",serif;
  --w:72rem;--measure:40rem;--gut:1.25rem
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:1.0625rem/1.72 var(--f-text)}
img{max-width:100%;height:auto;display:block}
svg{max-width:100%;height:auto}
a{color:var(--beere);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--beere-d);text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--safran);outline-offset:2px}
h1,h2,h3{font-family:var(--f-head);line-height:1.15;letter-spacing:-.01em;color:var(--ink)}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.5rem 1rem;z-index:9}
.skip:focus{left:1rem}

/* Kopf */
.site_top{background:linear-gradient(90deg,var(--beere),var(--safran)) top/100% 5px no-repeat,var(--paper);padding-top:5px;border-bottom:1px solid var(--line)}
.top_inner{max-width:var(--w);margin:0 auto;padding:1rem var(--gut);display:flex;align-items:center;justify-content:space-between;gap:.8rem 2rem;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
.brand svg{width:38px;height:38px;flex:none}
.brand_word{font:700 1.25rem/1 var(--f-head);letter-spacing:-.02em}
.brand_word b{color:var(--beere);font-weight:800}
.main_nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1.4rem}
.main_nav a{font:600 .95rem/1 var(--f-head);color:var(--ink);text-decoration:none;padding:.45rem 0;border-bottom:2px solid transparent;display:inline-block}
.main_nav a:hover,.main_nav a[aria-current]{border-bottom-color:var(--beere);color:var(--beere)}

/* Startseite */
.hero{background:radial-gradient(ellipse at 78% 45%,#fbeede 0,transparent 60%),var(--paper)}
.hero_grid{max-width:var(--w);margin:0 auto;padding:3rem var(--gut) 2rem;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:2rem;align-items:center}
.kicker{font:600 .8rem/1.2 var(--f-head);letter-spacing:.14em;text-transform:uppercase;color:var(--beere);margin:0 0 .8rem}
.hero h1{font-size:clamp(2.3rem,5.4vw,4rem);margin:0 0 1rem;font-weight:800}
.hero_lead{font-size:1.2rem;color:var(--soft);max-width:34rem;margin:0}
.hero_links{display:flex;flex-wrap:wrap;gap:.9rem 1.6rem;margin-top:1.6rem;align-items:center}
.go{font:700 1rem/1 var(--f-head);text-decoration:none;display:inline-block;padding:.9rem 1.25rem;border-radius:2px;background:var(--beere);color:#fff}
.go:hover{background:var(--beere-d);color:#fff}
.go_plain{font:700 1rem/1 var(--f-head);text-decoration:none;color:var(--petrol);padding:.3rem 0;border-bottom:2px solid var(--safran)}
.go_plain:hover{color:var(--beere)}
.hero_art svg{width:100%;max-width:330px;margin-inline:auto;display:block}
.sec{max-width:var(--w);margin:0 auto;padding:3.5rem var(--gut)}
.sec_head{max-width:44rem;margin-bottom:2rem}
.sec_head h2{font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 .6rem}
.sec_head p{margin:0;color:var(--soft)}
.intro_cols{columns:2 21rem;column-gap:3rem}
.intro_cols p{margin:0 0 1rem;break-inside:avoid}

.spine{list-style:none;margin:0;padding:0;position:relative;max-width:46rem}
.spine::before{content:"";position:absolute;left:1.33rem;top:.6rem;bottom:1.6rem;width:2px;background:linear-gradient(var(--beere),var(--safran))}
.spine_step{position:relative;padding:0 0 1.7rem 4rem}
.spine_num{position:absolute;left:0;top:0;width:2.75rem;height:2.75rem;border-radius:50%;background:var(--paper);border:2px solid var(--beere);display:grid;place-items:center;font:700 1rem/1 var(--f-head);color:var(--beere)}
.spine_step h3{margin:.35rem 0 .3rem;font-size:1.2rem}
.spine_step p{margin:0}

.row_list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:0 2.5rem}
.row_item{display:grid;grid-template-columns:44px minmax(0,1fr);gap:1rem;padding:1.1rem 0;border-top:1px solid var(--line)}
.row_item svg{width:44px;height:44px}
.row_item h3{margin:0 0 .2rem;font-size:1.08rem}
.row_item h3 a{color:var(--ink);text-decoration:none}
.row_item h3 a:hover{color:var(--beere);text-decoration:underline}
.row_item p{margin:0;font-size:.97rem;color:var(--soft)}

.dark_band{background:var(--petrol);color:#f1ece2}
.band_grid{max-width:var(--w);margin:0 auto;padding:3.5rem var(--gut);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.5rem;align-items:center}
.dark_band h2{color:#fff;font-size:clamp(1.6rem,3vw,2.2rem);margin:0 0 1rem}
.dark_band p{margin:0 0 1rem}
.dark_band a{color:var(--safran)}
.dark_band .kicker{color:var(--safran)}
.dark_band .go_plain{color:#fff}
.band_art svg{border-radius:4px;width:100%}

.bg_split{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:2.5rem;align-items:start}
.bg_split figure{margin:0}
.bg_split img{border-radius:3px;max-height:30rem;width:auto;margin-inline:auto}
.bg_split figcaption{font-size:.82rem;color:var(--soft);margin-top:.5rem;line-height:1.4}
.bg_split figcaption a{color:var(--soft)}
.plain_list{list-style:none;padding:0;margin:0}
.plain_list li{padding:.9rem 0;border-bottom:1px dashed var(--line)}
.plain_list a{font:700 1.08rem/1.3 var(--f-head);text-decoration:none}
.plain_list span{display:block;color:var(--soft);font-size:.96rem}

.faq{max-width:46rem}
.faq details{border-top:1px solid var(--line);padding:.9rem 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{font:700 1.05rem/1.35 var(--f-head);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--beere);font-size:1.4rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:.6rem 0 0}
.partner_note{max-width:46rem;border-left:3px solid var(--safran);padding:.2rem 0 .2rem 1.2rem}
.partner_note p{margin:0 0 .6rem}

/* Fuß */
.site_foot{background:var(--petrol-d);color:#d9d3c7;margin-top:4rem;font-size:.95rem}
.foot_beads{height:14px;background:radial-gradient(circle,var(--safran) 3px,transparent 3.6px) 0 50%/18px 14px repeat-x,var(--petrol)}
.foot_inner{max-width:var(--w);margin:0 auto;padding:2.5rem var(--gut) 1rem;display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}
.foot_name{font:700 1.15rem/1 var(--f-head);color:#fff;margin:0 0 .8rem}
.foot_about p{margin:0 0 .8rem;max-width:30rem}
.foot_head{font:600 .78rem/1 var(--f-head);letter-spacing:.14em;text-transform:uppercase;color:var(--safran);margin:0 0 .8rem}
.foot_links ul{list-style:none;margin:0;padding:0}
.foot_links li{margin:.35rem 0}
.site_foot a{color:#f1ece2;text-decoration:none}
.site_foot a:hover{color:var(--safran);text-decoration:underline}
.foot_line{max-width:var(--w);margin:0 auto;padding:1rem var(--gut) 2rem;border-top:1px solid #23505e;font-size:.85rem;color:#a9b8bd}

/* Beiträge */
.art_wrap{max-width:var(--w);margin:0 auto;padding-inline:var(--gut)}
.crumbs{font:500 .85rem/1.4 var(--f-head);color:var(--soft);padding:1.5rem 0 0}
.crumbs a{color:var(--soft)}
.crumbs [aria-current]{color:var(--ink)}
.art_grid{display:grid;grid-template-columns:13.5rem minmax(0,var(--measure));gap:3.5rem;padding-top:1.5rem;justify-content:center}
.rail{position:sticky;top:1.5rem;align-self:start;font-family:var(--f-head)}
.rail_head{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--beere);font-weight:700;margin:0 0 .8rem}
.rail_head a{color:inherit;text-decoration:none}
.rail_list{list-style:none;margin:0;padding:0 0 0 1rem;border-left:2px solid var(--line)}
.rail_list li{position:relative;margin:0 0 .7rem;font-size:.88rem;line-height:1.3}
.rail_list li::before{content:"";position:absolute;left:calc(-1rem - 6px);top:.3em;width:10px;height:10px;border-radius:50%;background:var(--paper);border:2px solid var(--line)}
.rail_list .is_here::before{background:var(--beere);border-color:var(--beere)}
.rail_list a{color:var(--soft);text-decoration:none}
.rail_list a:hover{color:var(--beere)}
.rail_list .is_here a{color:var(--ink);font-weight:700}
.art_kicker{font:700 .78rem/1 var(--f-head);letter-spacing:.14em;text-transform:uppercase;margin:0}
.art_kicker a{color:var(--beere);text-decoration:none}
.art_head h1{font-size:clamp(1.9rem,4vw,2.75rem);margin:.5rem 0 .8rem;font-weight:800;hyphens:auto}
.art_meta{font:500 .88rem/1.4 var(--f-head);color:var(--soft);margin:0 0 1.8rem}
.prose h2{font-size:1.5rem;margin:2.4rem 0 .7rem}
.prose p{margin:0 0 1.1rem}
.prose ul,.prose ol{padding-left:1.3rem;margin:0 0 1.2rem}
.prose li{margin:.35rem 0}
.prose li::marker{color:var(--beere);font-weight:700}
.lead{font-size:1.24rem;line-height:1.6;color:#35303c}
.note_box{background:var(--sand);border-left:4px solid var(--beere);padding:1.1rem 1.3rem;margin:1.8rem 0;border-radius:0 4px 4px 0}
.note_box p{margin:0}
.note_box .note_title{font:700 .95rem/1.3 var(--f-head);color:var(--beere);margin:0 0 .4rem}
.tbl_wrap{overflow-x:auto;margin:1.5rem 0}
table{border-collapse:collapse;width:100%;font-size:.95rem;line-height:1.45}
th{font:700 .85rem/1.3 var(--f-head);text-align:left;background:var(--petrol);color:#fff;padding:.6rem .7rem}
td{padding:.55rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:nth-child(even){background:#fbf6ee}
.fig{margin:2rem 0}
.fig img{border-radius:3px;margin-inline:auto;max-height:34rem;width:auto}
.fig_svg{background:var(--sand);padding:1.2rem;border-radius:4px}
.fig_svg svg{display:block;margin-inline:auto}
.fig figcaption{font-size:.86rem;line-height:1.45;color:var(--soft);margin-top:.6rem}
.fig_credit{display:block;font-size:.8rem}
.fig_credit a{color:var(--soft)}
svg text{font-family:var(--f-head)}
.art_pager{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:3rem 0 0;padding-top:1.5rem;border-top:2px solid var(--ink)}
.art_pager a{text-decoration:none;font:700 1rem/1.3 var(--f-head);color:var(--ink)}
.art_pager a:hover{color:var(--beere)}
.art_pager small{display:block;font:500 .76rem/1.2 var(--f-head);letter-spacing:.1em;text-transform:uppercase;color:var(--soft);margin-bottom:.3rem}
.art_pager .nx{text-align:right;grid-column:2}
.more{max-width:var(--w);margin:3.5rem auto 0;padding-inline:var(--gut)}
.more h2{font-size:1.4rem}
.card_grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1.25rem}
.card{border-top:4px solid var(--beere);background:#fff;padding:1.2rem 1.2rem 1.4rem;box-shadow:0 1px 0 var(--line)}
.card:nth-child(3n+2){border-top-color:var(--petrol)}
.card:nth-child(3n){border-top-color:var(--safran)}
.card small{font:600 .74rem/1 var(--f-head);letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}
.card h3{font-size:1.1rem;margin:.5rem 0 .4rem}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a:hover{color:var(--beere)}
.card p{margin:0;font-size:.95rem;color:var(--soft)}

/* Übersichten und einfache Seiten */
.hub_head{max-width:46rem;padding:1.5rem 0 1rem}
.hub_head h1{font-size:clamp(2rem,4.5vw,3rem);margin:.4rem 0 1rem;font-weight:800}
.hub_head p{margin:0 0 1rem}
.hub_list{list-style:none;margin:1rem 0 0;padding:0;counter-reset:hub;max-width:52rem}
.hub_list li{counter-increment:hub;display:grid;grid-template-columns:3.2rem minmax(0,1fr);gap:1rem;padding:1.3rem 0;border-top:1px solid var(--line)}
.hub_list li::before{content:counter(hub,decimal-leading-zero);font:800 1.6rem/1 var(--f-head);color:var(--beere)}
.hub_list h2{margin:0 0 .3rem;font-size:1.25rem}
.hub_list h2 a{color:var(--ink);text-decoration:none}
.hub_list h2 a:hover{color:var(--beere)}
.hub_list p{margin:0;color:var(--soft)}
.simple{max-width:var(--measure);margin:0 auto;padding:1.5rem 0 0}
.simple h1{font-size:clamp(1.9rem,4vw,2.6rem);font-weight:800;margin:.4rem 0 1.2rem}
.legal{font-size:1rem}
.legal h2{font-size:1.15rem;margin:1.8rem 0 .4rem}
.legal li{margin:.4rem 0;font-size:.95rem}

@media (max-width:960px){
  .art_grid{grid-template-columns:minmax(0,1fr);gap:2rem}
  .rail{position:static;order:2;border-top:1px solid var(--line);padding-top:1.5rem}
  .hero_grid,.band_grid,.bg_split{grid-template-columns:minmax(0,1fr)}
  .hero_art svg{max-width:230px}
  .foot_inner{grid-template-columns:1fr 1fr}
  .foot_about{grid-column:1/-1}
}
@media (max-width:560px){
  :root{--gut:1rem}
  body{font-size:1rem}
  .top_inner{padding-block:.8rem}
  .brand_word{font-size:1.08rem}
  .main_nav ul{gap:.1rem 1rem}
  .main_nav a{font-size:.9rem}
  .hero_grid{padding-top:2rem}
  .hero h1{font-size:2rem}
  .spine_step{padding-left:3.5rem}
  .art_pager{grid-template-columns:1fr}
  .art_pager .nx{grid-column:1;text-align:left}
  .foot_inner{grid-template-columns:1fr}
  .row_list{grid-template-columns:minmax(0,1fr)}
  .fig_svg{padding:.7rem}
}