/* ref.css — /referenzen. Nutzt hero-v8.css (Tokens, Header, .ill), s8-v8.css (CTA-Panel), ft-v8.css. Praefix rf-. */
.v6-nl[aria-current="page"]{color:var(--v6-blue-h);box-shadow:inset 0 -2px 0 var(--v6-blue)}
.rf-hero{background:var(--v6-hero);padding:clamp(64px,7vw,96px) 0 clamp(56px,6vw,80px)}
.rf-hero h1{max-width:820px;font-size:clamp(40px,3.6vw,52px);font-weight:700;line-height:1.08;letter-spacing:-.02em;color:var(--v6-ink)}
.rf-hero h1 em{font-style:normal;color:var(--v6-blue)}
.rf-hero p{max-width:760px;margin-top:18px;font-size:18px;line-height:29px;color:var(--v6-ink)}
.rf-hero p+p{margin-top:8px;color:var(--v6-ink-2)}
.rf-pr{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:28px}
.rf-pr li{display:flex;align-items:center;gap:7px;font-size:14px;line-height:20px;color:var(--v6-ink-2)}
.rf-pr svg{width:13px;height:13px;color:var(--v6-blue)}
.rf-jump{display:inline-flex;align-items:center;min-height:44px;margin-top:18px;font-size:15px;font-weight:600;color:var(--v6-blue-h)}

.rf-sec{padding:clamp(80px,8vw,112px) 0}
.rf-sec.lb{background:var(--v6-hero)}
.rf-h2{max-width:860px;font-size:40px;font-weight:700;line-height:48px;color:var(--v6-ink);text-wrap:balance}
.rf-lead{max-width:760px;margin-top:14px;font-size:18px;line-height:29px;color:var(--v6-ink-2);text-wrap:pretty}
.rf-c{text-align:center}.rf-c .rf-h2,.rf-c .rf-lead{margin-left:auto;margin-right:auto}

