@import url("https://use.typekit.net/pnf4lwc.css");
/* ============================================================
   WORDUP – Ergänzendes CSS für die Unterseiten
   (Karriere, PR-Berater, Highlights)
   Wird ZUSÄTZLICH zu wordup.css geladen.
   Nutzt dieselben Variablen (--blau, --gold-warm, --creme, ...).
   ============================================================ */

/* Design-Variablen — identisch zur Startseite (wordup.css).
   Hier wiederholt, damit die Unterseiten auch ohne wordup.css
   die richtigen Farben zeigen (u. a. das Gold #c8be00 / #d0c400). */
:root{
  --blau:#00406b;
  --blau-tief:#002d4a;
  --gold:#c8be00;
  --gold-warm:#d0c400;
  --gold-text:#8a7d00;
  --grau:#3a3a38;
  --grau-hell:#6d6d68;
  --creme:#f6f4ec;
  --linie:#e5e2d6;
  --font-head:"ff-meta-web-pro","FF Meta Pro",system-ui,sans-serif;
  --font-cond:"ff-meta-web-pro-condensed","FF Meta Pro Condensed",system-ui,sans-serif;
  --font-body:"ff-meta-web-pro","FF Meta Pro",system-ui,sans-serif;
  --font-mono:"ff-meta-correspondence-web",monospace;
  /* Deckkraft der Signet-"W"-Dekorationen. Zentral hier, damit alle
     Vorkommen denselben Wert nutzen und nicht einzeln gepflegt werden.
     --sig-op   : Normalfall (Creme oder einfarbiges Blau)
     --sig-op-foto: nur dort, wo zusaetzlich ein Foto darunterliegt
                    (CTA mit Schloss Nymphenburg) - sonst zu unruhig. */
  --sig-op:.08;
  --sig-op-foto:.035;
}

/* ---------- Gemeinsamer Seiten-Hero (kompakt) ---------- */
.sub-hero{
  background:var(--blau);color:#fff;padding:120px 0 90px;position:relative;
  clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 28px));
}
.sub-hero .kicker{color:var(--gold-warm)}
.sub-hero h1{font-family:var(--font-cond);font-size:64px;line-height:1.02;font-weight:600;letter-spacing:0.03em;text-transform:uppercase;margin:14px 0 22px}
.sub-lead{font-family:var(--font-body);font-size:19px;line-height:1.7;color:#d6e2ec;max-width:760px}

/* ---------- Buttons ---------- */
.btn-gold{
  display:inline-block;background:var(--gold-warm);color:var(--blau-tief);
  font-family:var(--font-body);font-weight:700;font-size:15px;letter-spacing:.5px;
  padding:15px 30px;border-radius:4px;text-decoration:none;margin-top:28px;
  transition:transform .2s,background .2s;
}
.btn-gold:hover{transform:translateY(-2px);background:#dcd000}
.btn-gold.sm{margin-top:18px;padding:12px 24px;font-size:14px}
.btn-ghost{
  display:inline-block;border:1px solid rgba(255,255,255,.4);color:#fff;
  font-family:var(--font-body);font-weight:600;font-size:15px;
  padding:14px 28px;border-radius:4px;text-decoration:none;margin-top:28px;margin-left:12px;
  transition:background .2s,border-color .2s;
}
.btn-ghost:hover{background:rgba(255,255,255,.1);border-color:#fff}
/* Ghost-Button auf hellem Grund */
.proj-all .btn-ghost,.hl-projects .btn-ghost{border-color:var(--linie);color:var(--blau)}
.proj-all .btn-ghost:hover,.hl-projects .btn-ghost:hover{background:var(--creme)}

/* ---------- Intro-Zweispalter ---------- */
.sub-intro{padding:90px 0;background:#fff}
.sub-intro-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:60px;align-items:start}
.sub-intro h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:34px;color:var(--blau);font-weight:600;line-height:1.1}
.sub-intro p{font-family:var(--font-body);font-size:17px;line-height:1.8;color:var(--grau)}

/* ---------- Perks (Karriere) ---------- */
.perks{padding:100px 0;background:var(--creme);position:relative;clip-path:polygon(0 28px,100% 0,100% 100%,0 100%)}
.perks h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:36px;color:var(--blau);font-weight:600;margin:10px 0 44px}
.perks-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.perk{background:#fff;border:1px solid var(--linie);border-radius:8px;padding:32px 28px;box-shadow:0 6px 22px rgba(0,64,107,.05);transition:transform .25s,box-shadow .25s}
.perk:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,64,107,.10)}
.perk-ic{color:var(--gold-warm);font-size:20px}
.perk h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:22px;color:var(--blau);font-weight:500;margin:14px 0 10px}
.perk p{font-family:var(--font-body);font-size:15px;line-height:1.65;color:var(--grau)}

/* ---------- Jobs (Akkordeon nutzt .faq-item aus wordup.css) ---------- */
.jobs{padding:100px 0;background:#fff}
.job-body .job-cols{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:6px}
.job-body h4{font-family:var(--font-body);font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-text);font-weight:700;margin:0 0 14px}
.job-body ul{list-style:none;padding:0;margin:0}
.job-body li{font-family:var(--font-body);font-size:16px;line-height:1.5;color:var(--grau);padding:8px 0 8px 22px;position:relative}
.job-body li::before{content:"›";position:absolute;left:0;color:var(--gold-warm);font-weight:700}
.job-note{font-family:var(--font-body);font-size:15px;color:var(--grau-hell);font-style:italic;margin-top:22px;padding-top:18px;border-top:1px solid var(--linie)}

/* ---------- Profil-Hero (PR-Berater) ---------- */
.profile-hero{background:var(--blau);color:#fff;padding:110px 0 90px;position:relative;overflow:hidden}
/* Dezentes Signet-"W" als Hintergrund-Dekoration links unten im blauen Hero, stark abgeschnitten */
.profile-hero::after{
  content:"";
  position:absolute;
  bottom:-56px;
  left:-155px;
  width:420px;
  height:420px;
  background:url('/wp-content/uploads/wordup/signet-gold.webp') no-repeat center/contain;
  opacity:var(--sig-op);
  pointer-events:none;
  z-index:0;
}
.profile-hero .wrap{position:relative;z-index:1}
/* Auf den Leistungs-Unterseiten steht der Text allein (Solo-Variante
   ohne Foto). Dort gehoert das Signet an den RECHTEN Rand, sonst
   wirkt der Hero linkslastig. Gleicher Anschnitt, nur gespiegelt.
   Auf der PR-Berater-Seite bleibt es links, weil rechts das
   Portraetfoto steht. */
.profile-hero:has(.profile-hero-grid--solo)::after{
  left:auto;
  right:-155px;
}
.profile-hero-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:56px;align-items:start}
.profile-hero-grid > *{align-self:start}
.profile-hero-text > :first-child{margin-top:0}
.profile-hero-photo > :first-child{margin-top:0}
.profile-hero h1,.profile-hero .hero-headline{font-family:var(--font-cond);font-size:60px;line-height:1.02;font-weight:600;letter-spacing:0.03em;text-transform:uppercase;margin:14px 0 22px}
.profile-hero .kicker{color:var(--gold-warm)}
.profile-hero h1 span{color:var(--gold-warm)}
.profile-actions{display:flex;flex-wrap:wrap;align-items:center;margin-top:34px}
.profile-photo-frame{border-radius:10px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.35);aspect-ratio:4/5}
.profile-photo-frame img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block}

/* ---------- Buchbar als (Booking) ---------- */
.booking{padding:100px 0;background:#fff}
.booking h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:34px;color:var(--blau);font-weight:600;margin:10px 0 44px}
.booking-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.book-card{background:var(--creme);border-radius:8px;padding:30px 26px;position:relative;transition:transform .25s}
.book-card:hover{transform:translateY(-4px)}
.book-num{font-family:var(--font-cond);font-size:15px;color:var(--gold-text);font-weight:700}
.book-card h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:22px;color:var(--blau);font-weight:500;margin:12px 0 10px}
.book-card p{font-family:var(--font-body);font-size:15px;line-height:1.6;color:var(--grau)}

/* ---------- Lebenslauf-Timeline ---------- */
.cv{padding:100px 0;background:var(--creme)}
.cv-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:44px;align-items:start}
.cv-timeline{max-width:820px}
.cv-item{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:20px 0;border-bottom:1px solid var(--linie)}
.cv-year{font-family:var(--font-cond);font-size:17px;color:var(--gold-text);font-weight:700}
.cv-text{font-family:var(--font-body);font-size:17px;line-height:1.6;color:var(--grau)}
.member-card{background:var(--blau);border-radius:12px;padding:38px 34px;position:sticky;top:30px}
.member-lab{font-family:var(--font-body);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--gold-warm);font-weight:700;margin-bottom:12px}
.member-card h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:26px;color:#fff;font-weight:600;margin:0 0 24px}
.member-list{list-style:none;margin:0;padding:0}
.member-list li{font-family:var(--font-body);font-size:16px;line-height:1.5;color:#cfe0ec;padding:14px 0 14px 26px;border-bottom:1px solid rgba(255,255,255,.12);position:relative}
.member-list li:last-child{border-bottom:none}
.member-list li::before{content:"";position:absolute;left:0;top:20px;width:8px;height:8px;border-radius:50%;background:var(--gold-warm)}

/* ---------- Mitgliedschaften / Chips ---------- */
.memberships{padding:90px 0;background:#fff}
.memberships h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:32px;color:var(--blau);font-weight:600;margin:10px 0 30px}
.member-row{display:flex;flex-wrap:wrap;gap:14px}
.member-chip{font-family:var(--font-body);font-size:15px;color:var(--blau);background:var(--creme);border:1px solid var(--linie);border-radius:40px;padding:12px 22px}

/* ---------- Highlights: Award + Kennzahlen ---------- */
.award-line{margin-top:26px}
.award-badge{display:inline-block;background:var(--gold-warm);color:var(--blau-tief);font-family:var(--font-body);font-weight:700;font-size:14px;letter-spacing:.5px;padding:10px 20px;border-radius:40px}
.hl-stats{background:var(--blau-tief);padding:56px 0}
.hl-stats-row{display:flex;justify-content:space-around;flex-wrap:wrap;gap:30px}
.hl-stat{text-align:center}
.hl-num{display:block;font-family:var(--font-cond);font-size:52px;color:var(--gold-warm);font-weight:600;line-height:1}
.hl-lab{font-family:var(--font-body);font-size:15px;letter-spacing:1.5px;text-transform:uppercase;color:#cfe0ec}

/* ---------- Highlights: Kategorien ---------- */
.hl-cats{padding:100px 0;background:#fff}
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--linie);border:1px solid var(--linie)}
.cat-tile{background:#fff;padding:30px 26px;transition:background .25s}
.cat-tile:hover{background:var(--creme)}
.cat-tile h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:22px;color:var(--blau);font-weight:500;margin:0 0 10px}
.cat-tile p{font-family:var(--font-body);font-size:16px;line-height:1.6;color:var(--grau)}

/* ---------- Highlights: Projekt-Karten ---------- */
.hl-projects{padding:100px 0;background:var(--creme);position:relative;clip-path:polygon(0 28px,100% 0,100% 100%,0 100%)}
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.proj-card{display:block;background:#fff;border:1px solid var(--linie);border-radius:8px;padding:28px 26px;text-decoration:none;box-shadow:0 6px 22px rgba(0,64,107,.05);transition:transform .25s,box-shadow .25s}
.proj-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,64,107,.10)}
.proj-cat{font-family:var(--font-body);font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-text);font-weight:700}
.proj-card h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:22px;color:var(--blau);font-weight:500;margin:12px 0 10px;line-height:1.15}
.proj-card p{font-family:var(--font-body);font-size:16px;line-height:1.6;color:var(--grau)}
.proj-more{display:inline-block;margin-top:16px;font-family:var(--font-body);font-size:14px;font-weight:700;color:var(--gold-text)}
.proj-all{text-align:center;margin-top:40px}

/* ---------- Highlights: Kundenliste ---------- */
.clients{padding:90px 0;background:#fff}
.clients h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:30px;color:var(--blau);font-weight:600;margin:10px 0 24px}
.clients-list{font-family:var(--font-body);font-size:18px;line-height:2;color:var(--grau);max-width:900px}

/* ---------- CTA-Wrap (falls nicht schon in wordup.css) ---------- */
.cta-wrap{text-align:center}
.cta-final .btn-gold{margin-top:22px}

/* ============================================================
   MOBILE
   ============================================================ */
