


.prf-hero{min-height:min(88vh, 860px); padding:clamp(40px, 6vw, 84px) 0 clamp(56px, 7vw, 96px)}
.prf-hero::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(52% 62% at 78% 38%, rgba(201,164,92,.20), transparent 72%)}
.prf-hero .mass{display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:clamp(28px, 5vw, 76px); align-items:center}
.prf-hero .hero-text{max-width:none}
.prf-hero .wortmarke{font-size:clamp(56px, 8.2vw, 118px); line-height:.86; letter-spacing:-.04em; margin-top:14px}
.prf-hero .leitsatz{max-width:none}
.prf-hero .body{margin-top:14px; font-size:18px; max-width:44ch}
.prf-hero .body, .prf-hero .hero-knoepfe{animation:bs-auftritt .9s var(--mo-aus) .42s both}
.prf-hero .hero-knoepfe{animation-delay:.54s}

.prf-buehne{position:relative; justify-self:end; width:100%; max-width:452px; padding:0 0 9% 13%}
.prf-portrait{position:relative; margin:0; aspect-ratio:4/5; overflow:hidden; border-radius:var(--r-gross);
  border:1px solid var(--line-2); background:#0f0e0c;
  box-shadow:0 0 0 1px rgba(201,164,92,.08), 0 50px 110px -40px rgba(201,164,92,.5), 0 30px 60px -30px rgba(0,0,0,.9);
  animation:prf-buehne 1.15s var(--mo-aus) .12s both}
.prf-portrait img{width:100%; height:100%; object-fit:cover; object-position:50% 18%; animation:bs-foto 1.8s var(--mo-aus) .12s both}
.prf-portrait .siegel{position:absolute; left:16px; top:16px; z-index:2}
.prf-zweitbild{position:absolute; left:0; bottom:0; z-index:3; margin:0; width:40%; aspect-ratio:2/3; overflow:hidden;
  border-radius:var(--r); border:1px solid var(--line-2); background:#0f0e0c; rotate:-3deg;
  box-shadow:0 30px 60px -22px rgba(0,0,0,.95), 0 0 0 1px rgba(201,164,92,.10);
  animation:prf-buehne 1.15s var(--mo-aus) .36s both}
.prf-zweitbild img{width:100%; height:100%; object-fit:cover}
@keyframes prf-buehne{from{opacity:0; transform:translateY(34px) scale(.965)}}
@media (max-width:860px){
  .prf-hero{min-height:0}
  .prf-hero .mass{grid-template-columns:1fr}
  .prf-buehne{justify-self:start; max-width:400px}
}


.prf-band{overflow:hidden; padding:20px 0; border-top:1px solid var(--line-n); border-bottom:1px solid var(--line-n);
  background:linear-gradient(90deg, rgba(201,164,92,.07), rgba(201,164,92,0) 30%, rgba(201,164,92,0) 70%, rgba(201,164,92,.07));
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
          mask-image:linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent)}
.prf-band-spur{display:flex; width:max-content; animation:prf-band 46s linear infinite}
.prf-band:hover .prf-band-spur{animation-play-state:paused}
.prf-band ul{display:flex; align-items:center; list-style:none; margin:0; padding:0; flex:none}
.prf-band li{display:flex; align-items:center; white-space:nowrap; text-transform:uppercase; font-weight:800;
  font-size:clamp(24px, 3.4vw, 44px); letter-spacing:-.025em; line-height:1; color:transparent;
  -webkit-text-stroke:1px rgba(235,217,168,.5)}
.prf-band li:nth-child(odd){color:var(--fg); -webkit-text-stroke:0}
.prf-band li::after{content:""; width:9px; height:9px; margin:0 clamp(20px, 3vw, 40px); background:var(--gold); rotate:45deg; flex:none}
@keyframes prf-band{to{transform:translateX(-50%)}}


