/* a-theme.css – Konzept 1 · Leitsystem (klar und institutionell)
   Zentrale Gestaltungswerte. Die Redaktion wählt nur Varianten, keine Werte. */

.th{
  --f-body:"Public Sans","Segoe UI",Arial,sans-serif; --f-head:var(--f-body);
  --ink:#1A1E23; --ink2:#3E4650; --mute:#59626D;
  --line:#CDD4DB; --line2:#E3E8EC;
  --bg:#FFFFFF; --sf:#F2F4F6; --sf2:#E7EBEF;
  --red:#E60005; --red-d:#B4000A; --red-t:#FDEDED;
  --link:#B4000A; --link-h:#1A1E23; --focus:#0B57D0; --bullet:#E60005;
  --fs:17px; --lh:1.62; --r:4px;
  --wrap:1312px; --gut:40px; --measure:42em; --demo-pad:32px;
}
@container pg (max-width:600px){ .pg > *, .demo > *{ --gut:20px } }

/* ---------- Typografie ---------- */
.th .kicker{font-size:14px;line-height:1.3;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--red-d);margin-bottom:12px}
.th .hero-h{font-size:clamp(34px,5.6cqi,54px);line-height:1.06;font-weight:700;letter-spacing:-.02em}
.th .h2{font-size:clamp(26px,3.6cqi,34px);line-height:1.18;font-weight:700;letter-spacing:-.012em}
.th .lead{font-size:clamp(19px,2.4cqi,22px);line-height:1.5;color:var(--ink2)}

