/* =====================================================================
   Zusätze zum pruem.org-Design (site.css + art.css) für die
   neu gestalteten Einzelseiten. Schwarz. Weiß. Rot.
   ===================================================================== */

/* ---------- Hero: Porträt rechts ---------- */
.hero.portrait,.hero.vollbild{background:var(--bk);overflow:hidden;}
.hero.portrait .pic{position:absolute;top:0;right:0;bottom:0;width:min(58vw,820px);z-index:0;margin:0;}
.hero.portrait .pic img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15) brightness(.62);}
.hero.portrait .pic::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--bk) 0,rgba(7,7,7,.55) 30%,rgba(7,7,7,0) 60%),
             linear-gradient(rgba(7,7,7,.55),rgba(7,7,7,0) 30%,rgba(7,7,7,0) 55%,var(--bk) 98%);}
/* ---------- Hero: Vollbild ---------- */
.hero.vollbild .hbg{position:absolute;inset:0;background-size:cover;background-repeat:no-repeat;filter:grayscale(1) contrast(1.15) brightness(.42);z-index:0;}
.hero.vollbild::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(7,7,7,.35),rgba(7,7,7,.15) 50%,rgba(7,7,7,.95));z-index:1;}
.hero.portrait>*:not(.pic),.hero.vollbild>*:not(.hbg){position:relative;z-index:2;}
.hero.portrait .claim,.hero.vollbild .claim{position:absolute;}
.hero .credit{position:absolute;right:var(--gut);bottom:12px;color:var(--grey);z-index:3;font-size:10.5px;}
.hero .meta a:hover{color:var(--red);}
@media(max-width:760px){
  .hero.portrait .pic{width:100%;}
  .hero.portrait .pic::after{background:linear-gradient(rgba(7,7,7,.4),rgba(7,7,7,.1) 35%,rgba(7,7,7,.9) 70%,var(--bk));}
}
/* ---------- Kopf: Marke ---------- */
.top .logo small{font-family:var(--mono);font-size:10px;letter-spacing:.14em;color:var(--grey);display:block;margin-top:5px;text-transform:uppercase;}
@media(max-width:640px){.top .logo small{display:none;}}
/* ---------- Abschnitte ---------- */
.sec .fakten{margin-top:0;}
.sec .art{padding:0;}
.gallery{padding:0;margin:30px 0 40px;}
.art .video{margin:30px 0 40px;max-width:1000px;}
.art .video video{width:100%;display:block;background:var(--bk2);}
/* Personenkarten mit Bild */
.karte img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(1) contrast(1.1);margin:-2px 0 14px;}
.karte p{font-size:16px !important;line-height:1.4;margin:0 0 8px !important;}
.karte a.mehr{border:0;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--red);}