/* ===== RAIBA-IMMO BAUTRÄGERPROJEKT BUILD-MARKER: v1.2.0 ===== */
/*
 * Basis-Layout für die Bauträgerprojekt-Bausteine (Eckdaten, Ausstattung,
 * Nachbarschaft, Lagekarte). Farben/Abstände sind über die Elementor-Steuerungen
 * je Widget überschreibbar; hier stehen nur das Grundgerüst und neutrale Defaults.
 * Schrift immer per inherit (Theme-/Elementor-Globalschrift).
 */

.rpj { --rpj-accent: #FF6600; --rpj-ink: #1b2530; --rpj-muted: #5b6773; --rpj-line: #e4e8ef; --rpj-tile-bg: #f7f8fa; box-sizing: border-box; }
.rpj *, .rpj *::before, .rpj *::after { box-sizing: border-box; }
.rpj, .rpj h2, .rpj h3, .rpj p, .rpj span, .rpj strong, .rpj address { font-family: inherit; }

/* Optionaler Abschnitts-Titel (für alle Bausteine gleich) */
.rpj-head { margin: 0 0 18px; }
.rpj-head__eyebrow { display: block; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rpj-accent); margin: 0 0 4px; }
.rpj-head__title { margin: 0; font-size: 24px; line-height: 1.2; font-weight: 700; color: var(--rpj-ink); }
.rpj-head__sub { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: var(--rpj-muted); }

/* ---------- Eckdaten: Kachel-Raster ---------- */
.rpj-eck-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.rpj-tile { display: flex; align-items: center; gap: 14px; padding: 18px; background: var(--rpj-tile-bg); border: 1px solid var(--rpj-line); border-radius: 14px; }
.rpj-tile__ico { flex: none; width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border-radius: 11px; background: rgba(255, 102, 0, .1); color: var(--rpj-accent); font-size: 22px; }
.rpj-tile__ico svg { width: 22px; height: 22px; fill: currentColor; }
.rpj-tile__ico i { font-size: 20px; line-height: 1; }
.rpj-tile__body { min-width: 0; display: flex; flex-direction: column; }
.rpj-tile__label { font-size: 13px; line-height: 1.3; color: var(--rpj-muted); order: 1; }
.rpj-tile__value { font-size: 19px; line-height: 1.25; font-weight: 700; color: var(--rpj-ink); order: 2; word-break: break-word; }

/* ---------- Ausstattung: Merkmale ---------- */
.rpj-aus-group + .rpj-aus-group { margin-top: 22px; }
.rpj-aus-group__title { margin: 0 0 12px; font-size: 17px; font-weight: 700; color: var(--rpj-ink); }
.rpj-aus-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 22px; }
.rpj-feat { display: flex; align-items: flex-start; gap: 10px; }
.rpj-feat__ico { flex: none; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; color: var(--rpj-accent); font-size: 17px; margin-top: 1px; background: transparent; border-radius: 8px; }
.rpj-feat__ico svg { width: 18px; height: 18px; fill: currentColor; }
.rpj-feat__txt { font-size: 15px; line-height: 1.5; color: var(--rpj-ink); }

/* ---------- Nachbarschaft: Liste ---------- */
.rpj-nb-list { display: grid; grid-template-columns: 1fr; column-gap: 28px; }
.rpj-nb-item { display: flex; align-items: center; gap: 14px; padding: 12px 4px; border-bottom: 1px solid var(--rpj-line); }
.rpj-nb-item:last-child { border-bottom: 0; }
.rpj-nb__ico { flex: none; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: rgba(255, 102, 0, .1); color: var(--rpj-accent); font-size: 20px; }
.rpj-nb__ico svg { width: 20px; height: 20px; fill: currentColor; }
.rpj-nb__body { min-width: 0; flex: 1; }
.rpj-nb__name { font-size: 15.5px; font-weight: 600; color: var(--rpj-ink); }
.rpj-nb__note { font-size: 13.5px; color: var(--rpj-muted); }
.rpj-nb__dist { flex: none; font-size: 14px; font-weight: 700; color: var(--rpj-accent); white-space: nowrap; }

/* ---------- Lagekarte ---------- */
.rpj-lage { width: 100%; }
.rpj-map-wrap { display: flex; flex-direction: column; width: 100%; overflow: hidden; border: 0; border-radius: 0; }
.rpj-map { width: 100%; height: 420px; background: #eef1f5; }
.rpj-map .leaflet-container { font-family: inherit; }

/* Höhe füllt den Elementor-Container (Rest-Höhe für die Karte, Adresse bleibt sichtbar).
   min-height verhindert, dass die Karte unsichtbar wird, wenn der Container keine Höhe hat. */
.rpj-lage--fill { height: 100%; min-height: 260px; }
.rpj-lage--fill .rpj-map-wrap { height: 100%; }
.rpj.rpj-lage--fill .rpj-map { flex: 1 1 auto; height: auto; min-height: 160px; }

/* Feste Seitenverhältnisse */
.rpj.rpj-lage--ratio .rpj-map { height: auto; aspect-ratio: var(--rpj-ratio, 16 / 9); }
.rpj-map-addr { display: flex; align-items: flex-start; gap: 10px; padding: 14px 16px; background: #fff; }
.rpj-map-addr__ico { flex: none; color: var(--rpj-accent); font-size: 20px; margin-top: 1px; }
.rpj-map-addr__ico svg { width: 20px; height: 20px; fill: currentColor; }
.rpj-map-addr address { font-style: normal; font-size: 15px; line-height: 1.5; color: var(--rpj-ink); }

/* Editor-Hinweis */
.rpj-empty { padding: 20px; border: 1px dashed var(--rpj-line); border-radius: 12px; color: var(--rpj-muted); font-size: 14px; text-align: center; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
	.rpj-eck-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
	.rpj-eck-grid { grid-template-columns: 1fr; }
	.rpj-aus-grid { grid-template-columns: 1fr; }
	.rpj-map { height: 320px; }
}