/* ---------- Handlungslinks ---------- */
.th .btn{font-weight:700;font-size:16px;border-radius:var(--r)}
.th .btn-p{background:var(--red);color:#FFFFFF}
.th .btn-p:hover{background:var(--red-d);color:#FFFFFF}
.th .btn-s{background:#FFFFFF;color:var(--ink);border-color:var(--ink)}
.th .btn-s:hover{background:var(--ink);color:#FFFFFF}
.th .lnk{font-weight:700;color:var(--ink);text-decoration:none}
.th .lnk .ic{color:var(--red)}
.th .lnk:hover{color:var(--red-d);text-decoration:underline}

/* ---------- Seitenrahmen: Notfallleiste ---------- */
.th .svc{background:var(--ink);color:#FFFFFF;font-size:15px}
.th .svc-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0 32px;min-height:48px}
.th .svc-list{display:flex;flex-wrap:wrap;align-items:center;gap:0 22px}
.th .svc-list li{display:flex;align-items:center;gap:8px}
.th .svc-flag{background:var(--red);color:#FFFFFF;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 8px;border-radius:2px}
.th .svc-k{color:#C7CED5}
.th .svc a{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:#FFFFFF;font-weight:700;text-decoration:none}
.th .svc a:hover{color:#FFFFFF;text-decoration:underline}
.th .svc :focus-visible{outline-color:#FFFFFF}

/* ---------- Kopf und Hauptnavigation ---------- */
.th .hdr{position:relative;background:#FFFFFF;border-bottom:1px solid var(--line)}
.th .hdr-in{display:flex;align-items:center;gap:16px 40px;min-height:104px}
.th .brand{display:flex;align-items:center;gap:18px;margin-right:auto;color:var(--ink);text-decoration:none}
.th .brand img{height:56px;width:auto}
.th .brand-name{font-weight:700;font-size:18px;line-height:1.2;padding-left:18px;border-left:1px solid var(--line)}
.th .search{display:flex;width:380px;max-width:100%;border:1px solid var(--ink2);border-radius:var(--r);overflow:hidden;background:#FFFFFF}
.th .search:focus-within{outline:3px solid var(--focus);outline-offset:2px}
.th .search input{flex:1;min-width:0;border:0;outline:0;padding:0 16px;min-height:48px;background:transparent;font-size:16px}
.th .search input::placeholder{color:var(--mute)}
.th .search button{display:inline-flex;align-items:center;gap:8px;border:0;background:var(--ink);color:#FFFFFF;padding:0 18px;font-weight:700;font-size:15px;cursor:pointer}
.th .search button:hover{background:var(--red-d)}
.th .nav{border-top:1px solid var(--line2)}
.th .nav-list{display:flex;flex-wrap:wrap}
.th .nav-list a{position:relative;display:flex;align-items:center;min-height:60px;padding:0 18px;font-weight:600;font-size:16px;color:var(--ink);text-decoration:none}
.th .nav-list li:first-child a{padding-left:0}
.th .nav-list a:hover{color:var(--red-d)}
.th .nav-list a[aria-current]{color:var(--red-d)}
.th .nav-list a[aria-current]::after{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:4px;background:var(--red)}
.th .nav-list li:first-child a[aria-current]::after{left:0}

/* Mobiles Menü */
.th .mnav > summary{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 16px;border:2px solid var(--ink);border-radius:var(--r);font-weight:700;font-size:16px;background:#FFFFFF}
.th .mnav[open] > summary{background:var(--ink);color:#FFFFFF}
.th .burger{position:relative;width:20px;height:2px;flex:none;background:currentColor}
.th .burger::before,.th .burger::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor}
.th .burger::before{top:-6px}
.th .burger::after{top:6px}
.th .mnav[open] .burger{background:transparent}
.th .mnav[open] .burger::before{top:0;transform:rotate(45deg)}
.th .mnav[open] .burger::after{top:0;transform:rotate(-45deg)}
.th .mnav-panel{position:absolute;left:0;right:0;top:100%;z-index:30;background:#FFFFFF;border-top:1px solid var(--line);box-shadow:0 24px 48px rgba(26,30,35,.18);padding:20px var(--gut) 32px;display:flex;flex-direction:column;gap:24px}
.th .mnav-panel .search{width:100%}
.th .mn-list > li{border-bottom:1px solid var(--line2)}
.th .mn-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;font-weight:600;font-size:17px;color:var(--ink);text-decoration:none}
.th .mn-list a[aria-current="true"]{color:var(--red-d)}
.th .mn-sub{padding-bottom:12px}
.th .mn-sub a{min-height:46px;padding:0 12px;font-weight:400;font-size:16px;border-radius:var(--r)}
.th .mn-sub a[aria-current="page"]{background:var(--red-t);color:var(--red-d);font-weight:700}
.th .mn-emg{background:var(--sf);border-radius:var(--r);padding:16px 18px;display:grid;gap:4px}
.th .mn-emg li{display:flex;align-items:center;justify-content:space-between;gap:12px}
.th .mn-emg a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--ink)}
.th .mn-aud{display:flex;flex-wrap:wrap;gap:12px}

@container pg (max-width:980px){
  .th .nav,.th .hdr .search-hdr,.th .svc-aud{display:none}
  .th .mnav{display:block}
  .th .hdr-in{min-height:76px;gap:12px}
  .th .brand{gap:12px}
  .th .brand img{height:40px}
  .th .brand-name{font-size:15px;padding-left:12px}
}
@container pg (max-width:600px){
  .th .svc-list .svc-more{display:none}
  .th .svc{font-size:14px}
  .th .svc-list{gap:0 14px}
  .th .brand img{height:34px}
  .th .brand-name{font-size:14px}
}

/* ---------- Brotkrumen, Seitenleiste, Hauptbereich ---------- */
.th .crumbs{padding-top:24px;font-size:15px}
.th .crumbs ol{display:flex;flex-wrap:wrap;align-items:center}
.th .crumbs li{display:flex;align-items:center;color:var(--mute)}
.th .crumbs li + li::before{content:"";width:7px;height:7px;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg);margin:0 14px 0 10px}
.th .crumbs a{display:inline-flex;align-items:center;min-height:36px;color:var(--ink2)}
.th .layout{display:grid;grid-template-columns:272px minmax(0,1fr);gap:72px;padding-top:40px;padding-bottom:112px}
.th .side{display:flex;flex-direction:column;gap:44px;align-self:start}
.th .side-h{font-family:var(--f-body);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-bottom:10px}
.th .subnav li + li{margin-top:2px}
.th .subnav a{display:flex;align-items:center;min-height:48px;padding:10px 14px;border-radius:var(--r);color:var(--ink);text-decoration:none;line-height:1.3;font-size:16px}
.th .subnav a:hover{background:var(--sf)}
.th .subnav a[aria-current]{background:var(--red-t);color:var(--red-d);font-weight:700}
.th .toc ol{counter-reset:toc;border-top:1px solid var(--line2)}
.th .toc li{counter-increment:toc}
.th .toc a{display:flex;align-items:center;gap:12px;min-height:46px;color:var(--ink2);text-decoration:none;font-size:16px;border-bottom:1px solid var(--line2)}
.th .toc a::before{content:counter(toc,decimal-leading-zero);font-size:13px;font-weight:700;color:var(--red-d);font-variant-numeric:tabular-nums;min-width:22px}
.th .toc a:hover{color:var(--red-d)}
.th .toc-m{border:1px solid var(--line);border-radius:var(--r)}
.th .toc-m > summary{display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:0 16px;font-weight:700}
.th .toc-m[open] > summary{border-bottom:1px solid var(--line2)}
.th .toc-m ol{padding:6px 16px 10px;counter-reset:toc}
.th .toc-m li{counter-increment:toc}
.th .toc-m a{display:flex;align-items:center;gap:12px;min-height:44px;color:var(--ink);text-decoration:none}
.th .toc-m a::before{content:counter(toc,decimal-leading-zero);font-size:13px;font-weight:700;color:var(--red-d)}
.th .flow{display:flex;flex-direction:column;gap:88px;min-width:0}
@container pg (max-width:980px){
  .th .layout{grid-template-columns:minmax(0,1fr);gap:64px;padding-top:20px;padding-bottom:72px}
  .th .side{order:2}
  .th .toc{display:none}
  .th .toc-m{display:block}
  .th .flow{gap:56px}
}
@container pg (max-width:600px){ .th .crumbs li[aria-current]{display:none} }

/* ---------- 1 Seiteneinstieg ---------- */
.th .ce-hero{--hero-ratio:4/5;--hero-gap:48px}
.th .ce-hero .lead{margin-top:20px}
.th .ce-hero .actions{margin-top:32px}
.th .hero-img img{border-radius:var(--r)}
@container (max-width:759px){ .th .ce-hero{--hero-gap:28px} .th .hero-img img{aspect-ratio:3/2} }

/* ---------- 2 Textblock ---------- */
.th .ce-text .h2{margin-bottom:16px}
.th .ce-text.is-featured > .ce-in{background:var(--sf);padding:32px;border-radius:var(--r)}

/* ---------- 3 Bild-Text ---------- */
.th .ce-media{--m-ratio:4/3}
.th .m-img img{border-radius:var(--r)}
.th figcaption{font-size:14px;color:var(--mute);margin-top:10px}
.th .m-txt .h2{margin-bottom:16px}
.th .m-txt .actions{margin-top:24px}
.th .ce-media.is-featured > .ce-in{background:var(--sf);padding:32px;border-radius:var(--r)}

/* ---------- 4 Leistungen & Akkordeon ---------- */
.th .acc-head{margin-bottom:24px}
.th .acc-intro{margin-top:12px;color:var(--ink2);max-width:var(--measure)}
.th .acc{border-top:2px solid var(--ink)}
.th .acc-item{border-bottom:1px solid var(--line)}
.th .acc-item > summary{padding:16px 0;min-height:68px;font-weight:700;font-size:18px;line-height:1.35}
.th .acc-item > summary:hover,.th .acc-item[open] > summary{color:var(--red-d)}
.th .acc-i{border:1.5px solid currentColor;border-radius:50%}
.th .acc-c{padding:0 56px 28px 0}
.th .acc.is-grid{border-top:0}
.th .acc.is-grid .acc-item{border:1px solid var(--line);border-radius:var(--r);padding:0 20px}
.th .acc.is-grid .acc-c{padding-right:0}
.th .ce-acc.is-compact .acc-item > summary{min-height:52px;padding:10px 0;font-size:16px}
.th .ce-acc.is-compact .acc-i{width:28px;height:28px}

/* ---------- 5 Ansprechpartner: Kontaktkarte ---------- */
.th .ce-contact > .ce-in{display:flex;flex-direction:column;gap:16px;padding:28px;border:1px solid var(--line);border-radius:var(--r);background:#FFFFFF}
.th .ce-contact.is-featured > .ce-in{border:2px solid var(--ink)}
.th .ct-photo{width:80px;height:80px;border-radius:50%;object-fit:cover}
.th .ct-label{font-family:var(--f-body);font-size:14px;line-height:1.3;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--red-d)}
.th .ct-name{font-size:21px;line-height:1.3;font-weight:700;margin-top:6px}
.th .ct-role{color:var(--mute);font-size:16px}
.th .ct-lines{margin-top:14px;border-top:1px solid var(--line2)}
.th .ct-lines li{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:8px;min-height:44px;border-bottom:1px solid var(--line2)}
.th .ct-ic{display:none}
.th .ct-k{font-size:14px;color:var(--mute)}
@container (max-width:340px){ .th .ct-lines li{grid-template-columns:minmax(0,1fr);gap:0;padding:8px 0} }
.th .ct-lines a{font-weight:600;color:var(--ink);text-decoration:none}
.th .ct-lines a:hover{color:var(--red-d);text-decoration:underline}
.th .ct-extra{margin-top:14px;font-size:16px;color:var(--ink2)}
.th .ct-extra b{color:var(--ink)}

/* ---------- 5 Ansprechpartner: Profil ---------- */
.th .ce-person > .ce-in{display:grid;gap:24px;background:var(--sf);padding:24px;border-radius:var(--r)}
@container (min-width:620px){ .th .ce-person.has-photo > .ce-in{grid-template-columns:240px minmax(0,1fr);gap:44px;padding:32px;align-items:center} .th .ce-person:not(.has-photo) > .ce-in{padding:32px} }
.th .ps-img{max-width:240px}
.th .ps-img img{aspect-ratio:4/5;border-radius:var(--r)}
@container (max-width:619px){ .th .ps-img{max-width:176px} }
.th .ps-name{font-size:clamp(26px,3.6cqi,34px);line-height:1.15;font-weight:700;letter-spacing:-.01em}
.th .ps-role{font-size:18px;color:var(--ink2);margin-top:8px}
.th .ps-text{margin-top:16px}
.th .ps-links{margin-top:24px;border-top:1px solid var(--line)}
.th .ps-links a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:54px;border-bottom:1px solid var(--line);font-weight:700;color:var(--ink);text-decoration:none}
.th .ps-links a:hover{color:var(--red-d)}
.th .ps-links .ic{color:var(--red)}

/* ---------- 6 Downloadliste ---------- */
.th .dl-h{font-size:20px;line-height:1.3;font-weight:700;margin-bottom:12px}
.th .dl-list{border-top:1px solid var(--line)}
.th .dl-list a{border-bottom:1px solid var(--line);padding:12px 4px;color:var(--ink)}
.th .dl-list a:hover{background:var(--sf);color:var(--red-d)}
.th .dl-list .ic{color:var(--red);width:22px;height:22px}
.th .dl-t{font-weight:600;line-height:1.35}
.th .dl-m{font-size:13px;font-weight:700;letter-spacing:.06em;color:var(--mute)}
.th .ce-dl.is-compact .dl-list{border-top:0;display:flex;flex-wrap:wrap;gap:8px}
.th .ce-dl.is-compact .dl-list a{border:1px solid var(--line);border-radius:var(--r);padding:8px 14px;min-height:48px}

/* ---------- 7 Hinweis & Handlung ---------- */
.th .ce-note > .ce-in{padding:28px 32px;border-radius:var(--r);background:var(--sf);align-items:flex-start}
.th .note-ic{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#FFFFFF;color:var(--red-d)}
.th .note-ic .ic{width:24px;height:24px}
.th .note-h{font-size:21px;line-height:1.3;font-weight:700}
.th .note-txt p{margin-top:8px;color:var(--ink2)}
.th .ce-note.is-featured > .ce-in{background:var(--red);color:#FFFFFF}
.th .ce-note.is-featured .note-txt p{color:#FFFFFF}
.th .ce-note.is-featured .btn-p{background:#FFFFFF;color:var(--red-d)}
.th .ce-note.is-featured .btn-p:hover{background:var(--ink);color:#FFFFFF}
.th .ce-note.is-featured a:not(.btn){color:#FFFFFF}
.th .ce-note.is-featured :focus-visible{outline-color:#FFFFFF}

/* ---------- 8 Spaltengruppe ---------- */
.th .ce-group .grp-h{margin-bottom:24px}

/* ---------- Fuß ---------- */
.th .ftr{background:var(--sf);border-top:1px solid var(--line);font-size:16px}
.th .ftr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:40px 48px;padding-block:64px 48px}
.th .ftr-brand img{height:52px;width:auto;margin-bottom:20px}
.th .ftr-h{font-family:var(--f-body);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);margin-bottom:12px}
.th .ftr-list li{display:flex;align-items:center;gap:8px;min-height:36px}
.th .ftr-list .ftr-k{color:var(--mute);min-width:64px}
.th .ftr a{color:var(--ink);font-weight:600}
.th .ftr a:hover{color:var(--red-d)}
.th .ftr-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding-block:24px 40px;border-top:1px solid var(--line)}
.th .ftr-legal{display:flex;flex-wrap:wrap;gap:0 28px}
.th .ftr-legal a,.th .linklike{display:inline-flex;align-items:center;min-height:44px}
.th .linklike{background:none;border:0;padding:0;cursor:pointer;color:var(--ink);font-weight:600;text-decoration:underline;text-underline-offset:.22em}
.th .eu-box{background:#FFFFFF;padding:10px 14px;border-radius:var(--r);border:1px solid var(--line2)}
.th .eu-box img{height:44px;width:auto}

/* Ergänzung für die Präsentationswebsite: sehr schmale Geräte (bis 360 px) */
@container pg (max-width:360px){
  .th .brand img{height:30px}
  .th .brand{gap:10px}
  .th .brand-name{padding-left:10px}
  .th .mnav > summary{padding:0 13px}
  .th .mnav > summary > span:not(.burger){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}