.prf-weg-raster{display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr); gap:clamp(28px, 5vw, 76px); align-items:start}
.prf-klebt{position:sticky; top:112px}
.prf-klebt .kopfzeile{margin-bottom:0}
.prf-weg{position:relative; list-style:none; margin:0; padding:0 0 0 46px; display:grid; gap:14px}
.prf-weg::before, .prf-weg::after{content:""; position:absolute; left:15px; top:10px; bottom:10px; width:2px; border-radius:2px}
.prf-weg::before{background:var(--line-n)}
.prf-weg::after{background:linear-gradient(180deg, var(--gold-hell), var(--gold) 45%, var(--gold-tief)); transform-origin:50% 0}
.prf-weg li{position:relative; display:grid; grid-template-columns:44px minmax(0,1fr); gap:0 14px; align-items:center;
  padding:20px 22px; background:var(--tafel-2); border:1px solid var(--line-n); border-radius:var(--r)}
.prf-weg li > i{position:absolute; left:-38px; top:50%; width:16px; height:16px; margin-top:-8px; border-radius:50%; z-index:1;
  background:var(--ink); border:2px solid var(--gold); box-shadow:0 0 0 5px rgba(201,164,92,.10)}
.prf-weg .nr, .prf-zeilen .nr{color:var(--gold); font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  font-variant-numeric:tabular-nums}
.prf-weg b, .prf-zeilen b{display:block; font-size:18px; font-weight:650; letter-spacing:-.014em; line-height:1.3}
.prf-weg small, .prf-zeilen small{display:block; margin-top:4px; color:var(--fg-2); font-size:15px; line-height:1.55}
@media (max-width:860px){
  .prf-weg-raster{grid-template-columns:1fr}
  .prf-klebt{position:static}
}
@media (max-width:420px){
  .prf-weg{padding-left:34px}
  .prf-weg::before, .prf-weg::after{left:9px}
  .prf-weg li{grid-template-columns:30px minmax(0,1fr); gap:0 10px; padding:16px 16px}
  .prf-weg li > i{left:-32px}
}


.prf-fakten-band{position:relative; overflow:hidden; padding:clamp(72px, 9vw, 132px) 0; margin:clamp(8px, 2vw, 24px) 0 clamp(64px, 8vw, 120px)}
.prf-fakten-bild{position:absolute; inset:0; z-index:0; margin:0}
.prf-fakten-bild img{width:100%; height:100%; object-fit:cover; object-position:78% 40%; opacity:.5}
.prf-fakten-bild::after{content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, var(--ink) 0%, rgba(13,13,13,.90) 34%, rgba(13,13,13,.5) 72%, rgba(13,13,13,.62) 100%),
             linear-gradient(180deg, var(--ink) 0%, rgba(13,13,13,0) 20%, rgba(13,13,13,0) 74%, var(--ink) 100%)}
.prf-fakten-band .mass{position:relative; z-index:1}
.prf-fakten{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px}
.prf-fakten li{padding:24px 24px 26px; border-radius:var(--r); border:1px solid var(--line);
  background:rgba(14,13,11,.72); -webkit-backdrop-filter:blur(14px) saturate(140%); backdrop-filter:blur(14px) saturate(140%);
  box-shadow:inset 0 1px 0 rgba(235,217,168,.07)}
.prf-fakten .zahl{display:block; color:var(--gold); font-size:clamp(42px, 5.2vw, 66px); font-weight:700; line-height:1;
  letter-spacing:-.035em; font-variant-numeric:tabular-nums}