/* Featured Cases: abwechselnd Bild/Text */
.rf-cases{display:grid;gap:clamp(64px,7vw,104px);margin-top:clamp(52px,5.6vw,72px)}
.rf-case{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(32px,4.6vw,72px);align-items:center}
.rf-case.flip .rf-vis{order:2}
.rf-vis{position:relative;display:block;aspect-ratio:16/11;background:#fff;border:1px solid #C9D6EE;border-radius:14px;overflow:hidden;box-shadow:0 20px 44px -34px rgba(20,40,80,.5)}
.rf-vis img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.rf-vis:hover img,.rf-vis:hover .rf-ph{transform:scale(1.012)}
.rf-vis:focus-visible{outline:2px solid var(--v6-blue);outline-offset:4px}
.rf-ph{position:absolute;inset:0;display:flex;flex-direction:column;background:#F4F7FD;transition:transform .35s ease}
.rf-ph .bar{display:flex;gap:5px;height:30px;align-items:center;padding:0 14px;background:#fff;border-bottom:1px solid #E6ECF6}
.rf-ph .bar i{width:8px;height:8px;border-radius:50%;background:#D8DFEB}
.rf-ph .in{flex:1 1 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#A3B2CC}
.rf-ph .in svg{width:36px;height:36px}
.rf-ph .in b{font-size:15px;font-weight:600;color:var(--v6-ink-2)}
.rf-ph .in span{font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--v6-muted)}
.rf-meta{font-size:14px;font-weight:600;line-height:20px;color:#6B6B6B}
.rf-case h3{margin-top:8px;font-size:28px;font-weight:700;line-height:36px;color:var(--v6-ink);text-wrap:balance}
.rf-case .ph{color:var(--v6-ink-2)}
.rf-blk{margin-top:18px}
.rf-blk dt{font-size:13px;font-weight:600;line-height:18px;color:#7A8190}
.rf-blk dd{margin-top:4px;font-size:16px;line-height:26px;color:var(--v6-ink-2)}
.rf-blk dd.ph{color:#8A93A5}
.rf-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px;padding-top:18px;border-top:1px solid #E6ECF6}
.rf-facts b{display:block;font-size:12px;font-weight:600;color:#7A8190}
.rf-facts span{display:block;margin-top:3px;font-size:14px;line-height:21px;color:var(--v6-ink)}
.rf-go{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:14px;font-size:15px;font-weight:600;color:var(--v6-blue)}
.rf-go svg{width:15px;height:15px;transition:transform .2s ease}
.rf-go:hover svg{transform:translateX(3px)}
.rf-go[aria-disabled="true"]{color:var(--v6-muted);cursor:default}
.rf-more[hidden]{display:none}

/* Prozess-Wiedererkennung */
.rf-cat{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:clamp(40px,4.4vw,56px)}
.rf-cat a{display:flex;align-items:flex-start;gap:14px;height:100%;padding:18px 18px;background:#fff;border:1px solid #D2DEF3;border-radius:10px;color:var(--v6-ink);text-align:left;transition:border-color .15s ease}
.rf-cat a:hover{border-color:var(--v6-blue);color:var(--v6-ink)}
.rf-cat a:focus-visible{outline:2px solid var(--v6-blue);outline-offset:2px}
.rf-cat .ico{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:11px 13px 10px 14px;background:#DCE8FB;flex:0 0 auto}
.rf-cat .ico svg{width:24px;height:24px;fill:none;stroke:var(--v6-ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.rf-cat .ico .b{stroke:var(--v6-blue)}
.rf-cat .ico .f{fill:var(--v6-blue);stroke:none}
.rf-cat b{display:block;font-size:16px;font-weight:700;line-height:22px}
.rf-cat span{display:block;margin-top:3px;font-size:14px;line-height:21px;color:var(--v6-ink-2)}
.rf-cat .ar{margin-left:auto;align-self:center;width:16px;height:16px;color:var(--v6-blue);flex:0 0 auto}

/* Haltung */
.rf-prn{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px clamp(28px,4vw,56px);margin-top:clamp(48px,5vw,64px);text-align:left}
.rf-prn .ill{width:76px;height:76px;margin:0}
.rf-prn .ill svg{width:76px;height:76px}
.rf-prn h3{margin-top:16px;font-size:20px;font-weight:700;line-height:28px;color:var(--v6-ink)}
.rf-prn p{margin-top:6px;font-size:16px;line-height:26px;color:var(--v6-ink-2)}

/* CTA: Panel aus s8, ohne Eingabe */
.rf-cta .s8p{grid-template-columns:minmax(0,1fr) auto}
.rf-cta .s8-act{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.rf-btn{display:inline-flex;align-items:center;gap:10px;height:54px;padding:0 26px;background:#fff;border-radius:10px;font-size:16px;font-weight:600;color:var(--v6-ink);white-space:nowrap}
.rf-btn:hover{background:#EAF1FE;color:var(--v6-ink)}
.rf-btn svg{width:16px;height:16px}
.rf-sec-l{display:inline-flex;align-items:center;min-height:40px;font-size:15px;font-weight:600;color:#fff;opacity:.85}

@media(max-width:1000px){
  .rf-case,.rf-case.flip{grid-template-columns:minmax(0,1fr)}
  .rf-case.flip .rf-vis{order:0}
  .rf-cat{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rf-prn{grid-template-columns:minmax(0,1fr);max-width:560px}
  .rf-cta .s8p{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:600px){
  .rf-h2{font-size:30px;line-height:38px}
  .rf-case h3{font-size:23px;line-height:31px}
  .rf-facts{grid-template-columns:minmax(0,1fr)}
  .rf-cat{grid-template-columns:minmax(0,1fr)}
  .rf-btn{width:100%;justify-content:center}
}

/* Kontakt aufnehmen als echter Link (site-links.js) */
a.rf-sec-l:hover{color:#fff;opacity:1;text-decoration:underline}
/* Echte Aufnahme (16:10): Rahmen im selben Format, damit am Rand nichts abgeschnitten wird. */
.rf-vis:has(>img){aspect-ratio:16/10}
/* Fingerbedienung: Textaktionen im CTA-Panel mit voller Tippflaeche. */
@media(pointer:coarse){.rf-sec-l{min-height:44px}}