/* =========================================================
   WORDUP Projektbeispiele – Content-Bereich
   Header/Menü/CTA/Footer via Muster.
   Palette & Schrift wie ip-fuer-unternehmer.de.
   Bilder nutzen die native WordPress-Lightbox (Beim Klick vergrößern).
   ========================================================= */
:root{
  --blau-tief:#002d4a; --blau:#00406b;
  --gold:#c8be00; --gold-warm:#d0c400; --gold-text:#8a7d00;
  --grau:#3a3a38; --grau-hell:#6d6d68;
  --creme:#f6f4ec; --linie:#e5e2d6; --papier:#ffffff;
  --font-body:"ff-meta-web-pro","FF Meta Pro",system-ui,-apple-system,sans-serif;
  --font-cond:"ff-meta-web-pro-condensed","FF Meta Pro Condensed",system-ui,sans-serif;
}

/* Breite erzwingen (Theme begrenzt sonst auf 645px) */
.pj-content.alignfull,.pj-content{max-width:1200px !important;margin-left:auto !important;margin-right:auto !important;padding-left:24px;padding-right:24px;}
.pj-content > *{max-width:none;}

/* INTRO */
.pj-content .pj-intro{padding:64px 0 44px;align-items:start;}
.pj-content .pj-eyebrow{font-family:var(--font-cond);font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-text);margin:0 0 14px;font-weight:600;}
.pj-content h1.pj-h1{font-family:var(--font-cond);font-size:clamp(48px,6vw,76px);line-height:1;font-weight:600;margin:0 0 24px;color:var(--blau);letter-spacing:-1.5px;text-transform:uppercase;}
.pj-content .pj-lead p{font-size:16.5px;line-height:1.75;color:var(--grau);margin:0 0 16px;}
.pj-content .pj-lead a{color:var(--blau);text-decoration:underline;text-underline-offset:3px;}
.pj-content .pj-web a{display:inline-block;margin-top:6px;font-family:var(--font-cond);font-weight:600;font-size:15px;color:var(--blau);text-decoration:none;}

/* Aside: Logo-Karte + Stat */
.pj-content .pj-logo-card{background:var(--papier);border:1px solid var(--linie);border-radius:12px;padding:28px;text-align:center;margin:0 0 22px;}
.pj-content .pj-logo-card img{max-width:170px;width:100%;height:auto;}
.pj-content .pj-stat{background:var(--blau);border-radius:12px;padding:24px 28px;color:#fff;text-align:center;}
.pj-content .pj-stat .num{font-family:var(--font-cond);font-size:56px;font-weight:600;line-height:1;color:var(--gold-warm);}
.pj-content .pj-stat .lbl{font-family:var(--font-cond);font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin-top:4px;}

/* PROJEKTFOTO */
.pj-content .pj-photo{margin:8px 0 52px;border-radius:14px;overflow:hidden;border:1px solid var(--linie);}
.pj-content .pj-photo img{width:100%;display:block;height:auto;}

/* ZWEISPALTER */
.pj-content .pj-cols{gap:48px;padding:8px 0;}
.pj-content h2.pj-h2{font-family:var(--font-cond);font-size:clamp(26px,3vw,34px);font-weight:600;color:var(--blau);margin:0 0 20px;letter-spacing:-.4px;}
.pj-content .pj-list{list-style:none;padding:0;margin:0;}
.pj-content .pj-list li{position:relative;padding:11px 0 11px 30px;font-size:15.5px;line-height:1.5;color:var(--grau);border-bottom:1px solid var(--linie);}
.pj-content .pj-list li::before{content:"";position:absolute;left:0;top:19px;width:8px;height:8px;border-radius:50%;background:var(--gold-warm);}
.pj-content .pj-media-tags{display:flex;flex-wrap:wrap;gap:9px;}
.pj-content .pj-media-tags .pj-tag{font-family:var(--font-cond);font-size:13px;color:var(--grau);background:var(--papier);border:1px solid var(--linie);padding:7px 14px;border-radius:40px;}

/* CLIPPINGS */
.pj-content .pj-clippings{padding:52px 0 60px;}
.pj-content .pj-section-head{text-align:center;margin-bottom:34px;}
.pj-content .pj-section-head .pj-eyebrow{margin-bottom:8px;}
.pj-content h2.pj-h2-center{font-family:var(--font-cond);font-size:clamp(30px,3.6vw,44px);font-weight:600;color:var(--blau);margin:0;letter-spacing:-.5px;text-align:center;}
.pj-content .pj-grid.wp-block-group{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.pj-content .pj-clip{background:var(--papier);border:1px solid var(--linie);border-radius:12px;overflow:hidden;margin:0;}
.pj-content .pj-clip .wp-block-image{margin:0;}
.pj-content .pj-clip .wp-block-image img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:top;display:block;}
.pj-content .pj-clip figcaption{font-size:13.5px;line-height:1.5;color:var(--grau);padding:13px 16px 16px;text-align:left;}

@media(max-width:900px){
  .pj-content .pj-grid.wp-block-group{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:560px){
  .pj-content .pj-grid.wp-block-group{grid-template-columns:1fr;}
}