.prf-fakten b{display:block; margin-top:16px; font-size:17px; font-weight:650; letter-spacing:-.012em}
.prf-fakten small{display:block; margin-top:6px; color:var(--fg-2); font-size:14.5px; line-height:1.55}
@media (max-width:900px){.prf-fakten{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media (max-width:380px){.prf-fakten{grid-template-columns:1fr}}
@media (prefers-reduced-transparency:reduce){.prf-fakten li{background:var(--tafel-2); -webkit-backdrop-filter:none; backdrop-filter:none}}


.prf-zwei{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(28px, 5vw, 76px); align-items:center}
.prf-zwei .kopfzeile{margin-bottom:clamp(22px, 3vw, 34px)}
.prf-zeilen{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.prf-zeilen li{display:grid; grid-template-columns:44px minmax(0,1fr); gap:0 14px; align-items:center;
  padding:18px 22px; background:var(--tafel-2); border:1px solid var(--line-n); border-radius:var(--r)}
.prf-zeilen.benannt li{grid-template-columns:76px minmax(0,1fr)}
@media (max-width:860px){.prf-zwei{grid-template-columns:1fr}}
@media (max-width:420px){
  .prf-zeilen li{grid-template-columns:30px minmax(0,1fr); gap:0 10px; padding:16px 16px}
  .prf-zeilen.benannt li{grid-template-columns:1fr; gap:4px 0}
}


.prf-bild{margin:0; overflow:hidden; border-radius:var(--r-gross); border:1px solid var(--line-n); background:#0f0e0c}
.prf-bild img{width:100%; height:100%; object-fit:cover}
.prf-duo{display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start}
.prf-duo .prf-bild{aspect-ratio:3/4; box-shadow:0 34px 70px -34px rgba(0,0,0,.9)}
.prf-duo .prf-bild:nth-child(2){margin-top:clamp(28px, 5vw, 64px)}


.prf-bento{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr);
  grid-template-rows:repeat(3, minmax(0,1fr)); gap:14px; height:clamp(500px, 52vw, 640px)}
.prf-bento .prf-bild{min-height:0}
.prf-bento .b1{grid-column:1; grid-row:1 / 4}
.prf-bento .b2{grid-column:3; grid-row:1 / 3}
.prf-bento .b3{grid-column:3; grid-row:3}
.prf-bento .b3 img{object-position:50% 26%}
.prf-bento .s{grid-column:2; display:flex; flex-direction:column; justify-content:center; padding:20px 24px;
  background:var(--tafel-2); border:1px solid var(--line-n); border-radius:var(--r-gross)}
.prf-bento .s:nth-of-type(odd){background:linear-gradient(150deg, rgba(201,164,92,.13), rgba(201,164,92,.02) 62%), var(--tafel-2); border-color:var(--line)}
.prf-bento .s .nr{color:var(--gold); font-size:13px; font-weight:600; letter-spacing:.12em; font-variant-numeric:tabular-nums}
.prf-bento .s b{display:block; margin-top:8px; font-size:clamp(18px, 1.7vw, 21px); font-weight:650; letter-spacing:-.02em; line-height:1.2}
.prf-bento .s small{display:block; margin-top:6px; color:var(--fg-2); font-size:15px; line-height:1.5}
@media (max-width:860px){
  .prf-bento{grid-template-columns:1fr 1fr; grid-template-rows:none; height:auto}
  .prf-bento .b1{grid-column:1 / 3; grid-row:auto; aspect-ratio:4/5}
  .prf-bento .b2, .prf-bento .b3{grid-column:auto; grid-row:auto; aspect-ratio:3/4}
  .prf-bento .s{grid-column:1 / 3; padding:18px 20px}
}


.prf-heute{display:grid; grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr); gap:clamp(26px, 4.4vw, 60px); align-items:center;
  padding:clamp(22px, 4.2vw, 54px); border:1px solid var(--line-2); border-radius:var(--r-gross);
  background:radial-gradient(70% 90% at 100% 0%, rgba(201,164,92,.13), transparent 70%), var(--tafel-2); box-shadow:var(--schein)}
.prf-heute .kopfzeile{margin-bottom:clamp(20px, 3vw, 30px)}
.prf-heute .prf-zeilen li{background:rgba(8,8,7,.55)}
.prf-neben{display:flex; flex-direction:column; align-items:flex-start}
.prf-neben .prf-bild{width:100%; max-width:330px; aspect-ratio:2/3; box-shadow:0 34px 70px -34px rgba(0,0,0,.9)}
.prf-zitat{position:relative; margin-top:26px; padding-left:22px; max-width:30ch; color:var(--gold-hell);
  font-size:clamp(19px, 2vw, 24px); font-weight:600; line-height:1.36; letter-spacing:-.018em}
.prf-zitat::before{content:""; position:absolute; left:0; top:.3em; bottom:.3em; width:2px; border-radius:2px; background:var(--gold)}
@media (max-width:860px){.prf-heute{grid-template-columns:1fr}}


.prf-themen{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px}
.prf-themen li{display:flex; flex-direction:column; justify-content:flex-end; min-height:188px; padding:26px 26px 28px;
  background:var(--tafel-2); border:1px solid var(--line-n); border-radius:var(--r-gross)}
.prf-themen li:nth-child(1), .prf-themen li:nth-child(4){grid-column:span 2}
.prf-themen li:nth-child(1){background:linear-gradient(135deg, rgba(201,164,92,.20), rgba(201,164,92,.03) 58%), var(--tafel-2); border-color:var(--line-2)}
.prf-themen li:nth-child(4){background:radial-gradient(60% 120% at 100% 100%, rgba(201,164,92,.12), transparent 70%), var(--tafel-2)}
.prf-themen h3{font-size:clamp(22px, 2.5vw, 30px); letter-spacing:-.03em}
.prf-themen li:nth-child(1) h3{font-size:clamp(28px, 3.6vw, 44px)}
.prf-themen p{margin-top:10px; color:var(--fg-2); font-size:16px; line-height:1.6; max-width:46ch}
.prf-hinweis{margin-top:22px; color:var(--fg-2); font-size:15px; line-height:1.6; max-width:62ch}
@media (max-width:760px){
  .prf-themen{grid-template-columns:1fr}
  .prf-themen li:nth-child(1), .prf-themen li:nth-child(4){grid-column:auto}
  .prf-themen li{min-height:0}
}


.prf-links{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px}
.prf-links a{display:flex; align-items:center; gap:14px; min-height:84px; padding:20px 22px; color:var(--fg);
  background:var(--tafel-2); border:1px solid var(--line-n); border-radius:var(--r)}
.prf-links svg{width:22px; height:22px; flex:none; fill:none; stroke:var(--gold); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.prf-links b{display:block; font-size:16.5px; font-weight:650; letter-spacing:-.012em}
.prf-links small{display:block; color:var(--fg-2); font-size:13.5px; overflow-wrap:anywhere}
.prf-links .pfeil{margin-left:auto; color:var(--gold)}
@media (max-width:860px){.prf-links{grid-template-columns:1fr}}


.prf-schluss{position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0, 250px) minmax(0,1fr);
  gap:clamp(24px, 4.4vw, 60px); align-items:center; margin-top:clamp(20px, 3vw, 34px); padding:clamp(24px, 4.4vw, 54px);
  border:1px solid var(--line-2); border-radius:var(--r-gross);
  background:radial-gradient(60% 120% at 0% 50%, rgba(201,164,92,.16), transparent 70%), var(--tafel-2); box-shadow:var(--schein)}
.prf-schluss .prf-bild{aspect-ratio:2/3; max-width:250px; border-color:var(--line-2)}
.prf-schluss h2{font-size:clamp(30px, 4vw, 52px)}
.prf-schluss .body{margin-top:14px}
.prf-schluss .hero-knoepfe{margin-top:26px}
@media (max-width:700px){
  .prf-schluss{grid-template-columns:1fr}
  .prf-schluss .prf-bild{max-width:190px}
}


@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .prf-tief img{animation:prf-tief linear both; animation-timeline:view(); animation-range:entry 0% exit 100%}
    .prf-tief.gegen img{animation-name:prf-tief-gegen}
    .prf-fakten-bild img{animation:prf-tief-weit linear both; animation-timeline:view(); animation-range:entry 0% exit 100%}
    .prf-weg::after{animation:prf-linie linear both; animation-timeline:view(); animation-range:entry 12% exit 46%}
    .prf-zweitbild{animation:prf-buehne 1.15s var(--mo-aus) .36s both, prf-treiben linear both;
      animation-timeline:auto, scroll(root); animation-range:normal, 0 90vh}
  }
}
@keyframes prf-tief{from{transform:translateY(-5%) scale(1.12)} to{transform:translateY(5%) scale(1.12)}}
@keyframes prf-tief-gegen{from{transform:translateY(5%) scale(1.12)} to{transform:translateY(-5%) scale(1.12)}}
@keyframes prf-tief-weit{from{transform:translateY(-7%) scale(1.16)} to{transform:translateY(7%) scale(1.16)}}
@keyframes prf-linie{from{transform:scaleY(0)} to{transform:scaleY(1)}}
@keyframes prf-treiben{to{translate:0 -46px}}


@media (prefers-reduced-motion: reduce){
  .prf-band-spur{animation:none; flex-wrap:wrap; width:auto; justify-content:center}
  .prf-band ul + ul{display:none}
  .prf-band ul{flex-wrap:wrap; justify-content:center; row-gap:10px}
  .prf-portrait, .prf-portrait img, .prf-zweitbild, .prf-hero .body, .prf-hero .hero-knoepfe{animation:none}
}
