:root{
  --ci:#000000;
  --ci-accent:#ffffff;
  --ink:#ffffff;
  --muted:#cccccc;
  --radius:18px;
  --shadow:0 8px 28px rgba(0,0,0,.55);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Inter,"Open Sans",Arial,sans-serif;
  color:var(--ink);
  line-height:1.6;
  position:relative;
  min-height:100vh;
  background:center center / cover fixed no-repeat;
}
/* Overlay-Ebene für Hintergrund */
body::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.55);
  backdrop-filter:blur(3px);
  z-index:0;
}
.header,.meta,.shell{position:relative;z-index:1;}

.header{
  position:sticky;top:0;z-index:1000;
  background:rgba(0,0,0,.96);
  backdrop-filter:saturate(140%) blur(3px);
  box-shadow:0 2px 8px rgba(0,0,0,.6);
}
.header-inner{
  max-width:1100px;margin:0 auto;
  padding:20px 20px;display:flex;align-items:center;
  justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:16px;min-width:0}
.brand img{height:100px;width:auto}
.header-title{
  margin:0;line-height:1.25;word-break:break-word;
  font-size:26px;font-weight:800;color:var(--ci-accent);
}
.cta-top{display:flex;gap:10px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 18px;border-radius:12px;font-weight:700;font-size:15px;
  text-decoration:none;border:2px solid transparent;white-space:nowrap;
  transition:all .35s ease;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.5)}
.btn-primary{background:var(--ci-accent);color:var(--ci);box-shadow:0 0 12px rgba(255,255,255,0.25);}
.btn-primary:hover{background:#e6e6e6}
.btn-outline{background:transparent;color:var(--ci-accent);border-color:var(--ci-accent)}
.btn-outline:hover{background:rgba(255,255,255,0.1)}

.meta{background:rgba(0,0,0,.84);border-bottom:1px solid rgba(255,255,255,.1);}
.meta-inner{
  max-width:1100px;margin:0 auto;
  padding:8px 20px;display:flex;flex-wrap:wrap;gap:6px 14px;
  font-size:13px;color:var(--muted);
}
.meta .sep{opacity:.35}

.shell{max-width:1100px;margin:0 auto;padding:28px 20px 56px;}

.card{
  background:rgba(0,0,0,0.72);
  border:none;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  backdrop-filter:blur(6px);
  transition:all .35s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.6);}
.section{padding:24px;margin:0 0 32px 0;}
.section:last-child{margin-bottom:0}

.flow>*+*{margin-top:16px;}
.flow h2{
  margin:0;font-size:22px;font-weight:700;
  letter-spacing:0.5px;text-transform:uppercase;
  color:var(--ci-accent);margin-bottom:12px;
}
.flow ul{padding-left:20px;margin:0}
.flow li{margin:8px 0;line-height:1.75;}
.flow p{margin:0;line-height:1.75;}

.section-cta{
  display:flex;gap:10px;flex-wrap:wrap;justify-content:center;padding:20px;
}
.share{position:relative;display:inline-block}
.share-icon{width:16px;height:16px;fill:var(--ci-accent);}
.share-dropdown{
  display:none;position:absolute;bottom:100%;right:0;transform:translateY(-8px);
  background:rgba(0,0,0,.96);border:1px solid rgba(255,255,255,.15);
  border-radius:10px;min-width:240px;
  box-shadow:0 8px 20px rgba(0,0,0,.5);overflow:hidden;z-index:5;
}
.share:hover .share-dropdown,.share:focus-within .share-dropdown{display:block}
.share-dropdown a{
  display:block;padding:10px 12px;font-size:14px;
  color:var(--ci-accent);text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.share-dropdown a:last-child{border-bottom:none}
.share-dropdown a:hover{background:rgba(255,255,255,0.1)}

@media print { body { background:#fff !important; color:#000 !important; } * { box-shadow:none !important; animation:none !important; } }
@media (prefers-reduced-motion: reduce) { * { animation:none !important; transition:none !important; } }


/* Proteus: Hintergrund aus dem Inline-Stil des <body> der Vorlage */
body { background-image:url('../images/bild1.jpg'); }

b, strong { font-weight: bold; }

/* Proteus: Platzhalter für entfernte Rücksprung-Links — hält den Platz, ohne Text */
[data-prt-platz]::before { content: attr(data-prt-platz); }

#wrapper, .wrapper { padding-bottom: 2.5rem; }

/* prt-hyphenation — Silbentrennung langer Wörter (Proteus, alle Anzeigen) */
@media (max-width: 800px) {
  html {
  overflow-wrap: break-word;
  }
}
@media (max-width: 800px) {
  h1, h2, h3, h4, h5, h6 {
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  -webkit-hyphenate-limit-chars: 8 4 3;
  hyphenate-limit-chars: 8 4 3;
  }
}
@media (max-width: 700px) {
  html {
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  -webkit-hyphenate-limit-chars: 8 4 3;
  hyphenate-limit-chars: 8 4 3;
  }
}

/* Logo-Anker (S55): klickbar, aber ohne eigenen Kasten — sonst verschiebt
   sich ein prozentual bemessenes Logo (SDE-113070). */
a.prt-logo-link { display: contents; }

/* proteus-schriftgroesse-gemessen */
/* Fließtext mindestens 16px (Betreiber-Vorgabe SDE-113070): nur die Blöcke,
   die in der Vorlage kleiner standen — am Output gemessen, weil die Größe oft vom
   body/Container geerbt wird (SDE-123205). Maßstab ist die SICHTBARE Größe: eine
   Schrift mit kleinen Kleinbuchstaben wird größer gesetzt (YF-51810). Nur Bildschirm. */
@media screen {
  .prt-schrift { font-size: 16px !important; }
}