/* ============================================================
   ROCC Landingpage V3 · Design-Handoff 2026-08-01 (Claude Design)
   Namespace .rlk-* · Scope .rlkv3 (auf <main>) · Tokens V3
   Quelle: design_handoff_service_landingpage/ROCC Landingpage Vorlage.dc.html
   Diese Datei wird NUR auf V3-Seiten geladen (content/v3/<slug>.json
   vorhanden); das alte rocc-landing.css ist dort abgewählt — die
   .rlk-*-Namen hier kollidieren also nicht mit dem Altbestand.
   Fonts: selbst gehostet über den bestehenden rocc-fonts-Handle.
   Rollback: JSON-Spec löschen -> Seite rendert wieder das alte Design.
   ============================================================ */
.rlkv3{
  --canvas:#F5F4F1; --surface:#FFFFFF;
  --ink:#1C1C1A; --body:#2A2A28; --body-soft:#3A3A36; --muted:#7A7A7A; --muted-soft:#9B9A93;
  --hairline:#D9D6CE; --hairline-soft:#E5E3DE; --hairline-blue:#C7D2E6;
  --navy:#1A2A5C; --navy-deep:#141F45; --royal:#2F4E9E; --blue-light:#8FB8D9; --chip:#ECEFF7;
  --success:#1D7A4C; --warn:#9A6A11; --error:#A32D2D;
  --font-head:'Montserrat',system-ui,sans-serif;
  --font-body:'DM Sans',system-ui,-apple-system,sans-serif;
  --font-mono:'DM Mono',ui-monospace,monospace;
  --maxw:1140px; --maxw-prose:840px; --pad-x:clamp(20px,4vw,32px);
  --radius-btn:8px; --radius-card:10px; --radius-band:12px;
  --shadow-subtle:0 1px 3px rgba(26,42,92,.06);
  --shadow-card:0 14px 32px -8px rgba(26,42,92,.2);
  --shadow-deep:0 30px 70px -20px rgba(26,42,92,.35),0 10px 26px rgba(26,42,92,.12);
  --shadow-image:0 22px 48px -20px rgba(20,20,18,.28);
  font-family:var(--font-body); font-size:16px; line-height:1.55;
  background:var(--canvas); color:var(--body);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:clip;
}
.rlkv3 *,.rlkv3 *::before,.rlkv3 *::after{ box-sizing:border-box; }
.rlkv3 img{ max-width:100%; display:block; border:0; }
.rlkv3 a{ color:var(--royal); }
.rlkv3 a:hover{ color:var(--navy); }
/* Eingebettete r26-Module (Logo-Slider, Film-Grid): Button-Textfarben gegen den
   generischen Link-Hover verteidigen — sonst steht Navy-Text auf Royal-Flaeche
   (Gegencheck-Befund 01.08., Kontrast 1,8:1). Spezifitaet 0,3,1 schlaegt 0,2,1. */
.rlkv3 a.r26-btn--primary:hover{ color:#fff; }
.rlkv3 a.r26-btn--secondary:hover{ color:var(--navy); }
/* Platz fuer den Sticky-CTA (Body-Klasse setzt das Template) */
@media (max-width:759px){ body.rlkv3-body{ padding-bottom:76px; } }

/* ---------- Grundraster (Feedback 01.08.: keine Trennstriche zwischen Sektionen) ---------- */
.rlkv3 .rlk-sec{ padding:clamp(52px,7vw,92px) 0; }
.rlkv3 .rlk-wrap{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad-x); }
.rlkv3 .rlk-head{ margin:0 0 clamp(28px,4vw,40px); }
.rlkv3 .rlk-head--split{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px 32px; }

/* ---------- Typo ---------- */
.rlkv3 .rlk-kicker{
  font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:.14em;
  color:var(--royal); margin:0 0 12px;
}
.rlkv3 .rlk-sec h1,.rlkv3 .rlk-sec h2,.rlkv3 .rlk-sec h3,.rlkv3 .rlk-sec h4{
  font-family:var(--font-head); color:var(--navy); margin:0; text-wrap:balance;
}
.rlkv3 .rlk-sec h1{ font-weight:800; font-size:clamp(32px,4.4vw,56px); line-height:1.05; letter-spacing:-.022em; }
.rlkv3 .rlk-sec h2{ font-weight:700; font-size:clamp(27px,3.4vw,37px); line-height:1.14; letter-spacing:-.018em; }
.rlkv3 .rlk-sec h3{ font-weight:700; font-size:clamp(22px,2.3vw,29px); line-height:1.2; letter-spacing:-.015em; }
.rlkv3 .rlk-lead{ font-size:clamp(18px,1.6vw,20px); line-height:1.6; max-width:52ch; margin:16px 0 0; }
.rlkv3 .rlk-body{ max-width:var(--maxw-prose); }
.rlkv3 .rlk-body p{ margin:14px 0 0; line-height:1.7; color:var(--body-soft); }
.rlkv3 .rlk-small{ font-size:14.5px; color:var(--muted); }
.rlkv3 .rlk-fine{ font-size:13.5px; color:var(--muted-soft); }
.rlkv3 .rlk-mono{ font-family:var(--font-mono); }

