/* Rauscher & Reyhing – Bausteine für Inhaltsseiten (Service-Seite, Stand 03.11.2026)
   Wirkt nur auf Inhalte innerhalb von <div class="rr-svc">…</div>, alle anderen Seiten bleiben unverändert. */

:root{--rr-green:#1ba77f;--rr-green-d:#14866a;--rr-green-l:#e8f6f1;--rr-ink:#555;--rr-dark:#2f3b44;--rr-line:#e3e8eb;--rr-gray:#8898a1}

/* Weiße Karten behalten dunkle Schrift, auch in den grauen Abschnitten (Theme setzt dort Weiß) */
.rr-svc .rr-tile h3,.rr-svc .rr-step h3,.rr-svc .rr-box.rr-abroad h3,.rr-svc .rr-chain strong{color:var(--rr-dark) !important}
.rr-svc .rr-tile p,.rr-svc .rr-step p,.rr-svc .rr-box.rr-abroad p,.rr-svc .rr-chips span,.rr-svc .rr-flags span{color:var(--rr-ink) !important}
.rr-svc .rr-chain span{color:#7a868e !important}

/* Breiterer Inhaltsbereich nur auf Seiten mit Bausteinen */
.Content:has(.rr-svc) .container{max-width:1140px;width:auto}
.Content:has(.rr-center) h2{text-align:center}

.rr-svc{font-size:18px;line-height:1.55}
.rr-svc h3{font-family:"Open Sans",Arial,sans-serif;font-size:20px;line-height:1.25;margin:0 0 6px;color:var(--rr-dark)}
.rr-svc p{margin:0 0 10px}
.rr-center{text-align:center}
.rr-sub{max-width:720px;margin:0 auto 8px !important;font-size:20px}

/* Symbole aus der Icon-Schrift des Themes */
.rr-ico{width:54px;height:54px;border-radius:12px;background:var(--rr-green-l);color:var(--rr-green);display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:14px;flex-shrink:0}
.rr-ico i{line-height:1}

/* Knöpfe */
.rr-ctas{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0 0 !important}
.rr-ctas .button{margin:0;opacity:1 !important;transform:none !important}
.Content .rr-svc a.button.rr-btn-white,.Content .rr-svc a.button.rr-btn-white i{background:#fff !important;color:var(--rr-green) !important}
.rr-btn-line{background:transparent !important;color:#fff !important;box-shadow:inset 0 0 0 2px rgba(255,255,255,.8)}

/* Kopfbereich (grün) */
.rr-intro .rr-lead{font-size:23px;line-height:1.45;max-width:780px;color:#fff}
.rr-trust{display:grid;grid-template-columns:repeat(4,1fr);margin-top:32px;border-top:1px solid rgba(255,255,255,.35)}
.rr-trust div{padding:16px 14px 6px;border-left:1px solid rgba(255,255,255,.35)}
.rr-trust div:first-child{border-left:0;padding-left:0}
.rr-trust strong{display:block;font-family:"Open Sans",Arial,sans-serif;font-size:19px;color:#fff}
.rr-trust span{font-size:16px;color:rgba(255,255,255,.85)}

/* Leistungs-Kacheln */
.rr-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:28px;text-align:left}
.rr-tile{background:#fff;border:1px solid var(--rr-line);border-radius:12px;padding:22px;transition:transform .2s,box-shadow .2s;color:var(--rr-ink)}
.rr-tile:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(47,59,68,.14)}
.rr-tile p{font-size:16px;line-height:1.45;margin:0}
.rr-tile a{color:var(--rr-green);font-weight:bold}

/* Ablauf in Schritten (graue Abschnitte) */
.rr-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px;counter-reset:rrstep;text-align:left}
.rr-step{position:relative;background:#fff;border-radius:12px;padding:30px 20px 18px;color:var(--rr-ink)}
.rr-step::before{counter-increment:rrstep;content:counter(rrstep);position:absolute;top:-20px;left:20px;width:40px;height:40px;border-radius:50%;background:var(--rr-green);color:#fff;font:bold 19px/40px "Open Sans",Arial,sans-serif;text-align:center}
.rr-step h3{margin-top:4px}
.rr-step p{font-size:16px;line-height:1.45;margin:0}

/* Lieferung: Liste + Foto */
.rr-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin-top:10px}
.rr-chain{display:grid;gap:10px;margin-top:16px}
.rr-chain div{display:flex;align-items:center;gap:14px;border:1px solid var(--rr-line);border-radius:10px;padding:10px 14px;background:#fff}
.rr-chain .rr-ico{width:40px;height:40px;font-size:19px;margin:0;border-radius:9px}
.rr-chain strong{font-family:"Open Sans",Arial,sans-serif;color:var(--rr-dark);font-size:17px}
.rr-chain span{margin-left:auto;font-size:15px;color:#7a868e;text-align:right}
.rr-photo img{width:100%;height:auto;border-radius:14px;display:block;box-shadow:0 14px 30px rgba(47,59,68,.18)}
.rr-photo p{margin:0}

/* Hersteller-Chips */
.rr-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:24px}
.rr-chips span{background:#fff;color:var(--rr-dark);border-radius:999px;padding:7px 16px;font-size:16px;font-family:"Open Sans",Arial,sans-serif}

/* Preise + Ausland */
.rr-duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:10px}
.rr-box{border-radius:14px;padding:28px}
.rr-box.rr-price{background:var(--rr-dark);color:#fff}
.rr-box.rr-price h3{color:#fff}
.rr-prices{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0 12px}
.rr-prices div{background:rgba(255,255,255,.08);border-radius:10px;padding:14px}
.rr-prices strong{display:block;font:bold 34px/1.1 "Open Sans",Arial,sans-serif;color:#5fd3b0}
.rr-prices span{font-size:15px;color:#cfd6da}
.rr-box.rr-price small{font-size:15px;color:#cfd6da}
.rr-box.rr-abroad{background:var(--rr-green-l);color:var(--rr-ink)}
.rr-flags{display:flex;gap:10px;margin:14px 0}
.rr-flags span{background:#fff;border-radius:8px;padding:6px 14px;font-family:"Open Sans",Arial,sans-serif;color:var(--rr-dark);border:1px solid #cfe9df}

/* Abschluss-Band: ganzer Abschnitt grün */
.Content:has(.rr-cta){background:var(--rr-green) !important}
.Content:has(.rr-cta) h2{color:#fff;text-align:center}
.rr-cta{text-align:center;color:#fff}
.rr-cta p{color:#fff}
.rr-cta .rr-ctas{justify-content:center}

/* Konfigurator-Feld Startseite (Home_v1: .container und .Content am selben Element) */
.Content.container:has(.rr-svc){max-width:1140px;width:auto}
.rr-konfig{display:grid;grid-template-columns:1fr 1.15fr;gap:32px;align-items:center;background:linear-gradient(120deg,#2f3b44,#1c262d);border-radius:18px;padding:36px;text-align:left;margin:6px 0 36px;box-shadow:0 18px 40px rgba(47,59,68,.25)}
.rr-svc.rr-konfig h2{color:#fff !important;font-size:36px;line-height:1.15;margin:6px 0 14px;text-align:left}
.rr-svc.rr-konfig p{color:#dfe6ea !important;font-size:18px}
.rr-svc .rr-eyebrow{text-transform:uppercase;letter-spacing:.14em;font:bold 14px/1.2 "Open Sans",Arial,sans-serif !important;color:#5fd3b0 !important;margin:0 !important}
.rr-konfig .rr-ctas .button{font-size:22px;padding:14px 28px}
.rr-konfig-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rr-konfig-grid a{display:block;background:#fff;border-radius:12px;overflow:hidden;text-decoration:none;transition:transform .2s,box-shadow .2s}
.rr-konfig-grid a:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(0,0,0,.35)}
.rr-konfig-grid img{width:100%;height:140px;object-fit:contain;background:#f3f5f6;padding:10px;box-sizing:border-box;display:block}
.Content .rr-konfig-grid span{display:block;padding:10px 12px;font:bold 15px/1.3 "Open Sans",Arial,sans-serif;color:var(--rr-dark) !important}
/* Grünes Band wie die Kopfbereiche der übrigen Seiten */
.Content.rr-band{background:var(--rr-green) !important;padding:44px 0}
.rr-band .rr-konfig{background:none;box-shadow:none;padding:0;margin:0}
.rr-band .rr-svc .rr-eyebrow{color:#fff !important;opacity:.85}
.rr-band .rr-svc.rr-konfig p{color:#fff !important}
.rr-band .rr-konfig-grid a:hover{box-shadow:0 14px 28px rgba(0,0,0,.2)}
/* Neuzugänge als große weiße Kachel im grauen Abschnitt */
.rr-konfig.rr-lager{background:#fff;box-shadow:0 14px 34px rgba(47,59,68,.18);margin:0}
.rr-svc.rr-konfig.rr-lager h2{color:var(--rr-dark) !important}
.rr-svc.rr-konfig.rr-lager p{color:var(--rr-ink) !important}
.rr-svc.rr-lager .rr-eyebrow{color:var(--rr-green) !important}
.Content .rr-lager .rr-ctas a.button{background:var(--rr-green) !important;color:#fff !important;box-shadow:none;font-size:18px;white-space:nowrap}
.Content .rr-lager .rr-ctas a.button i{color:#fff !important}
.rr-lager .rr-konfig-grid a{border:1px solid var(--rr-line)}
.rr-lager .rr-konfig-grid img{background:#fff;padding:6px}
.Content.rr-band h1.rr-band-h1{color:#fff !important;font-size:22px;line-height:1.3;font-weight:normal;text-transform:none;text-align:left;margin:0 0 26px;padding:0 0 14px;border-bottom:1px solid rgba(255,255,255,.35)}

/* Kompakter Fuß (Footer.ss mit Klasse rr-foot, seit 03.11.2026) */
.footer.rr-foot{padding:32px 0 10px}
.rr-foot .container{max-width:1140px;width:auto}
.rr-foot-grid{display:grid;grid-template-columns:1.3fr 1.2fr 0.9fr 1.4fr;gap:28px;align-items:start}
.rr-foot-grid img{width:130px;height:auto;margin:4px 0 12px;display:block}
.rr-foot .rr-foot-grid p{font-size:16px;line-height:1.45;margin:0 0 4px}
.rr-foot .rr-foot-grid p.heading{font-size:19px;margin:0 0 8px}
.rr-foot-nav{display:flex;flex-wrap:wrap;gap:2px 14px}
.rr-foot hr{margin:20px 0 8px}
.rr-foot .lastrow{font-size:14px;margin:0}

/* Tablet */
@media (max-width:991px){
  .rr-tiles,.rr-steps{grid-template-columns:repeat(2,1fr)}
  .rr-steps{row-gap:36px}
  .rr-split,.rr-duo{grid-template-columns:1fr}
  .rr-trust{grid-template-columns:repeat(2,1fr)}
  .rr-trust div:nth-child(3){border-left:0;padding-left:0}
  .rr-foot-grid{grid-template-columns:1fr 1fr;gap:22px}
  .rr-konfig{grid-template-columns:1fr}
}
/* Handy */
@media (max-width:575px){
  .rr-svc{font-size:17px}
  .rr-intro .rr-lead{font-size:20px}
  .rr-tiles,.rr-steps,.rr-prices{grid-template-columns:1fr}
  .rr-chain span{display:none}
  .rr-box{padding:22px 18px}
  .rr-ctas .button{width:100%;text-align:center}
  .rr-foot-grid{grid-template-columns:1fr;gap:16px}
  .rr-foot-grid img{width:110px}
  .rr-konfig{padding:22px 18px}
  .rr-svc.rr-konfig h2{font-size:27px}
  .rr-konfig-grid{gap:10px}
  .rr-konfig-grid img{height:100px}
  .Content .rr-konfig-grid span{font-size:13px;padding:8px}
  .Content .rr-lager .rr-ctas a.button{white-space:normal;font-size:17px}
}