@media(max-width:900px){
  .sub-hero{padding:80px 0 60px;clip-path:none}
  .sub-hero h1,.profile-hero h1,.profile-hero .hero-headline{font-size:40px}
  .sub-intro-grid,.profile-hero-grid,.perks-grid,.booking-grid,.cat-grid,.proj-grid,.job-body .job-cols{grid-template-columns:1fr}
  .perks,.hl-projects{clip-path:none}
  .profile-hero-grid{gap:36px}
  .profile-photo-frame{max-width:320px;margin:0 auto}
  .cat-grid{gap:1px}
  .hl-stats-row{gap:24px}
  .hl-num{font-size:40px}
  .cv-item{grid-template-columns:1fr;gap:4px}
  .cv-year{font-size:15px}
  .cv-layout{grid-template-columns:1fr;gap:30px}
  .member-card{position:static}
  .btn-ghost{margin-left:0}
  .profile-actions{flex-direction:column;align-items:flex-start;gap:0}
}

/* ---------- Karriere: Ausbildungs-Partner-Logos ---------- */
.edu-partners{padding:90px 0;background:var(--creme)}
.edu-partners h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:32px;color:var(--blau);font-weight:600;margin:10px 0 16px}
.edu-intro{font-family:var(--font-body);font-size:17px;line-height:1.75;color:var(--grau);max-width:820px;margin-bottom:40px}
.edu-logos{display:flex;flex-wrap:wrap;align-items:center;gap:56px}
.edu-logo{display:flex;align-items:center;justify-content:center;height:90px}
.edu-logo img{max-height:90px;max-width:240px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.7;transition:filter .3s,opacity .3s}
.edu-logo:hover img{filter:grayscale(0);opacity:1}