/* ---------- Buttons ---------- */
.rlkv3 .rlk-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:600; font-size:15px; line-height:1; padding:13px 24px;
  border-radius:var(--radius-btn); border:1.5px solid transparent;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .25s ease;
}
.rlkv3 .rlk-btn--primary{ background:var(--navy); color:#fff; }
.rlkv3 .rlk-btn--primary:hover{ background:var(--navy-deep); color:#fff; box-shadow:var(--shadow-card); }
.rlkv3 .rlk-btn--ghost{ background:transparent; color:var(--navy); border-color:var(--navy); }
.rlkv3 .rlk-btn--ghost:hover{ background:var(--navy); color:#fff; }
.rlkv3 .rlk-btn--ondark{ background:#fff; color:var(--navy); }
.rlkv3 .rlk-btn--ondark:hover{ background:var(--chip); color:var(--navy); }
.rlkv3 .rlk-btnrow{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:28px; }
.rlkv3 .rlk-arrowlink{ font-weight:600; font-size:15px; text-decoration:none; display:inline-flex; align-items:center; gap:6px; }
.rlkv3 .rlk-arrowlink::after{ content:"→"; transition:transform .18s ease; }
.rlkv3 .rlk-arrowlink:hover::after{ transform:translateX(3px); }

/* ---------- Checkliste ---------- */
.rlkv3 .rlk-check{ list-style:none; margin:22px 0 0; padding:0; display:grid; gap:11px; }
.rlkv3 .rlk-check li{ position:relative; padding-left:30px; font-size:15.5px; color:var(--body); }
.rlkv3 .rlk-check li::before{
  content:""; position:absolute; left:2px; top:3px; width:16px; height:16px;
  border-radius:50%; background:var(--chip);
}
.rlkv3 .rlk-check li::after{
  content:""; position:absolute; left:7px; top:7px; width:5px; height:8px;
  border-right:2px solid var(--royal); border-bottom:2px solid var(--royal);
  transform:rotate(42deg);
}

/* ---------- Beweis-Zeile ---------- */
.rlkv3 .rlk-proof{ list-style:none; display:flex; flex-wrap:wrap; gap:20px 56px; margin:34px 0 0; padding:0; }
.rlkv3 .rlk-proof li{ font-size:15px; color:var(--muted); }
.rlkv3 .rlk-proof b{ display:block; font-family:var(--font-head); font-weight:800; font-size:clamp(30px,3vw,38px); line-height:1; color:var(--navy); letter-spacing:-.01em; margin-bottom:6px; }
.rlkv3 .rlk-proof--grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:26px; text-align:center; }
.rlkv3 .rlk-proof--grid b{ font-size:clamp(24px,2.3vw,30px); display:flex; align-items:center; justify-content:center; gap:9px; }
.rlkv3 .rlk-proof b .rlk-g{ width:24px; height:24px; }
.rlkv3 .rlk-stars{ color:var(--royal); letter-spacing:.06em; font-size:12.5px; }

/* ---------- Medien ---------- */
.rlkv3 .rlk-media{ border-radius:var(--radius-card); overflow:hidden; box-shadow:var(--shadow-image); background:var(--navy-deep); }
.rlkv3 .rlk-media img{ width:100%; height:100%; object-fit:cover; }
.rlkv3 .rlk-frame{ aspect-ratio:16/9; position:relative; }
.rlkv3 .rlk-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
/* Showreel-Frame 2,39:1 mit selbst gehostetem Video (rocc-2026.js haengt die Quelle an) */
.rlkv3 .rlk-frame--reel{ aspect-ratio:426/178; background:#000; }
.rlkv3 .rlk-frame--reel .rocc-vposter,
.rlkv3 .rlk-frame--reel video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.rlkv3 .rlk-ph{
  background:repeating-linear-gradient(-45deg,var(--chip) 0 10px,var(--surface) 10px 20px);
  border:1px solid var(--hairline-blue); border-radius:var(--radius-card);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:12.5px; color:var(--royal); text-align:center; padding:12px;
}
.rlkv3 .rlk-play{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center; text-decoration:none;
}
.rlkv3 .rlk-play span{
  width:72px; height:72px; border-radius:50%; background:rgba(255,255,255,.94);
  display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-deep);
  transition:background .18s ease,box-shadow .25s ease;
}
.rlkv3 .rlk-play span::after{
  content:""; margin-left:5px;
  border-left:18px solid var(--navy); border-top:11px solid transparent; border-bottom:11px solid transparent;
}
.rlkv3 .rlk-play:hover span{ background:#fff; }
.rlkv3 .rlk-play em{
  position:absolute; left:50%; bottom:18px; transform:translateX(-50%);
  font-style:normal; font-family:var(--font-mono); font-size:12.5px; color:rgba(255,255,255,.92);
  background:rgba(20,31,69,.66); padding:5px 12px; border-radius:20px; white-space:nowrap;
}

/* ---------- Hero ---------- */
.rlkv3 .rlk-hero{ display:grid; gap:clamp(32px,5vw,56px); align-items:center; }
@media (min-width:920px){ .rlkv3 .rlk-hero{ grid-template-columns:minmax(0,10fr) minmax(0,12fr); } }

/* Logo-Wall: seit Feedback 01.08. uebernimmt das geteilte [rocc_logo_slider]
   der Homepage (r26-Namensraum, eigenes CSS) — kein eigenes Marquee mehr. */

/* ---------- Flex-Grid ohne Loecher ---------- */
.rlkv3 .rlk-cards{ display:flex; flex-wrap:wrap; gap:16px; }
.rlkv3 .rlk-cards > *{ flex:1 1 260px; min-width:0; }
.rlkv3 .rlk-card{
  background:var(--surface); border:1px solid var(--hairline-soft); border-radius:var(--radius-card);
  padding:24px 26px; box-shadow:var(--shadow-subtle); transition:box-shadow .25s ease;
}
.rlkv3 .rlk-card:hover{ box-shadow:var(--shadow-card); }
.rlkv3 .rlk-card h3,
.rlkv3 .rlk-card h4{ font-size:18px; line-height:1.35; margin:0 0 8px; letter-spacing:-.005em; }
.rlkv3 .rlk-card p{ margin:0; font-size:15px; color:var(--body); }
.rlkv3 .rlk-card--img{ padding:0; overflow:hidden; }
.rlkv3 .rlk-cardimg{ aspect-ratio:16/10; overflow:hidden; background:var(--chip); }
.rlkv3 .rlk-cardimg img{ width:100%; height:100%; object-fit:cover; }
.rlkv3 .rlk-card--img .rlk-card-body{ padding:20px 24px 24px; }

/* ---------- Split (Gallery / Featured Film) ---------- */
.rlkv3 .rlk-split{ display:grid; gap:clamp(28px,4.5vw,56px); align-items:center; }
@media (min-width:920px){
  .rlkv3 .rlk-split{ grid-template-columns:minmax(0,6fr) minmax(0,5fr); }
  .rlkv3 .rlk-split--mediaright{ grid-template-columns:minmax(0,5fr) minmax(0,6fr); }
  .rlkv3 .rlk-split--mediaright .rlk-split-media{ order:2; }
  .rlkv3 .rlk-split--medialeft .rlk-split-media{ order:-1; }
}
.rlkv3 .rlk-pill{
  display:inline-block; background:var(--chip); color:var(--royal);
  font-weight:600; font-size:12px; padding:5px 12px; border-radius:20px; white-space:nowrap;
}
.rlkv3 .rlk-collage{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.rlkv3 .rlk-collage > *:first-child{ grid-column:1/-1; }
.rlkv3 .rlk-collage .rlk-media,.rlkv3 .rlk-collage .rlk-ph{ aspect-ratio:16/9; }
.rlkv3 .rlk-collage .rlk-media{ transition:box-shadow .35s ease; }
.rlkv3 .rlk-collage .rlk-media:hover{ box-shadow:var(--shadow-deep); }

/* ---------- Process: zentrierte Leitlinie ---------- */
.rlkv3 .rlk-flow{ position:relative; list-style:none; margin:0 auto; padding:0; max-width:980px; counter-reset:step; }
.rlkv3 .rlk-flow::before{
  content:""; position:absolute; top:10px; bottom:10px; left:23px; width:2px;
  background:linear-gradient(180deg,var(--royal),var(--hairline-blue)); transform-origin:top;
}
.rlkv3 .rlk-flow > li{ position:relative; counter-increment:step; padding:0 0 22px 66px; }
.rlkv3 .rlk-flow > li:last-child{ padding-bottom:0; }
.rlkv3 .rlk-flow-dot{
  position:absolute; left:0; top:2px; width:48px; height:48px; border-radius:50%;
  background:var(--navy); color:#fff; font-family:var(--font-mono); font-size:15px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 0 7px var(--canvas),var(--shadow-card);
}
.rlkv3 .rlk-flow-dot::before{ content:counter(step,decimal-leading-zero); }
.rlkv3 .rlk-flow-card{
  background:var(--surface); border:1px solid var(--hairline-soft); border-radius:var(--radius-card);
  padding:20px 24px 22px; box-shadow:var(--shadow-subtle);
}
.rlkv3 .rlk-flow-card h3{ font-size:clamp(19px,1.8vw,23px); }
.rlkv3 .rlk-flow-card p{ margin:8px 0 0; color:var(--body-soft); font-size:15.5px; }
.rlkv3 .rlk-step-top{ display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px; }
.rlkv3 .rlk-step-dur{ font-family:var(--font-mono); font-size:13px; color:var(--muted); }
@media (min-width:920px){
  .rlkv3 .rlk-flow::before{ left:50%; margin-left:-1px; }
  .rlkv3 .rlk-flow > li{ display:grid; grid-template-columns:1fr 104px 1fr; align-items:start; padding:0 0 20px; }
  .rlkv3 .rlk-flow-dot{ position:static; grid-column:2; grid-row:1; margin:8px auto 0; }
  .rlkv3 .rlk-flow-card{ grid-column:1; grid-row:1; }
  .rlkv3 .rlk-flow > li:nth-child(odd) .rlk-flow-card{ text-align:right; }
  .rlkv3 .rlk-flow > li:nth-child(odd) .rlk-step-top{ justify-content:flex-start; flex-direction:row-reverse; }
  .rlkv3 .rlk-flow > li:nth-child(even) .rlk-flow-card{ grid-column:3; }
}

/* ---------- Preis-Stufen ---------- */
.rlkv3 .rlk-tiers{ display:grid; grid-template-columns:1fr; gap:16px; }
@media (min-width:760px){ .rlkv3 .rlk-tiers{ grid-template-columns:repeat(3,1fr); } }
.rlkv3 .rlk-tier{
  background:var(--surface); border:1px solid var(--hairline-soft); border-radius:var(--radius-card);
  padding:24px 24px 26px; box-shadow:var(--shadow-subtle);
  display:flex; flex-direction:column; transition:box-shadow .25s ease;
}
.rlkv3 .rlk-tier:hover{ box-shadow:var(--shadow-card); }
.rlkv3 .rlk-tier--mid{ border-color:var(--hairline-blue); box-shadow:var(--shadow-card); }
.rlkv3 .rlk-tier-tag{ align-self:flex-start; margin-bottom:14px; }
.rlkv3 .rlk-tier-name{ font-family:var(--font-head); font-weight:700; font-size:18px; color:var(--navy); }
.rlkv3 .rlk-tier-price{ font-family:var(--font-mono); font-weight:500; font-size:clamp(21px,2.1vw,26px); color:var(--navy); line-height:1.15; margin-top:10px; }
.rlkv3 .rlk-tier-for{ font-size:14px; color:var(--muted); margin-top:8px; }
.rlkv3 .rlk-tier .rlk-check{ margin-top:18px; }
.rlkv3 .rlk-tier .rlk-check li{ font-size:14.5px; }

/* ---------- Stand-Datum, Google-Wertung, Rechner-Teaser ---------- */
.rlkv3 .rlk-stamp{
  display:inline-flex; align-items:center; gap:8px; margin:0;
  font-family:var(--font-mono); font-size:12.5px; color:var(--muted-soft);
}
.rlkv3 .rlk-stamp::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--success); flex:0 0 auto; }
.rlkv3 .rlk-rating{
  display:flex; align-items:center; gap:16px; text-decoration:none;
  background:var(--surface); border:1px solid var(--hairline-soft); border-radius:var(--radius-card);
  padding:16px 22px; box-shadow:var(--shadow-subtle); transition:box-shadow .25s ease;
}
.rlkv3 .rlk-rating:hover{ box-shadow:var(--shadow-card); }
.rlkv3 .rlk-rating-n{ font-family:var(--font-head); font-weight:800; font-size:30px; line-height:1; color:var(--navy); }
.rlkv3 .rlk-rating .rlk-stars{ font-size:15px; display:block; }
.rlkv3 .rlk-rating-txt{ font-size:14px; color:var(--muted); margin-top:3px; }
.rlkv3 .rlk-teaser{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 26px;
  background:var(--chip); border:1px solid var(--hairline-blue); border-radius:var(--radius-card);
  padding:18px 22px; text-decoration:none;
}
.rlkv3 .rlk-teaser-t{ font-family:var(--font-head); font-weight:700; font-size:17px; color:var(--navy); }
.rlkv3 .rlk-teaser-s{ font-size:14px; color:var(--body-soft); margin-top:3px; }
.rlkv3 .rlk-rating-g{ width:26px; height:26px; flex:0 0 auto; }
.rlkv3 .rlk-after{ display:grid; gap:16px; margin-top:16px; }
@media (min-width:920px){ .rlkv3 .rlk-after--two{ grid-template-columns:minmax(0,4fr) minmax(0,7fr); align-items:stretch; } }

/* ---------- Reel: mobil snappen, Desktop Raster ---------- */
.rlkv3 .rlk-reel{
  display:grid; grid-auto-flow:column; grid-auto-columns:min(78%,320px);
  gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-left:var(--pad-x);
  padding:4px var(--pad-x) 26px; margin:0 calc(-1 * var(--pad-x));
}
.rlkv3 .rlk-reel > *{ scroll-snap-align:start; }
@media (min-width:920px){
  .rlkv3 .rlk-reel{ grid-auto-flow:row; grid-auto-columns:unset; grid-template-columns:repeat(3,1fr); gap:22px; overflow:visible; padding:0; margin:0; }
}
.rlkv3 .rlk-film{ text-decoration:none; display:block; }
.rlkv3 .rlk-film .rlk-media{ aspect-ratio:16/9; transition:box-shadow .25s ease; }
.rlkv3 .rlk-film:hover .rlk-media{ box-shadow:var(--shadow-deep); }
.rlkv3 .rlk-film-body{ display:flex; align-items:center; gap:10px; margin-top:14px; }
.rlkv3 .rlk-film-title{ font-weight:600; font-size:15px; color:var(--navy); line-height:1.35; }
.rlkv3 .rlk-film:hover .rlk-film-title{ color:var(--royal); }
.rlkv3 .rlk-ovl{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end;
  gap:5px; padding:22px 24px;
  background:linear-gradient(180deg,rgba(20,31,69,0) 42%,rgba(20,31,69,.8));
}
.rlkv3 .rlk-ovl .rlk-pill{ position:absolute; top:16px; left:16px; }
.rlkv3 .rlk-ovl-meta{ font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.78); }
.rlkv3 .rlk-ovl-title{ font-family:var(--font-head); font-weight:700; font-size:clamp(18px,1.9vw,23px); line-height:1.25; color:#fff; letter-spacing:-.01em; text-wrap:balance; }
.rlkv3 .rlk-media img.rlk-ovl-logo,
.rlkv3 .rlk-ovl-logo{
  position:absolute; top:16px; right:16px; height:38px; width:auto; max-width:150px; object-fit:contain;
  background:#fff; border-radius:6px; padding:7px 9px; box-shadow:var(--shadow-subtle);
}
.rlkv3 .rlk-ovl-logo--txt{
  display:inline-flex; align-items:center; height:38px; max-width:none; white-space:nowrap; padding:0 12px;
  font-family:var(--font-head); font-weight:800; font-size:11.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--navy);
}

/* ---------- Case Study ---------- */
/* Keine Karte: Bildtafel und Text stehen direkt auf dem Papier-Hintergrund.
   minmax(0,1fr)/min-width:0 verhindern, dass die Bild-Eigenbreite die Spalte aufsprengt. */
.rlkv3 .rlk-case{ display:grid; gap:clamp(28px,4vw,56px); align-items:start; }
@media (min-width:920px){
  .rlkv3 .rlk-case{ grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:clamp(40px,5vw,80px); }
}
.rlkv3 .rlk-case-media{ display:grid; grid-template-columns:minmax(0,1fr); gap:14px; align-content:start; min-width:0; }
.rlkv3 .rlk-case-film{ position:relative; display:block; border-radius:var(--radius-card); overflow:hidden; aspect-ratio:16/9; box-shadow:var(--shadow-image); }
.rlkv3 .rlk-case-film > img:first-child{ width:100%; height:100%; object-fit:cover; }
.rlkv3 .rlk-case-film .rlk-pill{
  position:absolute; top:14px; left:14px; background:#fff;
  text-transform:uppercase; letter-spacing:.1em; font-weight:800;
}
.rlkv3 .rlk-case-badge{
  position:absolute; right:14px; bottom:14px; width:clamp(86px,26%,116px); height:auto;
  background:#fff; border-radius:6px; padding:7px 9px; box-shadow:var(--shadow-subtle);
}
.rlkv3 .rlk-case-shots{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; min-width:0; }
.rlkv3 .rlk-case-shots .rlk-media{ aspect-ratio:4/3; min-width:0; }
.rlkv3 .rlk-quote{ margin:26px 0 0; padding:0; }
.rlkv3 .rlk-quote p{ font-size:21px; line-height:1.45; font-weight:500; color:var(--navy); margin:0; }
.rlkv3 .rlk-quote p::before{ content:"„"; } .rlkv3 .rlk-quote p::after{ content:"“"; }
.rlkv3 .rlk-quote footer{ margin-top:16px; font-size:14px; color:var(--muted); display:flex; align-items:center; gap:12px; }
.rlkv3 .rlk-quote footer img{ width:46px; height:46px; border-radius:50%; object-fit:cover; flex:0 0 auto; }
.rlkv3 .rlk-quote footer b{ color:var(--ink); font-weight:600; }
.rlkv3 .rlk-quote--box{ background:var(--chip); border-radius:var(--radius-card); padding:24px 26px; }
.rlkv3 .rlk-quote--box p{ font-size:19.5px; font-weight:700; }
/* Case-Study-Liste: quadratische Marker statt Haken */
.rlkv3 .rlk-case-body .rlk-check{ gap:16px; }
.rlkv3 .rlk-case-body .rlk-check li::before{ width:9px; height:9px; border-radius:2px; background:var(--navy); top:8px; left:4px; }
.rlkv3 .rlk-case-body .rlk-check li::after{ content:none; }
.rlkv3 .rlk-case-body .rlk-quote footer b{ font-weight:400; color:var(--muted); }

/* ---------- Team ---------- */
.rlkv3 .rlk-member{ text-align:left; display:block; text-decoration:none; }
.rlkv3 .rlk-member .rlk-media{ aspect-ratio:3/4; transition:box-shadow .3s ease; }
.rlkv3 .rlk-member .rlk-media img{ transition:transform .4s ease; }
.rlkv3 .rlk-member:hover .rlk-media{ box-shadow:var(--shadow-card); }
.rlkv3 .rlk-member:hover .rlk-media img{ transform:scale(1.05); }
.rlkv3 .rlk-member:hover .rlk-member-name{ color:var(--royal); }
.rlkv3 .rlk-member-name{ font-weight:600; font-size:15px; color:var(--ink); margin-top:12px; transition:color .18s ease; }
.rlkv3 .rlk-member-role{ font-size:13.5px; color:var(--muted); margin-top:2px; }
@media (min-width:920px){ .rlkv3 .rlk-reel--team{ grid-template-columns:repeat(6,1fr); gap:16px; } }

/* ---------- Google-Bewertungen (Balken + Rezensionskarten) ---------- */
.rlkv3 .rlk-g{ width:28px; height:28px; flex:0 0 auto; }
.rlkv3 .rlk-gbar{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; text-decoration:none;
  background:var(--surface); border:1px solid var(--hairline-soft); border-radius:var(--radius-band);
  box-shadow:var(--shadow-subtle); padding:20px clamp(20px,2.4vw,28px); transition:box-shadow .35s ease;
}
.rlkv3 .rlk-gbar:hover{ box-shadow:var(--shadow-card); }
.rlkv3 .rlk-gbar-label{ font-family:var(--font-head); font-weight:700; font-size:17px; color:var(--navy); }
.rlkv3 .rlk-gbar-n{ font-family:var(--font-head); font-weight:800; font-size:34px; line-height:1; color:var(--navy); letter-spacing:-.02em; }
.rlkv3 .rlk-gbar .rlk-stars{ font-size:17px; color:#F2A50C; }
.rlkv3 .rlk-gbar-sub{ font-size:15px; color:var(--muted); }
.rlkv3 .rlk-gbar .rlk-arrowlink{ margin-left:auto; }
.rlkv3 .rlk-greviews{ display:grid; gap:18px; margin-top:18px; }
@media (min-width:760px){ .rlkv3 .rlk-greviews{ grid-template-columns:repeat(3,1fr); } }
.rlkv3 .rlk-grev{
  display:flex; flex-direction:column; background:var(--surface);
  border:1px solid var(--hairline-soft); border-radius:var(--radius-card);
  box-shadow:var(--shadow-subtle); padding:22px 24px 20px; transition:box-shadow .35s ease;
}
.rlkv3 .rlk-grev:hover{ box-shadow:var(--shadow-card); }
.rlkv3 .rlk-grev-top{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.rlkv3 .rlk-grev-top .rlk-stars{ font-size:15px; color:#F2A50C; }
.rlkv3 .rlk-grev-top .rlk-g{ width:19px; height:19px; }
.rlkv3 .rlk-grev p{ flex:1 1 auto; margin:14px 0 0; font-size:15.5px; line-height:1.62; color:var(--body-soft); }
.rlkv3 .rlk-grev-foot{ display:flex; align-items:center; gap:12px; margin-top:18px; padding-top:16px; border-top:1px solid var(--hairline-soft); }
.rlkv3 .rlk-grev-av{
  width:38px; height:38px; border-radius:50%; background:var(--chip); color:var(--navy); flex:0 0 auto;
  font-family:var(--font-head); font-weight:700; font-size:15px; display:flex; align-items:center; justify-content:center;
}
.rlkv3 .rlk-grev-name{ font-family:var(--font-head); font-weight:700; font-size:15px; color:var(--navy); }
.rlkv3 .rlk-grev-when{ font-size:13.5px; color:var(--muted); margin-top:2px; }
@media (min-width:920px){ .rlkv3 .rlk-testi--full .rlk-reel--videos{ grid-template-columns:repeat(4,1fr); gap:22px; } }
.rlkv3 .rlk-vcard{ position:relative; display:block; text-decoration:none; }
.rlkv3 .rlk-vcard .rlk-media{ aspect-ratio:16/9; }
.rlkv3 .rlk-vcard .rlk-play span{ width:52px; height:52px; }
.rlkv3 .rlk-vcard .rlk-play span::after{ border-left-width:13px; border-top-width:8px; border-bottom-width:8px; margin-left:4px; }
.rlkv3 .rlk-vcard-name{ margin-top:10px; font-size:14px; font-weight:600; color:var(--ink); }
.rlkv3 .rlk-vcard-sub{ font-size:12.5px; color:var(--muted-soft); margin-top:1px; }

/* ---------- Trust ---------- */
.rlkv3 .rlk-trust-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
@media (min-width:920px){ .rlkv3 .rlk-trust-grid{ grid-template-columns:repeat(4,1fr); } }
.rlkv3 .rlk-trust-card{ display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; padding:30px 22px; text-decoration:none; }
.rlkv3 .rlk-trust-card img{ height:88px; width:auto; max-width:100%; object-fit:contain; }
.rlkv3 .rlk-trust-name{ font-weight:600; font-size:15px; color:var(--ink); }
.rlkv3 .rlk-trust-sub{ display:block; font-size:13px; color:var(--muted); margin-top:2px; }

/* ---------- GEO-Fakten ----------
   Feedback 01.08.: nicht mehr als schmale Karte mittig, sondern volle
   Containerbreite; ab 920px zweispaltig (Kopf + Quelle links, Fakten rechts). */
.rlkv3 .rlk-facts{
  background:var(--surface); border:1px solid var(--hairline-blue); border-radius:var(--radius-band);
  padding:clamp(26px,4vw,46px); box-shadow:var(--shadow-subtle);
}
.rlkv3 .rlk-facts-grid{ display:grid; gap:10px clamp(36px,5vw,72px); }
@media (min-width:920px){
  .rlkv3 .rlk-facts-grid{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); align-items:start; }
  .rlkv3 .rlk-facts-grid dl{ margin-top:0; }
  .rlkv3 .rlk-facts-grid .rlk-facts-row:first-child{ border-top:0; padding-top:0; }
}
.rlkv3 .rlk-facts-def{ margin:16px 0 6px; font-size:16.5px; line-height:1.6; color:var(--body-soft); max-width:52ch; }
.rlkv3 .rlk-facts dl{ margin:18px 0 0; }
.rlkv3 .rlk-facts-row{ display:grid; grid-template-columns:1fr; gap:2px 24px; padding:12px 0; border-top:1px solid var(--hairline-soft); }
@media (min-width:640px){ .rlkv3 .rlk-facts-row{ grid-template-columns:220px 1fr; } }
.rlkv3 .rlk-facts dt{ font-weight:600; font-size:14px; color:var(--muted); }
.rlkv3 .rlk-facts dd{ margin:0; font-family:var(--font-mono); font-size:15px; color:var(--ink); }
.rlkv3 .rlk-facts .rlk-fine{ margin:18px 0 0; }

/* ---------- FAQ ---------- */
.rlkv3 .rlk-faq{ max-width:var(--maxw-prose); }
.rlkv3 .rlk-faq details{ border-bottom:1px solid var(--hairline-soft); }
.rlkv3 .rlk-faq summary{
  list-style:none; cursor:pointer; display:flex; align-items:baseline; justify-content:space-between; gap:20px;
  padding:20px 0; font-family:var(--font-head); font-weight:700; font-size:17px; color:var(--navy); line-height:1.4;
}
.rlkv3 .rlk-faq summary::-webkit-details-marker{ display:none; }
.rlkv3 .rlk-faq summary::after{
  content:"+"; font-family:var(--font-mono); font-weight:400; font-size:22px; color:var(--royal);
  flex:0 0 auto; transition:transform .2s ease; line-height:1;
}
.rlkv3 .rlk-faq details[open] summary::after{ transform:rotate(45deg); }
.rlkv3 .rlk-faq details p{ margin:0 0 22px; max-width:64ch; color:var(--body-soft); line-height:1.65; }

/* ---------- Beispielrechnung ---------- */
.rlkv3 .rlk-config{
  background:var(--surface); border:1px solid var(--hairline-soft); border-radius:var(--radius-band);
  box-shadow:var(--shadow-subtle); overflow:hidden; margin-top:18px;
}
.rlkv3 .rlk-config-head{ padding:clamp(24px,3vw,36px) clamp(24px,3.5vw,42px); background:var(--chip); border-bottom:1px solid var(--hairline-blue); }
.rlkv3 .rlk-config-head h3{ font-size:clamp(19px,1.9vw,23px); }
.rlkv3 .rlk-config-head p{ margin:10px 0 0; max-width:60ch; color:var(--body-soft); }
.rlkv3 .rlk-config-grid{ display:grid; }
@media (min-width:920px){ .rlkv3 .rlk-config-grid{ grid-template-columns:7fr 5fr; } }
.rlkv3 .rlk-config-items{ padding:clamp(20px,3vw,36px) clamp(24px,3.5vw,42px); }
.rlkv3 .rlk-config-row{ display:flex; align-items:baseline; justify-content:space-between; gap:18px; padding:13px 0; border-top:1px solid var(--hairline-soft); }
.rlkv3 .rlk-config-row:first-child{ border-top:0; }
.rlkv3 .rlk-config-row .n{ font-size:15px; color:var(--body); }
.rlkv3 .rlk-config-row .p{ font-family:var(--font-mono); font-size:15px; color:var(--ink); white-space:nowrap; }
.rlkv3 .rlk-config-row--sum .n{ font-weight:600; color:var(--ink); }
.rlkv3 .rlk-config-row--sum .p{ font-weight:500; color:var(--navy); }
.rlkv3 .rlk-config-inc{ padding:clamp(20px,3vw,36px) clamp(24px,3.5vw,42px); border-top:1px solid var(--hairline-soft); }
@media (min-width:920px){ .rlkv3 .rlk-config-inc{ border-top:0; border-left:1px solid var(--hairline-soft); } }
.rlkv3 .rlk-config-inc h4{ font-size:15px; font-family:var(--font-body); font-weight:700; color:var(--ink); margin:0 0 6px; }
.rlkv3 .rlk-config-inc .rlk-check{ margin-top:12px; }
.rlkv3 .rlk-config-note{ padding:16px clamp(24px,3.5vw,42px); border-top:1px solid var(--hairline-soft); }
.rlkv3 .rlk-config-note p{ margin:0; }

/* ---------- Interlink ---------- */
.rlkv3 .rlk-links{ display:flex; flex-wrap:wrap; gap:12px; }
.rlkv3 .rlk-links a{
  flex:1 1 200px; display:flex; align-items:center; justify-content:space-between; gap:12px;
  background:var(--surface); border:1px solid var(--hairline-soft); border-radius:var(--radius-card);
  padding:16px 20px; text-decoration:none; font-weight:600; font-size:15px; color:var(--navy);
  box-shadow:var(--shadow-subtle); transition:box-shadow .25s ease,border-color .18s ease;
}
.rlkv3 .rlk-links a::after{ content:"→"; color:var(--royal); transition:transform .18s ease; }
.rlkv3 .rlk-links a:hover{ box-shadow:var(--shadow-card); border-color:var(--hairline-blue); }
.rlkv3 .rlk-links a:hover::after{ transform:translateX(3px); }

/* ---------- CTA-Band ---------- */
.rlkv3 .rlk-band{
  background:var(--navy); color:#fff; border-radius:var(--radius-band);
  padding:clamp(28px,4.5vw,52px); box-shadow:var(--shadow-card);
}
.rlkv3 .rlk-band .rlk-kicker{ color:var(--blue-light); }
.rlkv3 .rlk-band h2,.rlkv3 .rlk-band h3{ color:#fff; }
.rlkv3 .rlk-band p{ color:rgba(255,255,255,.75); }
.rlkv3 .rlk-cta{ display:grid; gap:clamp(26px,4vw,48px); align-items:center; }
@media (min-width:920px){ .rlkv3 .rlk-cta{ grid-template-columns:minmax(0,7fr) minmax(0,4fr); } }
.rlkv3 .rlk-cta h2{ max-width:20ch; }
.rlkv3 .rlk-cta-copy{ margin:14px 0 0; max-width:46ch; }
.rlkv3 .rlk-cta-hint{ font-size:13.5px; color:rgba(255,255,255,.6); margin:14px 0 0; }
.rlkv3 .rlk-person{ display:flex; align-items:center; gap:16px; }
.rlkv3 .rlk-person img{ width:64px; height:64px; border-radius:50%; object-fit:cover; border:2px solid rgba(255,255,255,.25); }
.rlkv3 .rlk-person-name{ font-weight:600; font-size:15.5px; color:#fff; }
.rlkv3 .rlk-person-role{ font-size:13.5px; color:rgba(255,255,255,.65); margin-top:1px; }
.rlkv3 .rlk-person-links{ margin-top:7px; display:flex; flex-wrap:wrap; gap:4px 18px; }
.rlkv3 .rlk-person-links a{ font-family:var(--font-mono); font-size:14px; color:var(--blue-light); text-decoration:none; }
.rlkv3 .rlk-person-links a:hover{ color:#fff; }

/* ---------- Zwischen-CTA (flache helle Karte) ---------- */
.rlkv3 .rlk-sec--tight{ padding:clamp(30px,3.6vw,46px) 0; }
.rlkv3 .rlk-band--flat{
  background:var(--surface); border:1px solid var(--hairline-blue); border-radius:var(--radius-band);
  box-shadow:var(--shadow-subtle); padding:clamp(22px,2.6vw,30px) clamp(24px,3vw,38px);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px 32px;
}
.rlkv3 .rlk-band--flat h3{ font-size:clamp(20px,2.1vw,26px); max-width:28ch; }
.rlkv3 .rlk-band--flat .rlk-kicker{ margin-bottom:6px; }
.rlkv3 .rlk-band--flat .rlk-btnrow{ margin:0; }
.rlkv3 .rlk-band--flat > div:first-child{ flex:1 1 480px; }
.rlkv3 .rlk-flat-copy{ margin:10px 0 0; font-size:16px; line-height:1.6; color:var(--body-soft); max-width:56ch; }

/* ---------- Sticky-CTA (nur mobil) ---------- */
.rlkv3 .rlk-sticky{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  background:var(--surface); border-top:1px solid var(--hairline-soft);
  box-shadow:0 -8px 24px rgba(26,42,92,.12);
  padding:10px var(--pad-x) calc(10px + env(safe-area-inset-bottom));
  display:grid; grid-template-columns:auto 1fr; gap:10px;
}
.rlkv3 .rlk-sticky .rlk-btn{ padding:12px 18px; font-size:14.5px; }
.rlkv3 .rlk-sticky .rlk-btn--ghost{ font-family:var(--font-mono); font-weight:500; }
@media (min-width:760px){ .rlkv3 .rlk-sticky{ display:none; } }

/* ---------- Sanftes Aufsteigen beim Scrollen (nur wo unterstuetzt) ---------- */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .rlkv3 .rlk-rise{ animation:rlkv3Rise both; animation-timeline:view(); animation-range:entry 0% entry 22%; }
    .rlkv3 .rlk-flow > li{ animation:rlkv3FanL both; animation-timeline:view(); animation-range:entry 8% entry 62%; }
    .rlkv3 .rlk-flow > li:nth-child(even){ animation-name:rlkv3FanR; }
    .rlkv3 .rlk-flow::before{ animation:rlkv3Draw both; animation-timeline:view(); animation-range:cover 6% cover 62%; }
  }
}
@keyframes rlkv3Rise{ from{ opacity:.01; transform:translateY(16px); } to{ opacity:1; transform:none; } }
@keyframes rlkv3FanL{ from{ opacity:.01; transform:translate3d(-30px,28px,0); } to{ opacity:1; transform:none; } }
@keyframes rlkv3FanR{ from{ opacity:.01; transform:translate3d(30px,28px,0); } to{ opacity:1; transform:none; } }
@keyframes rlkv3Draw{ from{ transform:scaleY(0); } to{ transform:scaleY(1); } }

/* -- Vimeo-Klick-Fassade (featured_film mit vimeo_id) ---------------------- */
.rlkv3 .rlk-vplay{ cursor:pointer; }
.rlkv3 .rlk-vplay:focus-visible{ outline:3px solid var(--royal); outline-offset:4px; border-radius:var(--radius-card); }
.rlkv3 .rlk-vbadge{ position:absolute; inset:0; margin:auto; width:72px; height:72px; border-radius:50%;
  background:rgba(26,42,92,.92); display:flex; align-items:center; justify-content:center;
  transition:transform .2s ease, background .2s ease; z-index:2; pointer-events:none; }
.rlkv3 .rlk-vbadge::before{ content:""; display:block; width:0; height:0; border-style:solid;
  border-width:12px 0 12px 20px; border-color:transparent transparent transparent #fff; margin-left:5px; }
.rlkv3 .rlk-vplay:hover .rlk-vbadge, .rlkv3 .rlk-vplay:focus-visible .rlk-vbadge{ transform:scale(1.06); background:var(--royal); }
.rlkv3 .rlk-vframe{ position:relative; aspect-ratio:16/9; box-shadow:var(--shadow-deep); }
.rlkv3 .rlk-vframe iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
@media (prefers-reduced-motion: reduce){ .rlkv3 .rlk-vbadge{ transition:none; } }