/* ---------- Highlights: Kunden-Logo-Raster ---------- */
.client-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--linie);border:1px solid var(--linie);margin-top:20px}
.client-logo{background:#fff;display:flex;align-items:center;justify-content:center;height:120px;padding:22px}
.client-logo img{max-height:70px;max-width:150px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.62;transition:filter .3s,opacity .3s}
.client-logo:hover img{filter:grayscale(0);opacity:1}

/* ---------- PR-Berater: Foto-Galerie-Slider ---------- */
.gallery{padding:100px 0 90px;background:#fff;overflow:hidden}
.gallery-track{display:flex;gap:18px;padding:10px 32px 6px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.gallery-track::-webkit-scrollbar{display:none}
.gal-slide{flex:0 0 auto;width:440px;max-width:80vw;scroll-snap-align:center;border-radius:8px;overflow:hidden;box-shadow:0 14px 40px rgba(0,64,107,.12)}
.gal-slide img{width:100%;height:300px;object-fit:cover;display:block}
.gallery-controls{display:flex;gap:12px;justify-content:flex-end;margin-top:26px}
.gal-btn{width:52px;height:52px;border-radius:50%;border:1px solid var(--linie);background:#fff;color:var(--blau);font-size:20px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.gal-btn:hover{background:var(--blau);color:#fff;border-color:var(--blau)}

@media(max-width:900px){
  .client-grid{grid-template-columns:repeat(2,1fr)}
  .gal-slide{width:300px;height:auto}
  .gal-slide img{height:220px}
  .edu-logos{gap:32px}
}

/* ===== PR-Berater: Ergänzungen für Galerie-Unterschrift & Buttons ===== */
.gal-slide{position:relative}
.gal-cap{
  position:absolute;left:0;right:0;bottom:0;
  background:linear-gradient(180deg,rgba(0,40,66,0) 0%,rgba(0,40,66,.85) 100%);
  color:#fff;font-family:var(--font-body);font-size:14px;line-height:1.4;
  padding:30px 18px 16px;
}
.profile-hero .hero-claim{margin-bottom:20px;margin-left:0 !important;margin-right:auto !important}
/* Claim ist jetzt das <h1>. In wordup.css setzt "html body .wordup-page div"
   die normale (nicht-condensed) Schrift per !important; dieser Selektor greift
   bei einem <h1> nicht mehr. Hier wird der bisherige Wert nachgezogen, damit
   sich die Darstellung nicht aendert. */
html body .wordup-page h1.hero-claim{font-family:"ff-meta-web-pro","FF Meta Pro",system-ui,sans-serif !important}
.profile-hero .btn-primary{padding:13px 26px !important;font-size:14px !important}
.btn-pill-light{
  display:inline-block;background:transparent;color:#fff;
  border:1px solid rgba(255,255,255,.5);border-radius:40px;
  padding:14px 26px;font-family:var(--font-body);font-size:15px;font-weight:600;
  text-decoration:none;margin-left:12px;transition:background .25s,color .25s,transform .2s;
}
.btn-pill-light:hover{background:var(--gold-warm);color:var(--blau-tief);border-color:var(--gold-warm);transform:translateY(-2px)}

/* ===== Footer mit Kontaktdaten ===== */
.site-footer{background:var(--blau-tief);color:#cfe0ec}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:50px;padding:70px 32px 44px}
.footer-logo{height:34px;width:auto;margin-bottom:20px}
.footer-tag{font-family:var(--font-body);font-size:15px;line-height:1.7;color:#9db4c6;max-width:360px;margin:0 0 22px}
.footer-col h4{font-family:var(--font-cond);font-size:15px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-warm);font-weight:700;margin:0 0 18px}
.footer-col address{font-style:normal;font-family:var(--font-body);font-size:15px;line-height:1.75;color:#cfe0ec;margin-bottom:16px}
.footer-contact a{color:#fff;text-decoration:none;font-size:15px;line-height:1.9;transition:color .2s}
.footer-contact a:hover{color:var(--gold-warm)}
.footer-nav{display:flex;flex-direction:column;gap:10px}
.footer-nav a{color:#cfe0ec;text-decoration:none;font-family:var(--font-body);font-size:15px;transition:color .2s}
.footer-nav a:hover{color:var(--gold-warm)}
.foot-social{display:flex;gap:12px}
.foot-social a{width:38px;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#8fa8bb;transition:background .25s,color .25s,border-color .25s}
.foot-social a:hover{background:var(--gold-warm);color:var(--blau-tief);border-color:var(--gold-warm)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1)}
.footer-bottom-row{display:flex;justify-content:space-between;align-items:center;padding:22px 32px;font-family:var(--font-body);font-size:13px;color:#8fa8bb}
.footer-bottom .links{display:flex;gap:20px}
.footer-bottom .links a{color:#8fa8bb;text-decoration:none;transition:color .2s}
.footer-bottom .links a:hover{color:var(--gold-warm)}
@media(max-width:900px){
  .footer-grid{grid-template-columns:1fr;gap:34px;padding:50px 24px 34px}
  .footer-bottom-row{flex-direction:column;gap:12px;text-align:center}
}

/* ===== Gemeinsamer Abschluss: CTA + Trust (identisch zur Startseite) ===== */
.cta-final{background:var(--blau);color:#fff;padding:120px 0;position:relative;overflow:hidden;text-align:center}
.cta-final .sig-bg{position:absolute;width:640px;left:-220px;top:-140px;opacity:var(--sig-op-foto);pointer-events:none}
.cta-final .inner{position:relative}
.cta-final h2{font-family:var(--font-cond);font-size:44px;font-weight:400;line-height:1.2;max-width:620px;margin:0 auto;letter-spacing:0.02em}
.cta-final .rule{width:60px;height:4px;background:var(--gold);margin:30px auto}
.cta-final .contact{font-family:var(--font-body);font-size:16px;color:#b9cad6;line-height:1.9}
.cta-final .btn-gold{display:inline-block;background:var(--gold-warm);color:#3a3400;padding:16px 38px;border-radius:40px;font-family:var(--font-body);font-size:15px;font-weight:700;margin-top:34px;transition:transform .2s;text-decoration:none}
.cta-final .btn-gold:hover{transform:translateY(-2px)}
.trust{padding:70px 0 74px;background:#fff;border-top:1px solid var(--linie)}
.trust-lab{font-family:var(--font-body);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--gold);font-weight:700;text-align:center;margin-bottom:40px}
.trust-logos{display:grid !important;grid-template-columns:repeat(4,1fr) !important;align-items:center;justify-items:center;gap:44px 40px !important;max-width:760px;margin:0 auto}
.trust-logos .trust-logo:nth-child(5){grid-column:2 !important}
.trust-logos .trust-logo:nth-child(6){grid-column:3 !important}
.trust-logo{display:flex !important;align-items:center;justify-content:center;height:90px !important;width:100% !important;margin:0 !important}
.trust-logo img{max-height:64px !important;max-width:150px !important;width:auto !important;height:auto !important;object-fit:contain;filter:grayscale(1);opacity:.65;transition:filter .3s,opacity .3s}
.trust-logo:hover img{filter:grayscale(0);opacity:1}
@media(max-width:900px){
  .cta-final{padding:80px 0}
  .cta-final h2{font-size:30px}
  .trust{padding:52px 0}
  .trust-logos{grid-template-columns:repeat(2,1fr);gap:30px 24px}
  .trust-logos .trust-logo:nth-child(5){grid-column:auto}
  .trust-logos .trust-logo:nth-child(6){grid-column:auto}
  .trust-logo{height:56px}
  .trust-logo img{max-height:56px;max-width:120px;filter:grayscale(0);opacity:.85}
}

/* ===== Header/Menü (identisch zu wordup.css, damit Muster überall gleich aussehen) ===== */
header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,0.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--linie)}
.nav{display:flex;align-items:center;justify-content:space-between;height:80px}
.logo img{height:32px}
.menu{display:flex;gap:30px;align-items:center;font-family:var(--font-body) !important;font-size:15px;letter-spacing:0.2px;font-weight:600}
.menu a{font-family:var(--font-body) !important;color:var(--blau);font-weight:600;transition:color .2s;position:relative;text-decoration:none}
.menu a:hover{color:var(--gold-text)}
.menu>a::after,.menu .has-sub>a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.menu>a.cta::after,.menu>a.lang::after{display:none}
.menu>a:hover::after,.menu .has-sub:hover>a::after{transform:scaleX(1)}
.menu .cta{background:var(--blau);color:#fff;padding:11px 22px;border-radius:40px !important}
.menu .cta:hover{background:var(--blau-tief);color:#fff}
.menu .lang{font-weight:700;letter-spacing:1px;color:var(--gold-warm)}
.menu .lang:hover{color:var(--blau)}
.has-sub{position:relative}
.sub-toggle{display:flex;align-items:center;gap:6px;cursor:pointer}
.sub-toggle .caret{font-size:10px;transition:transform .25s;color:var(--gold-warm)}
.has-sub:hover .caret{transform:rotate(180deg)}
.submenu{position:absolute;top:calc(100% + 18px);left:50%;transform:translateX(-50%) translateY(10px);background:#fff;border:1px solid var(--linie);box-shadow:0 24px 60px rgba(0,64,107,.12);min-width:250px;padding:10px 0;opacity:0;visibility:hidden;transition:opacity .25s,transform .25s;z-index:60}
.has-sub::after{content:"";position:absolute;top:100%;left:0;right:0;height:24px}
.has-sub:hover .submenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.submenu a{display:block;padding:11px 24px;color:var(--grau);white-space:nowrap;position:relative}
.submenu a::before{content:"";position:absolute;left:24px;top:50%;transform:translateY(-50%) scale(0);width:6px;height:6px;border-radius:50%;background:var(--gold-warm);transition:transform .2s}
.submenu a:hover{color:var(--blau);padding-left:38px}
.submenu a:hover::before{transform:translateY(-50%) scale(1)}
.burger{display:none;font-size:26px;color:var(--blau);background:none;border:none;cursor:pointer}
@media(max-width:900px){
  .nav{height:68px}
  .menu{display:none;position:absolute;top:68px;left:0;right:0;background:#fff;flex-direction:column;gap:0;border-bottom:1px solid var(--linie);padding:8px 0;align-items:stretch}
  .menu.open{display:flex}
  .menu a{padding:14px 24px}
  .submenu{position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;border:none;min-width:0;padding:0 0 0 20px}
  .burger{display:block}
  .has-sub:hover .submenu{transform:none}
}

/* ===== Automatischen Seitentitel des Themes ausblenden ===== */
/* greift auf Seiten mit WORDUP-Inhalt; normale Seiten behalten ihren Titel */
body:has(.wordup-page:not(.wordup-post)) h1.wp-block-post-title,
body:has(.wordup-header) h1.wp-block-post-title,
body:has(.wordup-page:not(.wordup-post)) .entry-title{display:none !important;}

/* ===== Karriere: Job-Spalten in FAQ, Bewerbung, Partner ===== */
/* Stellenangebote/FAQ-Antwort-Box: linker (und rechter) Innenabstand */
.faq-a{padding-left:32px;padding-right:32px;}
.faq-a .job-cols{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin-top:18px}
.faq-a .job-list{list-style:none;padding:0;margin:0}
.faq-a .job-list li{font-family:var(--font-body);font-size:15px;line-height:1.5;color:var(--grau);padding:9px 0 9px 22px;position:relative}
.faq-a .job-list li::before{content:"";position:absolute;left:0;top:16px;width:7px;height:7px;border-radius:50%;background:var(--gold-warm)}
.faq-a h4{font-family:var(--font-body);font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-text);font-weight:700;margin:0 0 8px}
.apply{padding:100px 0;background:var(--creme)}
.apply-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:50px;align-items:start}
.apply-text h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:38px;color:var(--blau);font-weight:600;margin:10px 0 18px}
.apply-text p{font-family:var(--font-body);font-size:17px;line-height:1.7;color:var(--grau);margin-bottom:26px;max-width:560px}
.partner-card{background:var(--blau);border-radius:12px;padding:38px 34px}
.partner-card .member-lab{font-family:var(--font-body);font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--gold-warm);font-weight:700;margin-bottom:12px}
.partner-card h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:24px;color:#fff;font-weight:600;margin:0 0 20px}
.partner-logos{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin-top:26px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12)}
/* +30 %: feste Bildhoehe statt max-height, damit auch Logos wachsen,
   die von sich aus kleiner sind als die Obergrenze waren (52 -> 68 px).
   box-sizing:content-box, weil das globale border-box das Padding sonst
   von der Hoehe abziehen wuerde und das Logo unveraendert bliebe. */
.partner-logos img{box-sizing:content-box;height:68px;max-height:none;max-width:min(169px,100%);width:auto;object-fit:contain;background:#fff;padding:8px 12px;border-radius:6px}
@media(max-width:900px){
  .apply-grid{grid-template-columns:1fr;gap:30px}
  .faq-a .job-cols{grid-template-columns:1fr;gap:20px}
}

/* Karriere: 6 Perks als 3 pro Zeile (3+3) */
.booking-grid.perks-6{grid-template-columns:repeat(3,1fr) !important}
@media(max-width:900px){
  .booking-grid.perks-6{grid-template-columns:1fr !important}
}

/* ===== Highlights: Award-Badge, Kennzahlen, Projekte, Kunden ===== */
.award-frame{border-radius:14px;overflow:hidden;box-shadow:0 18px 50px rgba(0,64,107,.16);background:#fff}
.award-frame img{display:block;width:100%;height:auto}
.stats-band{background:var(--creme);padding:54px 0}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat-num{display:block;font-family:var(--font-cond);font-size:48px;color:var(--blau);font-weight:700;line-height:1}
.stat-lab{display:block;font-family:var(--font-body);font-size:15px;color:var(--gold-text);font-weight:600;letter-spacing:1px;margin-top:8px;text-transform:uppercase}
.projects{padding:100px 0;background:#fff}
.proj-filter{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:40px}
.filter-btn{font-family:var(--font-body);font-size:15px;font-weight:600;color:var(--blau);background:transparent;border:1px solid var(--linie);border-radius:40px;padding:10px 20px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.filter-btn:hover{border-color:var(--gold-warm)}
.filter-btn.is-active{background:var(--blau);color:#fff;border-color:var(--blau)}
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.proj-card{background:var(--creme);border-radius:10px;padding:28px 26px;border-top:3px solid var(--gold-warm);transition:transform .2s,box-shadow .2s}
.proj-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,64,107,.1)}
.proj-cat{font-family:var(--font-body);font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--gold-text);font-weight:700;margin-bottom:10px}
.proj-card h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:22px;color:var(--blau);font-weight:600;margin:0 0 8px}
.proj-card p{font-family:var(--font-body);font-size:16px;color:var(--grau);line-height:1.6;margin:0}
.proj-card.is-hidden{display:none}
.clients{padding:100px 0;background:var(--creme)}
.client-list{list-style:none;padding:0;margin:0;columns:3;column-gap:40px}
.client-list li{font-family:var(--font-body);font-size:14px;line-height:1.5;color:var(--grau);padding:7px 0 7px 18px;position:relative;break-inside:avoid}
.client-list li::before{content:"";position:absolute;left:0;top:14px;width:5px;height:5px;border-radius:50%;background:var(--gold-warm)}
@media(max-width:900px){
  .stats-row{grid-template-columns:repeat(2,1fr);gap:34px 24px}
  .proj-grid{grid-template-columns:1fr}
  .client-list{columns:1}
  .award-badge{padding:32px 26px}
}
@media(min-width:901px) and (max-width:1200px){
  .proj-grid{grid-template-columns:repeat(2,1fr)}
  .client-list{columns:2}
}

/* ============================================================
   NEWSROOM (eigene Seite): Query-Loop im WORDUP-Kartendesign
   ============================================================ */
/* Newsroom-Hero-Lead */
.sub-hero-lead{font-family:var(--font-body);font-size:19px;line-height:1.7;color:var(--grau);max-width:640px;margin:14px 0 0}
.news-archive{padding:80px 0 100px;background:var(--creme)}
.news-hero{padding-bottom:10px}
/* ===== NEWSROOM: nativer Abfrage-Loop im WORDUP-Kartendesign =====
   Bringt den WordPress-Block "Abfrage-Loop" (Query Loop) optisch in unser
   Newsroom-Design. Greift über .wordup-newsroom ODER wenn der Loop im
   News-Bereich steht — robust auch ohne Gruppen-Klasse. */
.wordup-newsroom .wp-block-query,
.wordup-page .news + .wp-block-query,
.wp-block-query.is-wordup-news{max-width:1180px;margin:0 auto;padding:0 40px;}

.wordup-newsroom .wp-block-post-template,
.wp-block-query.is-wordup-news .wp-block-post-template{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:28px;
  list-style:none;margin:0;padding:0;
}
.wordup-newsroom .wp-block-post,
.wp-block-query.is-wordup-news .wp-block-post{
  background:#fff;border:1px solid var(--linie);margin:0;
  transition:transform .25s,box-shadow .25s;overflow:hidden;
}
.wordup-newsroom .wp-block-post:hover,
.wp-block-query.is-wordup-news .wp-block-post:hover{
  transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,64,107,.09);
}
.wordup-newsroom .wp-block-post-featured-image,
.wp-block-query.is-wordup-news .wp-block-post-featured-image{margin:0;}
.wordup-newsroom .wp-block-post-featured-image img,
.wp-block-query.is-wordup-news .wp-block-post-featured-image img{
  width:100%;height:150px;object-fit:cover;display:block;
}
/* Fällt ein Beitrag ohne Beitragsbild an, blauer Ersatzbereich */
.wordup-newsroom .wp-block-post-featured-image:empty,
.wp-block-query.is-wordup-news .wp-block-post-featured-image:empty{
  height:150px;background:var(--blau);
}
.wordup-newsroom .wp-block-post > *:not(.wp-block-post-featured-image),
.wp-block-query.is-wordup-news .wp-block-post > *:not(.wp-block-post-featured-image){
  padding-left:26px;padding-right:26px;
}
.wordup-newsroom .wp-block-post-date,
.wp-block-query.is-wordup-news .wp-block-post-date{
  font-family:var(--font-body);font-size:12px;letter-spacing:1px;
  color:var(--gold-text);font-weight:700;text-transform:uppercase;
  margin-top:24px;
}
.wordup-newsroom .wp-block-post-date time,
.wp-block-query.is-wordup-news .wp-block-post-date time{color:var(--gold-text);}
.wordup-newsroom .wp-block-post-title,
.wp-block-query.is-wordup-news .wp-block-post-title{
  font-family:var(--font-cond);font-size:19px;line-height:1.25;
  color:var(--blau);font-weight:500;margin:10px 0 26px;
}
.wordup-newsroom .wp-block-post-title a,
.wp-block-query.is-wordup-news .wp-block-post-title a{color:var(--blau);text-decoration:none;}
.wordup-newsroom .wp-block-post-title a:hover,
.wp-block-query.is-wordup-news .wp-block-post-title a:hover{color:var(--gold-warm);}
@media(max-width:900px){
  .wordup-newsroom .wp-block-query,
  .wp-block-query.is-wordup-news{padding:0 24px;}
  .wordup-newsroom .wp-block-post-template,
  .wp-block-query.is-wordup-news .wp-block-post-template{
    display:flex !important;
    grid-template-columns:none !important;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    gap:16px;
    padding:4px 24px 16px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .wp-block-query.is-wordup-news .wp-block-post-template::-webkit-scrollbar{display:none}
  .wp-block-query.is-wordup-news .wp-block-post{
    flex:0 0 82%;
    scroll-snap-align:center;
  }
  .wp-block-query.is-wordup-news .wp-block-post-title{font-size:18px !important;line-height:1.3;margin:8px 0 20px}
  .wp-block-query.is-wordup-news .wp-block-post > *:not(.wp-block-post-featured-image){padding-left:20px;padding-right:20px}
}

/* Newsroom-Vollseite: großzügigere Karten, Auszug, Weiterlesen */
.wordup-newsroom .wp-block-post-featured-image img,
.wp-block-query.is-wordup-news .wp-block-post-featured-image img{height:160px !important}
.wordup-newsroom .wp-block-post-featured-image:empty,
.wp-block-query.is-wordup-news .wp-block-post-featured-image:empty{height:160px !important}
.wordup-newsroom .wp-block-post-excerpt,
.wp-block-query.is-wordup-news .wp-block-post-excerpt{
  font-family:var(--font-body);font-size:15px;line-height:1.6;color:var(--grau);margin:0 0 18px;
}
.wordup-newsroom .wp-block-post-excerpt__more-text,
.wp-block-query.is-wordup-news .wp-block-post-excerpt__more-text{display:block;margin-top:14px}
.wordup-newsroom .wp-block-post-excerpt a,
.wp-block-query.is-wordup-news .wp-block-post-excerpt a,
.wordup-newsroom .wp-block-read-more,
.wp-block-query.is-wordup-news .wp-block-read-more{
  font-family:var(--font-body);font-size:14px;font-weight:600;color:var(--blau);
  text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:2px;
}
.wordup-newsroom .wp-block-read-more:hover,
.wp-block-query.is-wordup-news .wp-block-read-more:hover{color:var(--gold-text)}
.wordup-newsroom .wp-block-post-title,
.wp-block-query.is-wordup-news .wp-block-post-title{margin-bottom:14px !important}
/* letzter Innen-Abstand unter dem Weiterlesen */
.wordup-newsroom .wp-block-post > *:last-child,
.wp-block-query.is-wordup-news .wp-block-post > *:last-child{padding-bottom:26px}

/* Newsroom 4er-Raster: Zwischenstufe für Tablets */
@media(min-width:901px) and (max-width:1200px){
  .wordup-newsroom .wp-block-post-template,
  .wp-block-query.is-wordup-news .wp-block-post-template{
    grid-template-columns:repeat(2,1fr) !important;
  }
}

/* ============================================================
   NEWSROOM: Block "Neueste Beiträge" (Latest Posts) im WORDUP-Design
   Alternative zum Abfrage-Loop — funktioniert ohne Konfiguration.
   ============================================================ */
.wordup-page .wp-block-latest-posts.is-grid,
.wordup-newsroom ul.wp-block-latest-posts__list,
.wordup-page ul.wp-block-latest-posts__list,
ul.wp-block-latest-posts.wp-block-latest-posts__list{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:28px !important;
  list-style:none !important;
  margin:0 auto !important;
  padding:0 !important;
  max-width:1180px;
}
.wordup-page .wp-block-latest-posts__list > li,
.wordup-page .wp-block-latest-posts__list > li,
ul.wp-block-latest-posts__list > li{
  background:#fff;border:1px solid var(--linie);margin:0 !important;
  overflow:hidden;transition:transform .25s,box-shadow .25s;
  display:flex;flex-direction:column;
}
.wordup-page .wp-block-latest-posts__list > li:hover,
.wordup-page .wp-block-latest-posts__list > li:hover{
  transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,64,107,.09);
}
/* Beitragsbild */
.wordup-page .wp-block-latest-posts__featured-image,
.wordup-page .wp-block-latest-posts__featured-image{margin:0}
.wordup-page .wp-block-latest-posts__featured-image img,
.wordup-page .wp-block-latest-posts__featured-image img{
  width:100% !important;height:160px !important;object-fit:cover;display:block;
}
/* Innen-Abstände für Textelemente */
.wordup-page .wp-block-latest-posts__list > li > a,
.wordup-page .wp-block-latest-posts__post-date,
.wordup-page .wp-block-latest-posts__post-excerpt{
  padding-left:24px;padding-right:24px;
}
/* Titel-Link */
.wordup-page .wp-block-latest-posts__list > li > a{
  font-family:var(--font-cond);font-size:19px;line-height:1.25;
  color:var(--blau);font-weight:600;text-decoration:none;
  margin-top:22px;display:block;
}
.wordup-page .wp-block-latest-posts__list > li > a:hover{color:var(--gold-warm)}
/* Datum */
.wordup-page .wp-block-latest-posts__post-date{
  font-family:var(--font-body);font-size:12px;letter-spacing:1px;
  color:var(--gold-text);font-weight:700;text-transform:uppercase;
  margin-top:10px;order:-1;
}
/* Auszug */
.wordup-page .wp-block-latest-posts__post-excerpt{
  font-family:var(--font-body);font-size:14px;line-height:1.6;
  color:var(--grau);margin:12px 0 22px;
}
@media(min-width:901px) and (max-width:1200px){
  .wordup-page ul.wp-block-latest-posts__list{grid-template-columns:repeat(2,1fr) !important}
}
@media(max-width:900px){
  .wordup-page ul.wp-block-latest-posts__list{grid-template-columns:1fr !important}
}

/* ============================================================
   NEWSROOM Latest-Posts: GARANTIE-Grid (greift auf jede Struktur)
   Zielt direkt auf die Liste im Block, unabhängig von Zusatzklassen.
   ============================================================ */
.wordup-page .wp-block-latest-posts,
.wordup-page ul.wp-block-latest-posts{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:28px !important;
  list-style:none !important;
  padding:0 !important;
  margin:0 auto !important;
  max-width:1180px;
}
.wordup-page .wp-block-latest-posts > li{
  background:#fff;border:1px solid var(--linie);border-radius:10px;overflow:hidden;
  margin:0 !important;display:flex;flex-direction:column;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.wordup-page .wp-block-latest-posts > li:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 44px rgba(0,64,107,.12);
  border-color:transparent;
}
/* Beitragsbild ganz oben, gleiche Höhe */
.wordup-page .wp-block-latest-posts > li img{
  width:100% !important;height:172px !important;object-fit:cover !important;
  display:block !important;order:-2;
}
/* Datum: kleine, goldene Metazeile in Großbuchstaben */
.wordup-page .wp-block-latest-posts__post-date{
  order:-1;
  padding:20px 24px 0 !important;
  font-family:var(--font-body) !important;
  font-size:11px !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  color:var(--gold-text) !important;
}
/* Titel: kräftig, blau, guter Zeilenabstand, klar dominant */
.wordup-page .wp-block-latest-posts > li > a{
  font-family:var(--font-cond) !important;
  font-size:21px !important;
  line-height:1.25 !important;
  color:var(--blau) !important;
  font-weight:600 !important;
  text-decoration:none !important;
  padding:8px 24px 0 !important;
  transition:color .2s;
}
.wordup-page .wp-block-latest-posts > li > a:hover{color:var(--gold-warm) !important}
/* feine Trennlinie zwischen Titel und Auszug über Abstand + Gold-Strich */
.wordup-page .wp-block-latest-posts__post-excerpt{
  padding:14px 24px 24px !important;
  margin-top:14px !important;
  position:relative;
  font-family:var(--font-body) !important;
  font-size:14px !important;
  line-height:1.65 !important;
  color:var(--grau) !important;
}
.wordup-page .wp-block-latest-posts__post-excerpt::before{
  content:"";position:absolute;top:0;left:24px;width:28px;height:2px;
  background:var(--gold);
}
/* "Weiterlesen"-Link falls aktiviert */
.wordup-page .wp-block-latest-posts__post-excerpt a{
  display:inline-block;margin-top:10px;
  font-family:var(--font-body) !important;font-size:13px !important;
  font-weight:600 !important;color:var(--blau) !important;
  text-decoration:none !important;border-bottom:2px solid var(--gold);
  padding-bottom:2px;
}
.wordup-page .wp-block-latest-posts__post-excerpt a:hover{color:var(--gold-text) !important}
@media(min-width:901px) and (max-width:1200px){
  .wordup-page .wp-block-latest-posts,
  .wordup-page ul.wp-block-latest-posts{grid-template-columns:repeat(2,1fr) !important}
}
@media(max-width:900px){
  .wordup-page .wp-block-latest-posts,
  .wordup-page ul.wp-block-latest-posts{grid-template-columns:1fr !important}
}


/* ============================================================
   NEWSROOM Latest-Posts: MAX-SPEZIFITÄT (überbietet Theme sicher)
   body-Kontext + doppelte Klassen. Setzt sich gegen Theme-Regeln durch.
   ============================================================ */
body .wordup-page ul.wp-block-latest-posts.wp-block-latest-posts li a,
body .wordup-page ul.wp-block-latest-posts li > a{
  font-family:var(--font-cond) !important;
  font-size:21px !important;
  line-height:1.25 !important;
  color:var(--blau) !important;
  font-weight:600 !important;
  text-decoration:none !important;
}
body .wordup-page ul.wp-block-latest-posts.wp-block-latest-posts li a:hover,
body .wordup-page ul.wp-block-latest-posts li > a:hover{
  color:var(--gold-warm) !important;
}
body .wordup-page ul.wp-block-latest-posts li .wp-block-latest-posts__post-date,
body .wordup-page ul.wp-block-latest-posts li time{
  font-family:var(--font-body) !important;
  font-size:11px !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  color:var(--gold-text) !important;
}
body .wordup-page ul.wp-block-latest-posts li .wp-block-latest-posts__post-excerpt{
  font-family:var(--font-body) !important;
  font-size:14px !important;
  line-height:1.65 !important;
  color:var(--grau) !important;
}

/* Falls der Titel in einer Überschrift (h2-h6) statt direktem <a> steckt */
body .wordup-page ul.wp-block-latest-posts li h2,
body .wordup-page ul.wp-block-latest-posts li h3,
body .wordup-page ul.wp-block-latest-posts li h4,
body .wordup-page ul.wp-block-latest-posts li h2 a,
body .wordup-page ul.wp-block-latest-posts li h3 a,
body .wordup-page ul.wp-block-latest-posts li h4 a{
  font-family:var(--font-cond) !important;
  font-size:21px !important;
  line-height:1.25 !important;
  color:var(--blau) !important;
  font-weight:600 !important;
  text-decoration:none !important;
  margin:0 !important;
}
/* Datum auch, falls es als <div> mit anderer Klasse oder direkt im li steht */
body .wordup-page ul.wp-block-latest-posts li > time,
body .wordup-page ul.wp-block-latest-posts li > div:not([class*="excerpt"]):not([class*="featured"]){
  font-family:var(--font-body) !important;
  font-size:11px !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  color:var(--gold-text) !important;
}

/* ============================================================
   NEWSROOM Latest-Posts: STRUKTUR-UNABHÄNGIG
   Trifft Elemente über Typ statt Klassenname. Greift immer.
   ============================================================ */
/* Jeder Link im Block = Titel (groß, blau) */
body .wordup-page .wp-block-latest-posts a{
  font-family:var(--font-cond) !important;
  font-size:21px !important;
  line-height:1.25 !important;
  color:var(--blau) !important;
  font-weight:600 !important;
  text-decoration:none !important;
}
body .wordup-page .wp-block-latest-posts a:hover{color:var(--gold-warm) !important}
/* Jedes <time> im Block = Datum (klein, gold, Versalien) */
body .wordup-page .wp-block-latest-posts time{
  display:block !important;
  font-family:var(--font-body) !important;
  font-size:11px !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  color:var(--gold-text) !important;
  margin-bottom:6px !important;
}
/* ============================================================
   NEWSROOM Latest-Posts: FINALE FARB-DURCHSETZUNG
   Datei kommt an (getestet). Theme überschreibt Farben — daher
   hier per Universalselektor jedes Element im Block treffen.
   ============================================================ */
/* Alle Titel-Links: über * a und h*-a, maximal breit */
body .wordup-page .wp-block-latest-posts li a,
body .wordup-page .wp-block-latest-posts li *,
html body .wordup-page .wp-block-latest-posts a{
  color:var(--blau) !important;
}
/* Titel-Text konkret groß + kondensiert */
body .wordup-page .wp-block-latest-posts li a,
html body .wordup-page .wp-block-latest-posts li a{
  font-family:var(--font-cond) !important;
  font-size:21px !important;
  line-height:1.25 !important;
  font-weight:600 !important;
  text-decoration:none !important;
}
body .wordup-page .wp-block-latest-posts li a:hover{color:var(--gold-warm) !important;}
/* Datum: time-Element und typische Datums-Container in Gold + klein */
body .wordup-page .wp-block-latest-posts time,
html body .wordup-page .wp-block-latest-posts time,
body .wordup-page .wp-block-latest-posts [class*="post-date"]{
  color:var(--gold-text) !important;
  font-family:var(--font-body) !important;
  font-size:11px !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  display:block !important;
}
/* Auszug grau, damit Titel klar dominiert */
body .wordup-page .wp-block-latest-posts [class*="excerpt"]{
  color:var(--grau) !important;
  font-size:14px !important;
  line-height:1.65 !important;
  font-family:var(--font-body) !important;
}
/* ============================================================
   NEWSROOM Latest-Posts: INLINE-FARBE AUSHEBELN
   Theme setzt Titelfarbe inline. -webkit-text-fill-color
   überschreibt inline color. Zusätzlich WP-Farbvariablen kippen.
   ============================================================ */
body .wordup-page .wp-block-latest-posts li a,
body .wordup-page .wp-block-latest-posts li a:visited{
  -webkit-text-fill-color:var(--blau) !important;
  color:var(--blau) !important;
  font-family:var(--font-cond) !important;
  font-size:21px !important;
  line-height:1.25 !important;
  font-weight:600 !important;
  text-decoration:none !important;
}
body .wordup-page .wp-block-latest-posts li a:hover{
  -webkit-text-fill-color:var(--gold-warm) !important;
  color:var(--gold-warm) !important;
}
/* Datum: inline-Farbe ebenso aushebeln */
body .wordup-page .wp-block-latest-posts time,
body .wordup-page .wp-block-latest-posts [class*="post-date"]{
  -webkit-text-fill-color:var(--gold-text) !important;
  color:var(--gold-text) !important;
  font-size:11px !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  font-family:var(--font-body) !important;
  display:block !important;
}
/* Auszug */
body .wordup-page .wp-block-latest-posts [class*="excerpt"]{
  -webkit-text-fill-color:var(--grau) !important;
  color:var(--grau) !important;
  font-size:14px !important;
  line-height:1.65 !important;
}

/* ============================================================
   NEWSROOM Latest-Posts: UNIVERSAL-DURCHGRIFF
   Vorherige Regeln zielten auf "li a" — dieses Element existiert
   in der echten Struktur offenbar nicht. Daher jetzt ALLES im
   Block über * treffen und per Elementtyp differenzieren.
   ============================================================ */
/* Grundfarbe für ALLES im Block */
body .wordup-page .wp-block-latest-posts *{
  -webkit-text-fill-color:var(--blau) !important;
  color:var(--blau) !important;
}
/* Überschriften / Titel egal in welchem Tag: groß + kondensiert */
body .wordup-page .wp-block-latest-posts h1,
body .wordup-page .wp-block-latest-posts h2,
body .wordup-page .wp-block-latest-posts h3,
body .wordup-page .wp-block-latest-posts h4,
body .wordup-page .wp-block-latest-posts h5,
body .wordup-page .wp-block-latest-posts strong,
body .wordup-page .wp-block-latest-posts a{
  font-family:var(--font-cond) !important;
  font-size:21px !important;
  line-height:1.28 !important;
  font-weight:600 !important;
  -webkit-text-fill-color:var(--blau) !important;
  color:var(--blau) !important;
  text-decoration:none !important;
}
/* Datum (time ODER Klassen mit "date"): klein + gold */
body .wordup-page .wp-block-latest-posts time,
body .wordup-page .wp-block-latest-posts [class*="date"]{
  font-family:var(--font-body) !important;
  font-size:11px !important;
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
  font-weight:700 !important;
  -webkit-text-fill-color:var(--gold-text) !important;
  color:var(--gold-text) !important;
  display:block !important;
}
/* Auszug: grau, normale Größe */
body .wordup-page .wp-block-latest-posts [class*="excerpt"],
body .wordup-page .wp-block-latest-posts [class*="excerpt"] *{
  font-family:var(--font-body) !important;
  font-size:14px !important;
  line-height:1.65 !important;
  font-weight:400 !important;
  -webkit-text-fill-color:var(--grau) !important;
  color:var(--grau) !important;
}


/* === Newsroom-Titel sichtbar erzwingen (übersteuert display:none) === */
html body .wp-block-query .wp-block-post-template li .wp-block-post-title,
html body .wp-block-query .wp-block-post-template .wp-block-post-title,
html body .newsroom-card .wp-block-post-title{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
  font-size:21px !important;
  line-height:1.35 !important;
  margin:0 0 12px !important;
}
html body .wp-block-query .wp-block-post-template li .wp-block-post-title a,
html body .wp-block-query .wp-block-post-template .wp-block-post-title a,
html body .newsroom-card .wp-block-post-title a{
  display:inline !important;
  visibility:visible !important;
  color:#1a1a1a !important;
  -webkit-text-fill-color:#1a1a1a !important;
  text-decoration:none !important;
}

/* === FIX: Standard-Query-Titel sichtbar (Seite /news/ nutzt KEINE newsroom-Klassen) === */
.wp-block-query .wp-block-post-template > li > .wp-block-post-title,
.wp-block-query .wp-block-post-template > li .wp-block-post-title{
  display:block !important;
}
.wp-block-query .wp-block-post-template > li .wp-block-post-title a{
  color:#1a1a1a !important;
  -webkit-text-fill-color:#1a1a1a !important;
  text-decoration:none !important;
}

/* =========================================================
   Highlights/Projekte: Logos in Kacheln, Link-Kacheln, Filter
   ========================================================= */
/* Kachel als Link: keine Unterstreichung, ganze Fläche klickbar */
.proj-card{display:flex;flex-direction:column;text-decoration:none;color:inherit;
  transition:box-shadow .25s ease,transform .25s ease;}
.proj-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,64,107,.13);}
.proj-card h3{text-decoration:none;}

/* Logo-Bereich in der Kachel */
/* +30 %: Kachelhoehe 52 -> 68 px, Bildhoehe 44 -> 57 px.
   height statt max-height, sonst bleiben kleine Logos unveraendert. */
.proj-logo{display:flex;align-items:center;justify-content:flex-start;height:68px;margin:6px 0 12px;}
.proj-logo img{height:57px;max-height:none;max-width:min(195px,100%);width:auto;object-fit:contain;
  filter:grayscale(1);opacity:.72;transition:filter .2s ease,opacity .2s ease;}
.proj-card:hover .proj-logo img{filter:grayscale(0);opacity:1;}

/* Vom Filter ausgeblendete Kacheln zuverlässig verstecken */
.proj-card[hidden]{display:none !important;}

/* Weiter-Hinweis unten rechts in jeder Kachel – sprachneutraler Pfeil
   im News-Stil (gelber Unterstrich, blaue Schrift). Per ::after erzeugt. */
.proj-card{position:relative;}
.proj-card::after{
  content:"→";
  display:inline-block;
  align-self:flex-end;
  margin-top:auto;
  padding-top:14px;
  font-family:var(--font-body);
  font-size:26px;
  font-weight:800;
  color:var(--blau);
  line-height:1;
  border-bottom:3px solid var(--gold);
  padding-bottom:4px;
  transition:color .2s ease,border-color .2s ease,transform .2s ease;
}
.proj-card:hover::after{color:var(--gold-text);border-bottom-color:var(--gold-warm);transform:translateX(3px);}


/* Hinweis, wenn eine Kategorie leer ist */
.proj-empty{text-align:center;color:var(--grau-hell);font-style:italic;padding:24px 0;}

/* ============================================================
   WORDUP – Ergänzendes CSS für EINZELNE BEITRÄGE (Single Post)
   Ans Ende von unterseiten.css anhängen.
   Nutzt dieselben Variablen wie wordup.css (--blau, --gold, ...).
   Alle Beitrags-Styles sind unter .wordup-post gekapselt, damit
   sie andere Seiten nicht beeinflussen.
   ============================================================ */

/* ---- Rahmen: dezentes Gold-Signet im Seitenhintergrund ---- */
.wordup-post{
  position:relative;
  background:#fff;
  overflow:hidden;
}
.wordup-post::before{
  content:"";
  position:absolute;
  top:320px;right:-140px;
  width:500px;height:500px;
  background-image:var(--sig);
  background-size:contain;background-repeat:no-repeat;
  opacity:var(--sig-op);pointer-events:none;z-index:0;
}
.wordup-post > *{position:relative;z-index:1;}

/* ---- Gemeinsame Lesebreiten ---- */
.post-narrow{max-width:720px;margin:0 auto;padding:0 32px;}   /* Fließtext */
.post-wide{max-width:840px;margin:0 auto;padding:0 32px;}     /* Bild, Nav */

/* ---- Kopfbereich ---- */
.post-head{padding:56px 0 0;}
.post-badge{
  display:inline-flex;align-items:center;gap:9px;
  background:var(--gold-warm);color:#3a3400;
  font-family:var(--font-body);font-size:16px;font-weight:700;
  letter-spacing:1.5px;text-transform:uppercase;
  padding:8px 20px;border-radius:40px;text-decoration:none;
  margin-bottom:20px;transition:transform .2s,background .2s;
}
.post-badge:hover{transform:translateY(-2px);background:#dcd000;color:#3a3400;}
.post-kicker{
  font-family:var(--font-mono);font-size:13px;letter-spacing:3px;
  text-transform:uppercase;color:var(--gold-text);font-weight:700;
  display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px 12px;margin-bottom:18px;
  overflow-wrap:anywhere;
}
.post-kicker::before{
  content:"";width:22px;height:22px;flex:none;margin-top:2px;
  background-image:var(--sig);background-size:contain;
  background-repeat:no-repeat;opacity:.9;
}
.wordup-post h1.post-title{
  font-family:var(--font-cond);font-size:46px;line-height:1.04;
  color:var(--blau);font-weight:600;letter-spacing:0.02em;margin:0 0 20px;
}
.post-rule{width:60px;height:4px;background:var(--gold);margin:0 0 22px;}
.post-lead{
  font-family:var(--font-body);font-size:19px;line-height:1.7;
  color:var(--grau);margin:0 0 22px;max-width:620px;
}
.post-meta{font-family:var(--font-body);font-size:14px;color:var(--grau-hell);padding-bottom:26px;}
.post-meta .m-strong{color:var(--gold-text);font-weight:700;}

/* ---- Beitragsbild ---- */
.post-figure{padding:0 0 10px;}
.post-figure .inner{
  max-width:840px;margin:0 auto;border-radius:4px;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,64,107,.16);
}
.post-figure img{width:100%;height:auto;max-height:460px;object-fit:cover;display:block;}

/* ---- Fließtext (Query-freundlich: greift auf entry-content) ---- */
.wordup-post .post-body{padding:34px 0 10px;}
.wordup-post .post-body p{
  font-family:var(--font-body);font-size:18px;line-height:1.8;
  color:var(--grau);margin:0 0 20px;
}
.wordup-post .post-body h2{
  font-family:var(--font-cond);font-size:30px;font-weight:600;
  color:var(--blau);letter-spacing:0.02em;margin:34px 0 14px;
}
.wordup-post .post-body h3{
  font-family:var(--font-cond);letter-spacing:0.02em;font-size:23px;font-weight:600;
  color:var(--blau);margin:28px 0 12px;
}
.wordup-post .post-body ul,
.wordup-post .post-body ol{margin:0 0 20px 22px;}
.wordup-post .post-body li{
  font-family:var(--font-body);font-size:18px;line-height:1.7;
  color:var(--grau);margin-bottom:8px;
}
.wordup-post .post-body a{color:var(--blau);text-decoration:underline;text-underline-offset:3px;}
.wordup-post .post-body a:hover{color:var(--gold-text);}
.wordup-post .post-body blockquote{
  font-family:var(--font-body);font-size:26px;line-height:1.35;
  color:var(--blau);font-weight:400;letter-spacing:0;
  margin:30px 0;padding:0;border:none;
}
.wordup-post .post-body blockquote::before{
  content:"„";display:block;font-size:64px;line-height:.5;height:34px;
  color:var(--gold);opacity:.4;
}
.wordup-post .post-body img{border-radius:4px;margin:24px 0;}

/* ---- Beitragsnavigation (vorheriger / nächster) ---- */
.post-nav{padding:30px 0 8px;}
.post-nav .inner{
  max-width:720px;margin:0 auto;padding:26px 0 0;
  border-top:1px solid var(--linie);
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
}
.post-nav a{
  text-decoration:none;border:1px solid var(--linie);border-radius:6px;
  padding:18px 20px;display:block;transition:transform .2s,box-shadow .2s,border-color .2s;
}
.post-nav a:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,64,107,.10);border-color:var(--gold-warm);}
.post-nav .lab{
  display:flex;align-items:center;gap:7px;
  font-family:var(--font-body);font-size:12px;letter-spacing:1px;
  text-transform:uppercase;color:var(--gold-text);font-weight:700;margin-bottom:8px;
}
.post-nav .np{text-align:right;}
.post-nav .np .lab{justify-content:flex-end;}
.post-nav .t{
  font-family:var(--font-cond);font-size:18px;line-height:1.3;
  color:var(--blau);font-weight:600;
}
/* Native WP-Post-Navigation ins gleiche Kleid stecken (falls Block genutzt) */
.wordup-post .wp-block-post-navigation-link{
  font-family:var(--font-cond);color:var(--blau);font-weight:600;
}

/* ---- Share-Leiste ---- */
.post-share{padding:4px 0 30px;}
.post-share .inner{
  max-width:720px;margin:0 auto;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.post-share .lab{font-family:var(--font-body);font-size:13px;color:var(--grau-hell);}
.post-share a{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-body);font-size:13px;font-weight:600;
  border:1px solid var(--linie);border-radius:40px;padding:7px 15px;
  color:var(--blau);text-decoration:none;transition:background .2s,color .2s,border-color .2s;
}
.post-share a:hover{background:var(--blau);color:#fff;border-color:var(--blau);}

/* ---- Responsive ---- */
@media(max-width:900px){
  .post-head{padding:40px 0 0;}
  .wordup-post h1.post-title{font-size:26px;}
  /* .post-lead bleibt mobil bei 19px – einheitlich mit .sub-lead */
  .post-narrow,.post-wide{padding:0 24px;}
  .wordup-post .post-body p,
  .wordup-post .post-body li{font-size:17px;}
  .wordup-post .post-body h2{font-size:26px;}
  .post-nav .inner{grid-template-columns:1fr;}
  .post-nav .np{text-align:left;}
  .post-nav .np .lab{justify-content:flex-start;}
  .wordup-post::before{width:280px;height:280px;right:-80px;top:260px;}
}

/* ---- Feinschliff für das dynamische Block-Markup ---- */
/* Badge sitzt in einem <p>-Wrapper – dessen Abstand neutralisieren */
.wordup-post .post-badge-wrap{margin:0 0 0;}
/* post-terms (Kicker) rendert Links – Farbe/Format erzwingen */
.wordup-post .post-kicker a{color:var(--gold-text);text-decoration:none;overflow-wrap:anywhere;}
.wordup-post .post-kicker a:hover{color:var(--gold-warm);}
/* Trennzeichen zwischen mehreren Kategorien nicht am Zeilenanfang kleben lassen */
.wordup-post .post-kicker .wp-block-post-terms__separator{display:none;}
/* Featured-Image-Block-Reset, damit .inner den Rahmen macht */
.wordup-post .post-figure .wp-block-post-featured-image{margin:0;}
.wordup-post .post-figure .wp-block-post-featured-image img{
  width:100%;height:auto;max-height:460px;object-fit:cover;display:block;
}
/* Meta-Zeile: Absätze inline halten */
.wordup-post .post-meta p{margin:0;font-size:14px;color:var(--grau-hell);}
.wordup-post .post-meta .wp-block-post-author-name{color:var(--gold-text);font-weight:700;}
.wordup-post .post-meta .wp-block-post-date{font-size:14px;color:var(--grau-hell);}

/* Native Post-Navigation ins Karten-Layout bringen */
.wordup-post .post-nav .inner{align-items:stretch;}
.wordup-post .wp-block-post-navigation-link{
  flex:1;
}
.wordup-post .wp-block-post-navigation-link a{
  display:block;border:1px solid var(--linie);border-radius:6px;padding:18px 20px;
  transition:transform .2s,box-shadow .2s,border-color .2s;
}
.wordup-post .wp-block-post-navigation-link a:hover{
  transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,64,107,.10);border-color:var(--gold-warm);
}
.wordup-post .wp-block-post-navigation-link.post-navigation-link-next{text-align:right;}
.wordup-post .wp-block-post-navigation-link a{color:var(--blau);text-decoration:none;}


/* ============================================================
   WORDUP – KORREKTUR EINZELBEITRÄGE  (v2, aufgeräumt)
   1) Titel sichtbar (überstimmt body:has(.wordup-page)…{display:none})
   2) Beitrag 30% breiter – inkl. Override der WP-constrained-Breite
   Diese Block bitte immer als LETZTES laden.
   ============================================================ */

/* ---- 0) DER EIGENTLICHE DECKEL: .wordup-post selbst ist auf 645px begrenzt.
   Diese Ebene freigeben, sonst kann KEIN Kind breiter werden. ---- */
html body .wordup-post{
  max-width:1092px !important;   /* Rahmen so breit wie das breiteste Kind */
  width:auto !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ---- 1) TITEL SICHTBAR ERZWINGEN ---- */
body:has(.wordup-post) h1.post-title,
body:has(.wordup-post) h1.wp-block-post-title.post-title,
.wordup-post h1.post-title,
.wordup-post .wp-block-post-title.post-title{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
  text-indent:0 !important;
  font-family:var(--font-cond) !important;
  font-size:46px !important;
  line-height:1.04 !important;
  color:var(--blau) !important;
  -webkit-text-fill-color:var(--blau) !important;
  font-weight:600 !important;
  letter-spacing:0.02em !important;
  margin:0 0 20px !important;
}

/* ---- 2) BEITRAG 30% BREITER (720 -> 936, 840 -> 1092) ----
   WordPress steuert die Breite im "constrained"-Layout über die Variable
   --wp--style--global--content-size UND eine generierte .wp-container-…-Regel,
   die die direkten Kinder per max-width begrenzt. Beides wird hier gekapert:
   (a) Variable auf .post-head/.post-body neu setzen,
   (b) die Container-Regel via [class*="wp-container"] > * überschreiben,
   (c) Blöcke selbst freigeben. So kann die WP-Breite nicht mehr gewinnen. */

/* (a) constrained-Variable im Beitrag hochsetzen */
html body .wordup-post .post-head,
html body .wordup-post .post-body{
  --wp--style--global--content-size:936px !important;
  --wp--style--global--wide-size:1092px !important;
  max-width:936px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* (b) + (c) die eigentlichen Inhalts-Kinder freigeben – deckt auch die
   generierte .wp-container-core-group-…-Regel ab (gleiche Struktur: > *) */
html body .wordup-post .post-head > *,
html body .wordup-post .post-body > *,
html body .wordup-post .post-head[class*="wp-container"] > *,
html body .wordup-post .post-body[class*="wp-container"] > *,
html body .wordup-post .post-head.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
html body .wordup-post .post-body.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
  max-width:936px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Bild, Navigation, Share etwas breiter als der Text */
html body .wordup-post .post-figure .inner,
html body .wordup-post .post-nav .inner,
html body .wordup-post .post-share .inner{
  max-width:1092px !important;
}

/* Falls die alten Hilfsklassen noch irgendwo greifen */
html body .wordup-post .post-narrow{ max-width:936px !important; }
html body .wordup-post .post-wide{ max-width:1092px !important; }

/* ---- 3) MOBIL: volle Breite, kleinerer Titel ---- */
@media(max-width:1000px){
  html body .wordup-post .post-head,
  html body .wordup-post .post-body,
  html body .wordup-post .post-head > *,
  html body .wordup-post .post-body > *,
  html body .wordup-post .post-head.is-layout-constrained > :where(:not(.alignfull)),
  html body .wordup-post .post-body.is-layout-constrained > :where(:not(.alignfull)),
  html body .wordup-post .post-figure .inner,
  html body .wordup-post .post-nav .inner,
  html body .wordup-post .post-share .inner{
    max-width:100% !important;
  }
  html body .wordup-post .post-head,
  html body .wordup-post .post-body{
    --wp--style--global--content-size:100% !important;
  }
  /* Seitlicher Abstand für Text/Titel/Navigation – aber NICHT fürs Bild */
  html body .wordup-post .post-head,
  html body .wordup-post .post-body,
  html body .wordup-post .post-nav .inner,
  html body .wordup-post .post-share .inner{
    padding-left:20px !important;
    padding-right:20px !important;
    box-sizing:border-box !important;
  }
  /* Bild randlos über die volle Breite */
  html body .wordup-post .post-figure,
  html body .wordup-post .post-figure .inner{
    padding-left:0 !important;
    padding-right:0 !important;
    max-width:100% !important;
    border-radius:0 !important;
  }
  /* Kleinere Überschrift auf Mobil */
  body:has(.wordup-post) h1.post-title,
  body:has(.wordup-post) h1.wp-block-post-title.post-title,
  html body .wordup-post h1.post-title,
  html body .wordup-post h1.wp-block-post-title.post-title,
  .wordup-post h1.post-title{ font-size:26px !important; line-height:1.15 !important; }
} /* Ende @media(max-width:1000px) – fehlende Klammer ergaenzt */

.hero-claim em .x-gold{
  color:var(--gold-warm) !important;
  font-weight:800 !important;
}


/* ============================================================
   KONTAKT-SEITE (zweispaltig: Text links, CF7-Formular rechts)
   Nutzt die WORDUP-Design-Tokens. Alle Formularfelder werden
   generisch über .contact-form-card gestylt, damit das
   Contact-Form-7-Markup sauber ins Layout passt.
   ============================================================ */

/* Hero */
.contact-hero{background:var(--blau);color:#fff;padding:90px 0 70px;position:relative;overflow:hidden}
.contact-hero .kicker{color:var(--gold-warm)}
.contact-hero h1{font-family:var(--font-cond);font-size:60px;line-height:1.02;font-weight:600;letter-spacing:0.03em;text-transform:uppercase;margin:14px 0 24px}
.contact-hero h1 span{color:var(--gold-warm)}

/* Zweispaltiges Raster */
.contact-main{padding:80px 0 90px;background:#fff}
.contact-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:start}

/* Einleitung – steht im blauen Hero, daher helle Schrift.
   Groesse 19px wie .sub-lead und .job-hero-lead.
   Die Linkfarbe kommt aus der globalen Regel fuer .contact-hero a. */
.contact-lead{font-family:var(--font-body);font-size:19px;line-height:1.7;color:#d6e2ec;max-width:820px;margin:0}
.contact-lead strong{color:#fff;font-weight:600}

/* Linke Spalte: Kontaktdaten */

.contact-card{background:var(--creme);border-radius:12px;padding:32px 32px;border-left:4px solid var(--gold-warm)}
.contact-card-name{font-family:var(--font-cond);font-size:22px;color:var(--blau);font-weight:600;margin-bottom:12px}
.contact-address{font-style:normal;font-family:var(--font-body);font-size:16px;line-height:1.7;color:var(--grau);margin-bottom:18px}
.contact-lines{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.contact-lines li{font-family:var(--font-body);font-size:16px}
.contact-lines a{color:var(--blau);text-decoration:none;transition:color .2s}
.contact-lines a:hover{color:var(--gold-warm)}

/* Rechte Spalte: Formularkarte */
.contact-form-col{position:relative}
.contact-form-card{background:#fff;border:1px solid var(--linie);border-radius:14px;padding:40px 38px;box-shadow:0 18px 50px rgba(0,64,107,.08)}
.contact-form-title{font-family:var(--font-cond);letter-spacing:0.02em;font-size:28px;color:var(--blau);font-weight:600;margin:0 0 26px}
.contact-form-hint{font-family:var(--font-body);font-size:15.5px;line-height:1.6;color:var(--grau-hell);margin:0 0 24px}

/* ---- Contact Form 7 Felder ins WORDUP-Design bringen ---- */
.contact-form-card .wpcf7-form p{margin:0 0 18px}
.contact-form-card label{display:block;font-family:var(--font-body);font-size:18px;font-weight:600;color:var(--blau);margin-bottom:9px}
html body .contact-form-card input[type=text],
html body .contact-form-card input[type=email],
html body .contact-form-card input[type=tel],
html body .contact-form-card input[type=url],
html body .contact-form-card input[type=date],
html body .contact-form-card input[type=number],
html body .contact-form-card input[type=search],
html body .contact-form-card select,
html body .contact-form-card textarea,
html body .contact-form-card .wpcf7-form-control:not(.wpcf7-submit):not([type=submit]):not(.wpcf7-radio):not(.wpcf7-checkbox):not(.wpcf7-acceptance){
  width:100% !important;
  font-family:var(--font-body) !important;
  font-size:20px !important;
  line-height:1.4 !important;
  color:var(--grau) !important;
  background:#fff !important;
  border:1px solid var(--linie) !important;
  border-radius:8px !important;
  padding:16px 18px !important;
  height:auto !important;
  box-sizing:border-box !important;
  transition:border-color .2s,box-shadow .2s;
}
.contact-form-card input:focus,
.contact-form-card select:focus,
.contact-form-card textarea:focus{
  outline:none;
  border-color:var(--gold-warm);
  box-shadow:0 0 0 3px rgba(200,190,0,.15);
}
html body .contact-form-card textarea{min-height:180px !important;resize:vertical}

/* Radio-/Checkbox-Gruppen (z. B. Anfrage-Typ des Multiforms) */
.contact-form-card .wpcf7-radio,
.contact-form-card .wpcf7-checkbox{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:6px}
.contact-form-card .wpcf7-list-item{margin:0}
.contact-form-card .wpcf7-list-item label{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:500;color:var(--grau);cursor:pointer}

/* Submit-Button im WORDUP-Gold */
html body .contact-form-card input[type=submit],
html body .contact-form-card .wpcf7-submit{
  display:inline-block;
  background:var(--gold-warm) !important;
  color:#2c2800 !important;
  font-family:var(--font-body) !important;
  font-size:20px !important;
  font-weight:700 !important;
  border:none !important;
  border-radius:40px !important;
  padding:19px 44px !important;
  width:auto !important;
  height:auto !important;
  margin-top:10px;
  cursor:pointer;
  transition:transform .2s,background .2s;
}
.contact-form-card input[type=submit]:hover,
.contact-form-card .wpcf7-submit:hover{transform:translateY(-2px);background:#dcd000}

/* CF7 Statusmeldungen */
.contact-form-card .wpcf7-response-output{
  font-family:var(--font-body);font-size:14px;
  border-radius:8px;padding:12px 16px !important;margin:18px 0 0 !important;
}

/* Mobile: einspaltig */
@media(max-width:900px){
  .contact-hero{padding:70px 0 52px}
  .contact-hero h1{font-size:44px}
  .contact-main{padding:56px 0 64px}
  .contact-grid{grid-template-columns:1fr;gap:38px}
  .contact-form-card{padding:30px 24px}
}

/* ============================================================
   NEWSROOM-ÜBERSICHT (Artikel-Archiv-Template)
   Weiße Karten auf blauem Grund — im Stil der Startseite.
   Gebunden an die Template-Klassen:
   .newsroom-grid / .newsroom-list / .newsroom-card /
   .newsroom-card__image|__date|__title|__excerpt / .newsroom-pagination
   ============================================================ */

/* ---- Blaue Sektion, randlos über die volle Breite ---- */
.newsroom-title{
  background:var(--blau);
  margin:0;
  padding:110px 40px 0;
  text-align:center;
  font-family:var(--font-cond);
  font-size:52px;
  font-weight:600;
  letter-spacing:0.03em;
  text-transform:uppercase;
  box-shadow:0 0 0 100vmax var(--blau);
  clip-path:inset(0 -100vmax);
  position:relative;
}
.newsroom-grid{
  background:var(--blau);
  max-width:none;
  margin:0;
  padding:56px 0 110px;
  box-shadow:0 0 0 100vmax var(--blau);
  clip-path:inset(0 -100vmax);
  position:relative;
}

/* ---- Raster: 3 Spalten, zentriert ---- */
.newsroom-grid .newsroom-list.wp-block-post-template,
.newsroom-grid .wp-block-post-template{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  gap:32px !important;
  list-style:none !important;
  max-width:1180px !important;
  margin:0 auto !important;
  padding:0 40px !important;
}
.newsroom-grid .wp-block-post-template > li,
.newsroom-grid .wp-block-post{
  margin:0 !important;
  width:auto !important;
  max-width:none !important;
}

/* ---- Karte (weißer Kasten) ---- */
.newsroom-grid .newsroom-card{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
  background:#fff !important;
  border:1px solid var(--linie) !important;
  border-radius:12px !important;
  overflow:hidden !important;
  transition:transform .25s, box-shadow .25s;
}
.newsroom-grid .newsroom-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 44px rgba(0,0,0,.28);
}

/* ---- Bild randlos oben ---- */
.newsroom-grid .newsroom-card__image{ margin:0 !important; padding:0 !important; }
.newsroom-grid .newsroom-card__image img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:16/9 !important;
  object-fit:cover !important;
  display:block !important;
}
/* Ersatzfläche, falls ein Beitrag kein Bild hat */
.newsroom-grid .newsroom-card__image:empty{
  aspect-ratio:16/9;
  background:var(--blau-tief);
}

/* ---- Innen-Abstände für Text (Bild ausgenommen) ---- */
.newsroom-grid .newsroom-card__date,
.newsroom-grid .newsroom-card__title,
.newsroom-grid .newsroom-card__excerpt{
  padding-left:26px !important;
  padding-right:26px !important;
}
.newsroom-grid .newsroom-card__date{ margin-top:24px !important; }
.newsroom-grid .newsroom-card__excerpt{ padding-bottom:28px !important; margin-top:auto !important; }

/* ---- Datum ---- */
.newsroom-grid .newsroom-card__date{
  font-family:var(--font-body);
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--gold-text);
  margin-bottom:12px;
}

/* ---- Titel (FF Meta Condensed) ----
   html body … : höhere Spezifität, damit die weiter oben stehende
   „Titel sichtbar erzwingen"-Regel (schwarz, ohne Schriftfamilie)
   nicht gewinnt. */
html body .newsroom-grid .newsroom-card__title,
html body .newsroom-grid .newsroom-card .newsroom-card__title{
  font-family:var(--font-cond) !important;
  font-size:22px !important;
  line-height:1.25 !important;
  font-weight:500 !important;
  margin:0 0 14px !important;
}
html body .newsroom-grid .newsroom-card__title a,
html body .newsroom-grid .newsroom-card .newsroom-card__title a{
  font-family:var(--font-cond) !important;
  color:var(--blau) !important;
  -webkit-text-fill-color:var(--blau) !important;
  text-decoration:none !important;
}
html body .newsroom-grid .newsroom-card__title a:hover,
html body .newsroom-grid .newsroom-card .newsroom-card__title a:hover{
  color:var(--gold-text) !important;
  -webkit-text-fill-color:var(--gold-text) !important;
}

/* ---- Exzerpt (FF Meta, max. 3 Zeilen) ---- */
.newsroom-grid .newsroom-card__excerpt{
  font-family:var(--font-body);
  font-size:15px;
  line-height:1.6;
  color:var(--grau);
  margin:0;
}
.newsroom-grid .newsroom-card__excerpt p{
  font-family:var(--font-body);
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin:0;
}

/* ---- Weiterlesen ---- */
.newsroom-grid .newsroom-card__excerpt .wp-block-post-excerpt__more-link{
  display:inline-block;
  margin-top:14px;
  font-family:var(--font-body);
  font-size:14px;
  font-weight:700;
  color:var(--blau);
  -webkit-text-fill-color:var(--blau);
  text-decoration:none;
  border-bottom:2px solid var(--gold);
  padding-bottom:2px;
}
.newsroom-grid .newsroom-card__excerpt .wp-block-post-excerpt__more-link:hover{
  color:var(--gold-text);
  -webkit-text-fill-color:var(--gold-text);
}

/* ---- Blätterfunktion (auf Blau) ---- */
.newsroom-grid .newsroom-pagination{
  max-width:1180px;
  margin:48px auto 0;
  padding:0 40px;
  gap:10px;
  font-family:var(--font-body);
  font-size:15px;
  color:#cfe0ec;
}
.newsroom-grid .newsroom-pagination a,
.newsroom-grid .newsroom-pagination .page-numbers{
  color:#cfe0ec;
  text-decoration:none;
  transition:color .2s;
}
.newsroom-grid .newsroom-pagination a:hover{ color:var(--gold-warm); }
.newsroom-grid .newsroom-pagination .wp-block-query-pagination-numbers .page-numbers.current{
  font-weight:700;
  color:var(--gold-warm);
}
.newsroom-grid .wp-block-query-no-results{
  max-width:1180px;
  margin:0 auto;
  padding:0 40px;
  color:#cfe0ec;
}

/* ---- Tablet: 2 Spalten ---- */
@media(max-width:1100px){
  .newsroom-grid .newsroom-list.wp-block-post-template,
  .newsroom-grid .wp-block-post-template{
    grid-template-columns:repeat(2,1fr) !important;
  }
}
/* ---- Mobil: 1 Spalte ---- */
@media(max-width:700px){
  .newsroom-title{ padding:70px 24px 0; font-size:36px; }
  .newsroom-grid{ padding:40px 0 70px; }
  .newsroom-grid .newsroom-list.wp-block-post-template,
  .newsroom-grid .wp-block-post-template{
    grid-template-columns:1fr !important;
    padding:0 24px !important;
    gap:24px !important;
  }
  .newsroom-grid .newsroom-pagination{ padding:0 24px; }
}

/* ============================================================
   TEXTLINKS – IMMER SICHTBAR
   Neben color wird -webkit-text-fill-color gesetzt, sonst
   gewinnt ein Gradient-Text-Effekt und der Text bleibt leer.
   Reihenfolge: 1. alle Inhaltslinks  2. dunkle Sektionen  3. Reset
   ============================================================ */

/* ---------- 1. Inhalt (heller Grund): Blau ---------- */
html body .wordup-page a,
html body .pj-content a,
html body .wu-content a,
html body .legal-content a{
  color:#00406b !important;
  -webkit-text-fill-color:#00406b !important;
  text-decoration:underline !important;
  text-decoration-color:#00406b !important;
  text-decoration-thickness:1px !important;
  text-underline-offset:3px !important;
}

/* ---------- 2. Blaue / dunkle Sektionen: Gold + unterstrichen ----------
   Gilt fuer ALLE Bereiche mit blauem Hintergrund (--blau / --blau-tief).
   Ohne diese Regel erben Links dort das Blau aus Block 1 und sind
   auf dem blauen Grund praktisch unsichtbar.
   Die Selektoren stehen jeweils doppelt: einmal mit .wordup-page
   (hoehere Spezifitaet) und einmal ohne, damit die Regel auch auf
   Seiten greift, die den Wrapper nicht setzen.
   Fuer neue blaue Bloecke genuegt die Hilfsklasse .auf-blau. */
html body .wordup-page .profile-hero a,
html body .wordup-page .profile-hero-text a,
html body .wordup-page .sub-hero a,
html body .wordup-page .cta-final a,
html body .wordup-page .contact-hero a,
html body .wordup-page .member-card a,
html body .wordup-page .partner-card a,
html body .wordup-page .hl-stats a,
html body .wordup-page .newsroom-title a,
html body .wordup-page .auf-blau a,
html body .profile-hero a,
html body .profile-hero-text a,
html body .sub-hero a,
html body .cta-final a,
html body .contact-hero a,
html body .member-card a,
html body .member-list a,
html body .partner-card a,
html body .hl-stats a,
html body .newsroom-title a,
html body .auf-blau a,
html body .pj-content .pj-stat a{
  color:#d0c400 !important;
  -webkit-text-fill-color:#d0c400 !important;
  text-decoration:underline !important;
  text-decoration-color:#d0c400 !important;
  text-decoration-thickness:1px !important;
  text-underline-offset:3px !important;
}

/* Hover in den blauen Sektionen: helleres Gold */
html body .wordup-page .profile-hero a:hover,
html body .wordup-page .profile-hero-text a:hover,
html body .wordup-page .sub-hero a:hover,
html body .wordup-page .cta-final a:hover,
html body .wordup-page .contact-hero a:hover,
html body .wordup-page .member-card a:hover,
html body .wordup-page .partner-card a:hover,
html body .wordup-page .hl-stats a:hover,
html body .wordup-page .newsroom-title a:hover,
html body .wordup-page .auf-blau a:hover,
html body .profile-hero a:hover,
html body .profile-hero-text a:hover,
html body .sub-hero a:hover,
html body .cta-final a:hover,
html body .contact-hero a:hover,
html body .member-card a:hover,
html body .member-list a:hover,
html body .partner-card a:hover,
html body .hl-stats a:hover,
html body .newsroom-title a:hover,
html body .auf-blau a:hover,
html body .pj-content .pj-stat a:hover{
  color:#e4d800 !important;
  -webkit-text-fill-color:#e4d800 !important;
  text-decoration-color:#e4d800 !important;
}

/* Ausnahmen innerhalb der blauen Sektionen:
   Buttons, Logos und Bildlinks bleiben ohne Unterstreichung. */
html body .wordup-page .member-card a.btn-gold,
html body .wordup-page .partner-card a.btn-gold,
html body .wordup-page .contact-hero a.btn-gold,
html body .member-card a.btn-gold,
html body .partner-card a.btn-gold,
html body .contact-hero a.btn-gold{
  color:#3a3400 !important;
  -webkit-text-fill-color:#3a3400 !important;
  text-decoration:none !important;
}
html body .wordup-page .member-card a.btn-ghost,
html body .wordup-page .partner-card a.btn-ghost,
html body .contact-hero a.btn-ghost,
html body .member-card a.btn-ghost,
html body .partner-card a.btn-ghost{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  text-decoration:none !important;
}
html body .wordup-page .partner-card a img,
html body .partner-card a img,
html body .wordup-page .member-card a.proj-card,
html body .member-card a.proj-card{
  text-decoration:none !important;
}

/* ---------- 3. Header, Footer, Buttons, Bildlinks ---------- */
html body .wordup-page .wordup-header a,
html body .wordup-page .wordup-header .menu a,
html body .wordup-page .wordup-header .sub-toggle{
  color:#00406b !important;
  -webkit-text-fill-color:#00406b !important;
  text-decoration:none !important;
}
html body .wordup-page .wordup-header .menu a.cta{
  color:#ffffff !important; -webkit-text-fill-color:#ffffff !important;
}
html body .wordup-page .wordup-header .submenu a{
  color:#3a3a38 !important; -webkit-text-fill-color:#3a3a38 !important;
}
html body .wordup-page .wordup-header a.lang{
  color:#000000 !important; -webkit-text-fill-color:#000000 !important;
}
html body .wordup-page .site-footer .footer-nav a{
  color:#cfe0ec !important; -webkit-text-fill-color:#cfe0ec !important;
  text-decoration:none !important;
}
html body .wordup-page .site-footer address a{
  color:#ffffff !important; -webkit-text-fill-color:#ffffff !important;
  text-decoration:none !important;
}
html body .wordup-page .site-footer .footer-bottom .links a,
html body .wordup-page .site-footer .foot-social a{
  color:#8fa8bb !important; -webkit-text-fill-color:#8fa8bb !important;
  text-decoration:none !important;
}
html body .wordup-page .cta-final a.btn-gold,
html body a.btn-gold{
  color:#3a3400 !important; -webkit-text-fill-color:#3a3400 !important;
  text-decoration:none !important;
}
html body .wordup-page .cta-final .social-icons a{
  color:#ffffff !important; -webkit-text-fill-color:#ffffff !important;
  text-decoration:none !important;
}
html body .wordup-page a.btn-primary,
html body a.btn-primary{
  color:#ffffff !important; -webkit-text-fill-color:#ffffff !important;
  text-decoration:none !important;
}
html body .wordup-page a.ref-media,
html body .wordup-page a.proj-card,
html body .wordup-page a.logo,
html body .pj-content .wp-lightbox-container a{
  text-decoration:none !important;
}

/* ---------- 4. Tastatur-Fokus ---------- */
html body .wordup-page a:focus-visible,
html body .pj-content a:focus-visible{
  outline:2px solid #d0c400 !important;
  outline-offset:2px;
}

/* ---------- ÜBERSCHRIFTEN: EINHEITLICHE SCHRIFT ----------
   Siehe gleichnamigen Block in wordup.css. Hier die
   Ueberschriften der Unterseiten. Jeweils der Selektor selbst
   und seine Kindelemente, damit ein <span> in der zweiten Zeile
   nicht in die Body-Schrift faellt.
   ---------------------------------------------------------- */
html body .sub-hero h1, html body .sub-hero h1 *,
html body .sub-intro h2, html body .sub-intro h2 *,
html body .perks h2, html body .perks h2 *,
html body .perk h3, html body .perk h3 *,
html body .profile-hero h1, html body .profile-hero h1 *,
html body .profile-hero .hero-headline, html body .profile-hero .hero-headline *,
html body .booking h2, html body .booking h2 *,
html body .book-card h3, html body .book-card h3 *,
html body .member-card h3, html body .member-card h3 *,
html body .memberships h2, html body .memberships h2 *,
html body .cat-tile h3, html body .cat-tile h3 *,
html body .proj-card h3, html body .proj-card h3 *,
html body .clients h2, html body .clients h2 *,
html body .edu-partners h2, html body .edu-partners h2 *,
html body .cta-final h2, html body .cta-final h2 *,
html body .apply-text h2, html body .apply-text h2 *,
html body .partner-card h3, html body .partner-card h3 *,
html body .contact-hero h1, html body .contact-hero h1 *,
html body .contact-form-title, html body .contact-form-title *,
html body .wordup-post h1.post-title, html body .wordup-post h1.post-title *,
html body .wordup-post .post-body h2, html body .wordup-post .post-body h2 *,
html body .wordup-post .post-body h3, html body .wordup-post .post-body h3 *,
html body .footer-col h4, html body .footer-col h4 *{
  font-family:var(--font-cond) !important;
}

/* ---------- MISSION-ÜBERSCHRIFT +20% ----------
   Siehe gleichnamigen Block in wordup.css. Hier nur zur Sicherheit,
   falls die Sektion auch auf einer Unterseite vorkommt.
   ---------------------------------------------------------- */
html body .mission .sec-head h2,
html body .mission .sec-head h2 *{
  font-size:55px !important;
}
@media(max-width:900px){
  html body .mission .sec-head h2,
  html body .mission .sec-head h2 *{
    font-size:41px !important;
  }
}

/* ---------- GELBE BUTTONS: SCHWARZE SCHRIFT ----------
   Diese Datei laedt NACH wordup.css, der Block steht deshalb hier
   am Ende und setzt sich site-weit durch. Erfasst zusaetzlich die
   Buttons und Badges, die es nur auf Unterseiten gibt.
   ---------------------------------------------------------- */
html body .btn-primary, html body a.btn-primary,
html body .wordup-page .btn-primary, html body .wordup-page a.btn-primary,
html body .btn-primary:hover, html body a.btn-primary:hover,
html body .wordup-page a.btn-primary:hover,
html body .profile-hero .btn-primary,
html body .btn-gold, html body a.btn-gold, html body .btn-gold.sm,
html body .wordup-page .btn-gold, html body .wordup-page a.btn-gold,
html body .cta-final .btn-gold, html body .cta-final a.btn-gold,
html body .wordup-page .cta-final a.btn-gold,
html body .btn-gold:hover, html body a.btn-gold:hover,
html body .member-card a.btn-gold, html body .partner-card a.btn-gold,
html body .contact-hero a.btn-gold,
html body .wordup-page .member-card a.btn-gold,
html body .wordup-page .partner-card a.btn-gold,
html body .wordup-page .contact-hero a.btn-gold,
html body .award-badge, html body a.award-badge,
html body .post-badge, html body a.post-badge,
html body .footer-nav a.lang, html body .wordup-page .footer-nav a.lang,
html body .wordup-header .lang, html body .menu a.lang,
html body .contact-form-card input[type=submit],
html body .contact-form-card .wpcf7-submit{
  color:#000 !important;
  -webkit-text-fill-color:#000 !important;
}
/* Elemente, die erst beim Hover gold werden */
html body .btn-pill-light:hover,
html body .social-icons a:hover,
html body .foot-social a:hover,
html body .site-footer .foot-social a:hover,
html body .wordup-page .news .news-top a.btn-pill:hover{
  color:#000 !important;
  -webkit-text-fill-color:#000 !important;
}

/* ---------- KOMPETENZ-KACHELN WIE DIE LEISTUNGEN AUF DER STARTSEITE ----------
   Schriftgroessen angeglichen an .serv in wordup.css:
   Nummer 15px, Ueberschrift 28px, Text 17px.
   Werte vorher: 15 / 22 / 15.
   ACHTUNG: Der Block hat VIER Spalten, die Startseite drei — die
   Kacheln sind also schmaler. Deshalb ab 1200px eine Stufe kleiner
   und ab 1000px zwei Spalten, damit nichts gequetscht wirkt.
   ------------------------------------------------------------- */
html body .book-num{
  font-size:15px;
  letter-spacing:1.2px;
}
html body .book-card h3{
  font-size:28px;
  margin:16px 0 12px;
}
html body .book-card p{
  font-size:17px;
  line-height:1.6;
}
@media(max-width:1200px){
  html body .book-card h3{font-size:25px}
  html body .book-card p{font-size:16px}
}
/* Zwischenstufe: zwei Spalten NUR zwischen 901 und 1200 px.
   Ab 900 px greift die bestehende Regel weiter oben mit einer
   Spalte — deshalb hier min-width:901px, sonst wuerde diese Regel
   sie wegen hoeherer Spezifitaet ueberschreiben. */
@media(min-width:901px) and (max-width:1200px){
  html body .booking-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  html body .booking-grid{grid-template-columns:1fr}
  html body .book-num{font-size:14px}
  html body .book-card h3{font-size:24px}
  html body .book-card p{font-size:16px}
}

/* ---------- KACHEL-RASTER: MOBILER UEBERLAUF ----------
   Grid-Elemente haben standardmaessig min-width:auto und lassen
   sich deshalb NICHT schmaler machen als ihr laengstes
   unbrechbares Wort. Woerter wie "Ludwig-Maximilians-Universität",
   "Führungskräfte-Schulungen" oder "Krisenkommunikation" haben so
   die Spalte aufgeblaeht und die ganze Seite nach rechts geschoben.

   min-width:0 hebt das auf, overflow-wrap sorgt fuer den Umbruch.
   Gilt fuer alle Kachel-Raster dieser Datei, damit derselbe Fehler
   nicht an der naechsten Stelle wieder auftritt.
   ---------------------------------------------------------- */
html body .booking-grid,
html body .perks-grid,
html body .cat-grid,
html body .proj-grid,
html body .sub-intro-grid,
html body .profile-hero-grid,
html body .booking-grid > *,
html body .perks-grid > *,
html body .cat-grid > *,
html body .proj-grid > *,
html body .sub-intro-grid > *,
html body .profile-hero-grid > *{
  min-width:0;
}
html body .book-card,
html body .book-card h3,
html body .book-card p,
html body .perk,
html body .perk h3,
html body .perk p,
html body .cat-tile,
html body .cat-tile h3,
html body .cat-tile p,
html body .proj-card,
html body .proj-card h3,
html body .proj-card p{
  overflow-wrap:break-word;
  word-break:break-word;
  hyphens:auto;
}

/* ============================================================
   STELLENSEITEN
   Detailseiten unter /stellenangebote-public-relations-muenchen/
   Aufbau wie die Kontaktseite: blauer Hero mit Positions-
   beschreibung, darunter zweispaltig Text links, Eckdaten und
   Bewerbungsformular rechts.

   Das Formular nutzt bewusst .contact-form-card aus dem Kontakt-
   Abschnitt weiter oben – ein Kartenstil fuer beide Seiten.
   ============================================================ */

/* Hero */
.job-hero{background:var(--blau);color:#fff;padding:90px 0 70px;position:relative;overflow:hidden}
.job-hero .kicker{color:var(--gold-warm)}
.job-hero h1{font-family:var(--font-cond);font-size:60px;line-height:1.02;font-weight:600;letter-spacing:0.03em;text-transform:uppercase;margin:14px 0 24px;color:#fff}
.job-hero h1 span{color:var(--gold-warm)}
.job-hero-lead{font-family:var(--font-body);font-size:19px;line-height:1.7;color:#d6e2ec;max-width:780px;margin:0 0 28px}
.job-badges{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0}
.job-badges li{font-family:var(--font-body);font-size:14px;font-weight:700;letter-spacing:.02em;color:var(--blau-tief);background:var(--gold-warm);padding:8px 17px;border-radius:40px}

/* Zweispaltiges Raster */
.job-main{padding:76px 0 90px;background:#fff}
.job-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:34px 60px;align-items:start}
.job-col-side{position:sticky;top:24px}

/* Textbloecke links */
.job-block{margin:0 0 42px}
.job-block:last-child{margin-bottom:0}
.job-block h2{font-family:var(--font-cond);letter-spacing:0.02em;font-size:30px;line-height:1.1;font-weight:600;color:var(--blau);margin:0 0 18px}
.job-block p{font-family:var(--font-body);font-size:17px;line-height:1.75;color:var(--grau);margin:0 0 14px}
.job-ul{list-style:none;margin:0;padding:0}
.job-ul li{position:relative;padding:11px 0 11px 28px;font-family:var(--font-body);font-size:17px;line-height:1.6;color:var(--grau);border-bottom:1px solid var(--linie)}
.job-ul li::before{content:"";position:absolute;left:0;top:21px;width:9px;height:9px;border-radius:50%;background:var(--gold-warm)}

/* Eckdaten-Karte rechts */
.job-facts{background:var(--creme);border-radius:12px;padding:30px;border-left:4px solid var(--gold-warm);margin-bottom:26px}
.job-facts h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:23px;font-weight:600;color:var(--blau);margin:0 0 6px}
.job-facts dl{margin:0}
.job-facts dt{font-family:var(--font-body);font-size:12.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--gold-text);font-weight:700;margin-top:17px}
.job-facts dd{margin:4px 0 0;font-family:var(--font-body);font-size:16.5px;line-height:1.5;color:var(--grau)}

/* Weitere offene Stellen */
.job-more{background:var(--creme);padding:56px 0 64px}
.job-more .kicker{color:var(--gold-text)}
.job-more h2{font-family:var(--font-cond);font-size:34px;font-weight:600;color:var(--blau);margin:0 0 26px;text-transform:uppercase;letter-spacing:0.03em}
.job-more-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.job-more-card{background:#fff;border:1px solid var(--linie);border-radius:12px;padding:26px;display:flex;flex-direction:column}
.job-more-card h3{font-family:var(--font-cond);letter-spacing:0.02em;font-size:22px;font-weight:600;color:var(--blau);margin:0 0 8px}
.job-more-card p{font-family:var(--font-body);font-size:15.5px;line-height:1.6;color:var(--grau-hell);margin:0 0 18px;flex:1}
.job-more-card a{align-self:flex-start;font-family:var(--font-body);font-size:15px;font-weight:600}
.job-back{margin-top:34px}
.job-back a{font-family:var(--font-body);font-size:16px}

/* Link von der Karriere-Uebersicht auf die Detailseite.
   Farbe mit !important, weil die globale Regel
   html body .wordup-page a {...} sonst Blau und Unterstrich erzwingt. */
.faq .job-detail-cta{margin:20px 0 0}
html body .faq .job-detail-cta a,
html body .faq .job-detail-cta a:link,
html body .faq .job-detail-cta a:visited{display:inline-block;font-family:var(--font-body);font-size:14.5px;font-weight:600;line-height:1;color:#fff !important;-webkit-text-fill-color:#fff !important;background:var(--blau);padding:10px 20px;border-radius:40px;text-decoration:none !important;border:none;transition:background .2s ease,transform .2s ease}
html body .faq .job-detail-cta a:hover,
html body .faq .job-detail-cta a:focus{background:var(--blau-tief);color:#fff !important;-webkit-text-fill-color:#fff !important;transform:translateY(-1px)}

@media(max-width:900px){
  .job-hero{padding:70px 0 52px}
  .job-hero h1{font-size:40px}
  .job-main{padding:56px 0 64px}
  .job-grid{grid-template-columns:1fr;gap:34px}
  .job-col-side{position:static}
  .job-block h2{font-size:26px}
  .job-more-grid{grid-template-columns:1fr}
}

/* ===== KARRIERESEITE EN: Keil ueber den offenen Stellen in Blau =====
   BEFUND 17.08.: Ueber der Sektion "Current job openings" stand ein
   cremefarbener Keil. Gemessen im Screenshot: Zeile 145 bis 186, links
   41 Geraetepixel hoch, nach rechts auf null auslaufend, Farbe
   durchgehend #f6f4ec.
   URSACHE: Weder .booking (weiss, unterseiten.css Zeile 126) noch .faq
   (weiss, wordup.css Zeile 344) sind creme. Die Farbe kommt vom
   SEITENHINTERGRUND: wu-service-styles.css setzt body{background:creme},
   und .faq schneidet mit clip-path:polygon(0 28px,100% 0,...) oben links
   ein Dreieck weg. Dort schaut der body durch.
   MERKE: In einem weggeschnittenen Bereich gibt es nichts einzufaerben.
   Sichtbar ist, was DAHINTER liegt. Gleicher Fehlertyp wie beim
   Newsroom-Keil auf der Startseite.
   LOESUNG: Die Sektion DARUEBER bekommt ein blaues Band nach unten.
   .faq traegt position:relative und malt deshalb ueber diesem Band.
   Sichtbar bleibt es nur dort, wo .faq weggeschnitten ist, also genau
   im Keil. Kein Layout wird verschoben, kein Element bewegt sich.
   30px statt 28px bewusst: der Ueberstand liegt vollstaendig unter der
   weissen .faq-Flaeche und deckt Subpixel-Rundung mit ab.
   GELTUNGSBEREICH: nur dort, wo .booking DIREKT von .faq gefolgt wird.
   Das ist die englische Karriereseite. .booking und .faq einzeln (etwa
   das FAQ der Startseite) bleiben unberuehrt. */
html body .booking:has(+ .faq){
  box-shadow:0 30px 0 0 var(--blau);
}